//>>built define("dojox/gfx/fx", ["dojo/_base/lang", "./_base", "./matrix", "dojo/_base/Color", "dojo/_base/array", "dojo/_base/fx", "dojo/_base/connect"], function(lang, g, m, Color, arr, fx, Hub){ var fxg = g.fx = {}; /*===== g = dojox.gfx; fxg = dojox.gfx.fx; =====*/ // Generic interpolators. Should they be moved to dojox.fx? function InterpolNumber(start, end){ this.start = start, this.end = end; } InterpolNumber.prototype.getValue = function(r){ return (this.end - this.start) * r + this.start; }; function InterpolUnit(start, end, units){ this.start = start, this.end = end; this.units = units; } InterpolUnit.prototype.getValue = function(r){ return (this.end - this.start) * r + this.start + this.units; }; function InterpolColor(start, end){ this.start = start, this.end = end; this.temp = new Color(); } InterpolColor.prototype.getValue = function(r){ return Color.blendColors(this.start, this.end, r, this.temp); }; function InterpolValues(values){ this.values = values; this.length = values.length; } InterpolValues.prototype.getValue = function(r){ return this.values[Math.min(Math.floor(r * this.length), this.length - 1)]; }; function InterpolObject(values, def){ this.values = values; this.def = def ? def : {}; } InterpolObject.prototype.getValue = function(r){ var ret = lang.clone(this.def); for(var i in this.values){ ret[i] = this.values[i].getValue(r); } return ret; }; function InterpolTransform(stack, original){ this.stack = stack; this.original = original; } InterpolTransform.prototype.getValue = function(r){ var ret = []; arr.forEach(this.stack, function(t){ if(t instanceof m.Matrix2D){ ret.push(t); return; } if(t.name == "original" && this.original){ ret.push(this.original); return; } if(!(t.name in m)){ return; } var f = m[t.name]; if(typeof f != "function"){ // constant ret.push(f); return; } var val = arr.map(t.start, function(v, i){ return (t.end[i] - v) * r + v; }), matrix = f.apply(m, val); if(matrix instanceof m.Matrix2D){ ret.push(matrix); } }, this); return ret; }; var transparent = new Color(0, 0, 0, 0); function getColorInterpol(prop, obj, name, def){ if(prop.values){ return new InterpolValues(prop.values); } var value, start, end; if(prop.start){ start = g.normalizeColor(prop.start); }else{ start = value = obj ? (name ? obj[name] : obj) : def; } if(prop.end){ end = g.normalizeColor(prop.end); }else{ if(!value){ value = obj ? (name ? obj[name] : obj) : def; } end = value; } return new InterpolColor(start, end); } function getNumberInterpol(prop, obj, name, def){ if(prop.values){ return new InterpolValues(prop.values); } var value, start, end; if(prop.start){ start = prop.start; }else{ start = value = obj ? obj[name] : def; } if(prop.end){ end = prop.end; }else{ if(typeof value != "number"){ value = obj ? obj[name] : def; } end = value; } return new InterpolNumber(start, end); } fxg.animateStroke = function(/*Object*/ args){ // summary: // Returns an animation which will change stroke properties over time. // example: // | dojox.gfx.fx.animateStroke{{ // | shape: shape, // | duration: 500, // | color: {start: "red", end: "green"}, // | width: {end: 15}, // | join: {values: ["miter", "bevel", "round"]} // | }).play(); if(!args.easing){ args.easing = fx._defaultEasing; } var anim = new fx.Animation(args), shape = args.shape, stroke; Hub.connect(anim, "beforeBegin", anim, function(){ stroke = shape.getStroke(); var prop = args.color, values = {}, value, start, end; if(prop){ values.color = getColorInterpol(prop, stroke, "color", transparent); } prop = args.style; if(prop && prop.values){ values.style = new InterpolValues(prop.values); } prop = args.width; if(prop){ values.width = getNumberInterpol(prop, stroke, "width", 1); } prop = args.cap; if(prop && prop.values){ values.cap = new InterpolValues(prop.values); } prop = args.join; if(prop){ if(prop.values){ values.join = new InterpolValues(prop.values); }else{ start = prop.start ? prop.start : (stroke && stroke.join || 0); end = prop.end ? prop.end : (stroke && stroke.join || 0); if(typeof start == "number" && typeof end == "number"){ values.join = new InterpolNumber(start, end); } } } this.curve = new InterpolObject(values, stroke); }); Hub.connect(anim, "onAnimate", shape, "setStroke"); return anim; // dojo.Animation }; fxg.animateFill = function(/*Object*/ args){ // summary: // Returns an animation which will change fill color over time. // Only solid fill color is supported at the moment // example: // | dojox.gfx.fx.animateFill{{ // | shape: shape, // | duration: 500, // | color: {start: "red", end: "green"} // | }).play(); if(!args.easing){ args.easing = fx._defaultEasing; } var anim = new fx.Animation(args), shape = args.shape, fill; Hub.connect(anim, "beforeBegin", anim, function(){ fill = shape.getFill(); var prop = args.color, values = {}; if(prop){ this.curve = getColorInterpol(prop, fill, "", transparent); } }); Hub.connect(anim, "onAnimate", shape, "setFill"); return anim; // dojo.Animation }; fxg.animateFont = function(/*Object*/ args){ // summary: // Returns an animation which will change font properties over time. // example: // | dojox.gfx.fx.animateFont{{ // | shape: shape, // | duration: 500, // | variant: {values: ["normal", "small-caps"]}, // | size: {end: 10, units: "pt"} // | }).play(); if(!args.easing){ args.easing = fx._defaultEasing; } var anim = new fx.Animation(args), shape = args.shape, font; Hub.connect(anim, "beforeBegin", anim, function(){ font = shape.getFont(); var prop = args.style, values = {}, value, start, end; if(prop && prop.values){ values.style = new InterpolValues(prop.values); } prop = args.variant; if(prop && prop.values){ values.variant = new InterpolValues(prop.values); } prop = args.weight; if(prop && prop.values){ values.weight = new InterpolValues(prop.values); } prop = args.family; if(prop && prop.values){ values.family = new InterpolValues(prop.values); } prop = args.size; if(prop && prop.units){ start = parseFloat(prop.start ? prop.start : (shape.font && shape.font.size || "0")); end = parseFloat(prop.end ? prop.end : (shape.font && shape.font.size || "0")); values.size = new InterpolUnit(start, end, prop.units); } this.curve = new InterpolObject(values, font); }); Hub.connect(anim, "onAnimate", shape, "setFont"); return anim; // dojo.Animation }; fxg.animateTransform = function(/*Object*/ args){ // summary: // Returns an animation which will change transformation over time. // example: // | dojox.gfx.fx.animateTransform{{ // | shape: shape, // | duration: 500, // | transform: [ // | {name: "translate", start: [0, 0], end: [200, 200]}, // | {name: "original"} // | ] // | }).play(); if(!args.easing){ args.easing = fx._defaultEasing; } var anim = new fx.Animation(args), shape = args.shape, original; Hub.connect(anim, "beforeBegin", anim, function(){ original = shape.getTransform(); this.curve = new InterpolTransform(args.transform, original); }); Hub.connect(anim, "onAnimate", shape, "setTransform"); return anim; // dojo.Animation }; return fxg; });