src/cm/media/js/lib/yui/yui3.0.0/examples/event/assets/checkbox.js
changeset 0 40c8f766c9b8
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/cm/media/js/lib/yui/yui3.0.0/examples/event/assets/checkbox.js	Mon Nov 23 15:14:29 2009 +0100
@@ -0,0 +1,305 @@
+YUI().use("*", function(Y) {
+
+	var UA = Y.UA,
+		getClassName = Y.ClassNameManager.getClassName,
+		sCheckboxFocusClass = getClassName("checkbox", "focus"),	// Create yui-checkbox-focus
+		sCheckboxCheckedClass = getClassName("checkbox", "checked"),	// Create yui-checkbox-checked
+		sCheckboxActiveClass = getClassName("checkbox", "active"),	// Create yui-checkbox-active
+		bKeyListenersInitialized = false,
+		bMouseListenersInitialized = false,
+		forAttr = (UA.ie && UA.ie < 8) ? "htmlFor" : "for",
+		bBlockDocumentMouseUp = false,
+		bBlockClearActive = false,
+		bBlockBlur = false,		
+		oActiveCheckbox;			
+
+
+	var initKeyListeners = function () {
+
+		this.delegate("keydown", onCheckboxKeyDown, ".yui-checkbox");
+		this.delegate("click", onCheckboxClick, ".yui-checkbox");
+		this.delegate("blur", onCheckboxBlur, "input[type=checkbox]");
+
+		bKeyListenersInitialized = true;
+
+	};
+
+
+	var initMouseListeners = function () {
+
+		this.delegate("mouseover", onCheckboxMouseOver, ".yui-checkbox");
+		this.delegate("mouseout", onCheckboxMouseOut, ".yui-checkbox-active");
+		this.get("ownerDocument").on("mouseup", onDocumentMouseUp);
+
+		bMouseListenersInitialized = true;
+
+	};
+
+
+	var getCheckbox = function (node) {
+
+		return (node.hasClass("yui-checkbox") ? node : node.ancestor(".yui-checkbox"));
+
+	};
+
+
+	var getCheckboxForLabel = function (label) {
+
+		var sID = label.getAttribute(forAttr),
+			oInput,
+			oCheckbox;
+
+		if (sID) {
+
+			oInput = Y.one("#" + sID);
+
+			if (oInput) {
+				oCheckbox = getCheckbox(oInput);
+			}
+
+		}
+
+		return oCheckbox;
+
+	};
+
+
+	var updateCheckedState = function (input) {
+
+		var oCheckbox = getCheckbox(input);
+
+		if (input.get("checked")) {
+			oCheckbox.addClass(sCheckboxCheckedClass);
+		}
+		else {
+			oCheckbox.removeClass(sCheckboxCheckedClass);
+		}
+
+	};
+
+
+	var setActiveCheckbox = function (checkbox) {
+
+		checkbox.addClass(sCheckboxActiveClass);
+		oActiveCheckbox = checkbox;
+
+	};
+
+
+	var clearActiveCheckbox = function () {
+
+		if (oActiveCheckbox) {
+			oActiveCheckbox.removeClass(sCheckboxActiveClass);
+			oActiveCheckbox = null;
+		}
+
+	};
+
+
+	var onCheckboxMouseOver = function (event, matchedEl) {
+
+		if (oActiveCheckbox && oActiveCheckbox.compareTo(this)) {
+			oActiveCheckbox.addClass(sCheckboxActiveClass);
+		}
+
+	};
+
+
+	var onCheckboxMouseOut = function (event) {
+
+		this.removeClass(sCheckboxActiveClass);
+
+	};				
+
+
+	var onDocumentMouseUp = function (event) {
+
+		var oCheckbox;
+
+		if (!bBlockDocumentMouseUp) {
+
+			oCheckbox = getCheckbox(event.target);
+
+			if ((oCheckbox && !oCheckbox.compareTo(oActiveCheckbox)) || !oCheckbox) {
+				clearActiveCheckbox();
+			}
+
+		}
+
+		bBlockDocumentMouseUp = false;
+
+	};
+
+
+	var onCheckboxFocus = function (event) {
+
+		//	Remove the focus style from any checkbox that might still have it
+
+		var oCheckbox = Y.one("#checkboxes").one(".yui-checkbox-focus");
+
+		if (oCheckbox) {
+			oCheckbox.removeClass(sCheckboxFocusClass);
+		}
+
+		//	Defer adding key-related and click event listeners until 
+		//	one of the checkboxes is initially focused.
+
+		if (!bKeyListenersInitialized) {
+			initKeyListeners.call(event.container);
+		}
+
+		oCheckbox = getCheckbox(this);
+
+		oCheckbox.addClass(sCheckboxFocusClass);
+
+	};
+
+
+	var onCheckboxBlur = function (event) {
+
+		if (bBlockBlur) {
+			bBlockBlur = false;
+			return;
+		}
+
+		var oCheckbox = getCheckbox(this);
+
+		oCheckbox.removeClass(sCheckboxFocusClass);
+
+		if (!bBlockClearActive && oCheckbox.compareTo(oActiveCheckbox)) {
+			clearActiveCheckbox();
+		}
+
+		bBlockClearActive = false;
+
+	};
+
+
+	var onCheckboxMouseDown = function (event) {
+
+		//	Defer adding mouse-related and click event listeners until 
+		//	the user mouses down on one of the checkboxes.
+
+		if (!bMouseListenersInitialized) {
+			initMouseListeners.call(event.container);
+		}
+
+		var oCheckbox,
+			oInput;
+
+
+		if (this.get("nodeName").toLowerCase() === "label") {
+
+			//	If the target of the event was the checkbox's label element, the
+			//	label will dispatch a click event to the checkbox, meaning the 
+			//	"onCheckboxClick" handler will be called twice.  For that reason
+			//	it is necessary to block the "onDocumentMouseUp" handler from
+			//	clearing the active state, so that a reference to the active  
+			//	checkbox still exists the second time the "onCheckboxClick"
+			//	handler is called.
+
+			bBlockDocumentMouseUp = true;
+
+			//	When the user clicks the label instead of the checkbox itself, 
+			//	the checkbox will be blurred if it has focus.  Since the 
+			//	"onCheckboxBlur" handler clears the active state it is 
+			//	necessary to block the clearing of the active state when the 
+			//	label is clicked instead of the checkbox itself.
+
+			bBlockClearActive = true;
+
+			oCheckbox = getCheckboxForLabel(this);
+
+		}
+		else {
+
+			oCheckbox = this;
+
+		}
+
+		//	Need to focus the input manually for two reasons:
+		//	1) 	Mousing down on a label in Webkit doesn't focus its  
+		//		associated checkbox
+		//	2)	By default checkboxes are focused when the user mouses 
+		//		down on them.  However, since the actually checkbox is 
+		//		obscurred by the two span elements that are used to 
+		//		style it, the checkbox wont' receive focus as it was 
+		//		never the actual target of the mousedown event.
+
+		oInput = oCheckbox.one("input");
+
+
+		//	Calling Event.preventDefault won't block the blurring of the 
+		//	currently focused element in IE, so we'll use the "bBlockBlur"
+		//	variable to stop the code in the blur event handler  
+		//	from executing.
+
+		bBlockBlur = (UA.ie && oInput.get("checked"));
+
+
+		oInput.focus();
+
+		setActiveCheckbox(oCheckbox);
+
+		//	Need to call preventDefault because by default mousing down on
+		//	an element will blur the element in the document that currently 
+		//	has focus--in this case, the input element that was 
+		//	just focused.
+
+		event.preventDefault();
+
+	};
+
+
+	var onCheckboxClick = function (event) {
+
+		var oInput;
+
+		if (this.compareTo(oActiveCheckbox)) {
+
+			oInput = this.one("input");
+
+			if (!event.target.compareTo(oInput)) {
+
+				//	If the click event was fired via the mouse the checked
+				//	state will have to be manually updated since the input 
+				//	is hidden offscreen and therefore couldn't be the 
+				//	target of the click.
+
+				oInput.set("checked", (!oInput.get("checked")));
+
+			}
+
+			updateCheckedState(oInput);
+			clearActiveCheckbox();
+
+		}
+
+	};
+
+
+	var onCheckboxKeyDown = function (event) {
+
+		//	Style the checkbox as being active when the user presses the 
+		//	space bar
+
+		if (event.keyCode === 32) {
+			setActiveCheckbox(this);
+		}
+
+	};
+
+	Y.all("#checkboxes>div>span").addClass("yui-checkbox");
+
+	//	Remove the "yui-checkboxes-loading" class used to hide the 
+	//	checkboxes now that the checkboxes have been skinned.
+
+	Y.one("#checkboxes").get("ownerDocument").get("documentElement").removeClass("yui-checkboxes-loading");
+
+	//	Add the minimum number of event listeners needed to start, bind the 
+	//	rest when needed
+
+	Y.delegate("mousedown", onCheckboxMouseDown, "#checkboxes", ".yui-checkbox,label");
+	Y.delegate("focus", onCheckboxFocus, "#checkboxes", "input[type=checkbox]");
+		
+});