html.js

初学者

/*
	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.html");
dojo.require("dojo.gfx.color");
dojo.require("dojo.lfx.Animation");
dojo.require("dojo.lang.array");
dojo.require("dojo.html.display");
dojo.require("dojo.html.color");
dojo.require("dojo.html.layout");
dojo.lfx.html._byId = function (nodes) {
	if (!nodes) {
		return [];
	}
	if (dojo.lang.isArrayLike(nodes)) {
		if (!nodes.alreadyChecked) {
			var n = [];
			dojo.lang.forEach(nodes, function (node) {
				n.push(dojo.byId(node));
			});
			n.alreadyChecked = true;
			return n;
		} else {
			return nodes;
		}
	} else {
		var n = [];
		n.push(dojo.byId(nodes));
		n.alreadyChecked = true;
		return n;
	}
};
dojo.lfx.html.propertyAnimation = function (nodes, propertyMap, duration, easing, handlers) {
	nodes = dojo.lfx.html._byId(nodes);
	var targs = {"propertyMap":propertyMap, "nodes":nodes, "duration":duration, "easing":easing || dojo.lfx.easeDefault};
	var setEmUp = function (args) {
		if (args.nodes.length == 1) {
			var pm = args.propertyMap;
			if (!dojo.lang.isArray(args.propertyMap)) {
				var parr = [];
				for (var pname in pm) {
					pm[pname].property = pname;
					parr.push(pm[pname]);
				}
				pm = args.propertyMap = parr;
			}
			dojo.lang.forEach(pm, function (prop) {
				if (dj_undef("start", prop)) {
					if (prop.property != "opacity") {
						prop.start = parseInt(dojo.html.getComputedStyle(args.nodes[0], prop.property));
					} else {
						prop.start = dojo.html.getOpacity(args.nodes[0]);
					}
				}
			});
		}
	};
	var coordsAsInts = function (coords) {
		var cints = [];
		dojo.lang.forEach(coords, function (c) {
			cints.push(Math.round(c));
		});
		return cints;
	};
	var setStyle = function (n, style) {
		n = dojo.byId(n);
		if (!n || !n.style) {
			return;
		}
		for (var s in style) {
			try {
				if (s == "opacity") {
					dojo.html.setOpacity(n, style[s]);
				} else {
					n.style[s] = style[s];
				}
			}
			catch (e) {
				dojo.debug(e);
			}
		}
	};
	var propLine = function (properties) {
		this._properties = properties;
		this.diffs = new Array(properties.length);
		dojo.lang.forEach(properties, function (prop, i) {
			if (dojo.lang.isFunction(prop.start)) {
				prop.start = prop.start(prop, i);
			}
			if (dojo.lang.isFunction(prop.end)) {
				prop.end = prop.end(prop, i);
			}
			if (dojo.lang.isArray(prop.start)) {
				this.diffs[i] = null;
			} else {
				if (prop.start instanceof dojo.gfx.color.Color) {
					prop.startRgb = prop.start.toRgb();
					prop.endRgb = prop.end.toRgb();
				} else {
					this.diffs[i] = prop.end - prop.start;
				}
			}
		}, this);
		this.getValue = function (n) {
			var ret = {};
			dojo.lang.forEach(this._properties, function (prop, i) {
				var value = null;
				if (dojo.lang.isArray(prop.start)) {
				} else {
					if (prop.start instanceof dojo.gfx.color.Color) {
						value = (prop.units || "rgb") + "(";
						for (var j = 0; j < prop.startRgb.length; j++) {
							value += Math.round(((prop.endRgb[j] - prop.startRgb[j]) * n) + prop.startRgb[j]) + (j < prop.startRgb.length - 1 ? "," : "");
						}
						value += ")";
					} else {
						value = ((this.diffs[i]) * n) + prop.start + (prop.property != "opacity" ? prop.units || "px" : "");
					}
				}
				ret[dojo.html.toCamelCase(prop.property)] = value;
			}, this);
			return ret;
		};
	};
	var anim = new dojo.lfx.Animation({beforeBegin:function () {
		setEmUp(targs);
		anim.curve = new propLine(targs.propertyMap);
	}, onAnimate:function (propValues) {
		dojo.lang.forEach(targs.nodes, function (node) {
			setStyle(node, propValues);
		});
	}}, targs.duration, null, targs.easing);
	if (handlers) {
		for (var x in handlers) {
			if (dojo.lang.isFunction(handlers[x])) {
				anim.connect(x, anim, handlers[x]);
			}
		}
	}
	return anim;
};
dojo.lfx.html._makeFadeable = function (nodes) {
	var makeFade = function (node) {
		if (dojo.render.html.ie) {
			if ((node.style.zoom.length == 0) && (dojo.html.getStyle(node, "zoom") == "normal")) {
				node.style.zoom = "1";
			}
			if ((node.style.width.length == 0) && (dojo.html.getStyle(node, "width") == "auto")) {
				node.style.width = "auto";
			}
		}
	};
	if (dojo.lang.isArrayLike(nodes)) {
		dojo.lang.forEach(nodes, makeFade);
	} else {
		makeFade(nodes);
	}
};
dojo.lfx.html.fade = function (nodes, values, duration, easing, callback) {
	nodes = dojo.lfx.html._byId(nodes);
	var props = {property:"opacity"};
	if (!dj_undef("start", values)) {
		props.start = values.start;
	} else {
		props.start = function () {
			return dojo.html.getOpacity(nodes[0]);
		};
	}
	if (!dj_undef("end", values)) {
		props.end = values.end;
	} else {
		dojo.raise("dojo.lfx.html.fade needs an end value");
	}
	var anim = dojo.lfx.propertyAnimation(nodes, [props], duration, easing);
	anim.connect("beforeBegin", function () {
		dojo.lfx.html._makeFadeable(nodes);
	});
	if (callback) {
		anim.connect("onEnd", function () {
			callback(nodes, anim);
		});
	}
	return anim;
};
dojo.lfx.html.fadeIn = function (nodes, duration, easing, callback) {
	return dojo.lfx.html.fade(nodes, {end:1}, duration, easing, callback);
};
dojo.lfx.html.fadeOut = function (nodes, duration, easing, callback) {
	return dojo.lfx.html.fade(nodes, {end:0}, duration, easing, callback);
};
dojo.lfx.html.fadeShow = function (nodes, duration, easing, callback) {
	nodes = dojo.lfx.html._byId(nodes);
	dojo.lang.forEach(nodes, function (node) {
		dojo.html.setOpacity(node, 0);
	});
	var anim = dojo.lfx.html.fadeIn(nodes, duration, easing, callback);
	anim.connect("beforeBegin", function () {
		if (dojo.lang.isArrayLike(nodes)) {
			dojo.lang.forEach(nodes, dojo.html.show);
		} else {
			dojo.html.show(nodes);
		}
	});
	return anim;
};
dojo.lfx.html.fadeHide = function (nodes, duration, easing, callback) {
	var anim = dojo.lfx.html.fadeOut(nodes, duration, easing, function () {
		if (dojo.lang.isArrayLike(nodes)) {
			dojo.lang.forEach(nodes, dojo.html.hide);
		} else {
			dojo.html.hide(nodes);
		}
		if (callback) {
			callback(nodes, anim);
		}
	});
	return anim;
};
dojo.lfx.html.wipeIn = function (nodes, duration, easing, callback) {
	nodes = dojo.lfx.html._byId(nodes);
	var anims = [];
	dojo.lang.forEach(nodes, function (node) {
		var oprop = {};
		var origTop, origLeft, origPosition;
		with (node.style) {
			origTop = top;
			origLeft = left;
			origPosition = position;
			top = "-9999px";
			left = "-9999px";
			position = "absolute";
			display = "";
		}
		var nodeHeight = dojo.html.getBorderBox(node).height;
		with (node.style) {
			top = origTop;
			left = origLeft;
			position = origPosition;
			display = "none";
		}
		var anim = dojo.lfx.propertyAnimation(node, {"height":{start:1, end:function () {
			return nodeHeight;
		}}}, duration, easing);
		anim.connect("beforeBegin", function () {
			oprop.overflow = node.style.overflow;
			oprop.height = node.style.height;