New feature: basic Ajax suggestion for tags and implementation of Dojo toolkit

git-svn-id: https://semanticscuttle.svn.sourceforge.net/svnroot/semanticscuttle/trunk@151 b3834d28-1941-0410-a4f8-b48e95affb8f

1 files changed, 219 insertions, 0 deletions

diff --git a/includes/js/dojox/fx/style.js b/includes/js/dojox/fx/style.js
new file mode 100644
index 0000000..895de9a
--- /dev/null
+++ b/includes/js/dojox/fx/style.js
@@ -0,0 +1,219 @@
+if(!dojo._hasResource["dojox.fx.style"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
+dojo._hasResource["dojox.fx.style"] = true;
+dojo.provide("dojox.fx.style");
+dojo.experimental("dojox.fx.style"); 
+//
+// summary: dojox.fx CSS Class _Animations: 
+//
+// description: a set of functions to animate properties based on
+// 	normalized CSS class definitions.
+//
+//	provides: addClass, removeClass, and toggleClass
+//	
+dojo.require("dojox.fx._base"); 
+
+// FIXME: should the call signatures match dojo.addClass/removeClass/toggleClass and extend
+// 	by having a third (or fourth) param to mix in additional _Animation args for advanced
+//	usage (delay: curve: repeat: easing: etc ... )
+
+dojox.fx.addClass = function(/*dojox.fx._arg.StyleArgs*/ args){
+	// summary: Animate the effects of adding a class to a node
+	// description:
+	//	Creates an animation that will animate
+	//	the properties of a node to the properties
+	//	defined in a standard CSS .class definition.
+	//	(calculating the differences itself)
+	//
+	// example:
+	// | 
+	// |	.bar { line-height: 12px; }
+	// |	.foo { line-height: 40px; }
+	// |	<div class="bar" id="test">
+	// |	Multi<br>line<br>text
+	// |	</div> 
+	// |
+	// |	// animate to line-height:40px
+	// |	dojo.fx.addClass({ node:"test", cssClass:"foo" }).play();
+	// 
+	var node = (args.node = dojo.byId(args.node)); 
+
+	var pushClass = (function(n){
+		// summary: onEnd we want to add the class to the node 
+		//	(as dojo.addClass naturally would) in case our 
+		//	class parsing misses anything the browser would 
+		// 	otherwise interpret. this may cause some flicker,
+		//	and will only apply the class so children can inherit 
+		//	after the animation is done (potentially more flicker)
+		return function(){
+			dojo.addClass(n, args.cssClass); 
+			n.style.cssText = _beforeStyle; 
+		}
+	})(node);
+
+	// _getCalculatedStleChanges is the core of our style/class animations
+	var mixedProperties = dojox.fx._getCalculatedStyleChanges(args,true);
+	var _beforeStyle = node.style.cssText; 
+	var _anim = dojo.animateProperty(dojo.mixin({
+		properties: mixedProperties
+	},args));
+	dojo.connect(_anim,"onEnd",_anim,pushClass); 
+	return _anim; // dojo._Animation
+};
+
+dojox.fx.removeClass = function(/*dojox.fx._arg.StyleArgs*/ args){
+	// summary: Animate the effects of removing a class from a node
+	// description:
+	//	Creates an animation that will animate the properties of a 
+	// 	node (args.node) to the properties calculated after removing 
+	//	a standard CSS className from a that node.
+	//	
+	//	calls dojo.removeClass(args.cssClass) onEnd of animation		
+	//
+	//	standard dojo._Animation object rules apply. 
+	//
+	// example:
+	// |	// animate the removal of "foo" from a node with id="bar"
+	// |	dojox.fx.removeClass({
+	// |		node: "bar",
+	// |		cssClass: "foo"
+	// |	}).play();
+
+	var node = (args.node = dojo.byId(args.node)); 
+
+	var pullClass = (function(n){
+		// summary: onEnd we want to remove the class from the node 
+		//	(as dojo.removeClass naturally would) in case our class
+		//	parsing misses anything the browser would otherwise 
+		//	interpret. this may cause some flicker, and will only 
+		//	apply the class so children can inherit after the
+		//	animation is done (potentially more flicker)
+		//
+		return function(){
+			dojo.removeClass(n, args.cssClass); 
+			n.style.cssText = _beforeStyle; 
+		}
+	})(node);
+
+	var mixedProperties = dojox.fx._getCalculatedStyleChanges(args,false);
+	var _beforeStyle = node.style.cssText; 
+	var _anim = dojo.animateProperty(dojo.mixin({
+		properties: mixedProperties
+	},args));
+	dojo.connect(_anim,"onEnd",_anim,pullClass); 
+	return _anim; // dojo._Animation
+};
+
+dojox.fx.toggleClass = function(/*DomNode|String*/node, /*String*/cssClass, /*Boolean?*/condition){
+        // summary:
+	//	Animate the effects of Toggling a class on a Node
+	//
+	// description:
+	//	creates an animation that will animate the effect of 
+	//	toggling a class on or off of a node.
+        //	Adds a class to node if not present, or removes if present.
+        //	Pass a boolean condition if you want to explicitly add or remove.
+	// node:
+	//	The domNode (or string of the id) to toggle
+	// cssClass:
+	//	String of the classname to add to the node
+        // condition:
+        //	If passed, true means to add the class, false means to remove.
+	//
+	// example:
+	// |	// add the class "sampleClass" to a node id="theNode"
+	// |	dojox.fx.toggleClass("theNode","sampleClass",true).play();
+	// example:
+	// |	// toggle the class "sampleClass" on the node id="theNode"
+	// |	dojox.fx.toggleClass("theNode","sampleClass").play();
+	
+        if(typeof condition == "undefined"){
+                condition = !dojo.hasClass(node, cssClass);
+        }
+        return dojox.fx[(condition ? "addClass" : "removeClass")]({ node: node, cssClass:cssClass }); // dojo._Animation
+	// TODO: support 4th param animMixin to allow passing of easing and duration and other _Animtion options
+};
+
+dojox.fx._allowedProperties = [
+	// summary: Our pseudo map of properties we will check for.
+	// description:
+	//	it should be much more intuitive. a way to normalize and
+	//	"predict" intent, or even something more clever ... 
+	//	open to suggestions.
+
+	// no-brainers:
+	"width",
+	"height",
+	// only if position = absolute || relative?
+	"left", "top", // "right", "bottom", 
+	// these need to be filtered through dojo.colors?
+	// "background", // normalize to:
+	/* "backgroundImage", */
+	// "backgroundPosition", // FIXME: to be effective, this needs "#px #px"?
+	"backgroundColor",
+
+	"color",
+
+	// "border", 
+	"borderBottomColor", "borderBottomWidth",
+	"borderTopColor","borderTopWidth",
+	"borderLeftColor","borderLeftWidth",
+	"borderRightColor","borderRightWidth",
+
+	// "padding", // normalize to: 
+	"paddingLeft", "paddingRight", "paddingTop", "paddingBottom",
+	// "margin", // normalize to:
+	"marginLeft", "marginTop", "marginRight", "marginBottom",
+
+	// unit import/delicate?:
+	"lineHeight",
+	"letterSpacing",
+	"fontSize"
+];
+
+dojox.fx._getStyleSnapshot = function(/* Object */cache){
+	// summary: 
+	//	uses a dojo.getComputedStyle(node) cache reference and
+	// 	iterates through the 'documented/supported animate-able'
+	// 	properties. 
+	//
+	// returns:  Array
+	//	an array of raw, calculcated values (no keys), to be normalized/compared
+	//	elsewhere	
+	return dojo.map(dojox.fx._allowedProperties,function(style){
+		return cache[style]; // String
+	}); // Array
+};
+
+dojox.fx._getCalculatedStyleChanges = function(/*dojox.fx._arg.StyleArgs*/ args, /*Boolean*/addClass){
+	// summary: calclate the difference in style properties between two states
+	// description:
+	//	calculate and normalize(?) the differences between two states
+	//	of a node (args.node) by quickly adding or removing a class, and
+	//	iterateing over the results of dojox.fx._getStyleSnapshot()
+	//
+	// addClass: 
+	// 	true to calculate what adding a class would do, 
+	// 	false to calculate what removing the class would do
+
+	var node = (args.node = dojo.byId(args.node)); 
+	var cs = dojo.getComputedStyle(node);
+
+	// take our snapShots
+	var _before = dojox.fx._getStyleSnapshot(cs);
+	dojo[(addClass ? "addClass" : "removeClass")](node,args.cssClass); 
+	var _after = dojox.fx._getStyleSnapshot(cs);
+	dojo[(addClass ? "removeClass" : "addClass")](node,args.cssClass); 
+
+	var calculated = {};
+	var i = 0;
+	dojo.forEach(dojox.fx._allowedProperties,function(prop){
+		if(_before[i] != _after[i]){
+			// FIXME: the static unit: px is not good, either. need to parse unit from computed style?
+			calculated[prop] = { end: parseInt(_after[i]) /* start: parseInt(_before[i]), unit: 'px' */ }; 
+		} 
+		i++;
+	});
+	return calculated; 
+};
+
+}