3D Rotate Tool : JavaScript version

JavaScript version runs also on devices that do not support flash player, like iPhone or iPad.

The current version 0.0.1 supports only these featrues:

• reading in the same config.xml as for flash based 3D Rotate Tool (easy integration)
• stop/play of rotation on mouse-click

Here is a list of features which I plan to implement. You can vote on which to implement first:

rotate (drag) with mouse / finger on iPhone : implemented in v. 0.0.2

You can suggest a new feature or example request in the forum: http://www.yofla.com/forum/index.php?action=vtopic&forum=15

Please see the Examples.

In the first example (Flash-JavaScript) the JavaScript version is used if the flash plugin is not available. The syntax of integrating the tool is:

<script type="text/javascript" src="swfobject.js"></script> 
<script type="text/javascript" src="rotatetool.js"></script> 
	
	<script type="text/javascript"> 
			var flashvars = {};
			flashvars.path = "deuter";
			
			var params = {};
			params.scale = "noScale";
			params.salign = "lt";
			params.allowScriptAccess = "always";
			params.allowFullScreen = "true";
			
			var attributes = {};
      attributes.id = "myFlash";
      attributes.name = "myFlash";
			
			swfobject.embedSWF("rotateTool.swf", "flashContent", "500", "375", "9.0.0","expressInstall.swf", flashvars, params, attributes);
	
			var jsParams    = {};
			jsParams.path   = "deuter";
			jsParams.target = "flashContent";
			jsParams.targetWidth  = "500";
			jsParams.targetHeight = "375";
			RotateTool.add(jsParams);
 
			
	</script> 
	
		
<div id="flashBorder"> 
	<div id="flashContent"> 
	</div> 
</div> 

(The flashBorder div is just a helper div for centering the rotateTool movie.)

RotateTool JavaScript parameters:

	var jsParams    = {};
	jsParams.path   = "deuter";
	jsParams.target = "flashContent";
	jsParams.targetWidth  = "500";
	jsParams.targetHeight = "375";
	RotateTool.add(jsParams);

• path : is the directory where the config.xml and images are stored.
• target : is the target div into which the images are loaded
• targetWidth : desired movie width
• targetHeight : desired move height

Optional parameters:

• configFile : custom filename of config.xml

If you don't want to use swfobject at all, the code for embedding the JS version of RotateTool must be placed after the target div.

• http://www.yofla.com/flash/3d-rotate/javascript/examples/example_Flash-JavaScript/
• http://www.yofla.com/flash/3d-rotate/javascript/examples/example_JavaScript-only/

This is the first version of the tool, 0.0.1 Beta. Bug reports, suggestions, comments, please let me know via:

Forum: http://www.yofla.com/forum/index.php?action=vtopic&forum=15

Or Email: info@yofla.com

The 3DRT JavaScript version 0.0.1 is free for all 3D Rotate Tool PRO, PRO WL, 3D Rotate Tool Flexi PRO, PRO WL, 3D Rotate Tool EZ PRO, PRO WL users. Just copy the js/html code into your web project and it should work. For FREE users the tool displays an small Y logo which might not be removed.