▼\n"),attributeMap:dojo.mixin(dojo.clone(dijit.form._FormSelectWidget.prototype.attributeMap),{style:"tableNode"}),required:false,state:"",tooltipPosition:[],emptyLabel:"",_isLoaded:false,_childrenLoaded:false,_fillContent:function(){ -this.inherited(arguments); -if(this.options.length&&!this.value&&this.srcNodeRef){ -var si=this.srcNodeRef.selectedIndex; -this.value=this.options[si!=-1?si:0].value; -} -this.dropDown=new dijit.form._SelectMenu({id:this.id+"_menu"}); -dojo.addClass(this.dropDown.domNode,this.baseClass+"Menu"); -},_getMenuItemForOption:function(_1){ -if(!_1.value){ -return new dijit.MenuSeparator(); -}else{ -var _2=dojo.hitch(this,"_setValueAttr",_1); -var _3=new dijit.MenuItem({option:_1,label:_1.label,onClick:_2,disabled:_1.disabled||false}); -dijit.setWaiRole(_3.focusNode,"listitem"); -return _3; -} -},_addOptionItem:function(_4){ -if(this.dropDown){ -this.dropDown.addChild(this._getMenuItemForOption(_4)); -} -},_getChildren:function(){ -if(!this.dropDown){ -return []; -} -return this.dropDown.getChildren(); -},_loadChildren:function(_5){ -if(_5===true){ -if(this.dropDown){ -delete this.dropDown.focusedChild; -} -if(this.options.length){ -this.inherited(arguments); -}else{ -dojo.forEach(this._getChildren(),function(_6){ -_6.destroyRecursive(); +dojo.requireLocalization("dijit.form", "validate", null, "ROOT,ar,ca,cs,da,de,el,es,fi,fr,he,hu,it,ja,kk,ko,nb,nl,pl,pt,pt-pt,ro,ru,sk,sl,sv,th,tr,zh,zh-tw"); + + +dojo.declare("dijit.form._SelectMenu", dijit.Menu, { + // summary: + // An internally-used menu for dropdown that allows us a vertical scrollbar + buildRendering: function(){ + // summary: + // Stub in our own changes, so that our domNode is not a table + // otherwise, we won't respond correctly to heights/overflows + this.inherited(arguments); + var o = (this.menuTableNode = this.domNode); + var n = (this.domNode = dojo.create("div", {style: {overflowX: "hidden", overflowY: "scroll"}})); + if(o.parentNode){ + o.parentNode.replaceChild(n, o); + } + dojo.removeClass(o, "dijitMenuTable"); + n.className = o.className + " dijitSelectMenu"; + o.className = "dijitReset dijitMenuTable"; + dijit.setWaiRole(o,"listbox"); + dijit.setWaiRole(n,"presentation"); + n.appendChild(o); + }, + + postCreate: function(){ + // summary: + // stop mousemove from selecting text on IE to be consistent with other browsers + + this.inherited(arguments); + + this.connect(this.domNode, "onmousemove", dojo.stopEvent); + }, + + resize: function(/*Object*/ mb){ + // summary: + // Overridden so that we are able to handle resizing our + // internal widget. Note that this is not a "full" resize + // implementation - it only works correctly if you pass it a + // marginBox. + // + // mb: Object + // The margin box to set this dropdown to. + if(mb){ + dojo.marginBox(this.domNode, mb); + if("w" in mb){ + // We've explicitly set the wrapper

's width, so set width to match. + // 100% is safer than a pixel value because there may be a scroll bar with + // browser/OS specific width. + this.menuTableNode.style.width = "100%"; + } + } + } }); -var _7=new dijit.MenuItem({label:" "}); -this.dropDown.addChild(_7); -} -}else{ -this._updateSelection(); -} -var _8=this.options.length; -this._isLoaded=false; -this._childrenLoaded=true; -if(!this._loadingStore){ -this._setValueAttr(this.value); -} -},_setValueAttr:function(_9){ -this.inherited(arguments); -dojo.attr(this.valueNode,"value",this.get("value")); -},_setDisplay:function(_a){ -this.containerNode.innerHTML=""+(_a||this.emptyLabel||" ")+""; -dijit.setWaiState(this.focusNode,"valuetext",(_a||this.emptyLabel||" ")); -},validate:function(_b){ -var _c=this.isValid(_b); -this.state=_c?"":"Error"; -this._setStateClass(); -dijit.setWaiState(this.focusNode,"invalid",_c?"false":"true"); -var _d=_c?"":this._missingMsg; -if(this._message!==_d){ -this._message=_d; -dijit.hideTooltip(this.domNode); -if(_d){ -dijit.showTooltip(_d,this.domNode,this.tooltipPosition,!this.isLeftToRight()); -} -} -return _c; -},isValid:function(_e){ -return (!this.required||!(/^\s*$/.test(this.value))); -},reset:function(){ -this.inherited(arguments); -dijit.hideTooltip(this.domNode); -this.state=""; -this._setStateClass(); -delete this._message; -},postMixInProperties:function(){ -this.inherited(arguments); -this._missingMsg=dojo.i18n.getLocalization("dijit.form","validate",this.lang).missingMessage; -},postCreate:function(){ -this.inherited(arguments); -if(this.tableNode.style.width){ -dojo.addClass(this.domNode,this.baseClass+"FixedWidth"); -} -},isLoaded:function(){ -return this._isLoaded; -},loadDropDown:function(_f){ -this._loadChildren(true); -this._isLoaded=true; -_f(); -},closeDropDown:function(){ -this.inherited(arguments); -if(this.dropDown&&this.dropDown.menuTableNode){ -this.dropDown.menuTableNode.style.width=""; -} -},uninitialize:function(_10){ -if(this.dropDown&&!this.dropDown._destroyed){ -this.dropDown.destroyRecursive(_10); -delete this.dropDown; -} -this.inherited(arguments); -}}); + +dojo.declare("dijit.form.Select", [dijit.form._FormSelectWidget, dijit._HasDropDown], { + // summary: + // This is a "styleable" select box - it is basically a DropDownButton which + // can take a

▼

\n"), + + // attributeMap: Object + // Add in our style to be applied to the focus node + attributeMap: dojo.mixin(dojo.clone(dijit.form._FormSelectWidget.prototype.attributeMap),{style:"tableNode"}), + + // required: Boolean + // Can be true or false, default is false. + required: false, + + // state: String + // Shows current state (ie, validation result) of input (Normal, Warning, or Error) + state: "", + + // message: String + // Currently displayed error/prompt message + message: "", + + // tooltipPosition: String[] + // See description of dijit.Tooltip.defaultPosition for details on this parameter. + tooltipPosition: [], + + // emptyLabel: string + // What to display in an "empty" dropdown + emptyLabel: " ", + + // _isLoaded: Boolean + // Whether or not we have been loaded + _isLoaded: false, + + // _childrenLoaded: Boolean + // Whether or not our children have been loaded + _childrenLoaded: false, + + _fillContent: function(){ + // summary: + // Set the value to be the first, or the selected index + this.inherited(arguments); + // set value from selected option + if(this.options.length && !this.value && this.srcNodeRef){ + var si = this.srcNodeRef.selectedIndex || 0; // || 0 needed for when srcNodeRef is not a SELECT + this.value = this.options[si >= 0 ? si : 0].value; + } + // Create the dropDown widget + this.dropDown = new dijit.form._SelectMenu({id: this.id + "_menu"}); + dojo.addClass(this.dropDown.domNode, this.baseClass + "Menu"); + }, + + _getMenuItemForOption: function(/*dijit.form.__SelectOption*/ option){ + // summary: + // For the given option, return the menu item that should be + // used to display it. This can be overridden as needed + if(!option.value && !option.label){ + // We are a separator (no label set for it) + return new dijit.MenuSeparator(); + }else{ + // Just a regular menu option + var click = dojo.hitch(this, "_setValueAttr", option); + var item = new dijit.MenuItem({ + option: option, + label: option.label || this.emptyLabel, + onClick: click, + disabled: option.disabled || false + }); + dijit.setWaiRole(item.focusNode, "listitem"); + return item; + } + }, + + _addOptionItem: function(/*dijit.form.__SelectOption*/ option){ + // summary: + // For the given option, add an option to our dropdown. + // If the option doesn't have a value, then a separator is added + // in that place. + if(this.dropDown){ + this.dropDown.addChild(this._getMenuItemForOption(option)); + } + }, + + _getChildren: function(){ + if(!this.dropDown){ + return []; + } + return this.dropDown.getChildren(); + }, + + _loadChildren: function(/*Boolean*/ loadMenuItems){ + // summary: + // Resets the menu and the length attribute of the button - and + // ensures that the label is appropriately set. + // loadMenuItems: Boolean + // actually loads the child menu items - we only do this when we are + // populating for showing the dropdown. + + if(loadMenuItems === true){ + // this.inherited destroys this.dropDown's child widgets (MenuItems). + // Avoid this.dropDown (Menu widget) having a pointer to a destroyed widget (which will cause + // issues later in _setSelected). (see #10296) + if(this.dropDown){ + delete this.dropDown.focusedChild; + } + if(this.options.length){ + this.inherited(arguments); + }else{ + // Drop down menu is blank but add one blank entry just so something appears on the screen + // to let users know that they are no choices (mimicing native select behavior) + dojo.forEach(this._getChildren(), function(child){ child.destroyRecursive(); }); + var item = new dijit.MenuItem({label: " "}); + this.dropDown.addChild(item); + } + }else{ + this._updateSelection(); + } + + this._isLoaded = false; + this._childrenLoaded = true; + + if(!this._loadingStore){ + // Don't call this if we are loading - since we will handle it later + this._setValueAttr(this.value); + } + }, + + _setValueAttr: function(value){ + this.inherited(arguments); + dojo.attr(this.valueNode, "value", this.get("value")); + }, + + _setDisplay: function(/*String*/ newDisplay){ + // summary: + // sets the display for the given value (or values) + var lbl = newDisplay || this.emptyLabel; + this.containerNode.innerHTML = '' + lbl + ''; + dijit.setWaiState(this.focusNode, "valuetext", lbl); + }, + + validate: function(/*Boolean*/ isFocused){ + // summary: + // Called by oninit, onblur, and onkeypress. + // description: + // Show missing or invalid messages if appropriate, and highlight textbox field. + // Used when a select is initially set to no value and the user is required to + // set the value. + + var isValid = this.isValid(isFocused); + this._set("state", isValid ? "" : "Error"); + dijit.setWaiState(this.focusNode, "invalid", isValid ? "false" : "true"); + var message = isValid ? "" : this._missingMsg; + if(this.message !== message){ + this._set("message", message); + dijit.hideTooltip(this.domNode); + if(message){ + dijit.showTooltip(message, this.domNode, this.tooltipPosition, !this.isLeftToRight()); + } + } + return isValid; + }, + + isValid: function(/*Boolean*/ isFocused){ + // summary: + // Whether or not this is a valid value. The only way a Select + // can be invalid is when it's required but nothing is selected. + return (!this.required || this.value === 0 || !(/^\s*$/.test(this.value || ""))); // handle value is null or undefined + }, + + reset: function(){ + // summary: + // Overridden so that the state will be cleared. + this.inherited(arguments); + dijit.hideTooltip(this.domNode); + this._set("state", ""); + this._set("message", "") + }, + + postMixInProperties: function(){ + // summary: + // set the missing message + this.inherited(arguments); + this._missingMsg = dojo.i18n.getLocalization("dijit.form", "validate", + this.lang).missingMessage; + }, + + postCreate: function(){ + // summary: + // stop mousemove from selecting text on IE to be consistent with other browsers + + this.inherited(arguments); + + this.connect(this.domNode, "onmousemove", dojo.stopEvent); + }, + + _setStyleAttr: function(/*String||Object*/ value){ + this.inherited(arguments); + dojo.toggleClass(this.domNode, this.baseClass + "FixedWidth", !!this.tableNode.style.width); + }, + + isLoaded: function(){ + return this._isLoaded; + }, + + loadDropDown: function(/*Function*/ loadCallback){ + // summary: + // populates the menu + this._loadChildren(true); + this._isLoaded = true; + loadCallback(); + }, + + closeDropDown: function(){ + // overriding _HasDropDown.closeDropDown() + this.inherited(arguments); + + if(this.dropDown && this.dropDown.menuTableNode){ + // Erase possible width: 100% setting from _SelectMenu.resize(). + // Leaving it would interfere with the next openDropDown() call, which + // queries the natural size of the drop down. + this.dropDown.menuTableNode.style.width = ""; + } + }, + + uninitialize: function(preserveDom){ + if(this.dropDown && !this.dropDown._destroyed){ + this.dropDown.destroyRecursive(preserveDom); + delete this.dropDown; + } + this.inherited(arguments); + } +}); + } diff --git a/lib/dijit/form/SimpleTextarea.js b/lib/dijit/form/SimpleTextarea.js index b4824c74e..6ff823105 100644 --- a/lib/dijit/form/SimpleTextarea.js +++ b/lib/dijit/form/SimpleTextarea.js @@ -1,59 +1,103 @@ /* - 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.SimpleTextarea"]){ -dojo._hasResource["dijit.form.SimpleTextarea"]=true; +if(!dojo._hasResource["dijit.form.SimpleTextarea"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.SimpleTextarea"] = true; dojo.provide("dijit.form.SimpleTextarea"); dojo.require("dijit.form.TextBox"); -dojo.declare("dijit.form.SimpleTextarea",dijit.form.TextBox,{baseClass:"dijitTextBox dijitTextArea",attributeMap:dojo.delegate(dijit.form._FormValueWidget.prototype.attributeMap,{rows:"textbox",cols:"textbox"}),rows:"3",cols:"20",templateString:"",postMixInProperties:function(){ -if(!this.value&&this.srcNodeRef){ -this.value=this.srcNodeRef.value; -} -this.inherited(arguments); -},filter:function(_1){ -if(_1){ -_1=_1.replace(/\r/g,""); -} -return this.inherited(arguments); -},postCreate:function(){ -this.inherited(arguments); -if(dojo.isIE&&this.cols){ -dojo.addClass(this.textbox,"dijitTextAreaCols"); -} -},_previousValue:"",_onInput:function(e){ -if(this.maxLength){ -var _2=parseInt(this.maxLength); -var _3=this.textbox.value.replace(/\r/g,""); -var _4=_3.length-_2; -if(_4>0){ -if(e){ -dojo.stopEvent(e); -} -var _5=this.textbox; -if(_5.selectionStart){ -var _6=_5.selectionStart; -var cr=0; -if(dojo.isOpera){ -cr=(this.textbox.value.substring(0,_6).match(/\r/g)||[]).length; -} -this.textbox.value=_3.substring(0,_6-_4-cr)+_3.substring(_6-cr); -_5.setSelectionRange(_6-_4,_6-_4); -}else{ -if(dojo.doc.selection){ -_5.focus(); -var _7=dojo.doc.selection.createRange(); -_7.moveStart("character",-_4); -_7.text=""; -_7.select(); -} -} -} -this._previousValue=this.textbox.value; -} -this.inherited(arguments); -}}); + + +dojo.declare("dijit.form.SimpleTextarea", + dijit.form.TextBox, + { + // summary: + // A simple textarea that degrades, and responds to + // minimal LayoutContainer usage, and works with dijit.form.Form. + // Doesn't automatically size according to input, like Textarea. + // + // example: + // | + // + // example: + // | new dijit.form.SimpleTextarea({ rows:20, cols:30 }, "foo"); + + baseClass: "dijitTextBox dijitTextArea", + + attributeMap: dojo.delegate(dijit.form._FormValueWidget.prototype.attributeMap, { + rows:"textbox", cols: "textbox" + }), + + // rows: Number + // The number of rows of text. + rows: "3", + + // rows: Number + // The number of characters per line. + cols: "20", + + templateString: "", + + postMixInProperties: function(){ + // Copy value from srcNodeRef, unless user specified a value explicitly (or there is no srcNodeRef) + // TODO: parser will handle this in 2.0 + if(!this.value && this.srcNodeRef){ + this.value = this.srcNodeRef.value; + } + this.inherited(arguments); + }, + + buildRendering: function(){ + this.inherited(arguments); + if(dojo.isIE && this.cols){ // attribute selectors is not supported in IE6 + dojo.addClass(this.textbox, "dijitTextAreaCols"); + } + }, + + filter: function(/*String*/ value){ + // Override TextBox.filter to deal with newlines... specifically (IIRC) this is for IE which writes newlines + // as \r\n instead of just \n + if(value){ + value = value.replace(/\r/g,""); + } + return this.inherited(arguments); + }, + + _previousValue: "", + _onInput: function(/*Event?*/ e){ + // Override TextBox._onInput() to enforce maxLength restriction + if(this.maxLength){ + var maxLength = parseInt(this.maxLength); + var value = this.textbox.value.replace(/\r/g,''); + var overflow = value.length - maxLength; + if(overflow > 0){ + if(e){ dojo.stopEvent(e); } + var textarea = this.textbox; + if(textarea.selectionStart){ + var pos = textarea.selectionStart; + var cr = 0; + if(dojo.isOpera){ + cr = (this.textbox.value.substring(0,pos).match(/\r/g) || []).length; + } + this.textbox.value = value.substring(0,pos-overflow-cr)+value.substring(pos-cr); + textarea.setSelectionRange(pos-overflow, pos-overflow); + }else if(dojo.doc.selection){ //IE + textarea.focus(); + var range = dojo.doc.selection.createRange(); + // delete overflow characters + range.moveStart("character", -overflow); + range.text = ''; + // show cursor + range.select(); + } + } + this._previousValue = this.textbox.value; + } + this.inherited(arguments); + } +}); + } diff --git a/lib/dijit/form/Slider.js b/lib/dijit/form/Slider.js index 051d57929..80d4cfa98 100644 --- a/lib/dijit/form/Slider.js +++ b/lib/dijit/form/Slider.js @@ -1,18 +1,23 @@ /* - 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.Slider"]){ -dojo._hasResource["dijit.form.Slider"]=true; +if(!dojo._hasResource["dijit.form.Slider"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.Slider"] = true; dojo.provide("dijit.form.Slider"); -dojo.deprecated("Call require() for HorizontalSlider / VerticalRule, explicitly rather than 'dijit.form.Slider' itself","","2.0"); dojo.require("dijit.form.HorizontalSlider"); dojo.require("dijit.form.VerticalSlider"); dojo.require("dijit.form.HorizontalRule"); dojo.require("dijit.form.VerticalRule"); dojo.require("dijit.form.HorizontalRuleLabels"); dojo.require("dijit.form.VerticalRuleLabels"); + + +dojo.deprecated("Call require() for HorizontalSlider / VerticalRule, explicitly rather than 'dijit.form.Slider' itself", "", "2.0"); + +// For back-compat, remove for 2.0 + } diff --git a/lib/dijit/form/TextBox.js b/lib/dijit/form/TextBox.js index 81c9b2a04..38a9c09d4 100644 --- a/lib/dijit/form/TextBox.js +++ b/lib/dijit/form/TextBox.js @@ -1,209 +1,427 @@ /* - 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.TextBox"]){ -dojo._hasResource["dijit.form.TextBox"]=true; +if(!dojo._hasResource["dijit.form.TextBox"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.TextBox"] = true; dojo.provide("dijit.form.TextBox"); dojo.require("dijit.form._FormWidget"); -dojo.declare("dijit.form.TextBox",dijit.form._FormValueWidget,{trim:false,uppercase:false,lowercase:false,propercase:false,maxLength:"",selectOnClick:false,placeHolder:"",templateString:dojo.cache("dijit.form","templates/TextBox.html","

\n"),_singleNodeTemplate:"",_buttonInputDisabled:dojo.isIE?"disabled":"",baseClass:"dijitTextBox",attributeMap:dojo.delegate(dijit.form._FormValueWidget.prototype.attributeMap,{maxLength:"focusNode"}),postMixInProperties:function(){ -var _1=this.type.toLowerCase(); -if(this.templateString.toLowerCase()=="input"||((_1=="hidden"||_1=="file")&&this.templateString==dijit.form.TextBox.prototype.templateString)){ -this.templateString=this._singleNodeTemplate; -} -this.inherited(arguments); -},_setPlaceHolderAttr:function(v){ -this.placeHolder=v; -if(!this._phspan){ -this._attachPoints.push("_phspan"); -this._phspan=dojo.create("span",{className:"dijitPlaceHolder dijitInputField"},this.textbox,"after"); -} -this._phspan.innerHTML=""; -this._phspan.appendChild(document.createTextNode(v)); -this._updatePlaceHolder(); -},_updatePlaceHolder:function(){ -if(this._phspan){ -this._phspan.style.display=(this.placeHolder&&!this._focused&&!this.textbox.value)?"":"none"; -} -},_getValueAttr:function(){ -return this.parse(this.get("displayedValue"),this.constraints); -},_setValueAttr:function(_2,_3,_4){ -var _5; -if(_2!==undefined){ -_5=this.filter(_2); -if(typeof _4!="string"){ -if(_5!==null&&((typeof _5!="number")||!isNaN(_5))){ -_4=this.filter(this.format(_5,this.constraints)); -}else{ -_4=""; -} -} -} -if(_4!=null&&_4!=undefined&&((typeof _4)!="number"||!isNaN(_4))&&this.textbox.value!=_4){ -this.textbox.value=_4; -} -this._updatePlaceHolder(); -this.inherited(arguments,[_5,_3]); -},displayedValue:"",getDisplayedValue:function(){ -dojo.deprecated(this.declaredClass+"::getDisplayedValue() is deprecated. Use set('displayedValue') instead.","","2.0"); -return this.get("displayedValue"); -},_getDisplayedValueAttr:function(){ -return this.filter(this.textbox.value); -},setDisplayedValue:function(_6){ -dojo.deprecated(this.declaredClass+"::setDisplayedValue() is deprecated. Use set('displayedValue', ...) instead.","","2.0"); -this.set("displayedValue",_6); -},_setDisplayedValueAttr:function(_7){ -if(_7===null||_7===undefined){ -_7=""; -}else{ -if(typeof _7!="string"){ -_7=String(_7); -} -} -this.textbox.value=_7; -this._setValueAttr(this.get("value"),undefined,_7); -},format:function(_8,_9){ -return ((_8==null||_8==undefined)?"":(_8.toString?_8.toString():_8)); -},parse:function(_a,_b){ -return _a; -},_refreshState:function(){ -},_onInput:function(e){ -if(e&&e.type&&/key/i.test(e.type)&&e.keyCode){ -switch(e.keyCode){ -case dojo.keys.SHIFT: -case dojo.keys.ALT: -case dojo.keys.CTRL: -case dojo.keys.TAB: -return; -} -} -if(this.intermediateChanges){ -var _c=this; -setTimeout(function(){ -_c._handleOnChange(_c.get("value"),false); -},0); -} -this._refreshState(); -},postCreate:function(){ -if(dojo.isIE){ -var s=dojo.getComputedStyle(this.domNode); -if(s){ -var ff=s.fontFamily; -if(ff){ -var _d=this.domNode.getElementsByTagName("INPUT"); -if(_d){ -for(var i=0;i<_d.length;i++){ -_d[i].style.fontFamily=ff; -} -} -} -} -} -this.textbox.setAttribute("value",this.textbox.value); -this.inherited(arguments); -if(dojo.isMoz||dojo.isOpera){ -this.connect(this.textbox,"oninput",this._onInput); -}else{ -this.connect(this.textbox,"onkeydown",this._onInput); -this.connect(this.textbox,"onkeyup",this._onInput); -this.connect(this.textbox,"onpaste",this._onInput); -this.connect(this.textbox,"oncut",this._onInput); -} -},_blankValue:"",filter:function(_e){ -if(_e===null){ -return this._blankValue; -} -if(typeof _e!="string"){ -return _e; -} -if(this.trim){ -_e=dojo.trim(_e); -} -if(this.uppercase){ -_e=_e.toUpperCase(); -} -if(this.lowercase){ -_e=_e.toLowerCase(); -} -if(this.propercase){ -_e=_e.replace(/[^\s]+/g,function(_f){ -return _f.substring(0,1).toUpperCase()+_f.substring(1); -}); -} -return _e; -},_setBlurValue:function(){ -this._setValueAttr(this.get("value"),true); -},_onBlur:function(e){ -if(this.disabled){ -return; -} -this._setBlurValue(); -this.inherited(arguments); -if(this._selectOnClickHandle){ -this.disconnect(this._selectOnClickHandle); -} -if(this.selectOnClick&&dojo.isMoz){ -this.textbox.selectionStart=this.textbox.selectionEnd=undefined; -} -this._updatePlaceHolder(); -},_onFocus:function(by){ -if(this.disabled||this.readOnly){ -return; -} -if(this.selectOnClick&&by=="mouse"){ -this._selectOnClickHandle=this.connect(this.domNode,"onmouseup",function(){ -this.disconnect(this._selectOnClickHandle); -var _10; -if(dojo.isIE){ -var _11=dojo.doc.selection.createRange(); -var _12=_11.parentElement(); -_10=_12==this.textbox&&_11.text.length==0; -}else{ -_10=this.textbox.selectionStart==this.textbox.selectionEnd; -} -if(_10){ -dijit.selectInputText(this.textbox); -} -}); -} -this._updatePlaceHolder(); -this._refreshState(); -this.inherited(arguments); -},reset:function(){ -this.textbox.value=""; -this.inherited(arguments); -}}); -dijit.selectInputText=function(_13,_14,_15){ -var _16=dojo.global; -var _17=dojo.doc; -_13=dojo.byId(_13); -if(isNaN(_14)){ -_14=0; -} -if(isNaN(_15)){ -_15=_13.value?_13.value.length:0; -} -dijit.focus(_13); -if(_17["selection"]&&dojo.body()["createTextRange"]){ -if(_13.createTextRange){ -var _18=_13.createTextRange(); -with(_18){ -collapse(true); -moveStart("character",-99999); -moveStart("character",_14); -moveEnd("character",_15-_14); -select(); -} -} -}else{ -if(_16["getSelection"]){ -if(_13.setSelectionRange){ -_13.setSelectionRange(_14,_15); -} -} -} + + +dojo.declare( + "dijit.form.TextBox", + dijit.form._FormValueWidget, + { + // summary: + // A base class for textbox form inputs + + // trim: Boolean + // Removes leading and trailing whitespace if true. Default is false. + trim: false, + + // uppercase: Boolean + // Converts all characters to uppercase if true. Default is false. + uppercase: false, + + // lowercase: Boolean + // Converts all characters to lowercase if true. Default is false. + lowercase: false, + + // propercase: Boolean + // Converts the first character of each word to uppercase if true. + propercase: false, + + // maxLength: String + // HTML INPUT tag maxLength declaration. + maxLength: "", + + // selectOnClick: [const] Boolean + // If true, all text will be selected when focused with mouse + selectOnClick: false, + + // placeHolder: String + // Defines a hint to help users fill out the input field (as defined in HTML 5). + // This should only contain plain text (no html markup). + placeHolder: "", + + templateString: dojo.cache("dijit.form", "templates/TextBox.html", "

\n"), + _singleNodeTemplate: '', + + _buttonInputDisabled: dojo.isIE ? "disabled" : "", // allows IE to disallow focus, but Firefox cannot be disabled for mousedown events + + baseClass: "dijitTextBox", + + attributeMap: dojo.delegate(dijit.form._FormValueWidget.prototype.attributeMap, { + maxLength: "focusNode" + }), + + postMixInProperties: function(){ + var type = this.type.toLowerCase(); + if(this.templateString && this.templateString.toLowerCase() == "input" || ((type == "hidden" || type == "file") && this.templateString == dijit.form.TextBox.prototype.templateString)){ + this.templateString = this._singleNodeTemplate; + } + this.inherited(arguments); + }, + + _setPlaceHolderAttr: function(v){ + this._set("placeHolder", v); + if(!this._phspan){ + this._attachPoints.push('_phspan'); + /* dijitInputField class gives placeHolder same padding as the input field + * parent node already has dijitInputField class but it doesn't affect this + * since it's position: absolute. + */ + this._phspan = dojo.create('span',{className:'dijitPlaceHolder dijitInputField'},this.textbox,'after'); + } + this._phspan.innerHTML=""; + this._phspan.appendChild(document.createTextNode(v)); + + this._updatePlaceHolder(); + }, + + _updatePlaceHolder: function(){ + if(this._phspan){ + this._phspan.style.display=(this.placeHolder&&!this._focused&&!this.textbox.value)?"":"none"; + } + }, + + _getValueAttr: function(){ + // summary: + // Hook so get('value') works as we like. + // description: + // For `dijit.form.TextBox` this basically returns the value of the . + // + // For `dijit.form.MappedTextBox` subclasses, which have both + // a "displayed value" and a separate "submit value", + // This treats the "displayed value" as the master value, computing the + // submit value from it via this.parse(). + return this.parse(this.get('displayedValue'), this.constraints); + }, + + _setValueAttr: function(value, /*Boolean?*/ priorityChange, /*String?*/ formattedValue){ + // summary: + // Hook so set('value', ...) works. + // + // description: + // Sets the value of the widget to "value" which can be of + // any type as determined by the widget. + // + // value: + // The visual element value is also set to a corresponding, + // but not necessarily the same, value. + // + // formattedValue: + // If specified, used to set the visual element value, + // otherwise a computed visual value is used. + // + // priorityChange: + // If true, an onChange event is fired immediately instead of + // waiting for the next blur event. + + var filteredValue; + if(value !== undefined){ + // TODO: this is calling filter() on both the display value and the actual value. + // I added a comment to the filter() definition about this, but it should be changed. + filteredValue = this.filter(value); + if(typeof formattedValue != "string"){ + if(filteredValue !== null && ((typeof filteredValue != "number") || !isNaN(filteredValue))){ + formattedValue = this.filter(this.format(filteredValue, this.constraints)); + }else{ formattedValue = ''; } + } + } + if(formattedValue != null && formattedValue != undefined && ((typeof formattedValue) != "number" || !isNaN(formattedValue)) && this.textbox.value != formattedValue){ + this.textbox.value = formattedValue; + this._set("displayedValue", this.get("displayedValue")); + } + + this._updatePlaceHolder(); + + this.inherited(arguments, [filteredValue, priorityChange]); + }, + + // displayedValue: String + // For subclasses like ComboBox where the displayed value + // (ex: Kentucky) and the serialized value (ex: KY) are different, + // this represents the displayed value. + // + // Setting 'displayedValue' through set('displayedValue', ...) + // updates 'value', and vice-versa. Otherwise 'value' is updated + // from 'displayedValue' periodically, like onBlur etc. + // + // TODO: move declaration to MappedTextBox? + // Problem is that ComboBox references displayedValue, + // for benefit of FilteringSelect. + displayedValue: "", + + getDisplayedValue: function(){ + // summary: + // Deprecated. Use get('displayedValue') instead. + // tags: + // deprecated + dojo.deprecated(this.declaredClass+"::getDisplayedValue() is deprecated. Use set('displayedValue') instead.", "", "2.0"); + return this.get('displayedValue'); + }, + + _getDisplayedValueAttr: function(){ + // summary: + // Hook so get('displayedValue') works. + // description: + // Returns the displayed value (what the user sees on the screen), + // after filtering (ie, trimming spaces etc.). + // + // For some subclasses of TextBox (like ComboBox), the displayed value + // is different from the serialized value that's actually + // sent to the server (see dijit.form.ValidationTextBox.serialize) + + // TODO: maybe we should update this.displayedValue on every keystroke so that we don't need + // this method + // TODO: this isn't really the displayed value when the user is typing + return this.filter(this.textbox.value); + }, + + setDisplayedValue: function(/*String*/ value){ + // summary: + // Deprecated. Use set('displayedValue', ...) instead. + // tags: + // deprecated + dojo.deprecated(this.declaredClass+"::setDisplayedValue() is deprecated. Use set('displayedValue', ...) instead.", "", "2.0"); + this.set('displayedValue', value); + }, + + _setDisplayedValueAttr: function(/*String*/ value){ + // summary: + // Hook so set('displayedValue', ...) works. + // description: + // Sets the value of the visual element to the string "value". + // The widget value is also set to a corresponding, + // but not necessarily the same, value. + + if(value === null || value === undefined){ value = '' } + else if(typeof value != "string"){ value = String(value) } + + this.textbox.value = value; + + // sets the serialized value to something corresponding to specified displayedValue + // (if possible), and also updates the textbox.value, for example converting "123" + // to "123.00" + this._setValueAttr(this.get('value'), undefined); + + this._set("displayedValue", this.get('displayedValue')); + }, + + format: function(/*String*/ value, /*Object*/ constraints){ + // summary: + // Replacable function to convert a value to a properly formatted string. + // tags: + // protected extension + return ((value == null || value == undefined) ? "" : (value.toString ? value.toString() : value)); + }, + + parse: function(/*String*/ value, /*Object*/ constraints){ + // summary: + // Replacable function to convert a formatted string to a value + // tags: + // protected extension + + return value; // String + }, + + _refreshState: function(){ + // summary: + // After the user types some characters, etc., this method is + // called to check the field for validity etc. The base method + // in `dijit.form.TextBox` does nothing, but subclasses override. + // tags: + // protected + }, + + _onInput: function(e){ + if(e && e.type && /key/i.test(e.type) && e.keyCode){ + switch(e.keyCode){ + case dojo.keys.SHIFT: + case dojo.keys.ALT: + case dojo.keys.CTRL: + case dojo.keys.TAB: + return; + } + } + if(this.intermediateChanges){ + var _this = this; + // the setTimeout allows the key to post to the widget input box + setTimeout(function(){ _this._handleOnChange(_this.get('value'), false); }, 0); + } + this._refreshState(); + + // In case someone is watch()'ing for changes to displayedValue + this._set("displayedValue", this.get("displayedValue")); + }, + + postCreate: function(){ + if(dojo.isIE){ // IE INPUT tag fontFamily has to be set directly using STYLE + // the setTimeout gives IE a chance to render the TextBox and to deal with font inheritance + setTimeout(dojo.hitch(this, function(){ + var s = dojo.getComputedStyle(this.domNode); + if(s){ + var ff = s.fontFamily; + if(ff){ + var inputs = this.domNode.getElementsByTagName("INPUT"); + if(inputs){ + for(var i=0; i < inputs.length; i++){ + inputs[i].style.fontFamily = ff; + } + } + } + } + }), 0); + } + + // setting the value here is needed since value="" in the template causes "undefined" + // and setting in the DOM (instead of the JS object) helps with form reset actions + this.textbox.setAttribute("value", this.textbox.value); // DOM and JS values should be the same + + this.inherited(arguments); + + if(dojo.isMoz || dojo.isOpera){ + this.connect(this.textbox, "oninput", "_onInput"); + }else{ + this.connect(this.textbox, "onkeydown", "_onInput"); + this.connect(this.textbox, "onkeyup", "_onInput"); + this.connect(this.textbox, "onpaste", "_onInput"); + this.connect(this.textbox, "oncut", "_onInput"); + } + }, + + _blankValue: '', // if the textbox is blank, what value should be reported + filter: function(val){ + // summary: + // Auto-corrections (such as trimming) that are applied to textbox + // value on blur or form submit. + // description: + // For MappedTextBox subclasses, this is called twice + // - once with the display value + // - once the value as set/returned by set('value', ...) + // and get('value'), ex: a Number for NumberTextBox. + // + // In the latter case it does corrections like converting null to NaN. In + // the former case the NumberTextBox.filter() method calls this.inherited() + // to execute standard trimming code in TextBox.filter(). + // + // TODO: break this into two methods in 2.0 + // + // tags: + // protected extension + if(val === null){ return this._blankValue; } + if(typeof val != "string"){ return val; } + if(this.trim){ + val = dojo.trim(val); + } + if(this.uppercase){ + val = val.toUpperCase(); + } + if(this.lowercase){ + val = val.toLowerCase(); + } + if(this.propercase){ + val = val.replace(/[^\s]+/g, function(word){ + return word.substring(0,1).toUpperCase() + word.substring(1); + }); + } + return val; + }, + + _setBlurValue: function(){ + this._setValueAttr(this.get('value'), true); + }, + + _onBlur: function(e){ + if(this.disabled){ return; } + this._setBlurValue(); + this.inherited(arguments); + + if(this._selectOnClickHandle){ + this.disconnect(this._selectOnClickHandle); + } + if(this.selectOnClick && dojo.isMoz){ + this.textbox.selectionStart = this.textbox.selectionEnd = undefined; // clear selection so that the next mouse click doesn't reselect + } + + this._updatePlaceHolder(); + }, + + _onFocus: function(/*String*/ by){ + if(this.disabled || this.readOnly){ return; } + + // Select all text on focus via click if nothing already selected. + // Since mouse-up will clear the selection need to defer selection until after mouse-up. + // Don't do anything on focus by tabbing into the widget since there's no associated mouse-up event. + if(this.selectOnClick && by == "mouse"){ + this._selectOnClickHandle = this.connect(this.domNode, "onmouseup", function(){ + // Only select all text on first click; otherwise users would have no way to clear + // the selection. + this.disconnect(this._selectOnClickHandle); + + // Check if the user selected some text manually (mouse-down, mouse-move, mouse-up) + // and if not, then select all the text + var textIsNotSelected; + if(dojo.isIE){ + var range = dojo.doc.selection.createRange(); + var parent = range.parentElement(); + textIsNotSelected = parent == this.textbox && range.text.length == 0; + }else{ + textIsNotSelected = this.textbox.selectionStart == this.textbox.selectionEnd; + } + if(textIsNotSelected){ + dijit.selectInputText(this.textbox); + } + }); + } + + this._updatePlaceHolder(); + + // call this.inherited() before refreshState(), since this.inherited() will possibly scroll the viewport + // (to scroll the TextBox into view), which will affect how _refreshState() positions the tooltip + this.inherited(arguments); + + this._refreshState(); + }, + + reset: function(){ + // Overrides dijit._FormWidget.reset(). + // Additionally resets the displayed textbox value to '' + this.textbox.value = ''; + this.inherited(arguments); + } + } +); + +dijit.selectInputText = function(/*DomNode*/ element, /*Number?*/ start, /*Number?*/ stop){ + // summary: + // Select text in the input element argument, from start (default 0), to stop (default end). + + // TODO: use functions in _editor/selection.js? + var _window = dojo.global; + var _document = dojo.doc; + element = dojo.byId(element); + if(isNaN(start)){ start = 0; } + if(isNaN(stop)){ stop = element.value ? element.value.length : 0; } + dijit.focus(element); + if(_document["selection"] && dojo.body()["createTextRange"]){ // IE + if(element.createTextRange){ + var r = element.createTextRange(); + r.collapse(true); + r.moveStart("character", -99999); // move to 0 + r.moveStart("character", start); // delta from 0 is the correct position + r.moveEnd("character", stop-start); + r.select(); + } + }else if(_window["getSelection"]){ + if(element.setSelectionRange){ + element.setSelectionRange(start, stop); + } + } }; + } diff --git a/lib/dijit/form/Textarea.js b/lib/dijit/form/Textarea.js index 4dd9cd928..cc1ec917e 100644 --- a/lib/dijit/form/Textarea.js +++ b/lib/dijit/form/Textarea.js @@ -1,103 +1,167 @@ /* - 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.Textarea"]){ -dojo._hasResource["dijit.form.Textarea"]=true; +if(!dojo._hasResource["dijit.form.Textarea"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.Textarea"] = true; dojo.provide("dijit.form.Textarea"); dojo.require("dijit.form.SimpleTextarea"); -dojo.declare("dijit.form.Textarea",dijit.form.SimpleTextarea,{cols:"",_previousNewlines:0,_strictMode:(dojo.doc.compatMode!="BackCompat"),_getHeight:function(_1){ -var _2=_1.scrollHeight; -if(dojo.isIE){ -_2+=_1.offsetHeight-_1.clientHeight-((dojo.isIE<8&&this._strictMode)?dojo._getPadBorderExtents(_1).h:0); -}else{ -if(dojo.isMoz){ -_2+=_1.offsetHeight-_1.clientHeight; -}else{ -if(dojo.isWebKit&&!(dojo.isSafari<4)){ -_2+=dojo._getBorderExtents(_1).h; -}else{ -_2+=dojo._getPadBorderExtents(_1).h; -} -} -} -return _2; -},_estimateHeight:function(_3){ -_3.style.maxHeight=""; -_3.style.height="auto"; -_3.rows=(_3.value.match(/\n/g)||[]).length+1; -},_needsHelpShrinking:dojo.isMoz||dojo.isWebKit,_onInput:function(){ -this.inherited(arguments); -if(this._busyResizing){ -return; -} -this._busyResizing=true; -var _4=this.textbox; -if(_4.scrollHeight&&_4.offsetHeight&&_4.clientHeight){ -var _5=this._getHeight(_4)+"px"; -if(_4.style.height!=_5){ -_4.style.maxHeight=_4.style.height=_5; -} -if(this._needsHelpShrinking){ -if(this._setTimeoutHandle){ -clearTimeout(this._setTimeoutHandle); -} -this._setTimeoutHandle=setTimeout(dojo.hitch(this,"_shrink"),0); -} -}else{ -this._estimateHeight(_4); -} -this._busyResizing=false; -},_busyResizing:false,_shrink:function(){ -this._setTimeoutHandle=null; -if(this._needsHelpShrinking&&!this._busyResizing){ -this._busyResizing=true; -var _6=this.textbox; -var _7=false; -if(_6.value==""){ -_6.value=" "; -_7=true; -} -var _8=_6.scrollHeight; -if(!_8){ -this._estimateHeight(_6); -}else{ -var _9=_6.style.paddingBottom; -var _a=dojo._getPadExtents(_6); -_a=_a.h-_a.t; -_6.style.paddingBottom=_a+1+"px"; -var _b=this._getHeight(_6)-1+"px"; -if(_6.style.maxHeight!=_b){ -_6.style.paddingBottom=_a+_8+"px"; -_6.scrollTop=0; -_6.style.maxHeight=this._getHeight(_6)-_8+"px"; -} -_6.style.paddingBottom=_9; -} -if(_7){ -_6.value=""; -} -this._busyResizing=false; -} -},resize:function(){ -this._onInput(); -},_setValueAttr:function(){ -this.inherited(arguments); -this.resize(); -},postCreate:function(){ -this.inherited(arguments); -dojo.style(this.textbox,{overflowY:"hidden",overflowX:"auto",boxSizing:"border-box",MsBoxSizing:"border-box",WebkitBoxSizing:"border-box",MozBoxSizing:"border-box"}); -this.connect(this.textbox,"onscroll",this._onInput); -this.connect(this.textbox,"onresize",this._onInput); -this.connect(this.textbox,"onfocus",this._onInput); -this._setTimeoutHandle=setTimeout(dojo.hitch(this,"resize"),0); -},uninitialize:function(){ -if(this._setTimeoutHandle){ -clearTimeout(this._setTimeoutHandle); -} -this.inherited(arguments); -}}); + + +dojo.declare( + "dijit.form.Textarea", + dijit.form.SimpleTextarea, + { + // summary: + // A textarea widget that adjusts it's height according to the amount of data. + // + // description: + // A textarea that dynamically expands/contracts (changing it's height) as + // the user types, to display all the text without requiring a scroll bar. + // + // Takes nearly all the parameters (name, value, etc.) that a vanilla textarea takes. + // Rows is not supported since this widget adjusts the height. + // + // example: + // | + + + // TODO: for 2.0, rename this to ExpandingTextArea, and rename SimpleTextarea to Textarea + + baseClass: "dijitTextBox dijitTextArea dijitExpandingTextArea", + + // Override SimpleTextArea.cols to default to width:100%, for backward compatibility + cols: "", + + _previousNewlines: 0, + _strictMode: (dojo.doc.compatMode != 'BackCompat'), // not the same as !dojo.isQuirks + + _getHeight: function(textarea){ + var newH = textarea.scrollHeight; + if(dojo.isIE){ + newH += textarea.offsetHeight - textarea.clientHeight - ((dojo.isIE < 8 && this._strictMode) ? dojo._getPadBorderExtents(textarea).h : 0); + }else if(dojo.isMoz){ + newH += textarea.offsetHeight - textarea.clientHeight; // creates room for horizontal scrollbar + }else if(dojo.isWebKit){ + newH += dojo._getBorderExtents(textarea).h; + }else{ // Opera 9.6 (TODO: test if this is still needed) + newH += dojo._getPadBorderExtents(textarea).h; + } + return newH; + }, + + _estimateHeight: function(textarea){ + // summary: + // Approximate the height when the textarea is invisible with the number of lines in the text. + // Fails when someone calls setValue with a long wrapping line, but the layout fixes itself when the user clicks inside so . . . + // In IE, the resize event is supposed to fire when the textarea becomes visible again and that will correct the size automatically. + // + textarea.style.maxHeight = ""; + textarea.style.height = "auto"; + // #rows = #newlines+1 + // Note: on Moz, the following #rows appears to be 1 too many. + // Actually, Moz is reserving room for the scrollbar. + // If you increase the font size, this behavior becomes readily apparent as the last line gets cut off without the +1. + textarea.rows = (textarea.value.match(/\n/g) || []).length + 1; + }, + + _needsHelpShrinking: dojo.isMoz || dojo.isWebKit, + + _onInput: function(){ + // Override SimpleTextArea._onInput() to deal with height adjustment + this.inherited(arguments); + if(this._busyResizing){ return; } + this._busyResizing = true; + var textarea = this.textbox; + if(textarea.scrollHeight && textarea.offsetHeight && textarea.clientHeight){ + var newH = this._getHeight(textarea) + "px"; + if(textarea.style.height != newH){ + textarea.style.maxHeight = textarea.style.height = newH; + } + if(this._needsHelpShrinking){ + if(this._setTimeoutHandle){ + clearTimeout(this._setTimeoutHandle); + } + this._setTimeoutHandle = setTimeout(dojo.hitch(this, "_shrink"), 0); // try to collapse multiple shrinks into 1 + } + }else{ + // hidden content of unknown size + this._estimateHeight(textarea); + } + this._busyResizing = false; + }, + + _busyResizing: false, + _shrink: function(){ + // grow paddingBottom to see if scrollHeight shrinks (when it is unneccesarily big) + this._setTimeoutHandle = null; + if(this._needsHelpShrinking && !this._busyResizing){ + this._busyResizing = true; + var textarea = this.textbox; + var empty = false; + if(textarea.value == ''){ + textarea.value = ' '; // prevent collapse all the way back to 0 + empty = true; + } + var scrollHeight = textarea.scrollHeight; + if(!scrollHeight){ + this._estimateHeight(textarea); + }else{ + var oldPadding = textarea.style.paddingBottom; + var newPadding = dojo._getPadExtents(textarea); + newPadding = newPadding.h - newPadding.t; + textarea.style.paddingBottom = newPadding + 1 + "px"; // tweak padding to see if height can be reduced + var newH = this._getHeight(textarea) - 1 + "px"; // see if the height changed by the 1px added + if(textarea.style.maxHeight != newH){ // if can be reduced, so now try a big chunk + textarea.style.paddingBottom = newPadding + scrollHeight + "px"; + textarea.scrollTop = 0; + textarea.style.maxHeight = this._getHeight(textarea) - scrollHeight + "px"; // scrollHeight is the added padding + } + textarea.style.paddingBottom = oldPadding; + } + if(empty){ + textarea.value = ''; + } + this._busyResizing = false; + } + }, + + resize: function(){ + // summary: + // Resizes the textarea vertically (should be called after a style/value change) + this._onInput(); + }, + + _setValueAttr: function(){ + this.inherited(arguments); + this.resize(); + }, + + buildRendering: function(){ + this.inherited(arguments); + + // tweak textarea style to reduce browser differences + dojo.style(this.textbox, { overflowY: 'hidden', overflowX: 'auto', boxSizing: 'border-box', MsBoxSizing: 'border-box', WebkitBoxSizing: 'border-box', MozBoxSizing: 'border-box' }); + }, + + postCreate: function(){ + this.inherited(arguments); + + this.connect(this.textbox, "onscroll", "_onInput"); + this.connect(this.textbox, "onresize", "_onInput"); + this.connect(this.textbox, "onfocus", "_onInput"); // useful when a previous estimate was off a bit + this._setTimeoutHandle = setTimeout(dojo.hitch(this, "resize"), 0); + }, + + uninitialize: function(){ + if(this._setTimeoutHandle){ + clearTimeout(this._setTimeoutHandle); + } + this.inherited(arguments); + } +}); + } diff --git a/lib/dijit/form/TimeTextBox.js b/lib/dijit/form/TimeTextBox.js index f5e7f99e3..81949c4a1 100644 --- a/lib/dijit/form/TimeTextBox.js +++ b/lib/dijit/form/TimeTextBox.js @@ -1,14 +1,87 @@ /* - 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.TimeTextBox"]){ -dojo._hasResource["dijit.form.TimeTextBox"]=true; +if(!dojo._hasResource["dijit.form.TimeTextBox"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.TimeTextBox"] = true; dojo.provide("dijit.form.TimeTextBox"); dojo.require("dijit._TimePicker"); dojo.require("dijit.form._DateTimeTextBox"); -dojo.declare("dijit.form.TimeTextBox",dijit.form._DateTimeTextBox,{baseClass:"dijitTextBox dijitTimeTextBox",popupClass:"dijit._TimePicker",_selector:"time",value:new Date("")}); + + +/*===== +dojo.declare( + "dijit.form.TimeTextBox.__Constraints", + [dijit.form._DateTimeTextBox.__Constraints, dijit._TimePicker.__Constraints] +); +=====*/ + +dojo.declare( + "dijit.form.TimeTextBox", + dijit.form._DateTimeTextBox, + { + // summary: + // A validating, serializable, range-bound time text box with a drop down time picker + + baseClass: "dijitTextBox dijitComboBox dijitTimeTextBox", + popupClass: "dijit._TimePicker", + _selector: "time", + +/*===== + // constraints: dijit.form.TimeTextBox.__Constraints + constraints:{}, +=====*/ + + // value: Date + // The value of this widget as a JavaScript Date object. Note that the date portion implies time zone and daylight savings rules. + // + // Example: + // | new dijit.form.TimeTextBox({value: dojo.date.stamp.fromISOString("T12:59:59", new Date())}) + // + // When passed to the parser in markup, must be specified according to locale-independent + // `dojo.date.stamp.fromISOString` format. + // + // Example: + // | + value: new Date(""), // value.toString()="NaN" + //FIXME: in markup, you have no control over daylight savings + + _onKey: function(evt){ + this.inherited(arguments); + + // If the user has backspaced or typed some numbers, then filter the result list + // by what they typed. Maybe there's a better way to detect this, like _handleOnChange()? + switch(evt.keyCode){ + case dojo.keys.ENTER: + case dojo.keys.TAB: + case dojo.keys.ESCAPE: + case dojo.keys.DOWN_ARROW: + case dojo.keys.UP_ARROW: + // these keys have special meaning + break; + default: + // setTimeout() because the keystroke hasn't yet appeared in the , + // so the get('displayedValue') call below won't give the result we want. + setTimeout(dojo.hitch(this, function(){ + // set this.filterString to the filter to apply to the drop down list; + // it will be used in openDropDown() + var val = this.get('displayedValue'); + this.filterString = (val && !this.parse(val, this.constraints)) ? val.toLowerCase() : ""; + + // close the drop down and reopen it, in order to filter the items shown in the list + // and also since the drop down may need to be repositioned if the number of list items has changed + // and it's being displayed above the + if(this._opened){ + this.closeDropDown(); + } + this.openDropDown(); + }), 0); + } + } + } +); + } diff --git a/lib/dijit/form/ToggleButton.js b/lib/dijit/form/ToggleButton.js index f67dd0880..27b836fbd 100644 --- a/lib/dijit/form/ToggleButton.js +++ b/lib/dijit/form/ToggleButton.js @@ -1,12 +1,15 @@ /* - 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.ToggleButton"]){ -dojo._hasResource["dijit.form.ToggleButton"]=true; +if(!dojo._hasResource["dijit.form.ToggleButton"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.ToggleButton"] = true; dojo.provide("dijit.form.ToggleButton"); dojo.require("dijit.form.Button"); + + + } diff --git a/lib/dijit/form/ValidationTextBox.js b/lib/dijit/form/ValidationTextBox.js index 2e0f17317..ee4292441 100644 --- a/lib/dijit/form/ValidationTextBox.js +++ b/lib/dijit/form/ValidationTextBox.js @@ -1,211 +1,486 @@ /* - 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.ValidationTextBox"]){ -dojo._hasResource["dijit.form.ValidationTextBox"]=true; +if(!dojo._hasResource["dijit.form.ValidationTextBox"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.ValidationTextBox"] = true; dojo.provide("dijit.form.ValidationTextBox"); dojo.require("dojo.i18n"); dojo.require("dijit.form.TextBox"); dojo.require("dijit.Tooltip"); -dojo.requireLocalization("dijit.form","validate",null,"ROOT,ar,ca,cs,da,de,el,es,fi,fr,he,hu,it,ja,ko,nb,nl,pl,pt,pt-pt,ro,ru,sk,sl,sv,th,tr,zh,zh-tw"); -dojo.declare("dijit.form.ValidationTextBox",dijit.form.TextBox,{templateString:dojo.cache("dijit.form","templates/ValidationTextBox.html","

\n"),baseClass:"dijitTextBox dijitValidationTextBox",required:false,promptMessage:"",invalidMessage:"$_unset_$",missingMessage:"$_unset_$",constraints:{},regExp:".*",regExpGen:function(_1){ -return this.regExp; -},state:"",tooltipPosition:[],_setValueAttr:function(){ -this.inherited(arguments); -this.validate(this._focused); -},validator:function(_2,_3){ -return (new RegExp("^(?:"+this.regExpGen(_3)+")"+(this.required?"":"?")+"$")).test(_2)&&(!this.required||!this._isEmpty(_2))&&(this._isEmpty(_2)||this.parse(_2,_3)!==undefined); -},_isValidSubset:function(){ -return this.textbox.value.search(this._partialre)==0; -},isValid:function(_4){ -return this.validator(this.textbox.value,this.constraints); -},_isEmpty:function(_5){ -return /^\s*$/.test(_5); -},getErrorMessage:function(_6){ -return (this.required&&this._isEmpty(this.textbox.value))?this.missingMessage:this.invalidMessage; -},getPromptMessage:function(_7){ -return this.promptMessage; -},_maskValidSubsetError:true,validate:function(_8){ -var _9=""; -var _a=this.disabled||this.isValid(_8); -if(_a){ -this._maskValidSubsetError=true; -} -var _b=this._isEmpty(this.textbox.value); -var _c=!_a&&!_b&&_8&&this._isValidSubset(); -this.state=((_a||((!this._hasBeenBlurred||_8)&&_b)||_c)&&this._maskValidSubsetError)?"":"Error"; -if(this.state=="Error"){ -this._maskValidSubsetError=_8; -} -this._setStateClass(); -dijit.setWaiState(this.focusNode,"invalid",_a?"false":"true"); -if(_8){ -if(this.state=="Error"){ -_9=this.getErrorMessage(true); -}else{ -_9=this.getPromptMessage(true); -} -this._maskValidSubsetError=true; -} -this.displayMessage(_9); -return _a; -},_message:"",displayMessage:function(_d){ -if(this._message==_d){ -return; -} -this._message=_d; -dijit.hideTooltip(this.domNode); -if(_d){ -dijit.showTooltip(_d,this.domNode,this.tooltipPosition,!this.isLeftToRight()); -} -},_refreshState:function(){ -this.validate(this._focused); -this.inherited(arguments); -},constructor:function(){ -this.constraints={}; -},_setConstraintsAttr:function(_e){ -if(!_e.locale&&this.lang){ -_e.locale=this.lang; -} -this.constraints=_e; -this._computePartialRE(); -},_computePartialRE:function(){ -var p=this.regExpGen(this.constraints); -this.regExp=p; -var _f=""; -if(p!=".*"){ -this.regExp.replace(/\\.|\[\]|\[.*?[^\\]{1}\]|\{.*?\}|\(\?[=:!]|./g,function(re){ -switch(re.charAt(0)){ -case "{": -case "+": -case "?": -case "*": -case "^": -case "$": -case "|": -case "(": -_f+=re; -break; -case ")": -_f+="|$)"; -break; -default: -_f+="(?:"+re+"|$)"; -break; -} -}); -} -try{ -"".search(_f); -} -catch(e){ -_f=this.regExp; -console.warn("RegExp error in "+this.declaredClass+": "+this.regExp); -} -this._partialre="^(?:"+_f+")$"; -},postMixInProperties:function(){ -this.inherited(arguments); -this.messages=dojo.i18n.getLocalization("dijit.form","validate",this.lang); -if(this.invalidMessage=="$_unset_$"){ -this.invalidMessage=this.messages.invalidMessage; -} -if(!this.invalidMessage){ -this.invalidMessage=this.promptMessage; -} -if(this.missingMessage=="$_unset_$"){ -this.missingMessage=this.messages.missingMessage; -} -if(!this.missingMessage){ -this.missingMessage=this.invalidMessage; -} -this._setConstraintsAttr(this.constraints); -},_setDisabledAttr:function(_10){ -this.inherited(arguments); -this._refreshState(); -},_setRequiredAttr:function(_11){ -this.required=_11; -dijit.setWaiState(this.focusNode,"required",_11); -this._refreshState(); -},reset:function(){ -this._maskValidSubsetError=true; -this.inherited(arguments); -},_onBlur:function(){ -this.displayMessage(""); -this.inherited(arguments); -}}); -dojo.declare("dijit.form.MappedTextBox",dijit.form.ValidationTextBox,{postMixInProperties:function(){ -this.inherited(arguments); -this.nameAttrSetting=""; -},serialize:function(val,_12){ -return val.toString?val.toString():""; -},toString:function(){ -var val=this.filter(this.get("value")); -return val!=null?(typeof val=="string"?val:this.serialize(val,this.constraints)):""; -},validate:function(){ -this.valueNode.value=this.toString(); -return this.inherited(arguments); -},buildRendering:function(){ -this.inherited(arguments); -this.valueNode=dojo.place("",this.textbox,"after"); -},reset:function(){ -this.valueNode.value=""; -this.inherited(arguments); -}}); -dojo.declare("dijit.form.RangeBoundTextBox",dijit.form.MappedTextBox,{rangeMessage:"",rangeCheck:function(_13,_14){ -return ("min" in _14?(this.compare(_13,_14.min)>=0):true)&&("max" in _14?(this.compare(_13,_14.max)<=0):true); -},isInRange:function(_15){ -return this.rangeCheck(this.get("value"),this.constraints); -},_isDefinitelyOutOfRange:function(){ -var val=this.get("value"); -var _16=false; -var _17=false; -if("min" in this.constraints){ -var min=this.constraints.min; -min=this.compare(val,((typeof min=="number")&&min>=0&&val!=0)?0:min); -_16=(typeof min=="number")&&min<0; -} -if("max" in this.constraints){ -var max=this.constraints.max; -max=this.compare(val,((typeof max!="number")||max>0)?max:0); -_17=(typeof max=="number")&&max>0; -} -return _16||_17; -},_isValidSubset:function(){ -return this.inherited(arguments)&&!this._isDefinitelyOutOfRange(); -},isValid:function(_18){ -return this.inherited(arguments)&&((this._isEmpty(this.textbox.value)&&!this.required)||this.isInRange(_18)); -},getErrorMessage:function(_19){ -var v=this.get("value"); -if(v!==null&&v!==""&&v!==undefined&&(typeof v!="number"||!isNaN(v))&&!this.isInRange(_19)){ -return this.rangeMessage; -} -return this.inherited(arguments); -},postMixInProperties:function(){ -this.inherited(arguments); -if(!this.rangeMessage){ -this.messages=dojo.i18n.getLocalization("dijit.form","validate",this.lang); -this.rangeMessage=this.messages.rangeMessage; -} -},_setConstraintsAttr:function(_1a){ -this.inherited(arguments); -if(this.focusNode){ -if(this.constraints.min!==undefined){ -dijit.setWaiState(this.focusNode,"valuemin",this.constraints.min); -}else{ -dijit.removeWaiState(this.focusNode,"valuemin"); -} -if(this.constraints.max!==undefined){ -dijit.setWaiState(this.focusNode,"valuemax",this.constraints.max); -}else{ -dijit.removeWaiState(this.focusNode,"valuemax"); -} -} -},_setValueAttr:function(_1b,_1c){ -dijit.setWaiState(this.focusNode,"valuenow",_1b); -this.inherited(arguments); -}}); +dojo.requireLocalization("dijit.form", "validate", null, "ROOT,ar,ca,cs,da,de,el,es,fi,fr,he,hu,it,ja,kk,ko,nb,nl,pl,pt,pt-pt,ro,ru,sk,sl,sv,th,tr,zh,zh-tw"); + + +/*===== + dijit.form.ValidationTextBox.__Constraints = function(){ + // locale: String + // locale used for validation, picks up value from this widget's lang attribute + // _flags_: anything + // various flags passed to regExpGen function + this.locale = ""; + this._flags_ = ""; + } +=====*/ + +dojo.declare( + "dijit.form.ValidationTextBox", + dijit.form.TextBox, + { + // summary: + // Base class for textbox widgets with the ability to validate content of various types and provide user feedback. + // tags: + // protected + + templateString: dojo.cache("dijit.form", "templates/ValidationTextBox.html", "

\n"), + baseClass: "dijitTextBox dijitValidationTextBox", + + // required: Boolean + // User is required to enter data into this field. + required: false, + + // promptMessage: String + // If defined, display this hint string immediately on focus to the textbox, if empty. + // Also displays if the textbox value is Incomplete (not yet valid but will be with additional input). + // Think of this like a tooltip that tells the user what to do, not an error message + // that tells the user what they've done wrong. + // + // Message disappears when user starts typing. + promptMessage: "", + + // invalidMessage: String + // The message to display if value is invalid. + // The translated string value is read from the message file by default. + // Set to "" to use the promptMessage instead. + invalidMessage: "$_unset_$", + + // missingMessage: String + // The message to display if value is empty and the field is required. + // The translated string value is read from the message file by default. + // Set to "" to use the invalidMessage instead. + missingMessage: "$_unset_$", + + // message: String + // Currently error/prompt message. + // When using the default tooltip implementation, this will only be + // displayed when the field is focused. + message: "", + + // constraints: dijit.form.ValidationTextBox.__Constraints + // user-defined object needed to pass parameters to the validator functions + constraints: {}, + + // regExp: [extension protected] String + // regular expression string used to validate the input + // Do not specify both regExp and regExpGen + regExp: ".*", + + regExpGen: function(/*dijit.form.ValidationTextBox.__Constraints*/ constraints){ + // summary: + // Overridable function used to generate regExp when dependent on constraints. + // Do not specify both regExp and regExpGen. + // tags: + // extension protected + return this.regExp; // String + }, + + // state: [readonly] String + // Shows current state (ie, validation result) of input (""=Normal, Incomplete, or Error) + state: "", + + // tooltipPosition: String[] + // See description of `dijit.Tooltip.defaultPosition` for details on this parameter. + tooltipPosition: [], + + _setValueAttr: function(){ + // summary: + // Hook so set('value', ...) works. + this.inherited(arguments); + this.validate(this._focused); + }, + + validator: function(/*anything*/ value, /*dijit.form.ValidationTextBox.__Constraints*/ constraints){ + // summary: + // Overridable function used to validate the text input against the regular expression. + // tags: + // protected + return (new RegExp("^(?:" + this.regExpGen(constraints) + ")"+(this.required?"":"?")+"$")).test(value) && + (!this.required || !this._isEmpty(value)) && + (this._isEmpty(value) || this.parse(value, constraints) !== undefined); // Boolean + }, + + _isValidSubset: function(){ + // summary: + // Returns true if the value is either already valid or could be made valid by appending characters. + // This is used for validation while the user [may be] still typing. + return this.textbox.value.search(this._partialre) == 0; + }, + + isValid: function(/*Boolean*/ isFocused){ + // summary: + // Tests if value is valid. + // Can override with your own routine in a subclass. + // tags: + // protected + return this.validator(this.textbox.value, this.constraints); + }, + + _isEmpty: function(value){ + // summary: + // Checks for whitespace + return (this.trim ? /^\s*$/ : /^$/).test(value); // Boolean + }, + + getErrorMessage: function(/*Boolean*/ isFocused){ + // summary: + // Return an error message to show if appropriate + // tags: + // protected + return (this.required && this._isEmpty(this.textbox.value)) ? this.missingMessage : this.invalidMessage; // String + }, + + getPromptMessage: function(/*Boolean*/ isFocused){ + // summary: + // Return a hint message to show when widget is first focused + // tags: + // protected + return this.promptMessage; // String + }, + + _maskValidSubsetError: true, + validate: function(/*Boolean*/ isFocused){ + // summary: + // Called by oninit, onblur, and onkeypress. + // description: + // Show missing or invalid messages if appropriate, and highlight textbox field. + // tags: + // protected + var message = ""; + var isValid = this.disabled || this.isValid(isFocused); + if(isValid){ this._maskValidSubsetError = true; } + var isEmpty = this._isEmpty(this.textbox.value); + var isValidSubset = !isValid && isFocused && this._isValidSubset(); + this._set("state", isValid ? "" : (((((!this._hasBeenBlurred || isFocused) && isEmpty) || isValidSubset) && this._maskValidSubsetError) ? "Incomplete" : "Error")); + dijit.setWaiState(this.focusNode, "invalid", isValid ? "false" : "true"); + + if(this.state == "Error"){ + this._maskValidSubsetError = isFocused && isValidSubset; // we want the error to show up after a blur and refocus + message = this.getErrorMessage(isFocused); + }else if(this.state == "Incomplete"){ + message = this.getPromptMessage(isFocused); // show the prompt whenever the value is not yet complete + this._maskValidSubsetError = !this._hasBeenBlurred || isFocused; // no Incomplete warnings while focused + }else if(isEmpty){ + message = this.getPromptMessage(isFocused); // show the prompt whenever there's no error and no text + } + this.set("message", message); + + return isValid; + }, + + displayMessage: function(/*String*/ message){ + // summary: + // Overridable method to display validation errors/hints. + // By default uses a tooltip. + // tags: + // extension + dijit.hideTooltip(this.domNode); + if(message && this._focused){ + dijit.showTooltip(message, this.domNode, this.tooltipPosition, !this.isLeftToRight()); + } + }, + + _refreshState: function(){ + // Overrides TextBox._refreshState() + this.validate(this._focused); + this.inherited(arguments); + }, + + //////////// INITIALIZATION METHODS /////////////////////////////////////// + + constructor: function(){ + this.constraints = {}; + }, + + _setConstraintsAttr: function(/*Object*/ constraints){ + if(!constraints.locale && this.lang){ + constraints.locale = this.lang; + } + this._set("constraints", constraints); + this._computePartialRE(); + }, + + _computePartialRE: function(){ + var p = this.regExpGen(this.constraints); + this.regExp = p; + var partialre = ""; + // parse the regexp and produce a new regexp that matches valid subsets + // if the regexp is .* then there's no use in matching subsets since everything is valid + if(p != ".*"){ this.regExp.replace(/\\.|\[\]|\[.*?[^\\]{1}\]|\{.*?\}|\(\?[=:!]|./g, + function (re){ + switch(re.charAt(0)){ + case '{': + case '+': + case '?': + case '*': + case '^': + case '$': + case '|': + case '(': + partialre += re; + break; + case ")": + partialre += "|$)"; + break; + default: + partialre += "(?:"+re+"|$)"; + break; + } + } + );} + try{ // this is needed for now since the above regexp parsing needs more test verification + "".search(partialre); + }catch(e){ // should never be here unless the original RE is bad or the parsing is bad + partialre = this.regExp; + console.warn('RegExp error in ' + this.declaredClass + ': ' + this.regExp); + } // should never be here unless the original RE is bad or the parsing is bad + this._partialre = "^(?:" + partialre + ")$"; + }, + + postMixInProperties: function(){ + this.inherited(arguments); + this.messages = dojo.i18n.getLocalization("dijit.form", "validate", this.lang); + if(this.invalidMessage == "$_unset_$"){ this.invalidMessage = this.messages.invalidMessage; } + if(!this.invalidMessage){ this.invalidMessage = this.promptMessage; } + if(this.missingMessage == "$_unset_$"){ this.missingMessage = this.messages.missingMessage; } + if(!this.missingMessage){ this.missingMessage = this.invalidMessage; } + this._setConstraintsAttr(this.constraints); // this needs to happen now (and later) due to codependency on _set*Attr calls attachPoints + }, + + _setDisabledAttr: function(/*Boolean*/ value){ + this.inherited(arguments); // call FormValueWidget._setDisabledAttr() + this._refreshState(); + }, + + _setRequiredAttr: function(/*Boolean*/ value){ + this._set("required", value); + dijit.setWaiState(this.focusNode, "required", value); + this._refreshState(); + }, + + _setMessageAttr: function(/*String*/ message){ + this._set("message", message); + this.displayMessage(message); + }, + + reset:function(){ + // Overrides dijit.form.TextBox.reset() by also + // hiding errors about partial matches + this._maskValidSubsetError = true; + this.inherited(arguments); + }, + + _onBlur: function(){ + // the message still exists but for back-compat, and to erase the tooltip + // (if the message is being displayed as a tooltip), call displayMessage('') + this.displayMessage(''); + + this.inherited(arguments); + } + } +); + +dojo.declare( + "dijit.form.MappedTextBox", + dijit.form.ValidationTextBox, + { + // summary: + // A dijit.form.ValidationTextBox subclass which provides a base class for widgets that have + // a visible formatted display value, and a serializable + // value in a hidden input field which is actually sent to the server. + // description: + // The visible display may + // be locale-dependent and interactive. The value sent to the server is stored in a hidden + // input field which uses the `name` attribute declared by the original widget. That value sent + // to the server is defined by the dijit.form.MappedTextBox.serialize method and is typically + // locale-neutral. + // tags: + // protected + + postMixInProperties: function(){ + this.inherited(arguments); + + // we want the name attribute to go to the hidden , not the displayed , + // so override _FormWidget.postMixInProperties() setting of nameAttrSetting + this.nameAttrSetting = ""; + }, + + serialize: function(/*anything*/ val, /*Object?*/ options){ + // summary: + // Overridable function used to convert the get('value') result to a canonical + // (non-localized) string. For example, will print dates in ISO format, and + // numbers the same way as they are represented in javascript. + // tags: + // protected extension + return val.toString ? val.toString() : ""; // String + }, + + toString: function(){ + // summary: + // Returns widget as a printable string using the widget's value + // tags: + // protected + var val = this.filter(this.get('value')); // call filter in case value is nonstring and filter has been customized + return val != null ? (typeof val == "string" ? val : this.serialize(val, this.constraints)) : ""; // String + }, + + validate: function(){ + // Overrides `dijit.form.TextBox.validate` + this.valueNode.value = this.toString(); + return this.inherited(arguments); + }, + + buildRendering: function(){ + // Overrides `dijit._Templated.buildRendering` + + this.inherited(arguments); + + // Create a hidden node with the serialized value used for submit + // (as opposed to the displayed value). + // Passing in name as markup rather than calling dojo.create() with an attrs argument + // to make dojo.query(input[name=...]) work on IE. (see #8660) + this.valueNode = dojo.place("", this.textbox, "after"); + }, + + reset: function(){ + // Overrides `dijit.form.ValidationTextBox.reset` to + // reset the hidden textbox value to '' + this.valueNode.value = ''; + this.inherited(arguments); + } + } +); + +/*===== + dijit.form.RangeBoundTextBox.__Constraints = function(){ + // min: Number + // Minimum signed value. Default is -Infinity + // max: Number + // Maximum signed value. Default is +Infinity + this.min = min; + this.max = max; + } +=====*/ + +dojo.declare( + "dijit.form.RangeBoundTextBox", + dijit.form.MappedTextBox, + { + // summary: + // Base class for textbox form widgets which defines a range of valid values. + + // rangeMessage: String + // The message to display if value is out-of-range + rangeMessage: "", + + /*===== + // constraints: dijit.form.RangeBoundTextBox.__Constraints + constraints: {}, + ======*/ + + rangeCheck: function(/*Number*/ primitive, /*dijit.form.RangeBoundTextBox.__Constraints*/ constraints){ + // summary: + // Overridable function used to validate the range of the numeric input value. + // tags: + // protected + return ("min" in constraints? (this.compare(primitive,constraints.min) >= 0) : true) && + ("max" in constraints? (this.compare(primitive,constraints.max) <= 0) : true); // Boolean + }, + + isInRange: function(/*Boolean*/ isFocused){ + // summary: + // Tests if the value is in the min/max range specified in constraints + // tags: + // protected + return this.rangeCheck(this.get('value'), this.constraints); + }, + + _isDefinitelyOutOfRange: function(){ + // summary: + // Returns true if the value is out of range and will remain + // out of range even if the user types more characters + var val = this.get('value'); + var isTooLittle = false; + var isTooMuch = false; + if("min" in this.constraints){ + var min = this.constraints.min; + min = this.compare(val, ((typeof min == "number") && min >= 0 && val !=0) ? 0 : min); + isTooLittle = (typeof min == "number") && min < 0; + } + if("max" in this.constraints){ + var max = this.constraints.max; + max = this.compare(val, ((typeof max != "number") || max > 0) ? max : 0); + isTooMuch = (typeof max == "number") && max > 0; + } + return isTooLittle || isTooMuch; + }, + + _isValidSubset: function(){ + // summary: + // Overrides `dijit.form.ValidationTextBox._isValidSubset`. + // Returns true if the input is syntactically valid, and either within + // range or could be made in range by more typing. + return this.inherited(arguments) && !this._isDefinitelyOutOfRange(); + }, + + isValid: function(/*Boolean*/ isFocused){ + // Overrides dijit.form.ValidationTextBox.isValid to check that the value is also in range. + return this.inherited(arguments) && + ((this._isEmpty(this.textbox.value) && !this.required) || this.isInRange(isFocused)); // Boolean + }, + + getErrorMessage: function(/*Boolean*/ isFocused){ + // Overrides dijit.form.ValidationTextBox.getErrorMessage to print "out of range" message if appropriate + var v = this.get('value'); + if(v !== null && v !== '' && v !== undefined && (typeof v != "number" || !isNaN(v)) && !this.isInRange(isFocused)){ // don't check isInRange w/o a real value + return this.rangeMessage; // String + } + return this.inherited(arguments); + }, + + postMixInProperties: function(){ + this.inherited(arguments); + if(!this.rangeMessage){ + this.messages = dojo.i18n.getLocalization("dijit.form", "validate", this.lang); + this.rangeMessage = this.messages.rangeMessage; + } + }, + + _setConstraintsAttr: function(/*Object*/ constraints){ + this.inherited(arguments); + if(this.focusNode){ // not set when called from postMixInProperties + if(this.constraints.min !== undefined){ + dijit.setWaiState(this.focusNode, "valuemin", this.constraints.min); + }else{ + dijit.removeWaiState(this.focusNode, "valuemin"); + } + if(this.constraints.max !== undefined){ + dijit.setWaiState(this.focusNode, "valuemax", this.constraints.max); + }else{ + dijit.removeWaiState(this.focusNode, "valuemax"); + } + } + }, + + _setValueAttr: function(/*Number*/ value, /*Boolean?*/ priorityChange){ + // summary: + // Hook so set('value', ...) works. + + dijit.setWaiState(this.focusNode, "valuenow", value); + this.inherited(arguments); + } + } +); + } diff --git a/lib/dijit/form/VerticalRule.js b/lib/dijit/form/VerticalRule.js index 13576277f..98f612cf0 100644 --- a/lib/dijit/form/VerticalRule.js +++ b/lib/dijit/form/VerticalRule.js @@ -1,13 +1,35 @@ /* - 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.VerticalRule"]){ -dojo._hasResource["dijit.form.VerticalRule"]=true; +if(!dojo._hasResource["dijit.form.VerticalRule"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.VerticalRule"] = true; dojo.provide("dijit.form.VerticalRule"); dojo.require("dijit.form.HorizontalRule"); -dojo.declare("dijit.form.VerticalRule",dijit.form.HorizontalRule,{templateString:"

",_positionPrefix:"

', + _positionPrefix: '

= 2.1 OR the modified BSD license. see: http://dojotoolkit.org/license for details */ -if(!dojo._hasResource["dijit.form.VerticalRuleLabels"]){ -dojo._hasResource["dijit.form.VerticalRuleLabels"]=true; +if(!dojo._hasResource["dijit.form.VerticalRuleLabels"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.VerticalRuleLabels"] = true; dojo.provide("dijit.form.VerticalRuleLabels"); dojo.require("dijit.form.HorizontalRuleLabels"); -dojo.declare("dijit.form.VerticalRuleLabels",dijit.form.HorizontalRuleLabels,{templateString:"

",_positionPrefix:"

",_calcPosition:function(_1){ -return 100-_1; -},_isHorizontal:false}); + + +dojo.declare("dijit.form.VerticalRuleLabels", dijit.form.HorizontalRuleLabels, +{ + // summary: + // Labels for the `dijit.form.VerticalSlider` + + templateString: '

', + + _positionPrefix: '

', + + _calcPosition: function(pos){ + // Overrides HorizontalRuleLabel._calcPosition() + return 100-pos; + }, + + // needed to prevent labels from being reversed in RTL mode + _isHorizontal: false +}); + } diff --git a/lib/dijit/form/VerticalSlider.js b/lib/dijit/form/VerticalSlider.js index 9e98cbe0f..f074c7cd1 100644 --- a/lib/dijit/form/VerticalSlider.js +++ b/lib/dijit/form/VerticalSlider.js @@ -1,15 +1,42 @@ /* - 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.VerticalSlider"]){ -dojo._hasResource["dijit.form.VerticalSlider"]=true; +if(!dojo._hasResource["dijit.form.VerticalSlider"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form.VerticalSlider"] = true; dojo.provide("dijit.form.VerticalSlider"); dojo.require("dijit.form.HorizontalSlider"); -dojo.declare("dijit.form.VerticalSlider",dijit.form.HorizontalSlider,{templateString:dojo.cache("dijit.form","templates/VerticalSlider.html","

	+



	-

\n"),_mousePixelCoord:"pageY",_pixelCount:"h",_startingPixelCoord:"y",_startingPixelCount:"t",_handleOffsetCoord:"top",_progressPixelSize:"height",_descending:true,_isReversed:function(){ -return this._descending; -}}); + + +dojo.declare( + "dijit.form.VerticalSlider", + dijit.form.HorizontalSlider, +{ + // summary: + // A form widget that allows one to select a value with a vertically draggable handle + + templateString: dojo.cache("dijit.form", "templates/VerticalSlider.html", "

	+



	-

\n"), + _mousePixelCoord: "pageY", + _pixelCount: "h", + _startingPixelCoord: "y", + _startingPixelCount: "t", + _handleOffsetCoord: "top", + _progressPixelSize: "height", + + // _descending: Boolean + // Specifies if the slider values go from high-on-top (true), or low-on-top (false) + // TODO: expose this in 1.2 - the css progress/remaining bar classes need to be reversed + _descending: true, + + _isReversed: function(){ + // summary: + // Overrides HorizontalSlider._isReversed. + // Indicates if values are high on top (with low numbers on the bottom). + return this._descending; + } +}); + } diff --git a/lib/dijit/form/_DateTimeTextBox.js b/lib/dijit/form/_DateTimeTextBox.js index 72898e406..9d5c004c8 100644 --- a/lib/dijit/form/_DateTimeTextBox.js +++ b/lib/dijit/form/_DateTimeTextBox.js @@ -1,148 +1,250 @@ /* - 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._DateTimeTextBox"]){ -dojo._hasResource["dijit.form._DateTimeTextBox"]=true; +if(!dojo._hasResource["dijit.form._DateTimeTextBox"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form._DateTimeTextBox"] = true; dojo.provide("dijit.form._DateTimeTextBox"); dojo.require("dojo.date"); dojo.require("dojo.date.locale"); dojo.require("dojo.date.stamp"); dojo.require("dijit.form.ValidationTextBox"); -new Date("X"); -dojo.declare("dijit.form._DateTimeTextBox",dijit.form.RangeBoundTextBox,{regExpGen:dojo.date.locale.regexp,datePackage:"dojo.date",compare:dojo.date.compare,format:function(_1,_2){ -if(!_1){ -return ""; -} -return this.dateLocaleModule.format(_1,_2); -},parse:function(_3,_4){ -return this.dateLocaleModule.parse(_3,_4)||(this._isEmpty(_3)?null:undefined); -},serialize:function(_5,_6){ -if(_5.toGregorian){ -_5=_5.toGregorian(); -} -return dojo.date.stamp.toISOString(_5,_6); -},value:new Date(""),_blankValue:null,popupClass:"",_selector:"",constructor:function(_7){ -var _8=_7.datePackage?_7.datePackage+".Date":"Date"; -this.dateClassObj=dojo.getObject(_8,false); -this.value=new this.dateClassObj(""); -this.datePackage=_7.datePackage||this.datePackage; -this.dateLocaleModule=dojo.getObject(this.datePackage+".locale",false); -this.regExpGen=this.dateLocaleModule.regexp; -},_setConstraintsAttr:function(_9){ -_9.selector=this._selector; -_9.fullYear=true; -var _a=dojo.date.stamp.fromISOString; -if(typeof _9.min=="string"){ -_9.min=_a(_9.min); -} -if(typeof _9.max=="string"){ -_9.max=_a(_9.max); -} -this.inherited(arguments,[_9]); -},_onFocus:function(_b){ -this._open(); -this.inherited(arguments); -},_setValueAttr:function(_c,_d,_e){ -if(_c!==undefined){ -if(!_c||_c.toString()==dijit.form._DateTimeTextBox.prototype.value.toString()){ -_c=null; -} -if(_c instanceof Date&&!(this.dateClassObj instanceof Date)){ -_c=new this.dateClassObj(_c); -} -} -this.inherited(arguments,[_c,_d,_e]); -if(this._picker){ -if(!_c){ -_c=new this.dateClassObj(); -} -this._picker.set("value",_c); -} -},_open:function(){ -if(this.disabled||this.readOnly||!this.popupClass){ -return; -} -var _f=this; -if(!this._picker){ -var _10=dojo.getObject(this.popupClass,false); -this._picker=new _10({onValueSelected:function(_11){ -if(_f._tabbingAway){ -delete _f._tabbingAway; -}else{ -_f.focus(); -} -setTimeout(dojo.hitch(_f,"_close"),1); -dijit.form._DateTimeTextBox.superclass._setValueAttr.call(_f,_11,true); -},id:this.id+"_popup",dir:_f.dir,lang:_f.lang,value:this.get("value")||new this.dateClassObj(),constraints:_f.constraints,datePackage:_f.datePackage,isDisabledDate:function(_12){ -var _13=dojo.date.compare; -var _14=_f.constraints; -return _14&&((_14.min&&_13(_14.min,_12,_f._selector)>0)||(_14.max&&_13(_14.max,_12,_f._selector)<0)); -}}); -} -if(!this._opened){ -dijit.popup.open({parent:this,popup:this._picker,orient:{"BL":"TL","TL":"BL"},around:this.domNode,onCancel:dojo.hitch(this,this._close),onClose:function(){ -_f._opened=false; -}}); -this._opened=true; -} -dojo.marginBox(this._picker.domNode,{w:this.domNode.offsetWidth}); -},_close:function(){ -if(this._opened){ -dijit.popup.close(this._picker); -this._opened=false; -} -},_onBlur:function(){ -this._close(); -if(this._picker){ -this._picker.destroy(); -delete this._picker; -} -this.inherited(arguments); -},_getDisplayedValueAttr:function(){ -return this.textbox.value; -},_setDisplayedValueAttr:function(_15,_16){ -this._setValueAttr(this.parse(_15,this.constraints),_16,_15); -},destroy:function(){ -if(this._picker){ -this._picker.destroy(); -delete this._picker; -} -this.inherited(arguments); -},postCreate:function(){ -this.inherited(arguments); -this.connect(this.focusNode,"onkeypress",this._onKeyPress); -this.connect(this.focusNode,"onclick",this._open); -},_onKeyPress:function(e){ -var p=this._picker,dk=dojo.keys; -if(p&&this._opened&&p.handleKey){ -if(p.handleKey(e)===false){ -return; -} -} -if(this._opened&&e.charOrCode==dk.ESCAPE&&!(e.shiftKey||e.ctrlKey||e.altKey||e.metaKey)){ -this._close(); -dojo.stopEvent(e); -}else{ -if(!this._opened&&e.charOrCode==dk.DOWN_ARROW){ -this._open(); -dojo.stopEvent(e); -}else{ -if(e.charOrCode===dk.TAB){ -this._tabbingAway=true; -}else{ -if(this._opened&&(e.keyChar||e.charOrCode===dk.BACKSPACE||e.charOrCode==dk.DELETE)){ -setTimeout(dojo.hitch(this,function(){ -if(this._picker&&this._opened){ -dijit.placeOnScreenAroundElement(p.domNode.parentNode,this.domNode,{"BL":"TL","TL":"BL"},p.orient?dojo.hitch(p,"orient"):null); -} -}),1); -} -} -} -} -}}); +dojo.require("dijit._HasDropDown"); + + +new Date("X"); // workaround for #11279, new Date("") == NaN + +/*===== +dojo.declare( + "dijit.form._DateTimeTextBox.__Constraints", + [dijit.form.RangeBoundTextBox.__Constraints, dojo.date.locale.__FormatOptions], { + // summary: + // Specifies both the rules on valid/invalid values (first/last date/time allowed), + // and also formatting options for how the date/time is displayed. + // example: + // To restrict to dates within 2004, displayed in a long format like "December 25, 2005": + // | {min:'2004-01-01',max:'2004-12-31', formatLength:'long'} +}); +=====*/ + +dojo.declare( + "dijit.form._DateTimeTextBox", + [ dijit.form.RangeBoundTextBox, dijit._HasDropDown ], + { + // summary: + // Base class for validating, serializable, range-bound date or time text box. + + templateString: dojo.cache("dijit.form", "templates/DropDownBox.html", "

\n"), + + // hasDownArrow: [const] Boolean + // Set this textbox to display a down arrow button, to open the drop down list. + hasDownArrow: true, + + // openOnClick: [const] Boolean + // Set to true to open drop down upon clicking anywhere on the textbox. + openOnClick: true, + + /*===== + // constraints: dijit.form._DateTimeTextBox.__Constraints + // Despite the name, this parameter specifies both constraints on the input + // (including starting/ending dates/times allowed) as well as + // formatting options like whether the date is displayed in long (ex: December 25, 2005) + // or short (ex: 12/25/2005) format. See `dijit.form._DateTimeTextBox.__Constraints` for details. + constraints: {}, + ======*/ + + // Override ValidationTextBox.regExpGen().... we use a reg-ex generating function rather + // than a straight regexp to deal with locale (plus formatting options too?) + regExpGen: dojo.date.locale.regexp, + + // datePackage: String + // JavaScript namespace to find calendar routines. Uses Gregorian calendar routines + // at dojo.date, by default. + datePackage: "dojo.date", + + // Override _FormWidget.compare() to work for dates/times + compare: function(/*Date*/ val1, /*Date*/ val2){ + var isInvalid1 = this._isInvalidDate(val1); + var isInvalid2 = this._isInvalidDate(val2); + return isInvalid1 ? (isInvalid2 ? 0 : -1) : (isInvalid2 ? 1 : dojo.date.compare(val1, val2, this._selector)); + }, + + // flag to _HasDropDown to make drop down Calendar width == width + forceWidth: true, + + format: function(/*Date*/ value, /*dojo.date.locale.__FormatOptions*/ constraints){ + // summary: + // Formats the value as a Date, according to specified locale (second argument) + // tags: + // protected + if(!value){ return ''; } + return this.dateLocaleModule.format(value, constraints); + }, + + "parse": function(/*String*/ value, /*dojo.date.locale.__FormatOptions*/ constraints){ + // summary: + // Parses as string as a Date, according to constraints + // tags: + // protected + + return this.dateLocaleModule.parse(value, constraints) || (this._isEmpty(value) ? null : undefined); // Date + }, + + // Overrides ValidationTextBox.serialize() to serialize a date in canonical ISO format. + serialize: function(/*anything*/ val, /*Object?*/ options){ + if(val.toGregorian){ + val = val.toGregorian(); + } + return dojo.date.stamp.toISOString(val, options); + }, + + // dropDownDefaultValue: Date + // The default value to focus in the popupClass widget when the textbox value is empty. + dropDownDefaultValue : new Date(), + + // value: Date + // The value of this widget as a JavaScript Date object. Use get("value") / set("value", val) to manipulate. + // When passed to the parser in markup, must be specified according to `dojo.date.stamp.fromISOString` + value: new Date(""), // value.toString()="NaN" + + _blankValue: null, // used by filter() when the textbox is blank + + // popupClass: [protected extension] String + // Name of the popup widget class used to select a date/time. + // Subclasses should specify this. + popupClass: "", // default is no popup = text only + + + // _selector: [protected extension] String + // Specifies constraints.selector passed to dojo.date functions, should be either + // "date" or "time". + // Subclass must specify this. + _selector: "", + + constructor: function(/*Object*/ args){ + var dateClass = args.datePackage ? args.datePackage + ".Date" : "Date"; + this.dateClassObj = dojo.getObject(dateClass, false); + this.value = new this.dateClassObj(""); + + this.datePackage = args.datePackage || this.datePackage; + this.dateLocaleModule = dojo.getObject(this.datePackage + ".locale", false); + this.regExpGen = this.dateLocaleModule.regexp; + this._invalidDate = dijit.form._DateTimeTextBox.prototype.value.toString(); + }, + + buildRendering: function(){ + this.inherited(arguments); + + if(!this.hasDownArrow){ + this._buttonNode.style.display = "none"; + } + + // If openOnClick is true, we basically just want to treat the whole widget as the + // button. We need to do that also if the actual drop down button will be hidden, + // so that there's a mouse method for opening the drop down. + if(this.openOnClick || !this.hasDownArrow){ + this._buttonNode = this.domNode; + this.baseClass += " dijitComboBoxOpenOnClick"; + } + }, + + _setConstraintsAttr: function(/*Object*/ constraints){ + constraints.selector = this._selector; + constraints.fullYear = true; // see #5465 - always format with 4-digit years + var fromISO = dojo.date.stamp.fromISOString; + if(typeof constraints.min == "string"){ constraints.min = fromISO(constraints.min); } + if(typeof constraints.max == "string"){ constraints.max = fromISO(constraints.max); } + this.inherited(arguments); + }, + + _isInvalidDate: function(/*Date*/ value){ + // summary: + // Runs various tests on the value, checking for invalid conditions + // tags: + // private + return !value || isNaN(value) || typeof value != "object" || value.toString() == this._invalidDate; + }, + + _setValueAttr: function(/*Date|String*/ value, /*Boolean?*/ priorityChange, /*String?*/ formattedValue){ + // summary: + // Sets the date on this textbox. Note: value can be a JavaScript Date literal or a string to be parsed. + if(value !== undefined){ + if(typeof value == "string"){ + value = dojo.date.stamp.fromISOString(value); + } + if(this._isInvalidDate(value)){ + value = null; + } + if(value instanceof Date && !(this.dateClassObj instanceof Date)){ + value = new this.dateClassObj(value); + } + } + this.inherited(arguments); + if(this.dropDown){ + this.dropDown.set('value', value, false); + } + }, + + _set: function(attr, value){ + // Avoid spurious watch() notifications when value is changed to new Date object w/the same value + if(attr == "value" && this.value instanceof Date && this.compare(value, this.value) == 0){ + return; + } + this.inherited(arguments); + }, + + _setDropDownDefaultValueAttr: function(/*Date*/ val){ + if(this._isInvalidDate(val)){ + // convert null setting into today's date, since there needs to be *some* default at all times. + val = new this.dateClassObj() + } + this.dropDownDefaultValue = val; + }, + + openDropDown: function(/*Function*/ callback){ + // rebuild drop down every time, so that constraints get copied (#6002) + if(this.dropDown){ + this.dropDown.destroy(); + } + var PopupProto = dojo.getObject(this.popupClass, false), + textBox = this, + value = this.get("value"); + this.dropDown = new PopupProto({ + onChange: function(value){ + // this will cause InlineEditBox and other handlers to do stuff so make sure it's last + dijit.form._DateTimeTextBox.superclass._setValueAttr.call(textBox, value, true); + }, + id: this.id + "_popup", + dir: textBox.dir, + lang: textBox.lang, + value: value, + currentFocus: !this._isInvalidDate(value) ? value : this.dropDownDefaultValue, + constraints: textBox.constraints, + filterString: textBox.filterString, // for TimeTextBox, to filter times shown + + datePackage: textBox.datePackage, + + isDisabledDate: function(/*Date*/ date){ + // summary: + // disables dates outside of the min/max of the _DateTimeTextBox + return !textBox.rangeCheck(date, textBox.constraints); + } + }); + + this.inherited(arguments); + }, + + _getDisplayedValueAttr: function(){ + return this.textbox.value; + }, + + _setDisplayedValueAttr: function(/*String*/ value, /*Boolean?*/ priorityChange){ + this._setValueAttr(this.parse(value, this.constraints), priorityChange, value); + } + } +); + } diff --git a/lib/dijit/form/_FormMixin.js b/lib/dijit/form/_FormMixin.js index 4c52ed9e2..e42702d31 100644 --- a/lib/dijit/form/_FormMixin.js +++ b/lib/dijit/form/_FormMixin.js @@ -1,158 +1,461 @@ /* - 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._FormMixin"]){ -dojo._hasResource["dijit.form._FormMixin"]=true; +if(!dojo._hasResource["dijit.form._FormMixin"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form._FormMixin"] = true; dojo.provide("dijit.form._FormMixin"); dojo.require("dojo.window"); -dojo.declare("dijit.form._FormMixin",null,{reset:function(){ -dojo.forEach(this.getDescendants(),function(_1){ -if(_1.reset){ -_1.reset(); -} -}); -},validate:function(){ -var _2=false; -return dojo.every(dojo.map(this.getDescendants(),function(_3){ -_3._hasBeenBlurred=true; -var _4=_3.disabled||!_3.validate||_3.validate(); -if(!_4&&!_2){ -dojo.window.scrollIntoView(_3.containerNode||_3.domNode); -_3.focus(); -_2=true; -} -return _4; -}),function(_5){ -return _5; -}); -},setValues:function(_6){ -dojo.deprecated(this.declaredClass+"::setValues() is deprecated. Use set('value', val) instead.","","2.0"); -return this.set("value",_6); -},_setValueAttr:function(_7){ -var _8={}; -dojo.forEach(this.getDescendants(),function(_9){ -if(!_9.name){ -return; -} -var _a=_8[_9.name]||(_8[_9.name]=[]); -_a.push(_9); -}); -for(var _b in _8){ -if(!_8.hasOwnProperty(_b)){ -continue; -} -var _c=_8[_b],_d=dojo.getObject(_b,false,_7); -if(_d===undefined){ -continue; -} -if(!dojo.isArray(_d)){ -_d=[_d]; -} -if(typeof _c[0].checked=="boolean"){ -dojo.forEach(_c,function(w,i){ -w.set("value",dojo.indexOf(_d,w.value)!=-1); -}); -}else{ -if(_c[0].multiple){ -_c[0].set("value",_d); -}else{ -dojo.forEach(_c,function(w,i){ -w.set("value",_d[i]); -}); -} -} -} -},getValues:function(){ -dojo.deprecated(this.declaredClass+"::getValues() is deprecated. Use get('value') instead.","","2.0"); -return this.get("value"); -},_getValueAttr:function(){ -var _e={}; -dojo.forEach(this.getDescendants(),function(_f){ -var _10=_f.name; -if(!_10||_f.disabled){ -return; -} -var _11=_f.get("value"); -if(typeof _f.checked=="boolean"){ -if(/Radio/.test(_f.declaredClass)){ -if(_11!==false){ -dojo.setObject(_10,_11,_e); -}else{ -_11=dojo.getObject(_10,false,_e); -if(_11===undefined){ -dojo.setObject(_10,null,_e); -} -} -}else{ -var ary=dojo.getObject(_10,false,_e); -if(!ary){ -ary=[]; -dojo.setObject(_10,ary,_e); -} -if(_11!==false){ -ary.push(_11); -} -} -}else{ -var _12=dojo.getObject(_10,false,_e); -if(typeof _12!="undefined"){ -if(dojo.isArray(_12)){ -_12.push(_11); -}else{ -dojo.setObject(_10,[_12,_11],_e); -} -}else{ -dojo.setObject(_10,_11,_e); -} -} -}); -return _e; -},isValid:function(){ -this._invalidWidgets=dojo.filter(this.getDescendants(),function(_13){ -return !_13.disabled&&_13.isValid&&!_13.isValid(); -}); -return !this._invalidWidgets.length; -},onValidStateChange:function(_14){ -},_widgetChange:function(_15){ -var _16=this._lastValidState; -if(!_15||this._lastValidState===undefined){ -_16=this.isValid(); -if(this._lastValidState===undefined){ -this._lastValidState=_16; -} -}else{ -if(_15.isValid){ -this._invalidWidgets=dojo.filter(this._invalidWidgets||[],function(w){ -return (w!=_15); -},this); -if(!_15.isValid()&&!_15.get("disabled")){ -this._invalidWidgets.push(_15); -} -_16=(this._invalidWidgets.length===0); -} -} -if(_16!==this._lastValidState){ -this._lastValidState=_16; -this.onValidStateChange(_16); -} -},connectChildren:function(){ -dojo.forEach(this._changeConnections,dojo.hitch(this,"disconnect")); -var _17=this; -var _18=(this._changeConnections=[]); -dojo.forEach(dojo.filter(this.getDescendants(),function(_19){ -return _19.validate; -}),function(_1a){ -_18.push(_17.connect(_1a,"validate",dojo.hitch(_17,"_widgetChange",_1a))); -_18.push(_17.connect(_1a,"_setDisabledAttr",dojo.hitch(_17,"_widgetChange",_1a))); -}); -this._widgetChange(null); -},startup:function(){ -this.inherited(arguments); -this._changeConnections=[]; -this.connectChildren(); -}}); + + +dojo.declare("dijit.form._FormMixin", null, { + // summary: + // Mixin for containers of form widgets (i.e. widgets that represent a single value + // and can be children of a

node or dijit.form.Form widget) + // description: + // Can extract all the form widgets + // values and combine them into a single javascript object, or alternately + // take such an object and set the values for all the contained + // form widgets + +/*===== + // value: Object + // Name/value hash for each child widget with a name and value. + // Child widgets without names are not part of the hash. + // + // If there are multiple child widgets w/the same name, value is an array, + // unless they are radio buttons in which case value is a scalar (since only + // one radio button can be checked at a time). + // + // If a child widget's name is a dot separated list (like a.b.c.d), it's a nested structure. + // + // Example: + // | { name: "John Smith", interests: ["sports", "movies"] } +=====*/ + + // state: [readonly] String + // Will be "Error" if one or more of the child widgets has an invalid value, + // "Incomplete" if not all of the required child widgets are filled in. Otherwise, "", + // which indicates that the form is ready to be submitted. + state: "", + + // TODO: + // * Repeater + // * better handling for arrays. Often form elements have names with [] like + // * people[3].sex (for a list of people [{name: Bill, sex: M}, ...]) + // + // + + reset: function(){ + dojo.forEach(this.getDescendants(), function(widget){ + if(widget.reset){ + widget.reset(); + } + }); + }, + + validate: function(){ + // summary: + // returns if the form is valid - same as isValid - but + // provides a few additional (ui-specific) features. + // 1 - it will highlight any sub-widgets that are not + // valid + // 2 - it will call focus() on the first invalid + // sub-widget + var didFocus = false; + return dojo.every(dojo.map(this.getDescendants(), function(widget){ + // Need to set this so that "required" widgets get their + // state set. + widget._hasBeenBlurred = true; + var valid = widget.disabled || !widget.validate || widget.validate(); + if(!valid && !didFocus){ + // Set focus of the first non-valid widget + dojo.window.scrollIntoView(widget.containerNode || widget.domNode); + widget.focus(); + didFocus = true; + } + return valid; + }), function(item){ return item; }); + }, + + setValues: function(val){ + dojo.deprecated(this.declaredClass+"::setValues() is deprecated. Use set('value', val) instead.", "", "2.0"); + return this.set('value', val); + }, + _setValueAttr: function(/*Object*/ obj){ + // summary: + // Fill in form values from according to an Object (in the format returned by get('value')) + + // generate map from name --> [list of widgets with that name] + var map = { }; + dojo.forEach(this.getDescendants(), function(widget){ + if(!widget.name){ return; } + var entry = map[widget.name] || (map[widget.name] = [] ); + entry.push(widget); + }); + + for(var name in map){ + if(!map.hasOwnProperty(name)){ + continue; + } + var widgets = map[name], // array of widgets w/this name + values = dojo.getObject(name, false, obj); // list of values for those widgets + + if(values === undefined){ + continue; + } + if(!dojo.isArray(values)){ + values = [ values ]; + } + if(typeof widgets[0].checked == 'boolean'){ + // for checkbox/radio, values is a list of which widgets should be checked + dojo.forEach(widgets, function(w, i){ + w.set('value', dojo.indexOf(values, w.value) != -1); + }); + }else if(widgets[0].multiple){ + // it takes an array (e.g. multi-select) + widgets[0].set('value', values); + }else{ + // otherwise, values is a list of values to be assigned sequentially to each widget + dojo.forEach(widgets, function(w, i){ + w.set('value', values[i]); + }); + } + } + + /*** + * TODO: code for plain input boxes (this shouldn't run for inputs that are part of widgets) + + dojo.forEach(this.containerNode.elements, function(element){ + if(element.name == ''){return}; // like "continue" + var namePath = element.name.split("."); + var myObj=obj; + var name=namePath[namePath.length-1]; + for(var j=1,len2=namePath.length;j 1){ + if(typeof(myObj[nameA[0]]) == "undefined"){ + myObj[nameA[0]]=[ ]; + } // if + + nameIndex=parseInt(nameA[1]); + if(typeof(myObj[nameA[0]][nameIndex]) == "undefined"){ + myObj[nameA[0]][nameIndex] = { }; + } + myObj=myObj[nameA[0]][nameIndex]; + continue; + } // repeater support ends + + if(typeof(myObj[p]) == "undefined"){ + myObj=undefined; + break; + }; + myObj=myObj[p]; + } + + if(typeof(myObj) == "undefined"){ + return; // like "continue" + } + if(typeof(myObj[name]) == "undefined" && this.ignoreNullValues){ + return; // like "continue" + } + + // TODO: widget values (just call set('value', ...) on the widget) + + // TODO: maybe should call dojo.getNodeProp() instead + switch(element.type){ + case "checkbox": + element.checked = (name in myObj) && + dojo.some(myObj[name], function(val){ return val == element.value; }); + break; + case "radio": + element.checked = (name in myObj) && myObj[name] == element.value; + break; + case "select-multiple": + element.selectedIndex=-1; + dojo.forEach(element.options, function(option){ + option.selected = dojo.some(myObj[name], function(val){ return option.value == val; }); + }); + break; + case "select-one": + element.selectedIndex="0"; + dojo.forEach(element.options, function(option){ + option.selected = option.value == myObj[name]; + }); + break; + case "hidden": + case "text": + case "textarea": + case "password": + element.value = myObj[name] || ""; + break; + } + }); + */ + + // Note: no need to call this._set("value", ...) as the child updates will trigger onChange events + // which I am monitoring. + }, + + getValues: function(){ + dojo.deprecated(this.declaredClass+"::getValues() is deprecated. Use get('value') instead.", "", "2.0"); + return this.get('value'); + }, + _getValueAttr: function(){ + // summary: + // Returns Object representing form values. See description of `value` for details. + // description: + + // The value is updated into this.value every time a child has an onChange event, + // so in the common case this function could just return this.value. However, + // that wouldn't work when: + // + // 1. User presses return key to submit a form. That doesn't fire an onchange event, + // and even if it did it would come too late due to the setTimout(..., 0) in _handleOnChange() + // + // 2. app for some reason calls this.get("value") while the user is typing into a + // form field. Not sure if that case needs to be supported or not. + + // get widget values + var obj = { }; + dojo.forEach(this.getDescendants(), function(widget){ + var name = widget.name; + if(!name || widget.disabled){ return; } + + // Single value widget (checkbox, radio, or plain type widget) + var value = widget.get('value'); + + // Store widget's value(s) as a scalar, except for checkboxes which are automatically arrays + if(typeof widget.checked == 'boolean'){ + if(/Radio/.test(widget.declaredClass)){ + // radio button + if(value !== false){ + dojo.setObject(name, value, obj); + }else{ + // give radio widgets a default of null + value = dojo.getObject(name, false, obj); + if(value === undefined){ + dojo.setObject(name, null, obj); + } + } + }else{ + // checkbox/toggle button + var ary=dojo.getObject(name, false, obj); + if(!ary){ + ary=[]; + dojo.setObject(name, ary, obj); + } + if(value !== false){ + ary.push(value); + } + } + }else{ + var prev=dojo.getObject(name, false, obj); + if(typeof prev != "undefined"){ + if(dojo.isArray(prev)){ + prev.push(value); + }else{ + dojo.setObject(name, [prev, value], obj); + } + }else{ + // unique name + dojo.setObject(name, value, obj); + } + } + }); + + /*** + * code for plain input boxes (see also dojo.formToObject, can we use that instead of this code? + * but it doesn't understand [] notation, presumably) + var obj = { }; + dojo.forEach(this.containerNode.elements, function(elm){ + if(!elm.name) { + return; // like "continue" + } + var namePath = elm.name.split("."); + var myObj=obj; + var name=namePath[namePath.length-1]; + for(var j=1,len2=namePath.length;j 1){ + if(typeof(myObj[nameA[0]]) == "undefined"){ + myObj[nameA[0]]=[ ]; + } // if + nameIndex=parseInt(nameA[1]); + if(typeof(myObj[nameA[0]][nameIndex]) == "undefined"){ + myObj[nameA[0]][nameIndex] = { }; + } + } else if(typeof(myObj[nameA[0]]) == "undefined"){ + myObj[nameA[0]] = { } + } // if + + if(nameA.length == 1){ + myObj=myObj[nameA[0]]; + } else{ + myObj=myObj[nameA[0]][nameIndex]; + } // if + } // for + + if((elm.type != "select-multiple" && elm.type != "checkbox" && elm.type != "radio") || (elm.type == "radio" && elm.checked)){ + if(name == name.split("[")[0]){ + myObj[name]=elm.value; + } else{ + // can not set value when there is no name + } + } else if(elm.type == "checkbox" && elm.checked){ + if(typeof(myObj[name]) == 'undefined'){ + myObj[name]=[ ]; + } + myObj[name].push(elm.value); + } else if(elm.type == "select-multiple"){ + if(typeof(myObj[name]) == 'undefined'){ + myObj[name]=[ ]; + } + for(var jdx=0,len3=elm.options.length; jdx= 0 ? "Error" : + dojo.indexOf(states, "Incomplete") >= 0 ? "Incomplete" : ""; + }, + + disconnectChildren: function(){ + // summary: + // Remove connections to monitor changes to children's value, error state, and disabled state, + // in order to update Form.value and Form.state. + dojo.forEach(this._childConnections || [], dojo.hitch(this, "disconnect")); + dojo.forEach(this._childWatches || [], function(w){ w.unwatch(); }); + }, + + connectChildren: function(/*Boolean*/ inStartup){ + // summary: + // Setup connections to monitor changes to children's value, error state, and disabled state, + // in order to update Form.value and Form.state. + // + // You can call this function directly, ex. in the event that you + // programmatically add a widget to the form *after* the form has been + // initialized. + + var _this = this; + + // Remove old connections, if any + this.disconnectChildren(); + + this._descendants = this.getDescendants(); + + // (Re)set this.value and this.state. Send watch() notifications but not on startup. + var set = inStartup ? function(name, val){ _this[name] = val; } : dojo.hitch(this, "_set"); + set("value", this.get("value")); + set("state", this._getState()); + + // Monitor changes to error state and disabled state in order to update + // Form.state + var conns = (this._childConnections = []), + watches = (this._childWatches = []); + dojo.forEach(dojo.filter(this._descendants, + function(item){ return item.validate; } + ), + function(widget){ + // We are interested in whenever the widget changes validity state - or + // whenever the disabled attribute on that widget is changed. + dojo.forEach(["state", "disabled"], function(attr){ + watches.push(widget.watch(attr, function(attr, oldVal, newVal){ + _this.set("state", _this._getState()); + })); + }); + }); + + // And monitor calls to child.onChange so we can update this.value + var onChange = function(){ + // summary: + // Called when child's value or disabled state changes + + // Use setTimeout() to collapse value changes in multiple children into a single + // update to my value. Multiple updates will occur on: + // 1. Form.set() + // 2. Form.reset() + // 3. user selecting a radio button (which will de-select another radio button, + // causing two onChange events) + if(_this._onChangeDelayTimer){ + clearTimeout(_this._onChangeDelayTimer); + } + _this._onChangeDelayTimer = setTimeout(function(){ + delete _this._onChangeDelayTimer; + _this._set("value", _this.get("value")); + }, 10); + }; + dojo.forEach( + dojo.filter(this._descendants, function(item){ return item.onChange; } ), + function(widget){ + // When a child widget's value changes, + // the efficient thing to do is to just update that one attribute in this.value, + // but that gets a little complicated when a checkbox is checked/unchecked + // since this.value["checkboxName"] contains an array of all the checkboxes w/the same name. + // Doing simple thing for now. + conns.push(_this.connect(widget, "onChange", onChange)); + + // Disabling/enabling a child widget should remove it's value from this.value. + // Again, this code could be more efficient, doing simple thing for now. + watches.push(widget.watch("disabled", onChange)); + } + ); + }, + + startup: function(){ + this.inherited(arguments); + + // Initialize value and valid/invalid state tracking. Needs to be done in startup() + // so that children are initialized. + this.connectChildren(true); + + // Make state change call onValidStateChange(), will be removed in 2.0 + this.watch("state", function(attr, oldVal, newVal){ this.onValidStateChange(newVal == ""); }); + }, + + destroy: function(){ + this.disconnectChildren(); + this.inherited(arguments); + } + + }); + } diff --git a/lib/dijit/form/_FormSelectWidget.js b/lib/dijit/form/_FormSelectWidget.js index 5905c0aef..fbbf7226b 100644 --- a/lib/dijit/form/_FormSelectWidget.js +++ b/lib/dijit/form/_FormSelectWidget.js @@ -1,307 +1,582 @@ /* - 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._FormSelectWidget"]){ -dojo._hasResource["dijit.form._FormSelectWidget"]=true; +if(!dojo._hasResource["dijit.form._FormSelectWidget"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.form._FormSelectWidget"] = true; dojo.provide("dijit.form._FormSelectWidget"); dojo.require("dijit.form._FormWidget"); dojo.require("dojo.data.util.sorter"); -dojo.declare("dijit.form._FormSelectWidget",dijit.form._FormValueWidget,{multiple:false,options:null,store:null,query:null,queryOptions:null,onFetch:null,sortByLabel:true,loadChildrenOnOpen:false,getOptions:function(_1){ -var _2=_1,_3=this.options||[],l=_3.length; -if(_2===undefined){ -return _3; -} -if(dojo.isArray(_2)){ -return dojo.map(_2,"return this.getOptions(item);",this); -} -if(dojo.isObject(_1)){ -if(!dojo.some(this.options,function(o,_4){ -if(o===_2||(o.value&&o.value===_2.value)){ -_2=_4; -return true; -} -return false; -})){ -_2=-1; -} -} -if(typeof _2=="string"){ -for(var i=0;i=0&&_2 elements. + // This also provides the mechanism for reading the elements from + // a store, if desired. + + // multiple: [const] Boolean + // Whether or not we are multi-valued + multiple: false, + + // options: dijit.form.__SelectOption[] + // The set of options for our select item. Roughly corresponds to + // the html