diff options
Diffstat (limited to 'js/components/editable.reel/editable.js')
-rw-r--r-- | js/components/editable.reel/editable.js | 38 |
1 files changed, 19 insertions, 19 deletions
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js index 026446ab..a0568648 100644 --- a/js/components/editable.reel/editable.js +++ b/js/components/editable.reel/editable.js | |||
@@ -39,7 +39,7 @@ EDITABLE - Methods | |||
39 | - startEdit | 39 | - startEdit |
40 | - stopEdit | 40 | - stopEdit |
41 | - value | 41 | - value |
42 | - | 42 | - |
43 | - _suggest | 43 | - _suggest |
44 | - _suggestNext | 44 | - _suggestNext |
45 | - _suggestPrev | 45 | - _suggestPrev |
@@ -70,7 +70,7 @@ exports.Editable = Montage.create(Component, { | |||
70 | if(this.startOnEvent) { | 70 | if(this.startOnEvent) { |
71 | this._element.addEventListener(this.startOnEvent, this, false); | 71 | this._element.addEventListener(this.startOnEvent, this, false); |
72 | } | 72 | } |
73 | 73 | ||
74 | } | 74 | } |
75 | }, | 75 | }, |
76 | _readOnly : { | 76 | _readOnly : { |
@@ -80,9 +80,9 @@ exports.Editable = Montage.create(Component, { | |||
80 | get : function() { return this._readOnly; }, | 80 | get : function() { return this._readOnly; }, |
81 | set : function(makeReadOnly) { | 81 | set : function(makeReadOnly) { |
82 | var action = makeReadOnly ? 'add' : 'remove'; | 82 | var action = makeReadOnly ? 'add' : 'remove'; |
83 | 83 | ||
84 | this._element.classList[action](this.readOnlyClass); | 84 | this._element.classList[action](this.readOnlyClass); |
85 | 85 | ||
86 | if(this.isEditable) { | 86 | if(this.isEditable) { |
87 | this.stop(); | 87 | this.stop(); |
88 | } | 88 | } |
@@ -160,7 +160,7 @@ exports.Editable = Montage.create(Component, { | |||
160 | ///// Pre Edit Value | 160 | ///// Pre Edit Value |
161 | ///// Value stored when editing starts | 161 | ///// Value stored when editing starts |
162 | ///// Useful for reverting to previous value | 162 | ///// Useful for reverting to previous value |
163 | 163 | ||
164 | _preEditValue : { | 164 | _preEditValue : { |
165 | value : null | 165 | value : null |
166 | }, | 166 | }, |
@@ -169,26 +169,26 @@ exports.Editable = Montage.create(Component, { | |||
169 | if(!this._readOnly) { | 169 | if(!this._readOnly) { |
170 | this._isEditable = this._element.contentEditable = true; | 170 | this._isEditable = this._element.contentEditable = true; |
171 | this._element.classList.add(this.editingClass); | 171 | this._element.classList.add(this.editingClass); |
172 | 172 | ||
173 | ///// Save the preEditValue | 173 | ///// Save the preEditValue |
174 | this._preEditValue = this.value; | 174 | this._preEditValue = this.value; |
175 | 175 | ||
176 | // Initialize enteredValue with current value | 176 | // Initialize enteredValue with current value |
177 | this.enteredValue = this.value; | 177 | this.enteredValue = this.value; |
178 | 178 | ||
179 | if(this.selectOnStart) { | 179 | if(this.selectOnStart) { |
180 | this.selectAll(); | 180 | this.selectAll(); |
181 | } | 181 | } |
182 | 182 | ||
183 | if(this.stopOnBlur) { | 183 | if(this.stopOnBlur) { |
184 | //console.log('adding mousedown event listener'); | 184 | //console.log('adding mousedown event listener'); |
185 | ///// Simulate blur on editable node by listening to the doc | 185 | ///// Simulate blur on editable node by listening to the doc |
186 | document.addEventListener('mousedown', this, false); | 186 | document.addEventListener('mousedown', this, false); |
187 | } | 187 | } |
188 | 188 | ||
189 | this._sendEvent('start'); | 189 | this._sendEvent('start'); |
190 | } | 190 | } |
191 | 191 | ||
192 | } | 192 | } |
193 | }, | 193 | }, |
194 | stop : { | 194 | stop : { |
@@ -209,7 +209,7 @@ exports.Editable = Montage.create(Component, { | |||
209 | value : function() { | 209 | value : function() { |
210 | var range = document.createRange(), | 210 | var range = document.createRange(), |
211 | sel = window.getSelection(); | 211 | sel = window.getSelection(); |
212 | 212 | ||
213 | sel.removeAllRanges(); | 213 | sel.removeAllRanges(); |
214 | range.selectNodeContents(this._element); | 214 | range.selectNodeContents(this._element); |
215 | sel.addRange(range); | 215 | sel.addRange(range); |
@@ -244,15 +244,15 @@ exports.Editable = Montage.create(Component, { | |||
244 | this._sendEvent('blur'); | 244 | this._sendEvent('blur'); |
245 | } | 245 | } |
246 | }, | 246 | }, |
247 | 247 | ||
248 | /* -------------------- User Event Handling -------------------- */ | 248 | /* -------------------- User Event Handling -------------------- */ |
249 | 249 | ||
250 | handleKeydown : { | 250 | handleKeydown : { |
251 | value : function(e) { | 251 | value : function(e) { |
252 | var k = e.keyCode; | 252 | var k = e.keyCode; |
253 | } | 253 | } |
254 | }, | 254 | }, |
255 | 255 | ||
256 | handleKeyup : { | 256 | handleKeyup : { |
257 | value : function(e) { | 257 | value : function(e) { |
258 | // Record change in value | 258 | // Record change in value |
@@ -267,7 +267,7 @@ exports.Editable = Montage.create(Component, { | |||
267 | if(!this.isDirty) { | 267 | if(!this.isDirty) { |
268 | this.isDirty = true; | 268 | this.isDirty = true; |
269 | } | 269 | } |
270 | 270 | ||
271 | this._sendEvent('input'); | 271 | this._sendEvent('input'); |
272 | } | 272 | } |
273 | }, | 273 | }, |
@@ -310,7 +310,7 @@ exports.Editable = Montage.create(Component, { | |||
310 | }, | 310 | }, |
311 | 311 | ||
312 | /* -------------------- CONFIG -------------------- */ | 312 | /* -------------------- CONFIG -------------------- */ |
313 | 313 | ||
314 | editingClass : { | 314 | editingClass : { |
315 | value : 'editable' | 315 | value : 'editable' |
316 | }, | 316 | }, |
@@ -326,7 +326,7 @@ exports.Editable = Montage.create(Component, { | |||
326 | stopOnBlur : { | 326 | stopOnBlur : { |
327 | value : true | 327 | value : true |
328 | }, | 328 | }, |
329 | keyActions : { | 329 | keyActions : { |
330 | value : { | 330 | value : { |
331 | stop : [27,9,13], | 331 | stop : [27,9,13], |
332 | revert : [27], | 332 | revert : [27], |
@@ -334,5 +334,5 @@ exports.Editable = Montage.create(Component, { | |||
334 | }, | 334 | }, |
335 | distinct: true | 335 | distinct: true |
336 | } | 336 | } |
337 | 337 | ||
338 | }); | 338 | }); |