/* Copyright (c) 2004-2006, The Dojo Foundation All Rights Reserved. Licensed under the Academic Free License version 2.1 or above OR the modified BSD license. For more information on Dojo licensing, see: http://dojotoolkit.org/community/licensing.shtml */ dojo.provide("dojo.lfx.extras"); dojo.require("dojo.lfx.html"); dojo.require("dojo.lfx.Animation"); dojo.lfx.html.fadeWipeIn = function(/*DOMNode[]*/ nodes, /*int?*/ duration, /*Function?*/ easing, /*Function?*/ callback){ // summary: Returns an animation that will fade "nodes" from its current // opacity to fully opaque while wiping it in. // nodes: An array of DOMNodes or one DOMNode. // duration: Duration of the animation in milliseconds. // easing: An easing function. // callback: Function to run at the end of the animation. nodes = dojo.lfx.html._byId(nodes); var anim = dojo.lfx.combine( dojo.lfx.fadeIn(nodes, duration, easing), dojo.lfx.wipeIn(nodes, duration, easing) ); if(callback){ anim.connect("onEnd", function(){ callback(nodes, anim); }); } return anim; // dojo.lfx.Combine } dojo.lfx.html.fadeWipeOut = function(/*DOMNode[]*/ nodes, /*int?*/ duration, /*Function?*/ easing, /*Function?*/ callback){ // summary: Returns an animation that will fade "nodes" from its current // opacity to fully transparent while wiping it out. // nodes: An array of DOMNodes or one DOMNode. // duration: Duration of the animation in milliseconds. // easing: An easing function. // callback: Function to run at the end of the animation. nodes = dojo.lfx.html._byId(nodes); var anim = dojo.lfx.combine( dojo.lfx.fadeOut(nodes, duration, easing), dojo.lfx.wipeOut(nodes, duration, easing) ); if(callback){ /* callback: Function pId: f */ anim.connect("onEnd", function(){ callback(nodes, anim); }); } return anim; // dojo.lfx.Combine } dojo.lfx.html.scale = function(/*DOMNode[]*/nodes, /*int*/ percentage, /*bool?*/ scaleContent, /*bool?*/ fromCenter, /*int?*/ duration, /*Function?*/ easing, /*Function?*/ callback){ // summary: Returns an animation that will scale "nodes" by "percentage". // nodes: An array of DOMNodes or one DOMNode. // percentage: A whole number representing the percentage to scale "nodes". // scaleContent: If true, will scale the contents of "nodes". // fromCenter: If true, will scale "nodes" from its center rather than the // lower right corner. // duration: Duration of the animation in milliseconds. // easing: An easing function. // callback: Function to run at the end of the animation. nodes = dojo.lfx.html._byId(nodes); var anims = []; dojo.lang.forEach(nodes, function(node){ var outer = dojo.html.getMarginBox(node); var actualPct = percentage/100.0; var props = [ { property: "width", start: outer.width, end: outer.width * actualPct }, { property: "height", start: outer.height, end: outer.height * actualPct }]; if(scaleContent){ var fontSize = dojo.html.getStyle(node, 'font-size'); var fontSizeType = null; if(!fontSize){ fontSize = parseFloat('100%'); fontSizeType = '%'; }else{ dojo.lang.some(['em','px','%'], function(item, index, arr){ if(fontSize.indexOf(item)>0){ fontSize = parseFloat(fontSize); fontSizeType = item; return true; } }); } props.push({ property: "font-size", start: fontSize, end: fontSize * actualPct, units: fontSizeType }); } if(fromCenter){ var positioning = dojo.html.getStyle(node, "position"); var originalTop = node.offsetTop; var originalLeft = node.offsetLeft; var endTop = ((outer.height * actualPct) - outer.height)/2; var endLeft = ((outer.width * actualPct) - outer.width)/2; props.push({ property: "top", start: originalTop, end: (positioning == "absolute" ? originalTop - endTop : (-1*endTop)) }); props.push({ property: "left", start: originalLeft, end: (positioning == "absolute" ? originalLeft - endLeft : (-1*endLeft)) }); } var anim = dojo.lfx.propertyAnimation(node, props, duration, easing); if(callback){ anim.connect("onEnd", function(){ callback(node, anim); }); } anims.push(anim); }); return dojo.lfx.combine(anims); // dojo.lfx.Combine } dojo.lang.mixin(dojo.lfx, dojo.lfx.html);