From 81bea17aefb26859f825b9293c7c99192874806e Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Tue, 8 Nov 2011 20:40:44 +0400 Subject: upgrade Dojo to 1.6.1 --- lib/dijit/form/Button.js | 463 +++++++++++++++++++++++++++++++++++------------ 1 file changed, 348 insertions(+), 115 deletions(-) (limited to 'lib/dijit/form/Button.js') diff --git a/lib/dijit/form/Button.js b/lib/dijit/form/Button.js index 741062022..77846776f 100644 --- a/lib/dijit/form/Button.js +++ b/lib/dijit/form/Button.js @@ -1,127 +1,360 @@ /* - Copyright (c) 2004-2010, The Dojo Foundation All Rights Reserved. + Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved. Available via Academic Free License >= 2.1 OR the modified BSD license. see: http://dojotoolkit.org/license for details */ -if(!dojo._hasResource["dijit.form.Button"]){ -dojo._hasResource["dijit.form.Button"]=true; +if(!dojo._hasResource["dijit.form.Button"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.Button"] = true; dojo.provide("dijit.form.Button"); dojo.require("dijit.form._FormWidget"); dojo.require("dijit._Container"); dojo.require("dijit._HasDropDown"); -dojo.declare("dijit.form.Button",dijit.form._FormWidget,{label:"",showLabel:true,iconClass:"",type:"button",baseClass:"dijitButton",templateString:dojo.cache("dijit.form","templates/Button.html","●\n"),attributeMap:dojo.delegate(dijit.form._FormWidget.prototype.attributeMap,{value:"valueNode",iconClass:{node:"iconNode",type:"class"}}),_onClick:function(e){ -if(this.disabled){ -return false; -} -this._clicked(); -return this.onClick(e); -},_onButtonClick:function(e){ -if(this._onClick(e)===false){ -e.preventDefault(); -}else{ -if(this.type=="submit"&&!(this.valueNode||this.focusNode).form){ -for(var _1=this.domNode;_1.parentNode;_1=_1.parentNode){ -var _2=dijit.byNode(_1); -if(_2&&typeof _2._onSubmit=="function"){ -_2._onSubmit(e); -break; -} -} -}else{ -if(this.valueNode){ -this.valueNode.click(); -e.preventDefault(); -} -} -} -},_fillContent:function(_3){ -if(_3&&(!this.params||!("label" in this.params))){ -this.set("label",_3.innerHTML); -} -},postCreate:function(){ -dojo.setSelectable(this.focusNode,false); -this.inherited(arguments); -},_setShowLabelAttr:function(_4){ -if(this.containerNode){ -dojo.toggleClass(this.containerNode,"dijitDisplayNone",!_4); -} -this.showLabel=_4; -},onClick:function(e){ -return true; -},_clicked:function(e){ -},setLabel:function(_5){ -dojo.deprecated("dijit.form.Button.setLabel() is deprecated. Use set('label', ...) instead.","","2.0"); -this.set("label",_5); -},_setLabelAttr:function(_6){ -this.containerNode.innerHTML=this.label=_6; -if(this.showLabel==false&&!this.params.title){ -this.titleNode.title=dojo.trim(this.containerNode.innerText||this.containerNode.textContent||""); -} -}}); -dojo.declare("dijit.form.DropDownButton",[dijit.form.Button,dijit._Container,dijit._HasDropDown],{baseClass:"dijitDropDownButton",templateString:dojo.cache("dijit.form","templates/DropDownButton.html","▼\n"),_fillContent:function(){ -if(this.srcNodeRef){ -var _7=dojo.query("*",this.srcNodeRef); -dijit.form.DropDownButton.superclass._fillContent.call(this,_7[0]); -this.dropDownContainer=this.srcNodeRef; -} -},startup:function(){ -if(this._started){ -return; -} -if(!this.dropDown){ -var _8=dojo.query("[widgetId]",this.dropDownContainer)[0]; -this.dropDown=dijit.byNode(_8); -delete this.dropDownContainer; -} -dijit.popup.moveOffScreen(this.dropDown.domNode); -this.inherited(arguments); -},isLoaded:function(){ -var _9=this.dropDown; -return (!_9.href||_9.isLoaded); -},loadDropDown:function(){ -var _a=this.dropDown; -if(!_a){ -return; -} -if(!this.isLoaded()){ -var _b=dojo.connect(_a,"onLoad",this,function(){ -dojo.disconnect(_b); -this.openDropDown(); + + +dojo.declare("dijit.form.Button", + dijit.form._FormWidget, + { + // summary: + // Basically the same thing as a normal HTML button, but with special styling. + // description: + // Buttons can display a label, an icon, or both. + // A label should always be specified (through innerHTML) or the label + // attribute. It can be hidden via showLabel=false. + // example: + // | + // + // example: + // | var button1 = new dijit.form.Button({label: "hello world", onClick: foo}); + // | dojo.body().appendChild(button1.domNode); + + // label: HTML String + // Text to display in button. + // If the label is hidden (showLabel=false) then and no title has + // been specified, then label is also set as title attribute of icon. + label: "", + + // showLabel: Boolean + // Set this to true to hide the label text and display only the icon. + // (If showLabel=false then iconClass must be specified.) + // Especially useful for toolbars. + // If showLabel=true, the label will become the title (a.k.a. tooltip/hint) of the icon. + // + // The exception case is for computers in high-contrast mode, where the label + // will still be displayed, since the icon doesn't appear. + showLabel: true, + + // iconClass: String + // Class to apply to DOMNode in button to make it display an icon + iconClass: "", + + // type: String + // Defines the type of button. "button", "submit", or "reset". + type: "button", + + baseClass: "dijitButton", + + templateString: dojo.cache("dijit.form", "templates/Button.html", "●\n"), + + attributeMap: dojo.delegate(dijit.form._FormWidget.prototype.attributeMap, { + value: "valueNode" + }), + + _onClick: function(/*Event*/ e){ + // summary: + // Internal function to handle click actions + if(this.disabled){ + return false; + } + this._clicked(); // widget click actions + return this.onClick(e); // user click actions + }, + + _onButtonClick: function(/*Event*/ e){ + // summary: + // Handler when the user activates the button portion. + if(this._onClick(e) === false){ // returning nothing is same as true + e.preventDefault(); // needed for checkbox + }else if(this.type == "submit" && !(this.valueNode||this.focusNode).form){ // see if a nonform widget needs to be signalled + for(var node=this.domNode; node.parentNode/*#5935*/; node=node.parentNode){ + var widget=dijit.byNode(node); + if(widget && typeof widget._onSubmit == "function"){ + widget._onSubmit(e); + break; + } + } + }else if(this.valueNode){ + this.valueNode.click(); + e.preventDefault(); // cancel BUTTON click and continue with hidden INPUT click + } + }, + + buildRendering: function(){ + this.inherited(arguments); + dojo.setSelectable(this.focusNode, false); + }, + + _fillContent: function(/*DomNode*/ source){ + // Overrides _Templated._fillContent(). + // If button label is specified as srcNodeRef.innerHTML rather than + // this.params.label, handle it here. + // TODO: remove the method in 2.0, parser will do it all for me + if(source && (!this.params || !("label" in this.params))){ + this.set('label', source.innerHTML); + } + }, + + _setShowLabelAttr: function(val){ + if(this.containerNode){ + dojo.toggleClass(this.containerNode, "dijitDisplayNone", !val); + } + this._set("showLabel", val); + }, + + onClick: function(/*Event*/ e){ + // summary: + // Callback for when button is clicked. + // If type="submit", return true to perform submit, or false to cancel it. + // type: + // callback + return true; // Boolean + }, + + _clicked: function(/*Event*/ e){ + // summary: + // Internal overridable function for when the button is clicked + }, + + setLabel: function(/*String*/ content){ + // summary: + // Deprecated. Use set('label', ...) instead. + dojo.deprecated("dijit.form.Button.setLabel() is deprecated. Use set('label', ...) instead.", "", "2.0"); + this.set("label", content); + }, + + _setLabelAttr: function(/*String*/ content){ + // summary: + // Hook for set('label', ...) to work. + // description: + // Set the label (text) of the button; takes an HTML string. + this._set("label", content); + this.containerNode.innerHTML = content; + if(this.showLabel == false && !this.params.title){ + this.titleNode.title = dojo.trim(this.containerNode.innerText || this.containerNode.textContent || ''); + } + }, + + _setIconClassAttr: function(/*String*/ val){ + // Custom method so that icon node is hidden when not in use, to avoid excess padding/margin + // appearing around it (even if it's a 0x0 sized node) + + var oldVal = this.iconClass || "dijitNoIcon", + newVal = val || "dijitNoIcon"; + dojo.replaceClass(this.iconNode, newVal, oldVal); + this._set("iconClass", val); + } }); -_a.refresh(); -}else{ -this.openDropDown(); -} -},isFocusable:function(){ -return this.inherited(arguments)&&!this._mouseDown; -}}); -dojo.declare("dijit.form.ComboButton",dijit.form.DropDownButton,{templateString:dojo.cache("dijit.form","templates/ComboButton.html","
▼
\n"),attributeMap:dojo.mixin(dojo.clone(dijit.form.Button.prototype.attributeMap),{id:"",tabIndex:["focusNode","titleNode"],title:"titleNode"}),optionsTitle:"",baseClass:"dijitComboButton",cssStateNodes:{"buttonNode":"dijitButtonNode","titleNode":"dijitButtonContents","_popupStateNode":"dijitDownArrowButton"},_focusedNode:null,_onButtonKeyPress:function(_c){ -if(_c.charOrCode==dojo.keys[this.isLeftToRight()?"RIGHT_ARROW":"LEFT_ARROW"]){ -dijit.focus(this._popupStateNode); -dojo.stopEvent(_c); -} -},_onArrowKeyPress:function(_d){ -if(_d.charOrCode==dojo.keys[this.isLeftToRight()?"LEFT_ARROW":"RIGHT_ARROW"]){ -dijit.focus(this.titleNode); -dojo.stopEvent(_d); -} -},focus:function(_e){ -dijit.focus(_e=="start"?this.titleNode:this._popupStateNode); -}}); -dojo.declare("dijit.form.ToggleButton",dijit.form.Button,{baseClass:"dijitToggleButton",checked:false,attributeMap:dojo.mixin(dojo.clone(dijit.form.Button.prototype.attributeMap),{checked:"focusNode"}),_clicked:function(_f){ -this.set("checked",!this.checked); -},_setCheckedAttr:function(_10,_11){ -this.checked=_10; -dojo.attr(this.focusNode||this.domNode,"checked",_10); -dijit.setWaiState(this.focusNode||this.domNode,"pressed",_10); -this._handleOnChange(_10,_11); -},setChecked:function(_12){ -dojo.deprecated("setChecked("+_12+") is deprecated. Use set('checked',"+_12+") instead.","","2.0"); -this.set("checked",_12); -},reset:function(){ -this._hasBeenBlurred=false; -this.set("checked",this.params.checked||false); -}}); + + +dojo.declare("dijit.form.DropDownButton", [dijit.form.Button, dijit._Container, dijit._HasDropDown], { + // summary: + // A button with a drop down + // + // example: + // | + // + // example: + // | var button1 = new dijit.form.DropDownButton({ label: "hi", dropDown: new dijit.Menu(...) }); + // | dojo.body().appendChild(button1); + // + + baseClass : "dijitDropDownButton", + + templateString: dojo.cache("dijit.form", "templates/DropDownButton.html", "▼\n"), + + _fillContent: function(){ + // Overrides Button._fillContent(). + // + // My inner HTML contains both the button contents and a drop down widget, like + // push me ... + // The first node is assumed to be the button content. The widget is the popup. + + if(this.srcNodeRef){ // programatically created buttons might not define srcNodeRef + //FIXME: figure out how to filter out the widget and use all remaining nodes as button + // content, not just nodes[0] + var nodes = dojo.query("*", this.srcNodeRef); + dijit.form.DropDownButton.superclass._fillContent.call(this, nodes[0]); + + // save pointer to srcNode so we can grab the drop down widget after it's instantiated + this.dropDownContainer = this.srcNodeRef; + } + }, + + startup: function(){ + if(this._started){ return; } + + // the child widget from srcNodeRef is the dropdown widget. Insert it in the page DOM, + // make it invisible, and store a reference to pass to the popup code. + if(!this.dropDown && this.dropDownContainer){ + var dropDownNode = dojo.query("[widgetId]", this.dropDownContainer)[0]; + this.dropDown = dijit.byNode(dropDownNode); + delete this.dropDownContainer; + } + if(this.dropDown){ + dijit.popup.hide(this.dropDown); + } + + this.inherited(arguments); + }, + + isLoaded: function(){ + // Returns whether or not we are loaded - if our dropdown has an href, + // then we want to check that. + var dropDown = this.dropDown; + return (!!dropDown && (!dropDown.href || dropDown.isLoaded)); + }, + + loadDropDown: function(){ + // Loads our dropdown + var dropDown = this.dropDown; + if(!dropDown){ return; } + if(!this.isLoaded()){ + var handler = dojo.connect(dropDown, "onLoad", this, function(){ + dojo.disconnect(handler); + this.openDropDown(); + }); + dropDown.refresh(); + }else{ + this.openDropDown(); + } + }, + + isFocusable: function(){ + // Overridden so that focus is handled by the _HasDropDown mixin, not by + // the _FormWidget mixin. + return this.inherited(arguments) && !this._mouseDown; + } +}); + +dojo.declare("dijit.form.ComboButton", dijit.form.DropDownButton, { + // summary: + // A combination button and drop-down button. + // Users can click one side to "press" the button, or click an arrow + // icon to display the drop down. + // + // example: + // | + // + // example: + // | var button1 = new dijit.form.ComboButton({label: "hello world", onClick: foo, dropDown: "myMenu"}); + // | dojo.body().appendChild(button1.domNode); + // + + templateString: dojo.cache("dijit.form", "templates/ComboButton.html", "
▼
\n"), + + attributeMap: dojo.mixin(dojo.clone(dijit.form.Button.prototype.attributeMap), { + id: "", + tabIndex: ["focusNode", "titleNode"], + title: "titleNode" + }), + + // optionsTitle: String + // Text that describes the options menu (accessibility) + optionsTitle: "", + + baseClass: "dijitComboButton", + + // Set classes like dijitButtonContentsHover or dijitArrowButtonActive depending on + // mouse action over specified node + cssStateNodes: { + "buttonNode": "dijitButtonNode", + "titleNode": "dijitButtonContents", + "_popupStateNode": "dijitDownArrowButton" + }, + + _focusedNode: null, + + _onButtonKeyPress: function(/*Event*/ evt){ + // summary: + // Handler for right arrow key when focus is on left part of button + if(evt.charOrCode == dojo.keys[this.isLeftToRight() ? "RIGHT_ARROW" : "LEFT_ARROW"]){ + dijit.focus(this._popupStateNode); + dojo.stopEvent(evt); + } + }, + + _onArrowKeyPress: function(/*Event*/ evt){ + // summary: + // Handler for left arrow key when focus is on right part of button + if(evt.charOrCode == dojo.keys[this.isLeftToRight() ? "LEFT_ARROW" : "RIGHT_ARROW"]){ + dijit.focus(this.titleNode); + dojo.stopEvent(evt); + } + }, + + focus: function(/*String*/ position){ + // summary: + // Focuses this widget to according to position, if specified, + // otherwise on arrow node + // position: + // "start" or "end" + if(!this.disabled){ + dijit.focus(position == "start" ? this.titleNode : this._popupStateNode); + } + } +}); + +dojo.declare("dijit.form.ToggleButton", dijit.form.Button, { + // summary: + // A button that can be in two states (checked or not). + // Can be base class for things like tabs or checkbox or radio buttons + + baseClass: "dijitToggleButton", + + // checked: Boolean + // Corresponds to the native HTML element's attribute. + // In markup, specified as "checked='checked'" or just "checked". + // True if the button is depressed, or the checkbox is checked, + // or the radio button is selected, etc. + checked: false, + + attributeMap: dojo.mixin(dojo.clone(dijit.form.Button.prototype.attributeMap), { + checked:"focusNode" + }), + + _clicked: function(/*Event*/ evt){ + this.set('checked', !this.checked); + }, + + _setCheckedAttr: function(/*Boolean*/ value, /*Boolean?*/ priorityChange){ + this._set("checked", value); + dojo.attr(this.focusNode || this.domNode, "checked", value); + dijit.setWaiState(this.focusNode || this.domNode, "pressed", value); + this._handleOnChange(value, priorityChange); + }, + + setChecked: function(/*Boolean*/ checked){ + // summary: + // Deprecated. Use set('checked', true/false) instead. + dojo.deprecated("setChecked("+checked+") is deprecated. Use set('checked',"+checked+") instead.", "", "2.0"); + this.set('checked', checked); + }, + + reset: function(){ + // summary: + // Reset the widget's value to what it was at initialization time + + this._hasBeenBlurred = false; + + // set checked state to original setting + this.set('checked', this.params.checked || false); + } +}); + } -- cgit v1.2.3