diff options
Diffstat (limited to 'node_modules/montage/ui/component.js')
-rwxr-xr-x | node_modules/montage/ui/component.js | 115 |
1 files changed, 77 insertions, 38 deletions
diff --git a/node_modules/montage/ui/component.js b/node_modules/montage/ui/component.js index d347f655..69559fc1 100755 --- a/node_modules/montage/ui/component.js +++ b/node_modules/montage/ui/component.js | |||
@@ -59,7 +59,6 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
59 | value: function() { | 59 | value: function() { |
60 | var actionEvent = document.createEvent("CustomEvent"); | 60 | var actionEvent = document.createEvent("CustomEvent"); |
61 | actionEvent.initCustomEvent("action", true, true, null); | 61 | actionEvent.initCustomEvent("action", true, true, null); |
62 | actionEvent.type = "action"; | ||
63 | return actionEvent; | 62 | return actionEvent; |
64 | } | 63 | } |
65 | }, | 64 | }, |
@@ -162,6 +161,15 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
162 | } | 161 | } |
163 | }, | 162 | }, |
164 | 163 | ||
164 | setElementWithParentComponent: { | ||
165 | value: function(element, parent) { | ||
166 | this._alternateParentComponent = parent; | ||
167 | if (this.element != element) { | ||
168 | this.element = element; | ||
169 | } | ||
170 | } | ||
171 | }, | ||
172 | |||
165 | // access to the Application object | 173 | // access to the Application object |
166 | /** | 174 | /** |
167 | Description TODO | 175 | Description TODO |
@@ -215,6 +223,11 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
215 | return targetElementController; | 223 | return targetElementController; |
216 | } | 224 | } |
217 | }, | 225 | }, |
226 | |||
227 | _alternateParentComponent: { | ||
228 | value: null | ||
229 | }, | ||
230 | |||
218 | /** | 231 | /** |
219 | Description TODO | 232 | Description TODO |
220 | @private | 233 | @private |
@@ -235,21 +248,27 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
235 | get: function() { | 248 | get: function() { |
236 | var cachedParentComponent = this._cachedParentComponent; | 249 | var cachedParentComponent = this._cachedParentComponent; |
237 | if (cachedParentComponent == null) { | 250 | if (cachedParentComponent == null) { |
238 | var anElement = this.element, | 251 | return (this._cachedParentComponent = this.findParentComponent()); |
239 | aParentNode, | ||
240 | eventManager = this.eventManager; | ||
241 | if (anElement) { | ||
242 | while ((aParentNode = anElement.parentNode) !== null && eventManager.eventHandlerForElement(aParentNode) == null) { | ||
243 | anElement = aParentNode; | ||
244 | } | ||
245 | return (this._cachedParentComponent = aParentNode ? eventManager.eventHandlerForElement(aParentNode) : null); | ||
246 | } | ||
247 | } else { | 252 | } else { |
248 | return cachedParentComponent; | 253 | return cachedParentComponent; |
249 | } | 254 | } |
250 | } | 255 | } |
251 | }, | 256 | }, |
252 | 257 | ||
258 | findParentComponent: { | ||
259 | value: function() { | ||
260 | var anElement = this.element, | ||
261 | aParentNode, | ||
262 | eventManager = this.eventManager; | ||
263 | if (anElement) { | ||
264 | while ((aParentNode = anElement.parentNode) !== null && eventManager.eventHandlerForElement(aParentNode) == null) { | ||
265 | anElement = aParentNode; | ||
266 | } | ||
267 | return aParentNode ? eventManager.eventHandlerForElement(aParentNode) : this._alternateParentComponent; | ||
268 | } | ||
269 | } | ||
270 | }, | ||
271 | |||
253 | querySelectorComponent: { | 272 | querySelectorComponent: { |
254 | value: function(selector) { | 273 | value: function(selector) { |
255 | if (typeof selector !== "string") { | 274 | if (typeof selector !== "string") { |
@@ -406,19 +425,30 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
406 | attachToParentComponent: { | 425 | attachToParentComponent: { |
407 | value: function() { | 426 | value: function() { |
408 | this._cachedParentComponent = null; | 427 | this._cachedParentComponent = null; |
409 | 428 | ||
410 | var parentComponent = this.parentComponent; | 429 | var parentComponent = this.parentComponent, |
411 | 430 | childComponents, | |
431 | childComponent; | ||
432 | |||
412 | if (parentComponent) { | 433 | if (parentComponent) { |
434 | childComponents = parentComponent.childComponents; | ||
435 | for (var i = 0; (childComponent = childComponents[i]); i++) { | ||
436 | var newParentComponent = childComponent.findParentComponent(); | ||
437 | if (newParentComponent === this) { | ||
438 | parentComponent.removeChildComponent(childComponent); | ||
439 | newParentComponent._addChildComponent(childComponent); | ||
440 | } | ||
441 | } | ||
442 | |||
413 | parentComponent._addChildComponent(this); | 443 | parentComponent._addChildComponent(this); |
414 | } | 444 | } |
415 | } | 445 | } |
416 | }, | 446 | }, |
417 | 447 | ||
418 | detachFromParentComponent: { | 448 | detachFromParentComponent: { |
419 | value: function() { | 449 | value: function() { |
420 | var parentComponent = this.parentComponent; | 450 | var parentComponent = this.parentComponent; |
421 | 451 | ||
422 | if (parentComponent) { | 452 | if (parentComponent) { |
423 | parentComponent.removeChildComponent(this); | 453 | parentComponent.removeChildComponent(this); |
424 | } | 454 | } |
@@ -438,6 +468,7 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
438 | if (ix > -1) { | 468 | if (ix > -1) { |
439 | childComponents.splice(ix, 1); | 469 | childComponents.splice(ix, 1); |
440 | childComponent._cachedParentComponent = null; | 470 | childComponent._cachedParentComponent = null; |
471 | childComponent._alternateParentComponent = null; | ||
441 | } | 472 | } |
442 | } | 473 | } |
443 | }, | 474 | }, |
@@ -458,7 +489,6 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
458 | */ | 489 | */ |
459 | ownerComponent: { | 490 | ownerComponent: { |
460 | enumerable: false, | 491 | enumerable: false, |
461 | serializable: true, | ||
462 | value: null | 492 | value: null |
463 | }, | 493 | }, |
464 | /** | 494 | /** |
@@ -488,7 +518,7 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
488 | enumerable: false, | 518 | enumerable: false, |
489 | value: null | 519 | value: null |
490 | }, | 520 | }, |
491 | 521 | ||
492 | /** | 522 | /** |
493 | * Remove all bindings and starts buffering the needsDraw. | 523 | * Remove all bindings and starts buffering the needsDraw. |
494 | * @function | 524 | * @function |
@@ -498,23 +528,20 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
498 | this.needsDraw = false; | 528 | this.needsDraw = false; |
499 | this.traverseComponentTree(function(component) { | 529 | this.traverseComponentTree(function(component) { |
500 | Object.deleteBindings(component); | 530 | Object.deleteBindings(component); |
501 | component.canDrawGate.setField("componentTreeLoaded", false); | ||
502 | component.blockDrawGate.setField("element", false); | ||
503 | component.blockDrawGate.setField("drawRequested", false); | ||
504 | component.needsDraw = false; | 531 | component.needsDraw = false; |
505 | }); | 532 | }); |
506 | } | 533 | } |
507 | }, | 534 | }, |
508 | 535 | ||
509 | originalContent: { | 536 | originalContent: { |
510 | value: null | 537 | value: null |
511 | }, | 538 | }, |
512 | 539 | ||
513 | _newContent: { | 540 | _newContent: { |
514 | enumerable: false, | 541 | enumerable: false, |
515 | value: null | 542 | value: null |
516 | }, | 543 | }, |
517 | 544 | ||
518 | content: { | 545 | content: { |
519 | get: function() { | 546 | get: function() { |
520 | if (this._element) { | 547 | if (this._element) { |
@@ -526,21 +553,21 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
526 | set: function(value) { | 553 | set: function(value) { |
527 | var components = [], | 554 | var components = [], |
528 | childNodes; | 555 | childNodes; |
529 | 556 | ||
530 | this._newContent = value; | 557 | this._newContent = value; |
531 | this.needsDraw = true; | 558 | this.needsDraw = true; |
532 | 559 | ||
533 | if (typeof this.contentWillChange === "function") { | 560 | if (typeof this.contentWillChange === "function") { |
534 | this.contentWillChange(value); | 561 | this.contentWillChange(value); |
535 | } | 562 | } |
536 | 563 | ||
537 | // cleanup current content | 564 | // cleanup current content |
538 | components = this.childComponents; | 565 | components = this.childComponents; |
539 | for (var i = 0, component; (component = components[i]); i++) { | 566 | for (var i = 0, component; (component = components[i]); i++) { |
540 | component.detachFromParentComponent(); | 567 | component.detachFromParentComponent(); |
541 | component.cleanupDeletedComponentTree(); | 568 | component.cleanupDeletedComponentTree(); |
542 | } | 569 | } |
543 | 570 | ||
544 | if (value instanceof Element) { | 571 | if (value instanceof Element) { |
545 | findAndDetachComponents(value); | 572 | findAndDetachComponents(value); |
546 | } else { | 573 | } else { |
@@ -548,11 +575,11 @@ var Component = exports.Component = Montage.create(Montage,/** @lends module:mon | |||
548 | findAndDetachComponents(value[i]); | 575 | findAndDetachComponents(value[i]); |
549 | } | 576 | } |
550 |