[483] | 1 | define([ |
---|
| 2 | "dojo/_base/kernel", |
---|
| 3 | "../../main", |
---|
| 4 | "dojo/_base/declare", |
---|
| 5 | "dojo/_base/array", |
---|
| 6 | "dojo/_base/lang", |
---|
| 7 | "dojo/_base/json", |
---|
| 8 | "dojo/_base/connect", |
---|
| 9 | "dojo/_base/sniff", |
---|
| 10 | "dojo/dom", |
---|
| 11 | "dojo/dom-attr", |
---|
| 12 | "dojo/dom-construct", |
---|
| 13 | "dojo/dom-style", |
---|
| 14 | "dojo/dom-geometry", |
---|
| 15 | "dojo/data/ItemFileReadStore", |
---|
| 16 | "dijit/form/DateTextBox", |
---|
| 17 | "dijit/form/TimeTextBox", |
---|
| 18 | "dijit/form/ComboBox", |
---|
| 19 | "dijit/form/CheckBox", |
---|
| 20 | "dijit/form/TextBox", |
---|
| 21 | "dijit/form/NumberSpinner", |
---|
| 22 | "dijit/form/NumberTextBox", |
---|
| 23 | "dijit/form/CurrencyTextBox", |
---|
| 24 | "dijit/form/HorizontalSlider", |
---|
| 25 | "dijit/form/_TextBoxMixin", |
---|
| 26 | "dijit/Editor", |
---|
| 27 | "../util", |
---|
| 28 | "./_base" |
---|
| 29 | ], function(dojo, dojox, declare, array, lang, json, connect, has, dom, domAttr, domConstruct, domStyle, |
---|
| 30 | domGeometry, ItemFileReadStore, DateTextBox, TimeTextBox, ComboBox, CheckBox, TextBox, |
---|
| 31 | NumberSpinner, NumberTextBox, CurrencyTextBox, HorizontalSlider, _TextBoxMixin, Editor, util, BaseCell){ |
---|
| 32 | |
---|
| 33 | // TODO: shouldn't it be the test file's job to require these modules, |
---|
| 34 | // if it is using them? Most of these modules aren't referenced by this file. |
---|
| 35 | |
---|
| 36 | var exports = {}; |
---|
| 37 | |
---|
| 38 | var _Widget = exports._Widget = declare("dojox.grid.cells._Widget", BaseCell, { |
---|
| 39 | widgetClass: TextBox, |
---|
| 40 | constructor: function(inCell){ |
---|
| 41 | this.widget = null; |
---|
| 42 | if(typeof this.widgetClass == "string"){ |
---|
| 43 | dojo.deprecated("Passing a string to widgetClass is deprecated", "pass the widget class object instead", "2.0"); |
---|
| 44 | this.widgetClass = lang.getObject(this.widgetClass); |
---|
| 45 | } |
---|
| 46 | }, |
---|
| 47 | formatEditing: function(inDatum, inRowIndex){ |
---|
| 48 | this.needFormatNode(inDatum, inRowIndex); |
---|
| 49 | return "<div></div>"; |
---|
| 50 | }, |
---|
| 51 | getValue: function(inRowIndex){ |
---|
| 52 | return this.widget.get('value'); |
---|
| 53 | }, |
---|
| 54 | _unescapeHTML: function(value){ |
---|
| 55 | return (value && value.replace && this.grid.escapeHTMLInData) ? |
---|
| 56 | value.replace(/</g, '<').replace(/&/g, '&') : value; |
---|
| 57 | }, |
---|
| 58 | setValue: function(inRowIndex, inValue){ |
---|
| 59 | if(this.widget&&this.widget.set){ |
---|
| 60 | inValue = this._unescapeHTML(inValue); |
---|
| 61 | //Look for lazy-loading editor and handle it via its deferred. |
---|
| 62 | if(this.widget.onLoadDeferred){ |
---|
| 63 | var self = this; |
---|
| 64 | this.widget.onLoadDeferred.addCallback(function(){ |
---|
| 65 | self.widget.set("value",inValue===null?"":inValue); |
---|
| 66 | }); |
---|
| 67 | }else{ |
---|
| 68 | this.widget.set("value", inValue); |
---|
| 69 | } |
---|
| 70 | }else{ |
---|
| 71 | this.inherited(arguments); |
---|
| 72 | } |
---|
| 73 | }, |
---|
| 74 | getWidgetProps: function(inDatum){ |
---|
| 75 | return lang.mixin( |
---|
| 76 | { |
---|
| 77 | dir: this.dir, |
---|
| 78 | lang: this.lang |
---|
| 79 | }, |
---|
| 80 | this.widgetProps||{}, |
---|
| 81 | { |
---|
| 82 | constraints: lang.mixin({}, this.constraint) || {}, //TODO: really just for ValidationTextBoxes |
---|
| 83 | required: (this.constraint || {}).required, |
---|
| 84 | value: this._unescapeHTML(inDatum) |
---|
| 85 | } |
---|
| 86 | ); |
---|
| 87 | }, |
---|
| 88 | createWidget: function(inNode, inDatum, inRowIndex){ |
---|
| 89 | return new this.widgetClass(this.getWidgetProps(inDatum), inNode); |
---|
| 90 | }, |
---|
| 91 | attachWidget: function(inNode, inDatum, inRowIndex){ |
---|
| 92 | inNode.appendChild(this.widget.domNode); |
---|
| 93 | this.setValue(inRowIndex, inDatum); |
---|
| 94 | }, |
---|
| 95 | formatNode: function(inNode, inDatum, inRowIndex){ |
---|
| 96 | if(!this.widgetClass){ |
---|
| 97 | return inDatum; |
---|
| 98 | } |
---|
| 99 | if(!this.widget){ |
---|
| 100 | this.widget = this.createWidget.apply(this, arguments); |
---|
| 101 | }else{ |
---|
| 102 | this.attachWidget.apply(this, arguments); |
---|
| 103 | } |
---|
| 104 | this.sizeWidget.apply(this, arguments); |
---|
| 105 | this.grid.views.renormalizeRow(inRowIndex); |
---|
| 106 | this.grid.scroller.rowHeightChanged(inRowIndex, true/*fix #11101*/); |
---|
| 107 | this.focus(); |
---|
| 108 | return undefined; |
---|
| 109 | }, |
---|
| 110 | sizeWidget: function(inNode, inDatum, inRowIndex){ |
---|
| 111 | var p = this.getNode(inRowIndex); |
---|
| 112 | dojo.marginBox(this.widget.domNode, {w: domStyle.get(p, 'width')}); |
---|
| 113 | }, |
---|
| 114 | focus: function(inRowIndex, inNode){ |
---|
| 115 | if(this.widget){ |
---|
| 116 | setTimeout(lang.hitch(this.widget, function(){ |
---|
| 117 | util.fire(this, "focus"); |
---|
| 118 | if(this.focusNode && this.focusNode.tagName === "INPUT"){ |
---|
| 119 | _TextBoxMixin.selectInputText(this.focusNode); |
---|
| 120 | } |
---|
| 121 | }), 0); |
---|
| 122 | } |
---|
| 123 | }, |
---|
| 124 | _finish: function(inRowIndex){ |
---|
| 125 | this.inherited(arguments); |
---|
| 126 | util.removeNode(this.widget.domNode); |
---|
| 127 | if(has('ie')){ |
---|
| 128 | dom.setSelectable(this.widget.domNode, true); |
---|
| 129 | } |
---|
| 130 | } |
---|
| 131 | }); |
---|
| 132 | _Widget.markupFactory = function(node, cell){ |
---|
| 133 | BaseCell.markupFactory(node, cell); |
---|
| 134 | var widgetProps = lang.trim(domAttr.get(node, "widgetProps")||""); |
---|
| 135 | var constraint = lang.trim(domAttr.get(node, "constraint")||""); |
---|
| 136 | var widgetClass = lang.trim(domAttr.get(node, "widgetClass")||""); |
---|
| 137 | if(widgetProps){ |
---|
| 138 | cell.widgetProps = json.fromJson(widgetProps); |
---|
| 139 | } |
---|
| 140 | if(constraint){ |
---|
| 141 | cell.constraint = json.fromJson(constraint); |
---|
| 142 | } |
---|
| 143 | if(widgetClass){ |
---|
| 144 | cell.widgetClass = lang.getObject(widgetClass); |
---|
| 145 | } |
---|
| 146 | }; |
---|
| 147 | |
---|
| 148 | var ComboBox = exports.ComboBox = declare("dojox.grid.cells.ComboBox", _Widget, { |
---|
| 149 | widgetClass: ComboBox, |
---|
| 150 | getWidgetProps: function(inDatum){ |
---|
| 151 | var items=[]; |
---|
| 152 | array.forEach(this.options, function(o){ |
---|
| 153 | items.push({name: o, value: o}); |
---|
| 154 | }); |
---|
| 155 | var store = new ItemFileReadStore({data: {identifier:"name", items: items}}); |
---|
| 156 | return lang.mixin({}, this.widgetProps||{}, { |
---|
| 157 | value: inDatum, |
---|
| 158 | store: store |
---|
| 159 | }); |
---|
| 160 | }, |
---|
| 161 | getValue: function(){ |
---|
| 162 | var e = this.widget; |
---|
| 163 | // make sure to apply the displayed value |
---|
| 164 | e.set('displayedValue', e.get('displayedValue')); |
---|
| 165 | return e.get('value'); |
---|
| 166 | } |
---|
| 167 | }); |
---|
| 168 | ComboBox.markupFactory = function(node, cell){ |
---|
| 169 | _Widget.markupFactory(node, cell); |
---|
| 170 | var options = lang.trim(domAttr.get(node, "options")||""); |
---|
| 171 | if(options){ |
---|
| 172 | var o = options.split(','); |
---|
| 173 | if(o[0] != options){ |
---|
| 174 | cell.options = o; |
---|
| 175 | } |
---|
| 176 | } |
---|
| 177 | }; |
---|
| 178 | |
---|
| 179 | var DateTextBox = exports.DateTextBox = declare("dojox.grid.cells.DateTextBox", _Widget, { |
---|
| 180 | widgetClass: DateTextBox, |
---|
| 181 | setValue: function(inRowIndex, inValue){ |
---|
| 182 | if(this.widget){ |
---|
| 183 | this.widget.set('value', new Date(inValue)); |
---|
| 184 | }else{ |
---|
| 185 | this.inherited(arguments); |
---|
| 186 | } |
---|
| 187 | }, |
---|
| 188 | getWidgetProps: function(inDatum){ |
---|
| 189 | return lang.mixin(this.inherited(arguments), { |
---|
| 190 | value: new Date(inDatum) |
---|
| 191 | }); |
---|
| 192 | } |
---|
| 193 | }); |
---|
| 194 | DateTextBox.markupFactory = function(node, cell){ |
---|
| 195 | _Widget.markupFactory(node, cell); |
---|
| 196 | }; |
---|
| 197 | |
---|
| 198 | var CheckBox = exports.CheckBox = declare("dojox.grid.cells.CheckBox", _Widget, { |
---|
| 199 | widgetClass: CheckBox, |
---|
| 200 | getValue: function(){ |
---|
| 201 | return this.widget.checked; |
---|
| 202 | }, |
---|
| 203 | setValue: function(inRowIndex, inValue){ |
---|
| 204 | if(this.widget&&this.widget.attributeMap.checked){ |
---|
| 205 | this.widget.set("checked", inValue); |
---|
| 206 | }else{ |
---|
| 207 | this.inherited(arguments); |
---|
| 208 | } |
---|
| 209 | }, |
---|
| 210 | sizeWidget: function(inNode, inDatum, inRowIndex){ |
---|
| 211 | return; |
---|
| 212 | } |
---|
| 213 | }); |
---|
| 214 | CheckBox.markupFactory = function(node, cell){ |
---|
| 215 | _Widget.markupFactory(node, cell); |
---|
| 216 | }; |
---|
| 217 | |
---|
| 218 | var Editor = exports.Editor = declare("dojox.grid.cells.Editor", _Widget, { |
---|
| 219 | widgetClass: Editor, |
---|
| 220 | getWidgetProps: function(inDatum){ |
---|
| 221 | return lang.mixin({}, this.widgetProps||{}, { |
---|
| 222 | height: this.widgetHeight || "100px" |
---|
| 223 | }); |
---|
| 224 | }, |
---|
| 225 | createWidget: function(inNode, inDatum, inRowIndex){ |
---|
| 226 | // widget needs its value set after creation |
---|
| 227 | var widget = new this.widgetClass(this.getWidgetProps(inDatum), inNode); |
---|
| 228 | // use onLoadDeferred because onLoad may have already fired |
---|
| 229 | widget.onLoadDeferred.then(lang.hitch(this, 'populateEditor')); |
---|
| 230 | return widget; |
---|
| 231 | }, |
---|
| 232 | formatNode: function(inNode, inDatum, inRowIndex){ |
---|
| 233 | this.content = inDatum; |
---|
| 234 | this.inherited(arguments); |
---|
| 235 | if(has('mozilla')){ |
---|
| 236 | // FIXME: seem to need to reopen the editor and display the toolbar |
---|
| 237 | var e = this.widget; |
---|
| 238 | e.open(); |
---|
| 239 | if(this.widgetToolbar){ |
---|
| 240 | domConstruct.place(e.toolbar.domNode, e.editingArea, "before"); |
---|
| 241 | } |
---|
| 242 | } |
---|
| 243 | }, |
---|
| 244 | populateEditor: function(){ |
---|
| 245 | this.widget.set('value', this.content); |
---|
| 246 | this.widget.placeCursorAtEnd(); |
---|
| 247 | } |
---|
| 248 | }); |
---|
| 249 | Editor.markupFactory = function(node, cell){ |
---|
| 250 | _Widget.markupFactory(node, cell); |
---|
| 251 | var h = lang.trim(domAttr.get(node, "widgetHeight")||""); |
---|
| 252 | if(h){ |
---|
| 253 | if((h != "auto")&&(h.substr(-2) != "em")){ |
---|
| 254 | h = parseInt(h, 10)+"px"; |
---|
| 255 | } |
---|
| 256 | cell.widgetHeight = h; |
---|
| 257 | } |
---|
| 258 | }; |
---|
| 259 | |
---|
| 260 | return exports; |
---|
| 261 | |
---|
| 262 | }); |
---|