Start animation without link in HTML file


(Freelancer) #1

Hi guys, I hope someone can helps me on this.

I have a particular problem and am looking for a solution. I’m trying to develop a stack for rapidweaver with a hype animation inside. The structure of a stack works with plist and html + css template. All links are managed only in the plist. Unfortunately this way the animation is not loaded. If instead I put the links in the html template it works (as usually happens with hype). Unfortunately this causes problems in the instances of the stack on the same page, some instances are wrong.

with the code below it works ( %assetPath% by stacks API)

template.html

<!-- both JS works only if stored in this place -->
<script type="text/javascript" charset="utf-8" src="%assetPath%/index.hyperesources/index_hype_generated_script.js"></script>
<!-- The second file fix issue in extracontent RWthemes -->
<script type="text/javascript" charset="utf-8" src="%assetPath%/index.hyperesources/HYPE-638.waypoints.min.js"></script>	


This should be the right method but it doesn’t work ( <string>each</string> determines where file instances are handled) . the files should be called in the plist and not in the template.html (as above). Note that all files al stored in the Stack Assets

Info.plist

	....<key>templates</key>
	<array>				
		<dict>
			<key>filename</key>
			<string>template.html</string>
			<key>scope</key>
			<string>each</string>
			<key>type</key>
			<string>html</string>
		</dict>
		<dict>
			<key>filename</key>
			<string>style.css</string>
			<key>scope</key>
			<string>each</string>
			<key>type</key>
			<string>css</string>
		</dict>
		
		<!-- hype animation customization  -->
		<dict>
			<key>filename</key>
			<string>script.js</string>
			<key>scope</key>
			<string>each</string>
			<key>type</key>
			<string>js</string>
		</dict>
		<!-- hype animation customization  -->		
		
		<!-- hype animation files  -->
		<dict>
			<key>filename</key>
			<string>index.hyperesources/HYPE-638.waypoints.min.js</string>
			<key>scope</key>
			<string>each</string>
			<key>type</key>
			<string>js</string>
		</dict>
		<dict>
			<key>filename</key>
			<string>index.hyperesources/HYPE-638.full.min.js</string>
			<key>scope</key>
			<string>each</string>
			<key>type</key>
			<string>js</string>
		</dict>
		<dict>
			<key>filename</key>
			<string>index.hyperesources/index_hype_generated_script.js</string>
			<key>scope</key>
			<string>each</string>
			<key>type</key>
			<string>js</string>
		</dict>
		<!-- hype animation files  -->
	</array>
	<key>title</key>
	<string>stack title</string>
</dict>
</plist>

it is not easy for me to provide more examples because it’s a specific environment, sorry.
My question is if there is a way to start the animation without putting the link in an html file, but through an external Plist.

Thanks!


(Jonathan Deutsch) #2

I really don’t know, but the documentaiton on the filename key says:

Filename – key: filename

The filename of the template. Do not include the path to the file.

(emphasis mine!)

So perhaps you should not include the index.hyperesources/ part and it automagically will recursively search for it? Seems weird though since it could be common to have two scripts named the same…

Regardless, it could also be an issue on what the script is relative to. Do you have access to any logging/alert facility? It would be easy to export the non-minified runtime and look to see what exactly %assetPath%/index.hyperesources/index_hype_generated_script.js is resolving to, which may give you hints as to what is going wrong.

If RapidWeaver is using the system’s WebKit you can probably turn on “Automatically Show Web Inspector for JSContexts” in Safari’s Develop menu and gain more insight.


(Freelancer) #3

thanks @jonathan
Abouth the path, I examined dozens of existing stacks and the complete path is always present in the templates; anyway I tried also without path.
Below an example of files located in a sub folder in the Content folder.

good question, Stack plugin has an internal console but I can’t see this.

I think the relationship between Hype files is not correctly recognized by Stack. I sucesfully embedded hype into RWthemes but this is more complex.
In stacks (in 90% of cases) the JS files are linked to the css scheme but in our case the JS files are the main subject. An integration to fix it would be great! I’m in touch with the developer.

I’ll take a look! also with Pluskit ( veriosn 4 by Yourhead, the same dev of stacks)

thanks