diff options
Diffstat (limited to 'js')
-rw-r--r-- | js/components/editable.reel/editable.js | 45 | ||||
-rw-r--r-- | js/components/hintable.reel/hintable.js | 36 | ||||
-rw-r--r-- | js/panels/binding-panel.reel/binding-panel.html | 2 | ||||
-rw-r--r-- | js/panels/binding-panel.reel/binding-panel.js | 12 | ||||
-rw-r--r-- | js/panels/binding/edit-binding-view.reel/edit-binding-view.css | 11 | ||||
-rw-r--r-- | js/panels/binding/edit-binding-view.reel/edit-binding-view.html | 4 | ||||
-rw-r--r-- | js/panels/binding/edit-binding-view.reel/edit-binding-view.js | 83 | ||||
-rwxr-xr-x | js/stage/binding-view.reel/binding-view.css | 2 | ||||
-rwxr-xr-x | js/stage/binding-view.reel/binding-view.html | 14 | ||||
-rw-r--r-- | js/stage/objects-tray.reel/objects-tray.js | 9 |
10 files changed, 123 insertions, 95 deletions
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js index 103e418f..88b93b2c 100644 --- a/js/components/editable.reel/editable.js +++ b/js/components/editable.reel/editable.js | |||
@@ -93,12 +93,43 @@ exports.Editable = Montage.create(Component, { | |||
93 | } | 93 | } |
94 | } | 94 | } |
95 | }, | 95 | }, |
96 | |||
97 | _value : { value: null }, | ||
96 | value : { | 98 | value : { |
97 | get: function() { | 99 | get : function() { return this._value; }, |
98 | return this._element.textContent; | 100 | set : function(value) { |
99 | }, | 101 | if(value === this._value) { return; } |
100 | set: function(str) { | 102 | |
101 | this._element.textContent = str; | 103 | var node = this._getFirstTextNode(); |
104 | node.textContent = value; | ||
105 | |||
106 | this._value = value; | ||
107 | } | ||
108 | }, | ||
109 | _getFirstTextNode : { | ||
110 | value : function(el) { | ||
111 | ///// optional el argument specified container element | ||
112 | var e = el || this._element, | ||
113 | nodes = e.childNodes, node; | ||
114 | |||
115 | if(nodes.length) { | ||
116 | for(var i=0; i<nodes.length; i++) { | ||
117 | if(nodes[i].nodeType === 3) { | ||
118 | ///// found the first text node | ||
119 | node = nodes[i]; | ||
120 | break; | ||
121 | } | ||
122 | } | ||
123 | } | ||
124 | |||
125 | ///// Text node not found | ||
126 | if(!node) { | ||
127 | node = document.createTextNode(''); | ||
128 | e.appendChild(node); | ||
129 | } | ||
130 | |||
131 | |||
132 | return node; | ||
102 | } | 133 | } |
103 | }, | 134 | }, |
104 | 135 | ||
@@ -207,6 +238,8 @@ exports.Editable = Montage.create(Component, { | |||
207 | ///// Text input has changed values | 238 | ///// Text input has changed values |
208 | handleInput : { | 239 | handleInput : { |
209 | value : function(e) { | 240 | value : function(e) { |
241 | this.value = this._getFirstTextNode().textContent; | ||
242 | |||
210 | if(!this.isDirty) { | 243 | if(!this.isDirty) { |
211 | this.isDirty = true; | 244 | this.isDirty = true; |
212 | } | 245 | } |
@@ -230,6 +263,8 @@ exports.Editable = Montage.create(Component, { | |||
230 | value: function(e) { | 263 | value: function(e) { |
231 | e.preventDefault(); | 264 | e.preventDefault(); |
232 | document.execCommand('insertHTML', null, e._event.clipboardData.getData("Text")); | 265 | document.execCommand('insertHTML', null, e._event.clipboardData.getData("Text")); |
266 | this.value = this._element.textContent; | ||
267 | |||
233 | this._sendEvent('paste', e); | 268 | this._sendEvent('paste', e); |
234 | } | 269 | } |
235 | }, | 270 | }, |
diff --git a/js/components/hintable.reel/hintable.js b/js/components/hintable.reel/hintable.js index e16c5f8a..d09cdbd2 100644 --- a/js/components/hintable.reel/hintable.js +++ b/js/components/hintable.reel/hintable.js | |||
@@ -140,15 +140,6 @@ exports.Hintable = Montage.create(Editable, { | |||
140 | } | 140 | } |
141 | } | 141 | } |
142 | }, | 142 | }, |
143 | value : { | ||
144 | get: function() { | ||
145 | return this._getFirstTextNode().textContent; | ||
146 | }, | ||
147 | set: function(str) { | ||
148 | var node = this._getFirstTextNode(); | ||
149 | node.textContent = str; | ||
150 | } | ||
151 | }, | ||
152 | 143 | ||
153 | handleKeydown : { | 144 | handleKeydown : { |
154 | value : function handleKeydown(e) { | 145 | value : function handleKeydown(e) { |
@@ -196,6 +187,7 @@ exports.Hintable = Montage.create(Editable, { | |||
196 | 187 | ||
197 | this._matchIndex = 0; | 188 | this._matchIndex = 0; |
198 | this.matches = this.hints.filter(function(h) { | 189 | this.matches = this.hints.filter(function(h) { |
190 | if(!h) { return false; } | ||
199 | return h.indexOf(val) === 0; | 191 | return h.indexOf(val) === 0; |
200 | }).sort(); | 192 | }).sort(); |
201 | 193 | ||
@@ -271,32 +263,6 @@ exports.Hintable = Montage.create(Editable, { | |||
271 | return Array.prototype.slice.call(arrayLikeObj); | 263 | return Array.prototype.slice.call(arrayLikeObj); |
272 | } | 264 | } |
273 | }, | 265 | }, |
274 | _getFirstTextNode : { | ||
275 | value : function(el) { | ||
276 | ///// optional el argument specified container element | ||
277 | var e = el || this._element, | ||
278 | nodes = e.childNodes, node; | ||
279 | |||
280 | if(nodes.length) { | ||
281 | for(var i=0; i<nodes.length; i++) { | ||
282 | if(nodes[i].nodeType === 3) { | ||
283 | ///// found the first text node | ||
284 | node = nodes[i]; | ||
285 | break; | ||
286 | } | ||
287 | } | ||
288 | } | ||
289 | |||
290 | ///// Text node not found | ||
291 | if(!node) { | ||
292 | node = document.createTextNode(''); | ||
293 | e.appendChild(node); | ||
294 | } | ||
295 | |||
296 | |||
297 | return node; | ||
298 | } | ||
299 | }, | ||
300 | _super : { | 266 | _super : { |
301 | value : function(args) { | 267 | value : function(args) { |
302 | this.inheritsFrom[arguments.callee.caller.name].apply(this, args); | 268 | this.inheritsFrom[arguments.callee.caller.name].apply(this, args); |
diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html index 9a2834c7..fc80cd6e 100644 --- a/js/panels/binding-panel.reel/binding-panel.html +++ b/js/panels/binding-panel.reel/binding-panel.html | |||
@@ -74,7 +74,7 @@ | |||
74 | <div data-montage-id="binding-panel-toolbar-container" class="binding-panel-toolbar-container"> | 74 | <div data-montage-id="binding-panel-toolbar-container" class="binding-panel-toolbar-container"> |
75 | <div data-montage-id="binding-panel-toolbar"></div> | 75 | <div data-montage-id="binding-panel-toolbar"></div> |
76 | </div> | 76 | </div> |
77 | <div data-montage-id="edit-binding-view" class="edit-binding-view"></div> | 77 | <div data-montage-id="edit-binding-view"></div> |
78 | </div> | 78 | </div> |
79 | </body> | 79 | </body> |
80 | </html> \ No newline at end of file | 80 | </html> \ No newline at end of file |
diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js index 45fa4005..c040c009 100644 --- a/js/panels/binding-panel.reel/binding-panel.js +++ b/js/panels/binding-panel.reel/binding-panel.js | |||
@@ -64,11 +64,15 @@ exports.BindingPanel = Montage.create(Component, { | |||
64 | 64 | ||
65 | handleAddAction : { | 65 | handleAddAction : { |
66 | value: function(e) { | 66 | value: function(e) { |
67 | var newBindingArgs = { | 67 | var sourceObject = this.application.ninja.objectsController.currentObject; |
68 | sourceObject : this.application.ninja.objectsController.currentObject | ||
69 | }; | ||
70 | 68 | ||
71 | this.displayEditView(newBindingArgs); | 69 | if(sourceObject) { |
70 | this.displayEditView({ | ||
71 | sourceObject: sourceObject | ||
72 | }); | ||
73 | } else { | ||
74 | this.displayEditView(); | ||
75 | } | ||
72 | } | 76 | } |
73 | }, | 77 | }, |
74 | 78 | ||
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.css b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css index 01feb5cc..0ca82179 100644 --- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.css +++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css | |||
@@ -14,7 +14,7 @@ | |||
14 | top: 0; | 14 | top: 0; |
15 | width: 100%; | 15 | width: 100%; |
16 | -webkit-transition-property: -webkit-transform; | 16 | -webkit-transition-property: -webkit-transform; |
17 | -webkit-transition-duration: .55s; | 17 | -webkit-transition-duration: 550ms; |
18 | -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99); | 18 | -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99); |
19 | -webkit-user-select: text; | 19 | -webkit-user-select: text; |
20 | } | 20 | } |
@@ -55,13 +55,16 @@ | |||
55 | position:relative; | 55 | position:relative; |
56 | top: -1px; | 56 | top: -1px; |
57 | left: -1px; | 57 | left: -1px; |
58 | -webkit-transition: opacity 550ms linear; | ||
58 | } | 59 | } |
59 | .object-fields-container { | 60 | .object-fields-container { |
60 | -webkit-box-flex: 1; | 61 | -webkit-box-flex: 1; |
61 | padding-top: 1px; | 62 | padding-top: 1px; |
62 | width: 1px; | 63 | width: 1px; |
63 | } | 64 | } |
64 | 65 | .no-object { | |
66 | opacity: 0; | ||
67 | } | ||
65 | 68 | ||
66 | .edit-binding-view ul { | 69 | .edit-binding-view ul { |
67 | padding: 0; | 70 | padding: 0; |