aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJose Antonio Marquez Russo2012-02-23 08:05:06 -0800
committerJose Antonio Marquez Russo2012-02-23 08:05:06 -0800
commitc8a5107fa6f85ad572cf0881ed7e222ac6fbacfc (patch)
tree61bac34de22852efd2b9b8880f62210685b16297
parentd264092596ba697cd04738566184270dc608be63 (diff)
parent64a971f63333d74ca89690892a52948b3bd4283a (diff)
downloadninja-c8a5107fa6f85ad572cf0881ed7e222ac6fbacfc.tar.gz
Merge pull request #18 from mencio/file-io
File io - drawing the layout on open and make models
-rwxr-xr-xjs/document/html-document.js12
-rwxr-xr-xjs/helper-classes/3D/snap-manager.js4
-rwxr-xr-xjs/lib/NJUtils.js4
-rwxr-xr-xjs/mediators/element-mediator.js12
-rwxr-xr-xjs/stage/layout.js71
-rwxr-xr-xjs/stage/stage.reel/stage.js2
6 files changed, 55 insertions, 50 deletions
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 143b1598..eaf56146 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -23,6 +23,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
23 23
24 _document: { value: null, enumerable: false }, 24 _document: { value: null, enumerable: false },
25 _documentRoot: { value: null, enumerable: false }, 25 _documentRoot: { value: null, enumerable: false },
26 _liveNodeList: { value: null, enumarable: false },
26 _stageBG: { value: null, enumerable: false }, 27 _stageBG: { value: null, enumerable: false },
27 _window: { value: null, enumerable: false }, 28 _window: { value: null, enumerable: false },
28 _styles: { value: null, enumerable: false }, 29 _styles: { value: null, enumerable: false },
@@ -402,7 +403,16 @@ exports.HTMLDocument = Montage.create(TextDocument, {
402 //Adding a handler for the main user document reel to finish loading 403 //Adding a handler for the main user document reel to finish loading
403 this._document.body.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false); 404 this._document.body.addEventListener("userTemplateDidLoad", this.userTemplateDidLoad.bind(this), false);
404 405
405 406 // Live node list of the current loaded document
407 this._liveNodeList = this.documentRoot.getElementsByTagName('*');
408
409 // TODO Move this to the appropriate location
410 var len = this._liveNodeList.length;
411
412 for(var i = 0; i < len; i++) {
413 NJUtils.makeModelFromElement(this._liveNodeList[i]);
414 }
415
406 /* this.iframe.contentWindow.document.addEventListener('DOMSubtreeModified', function (e) { */ //TODO: Remove events upon loading once 416 /* this.iframe.contentWindow.document.addEventListener('DOMSubtreeModified', function (e) { */ //TODO: Remove events upon loading once
407 417
408 //TODO: When re-written, the best way to initialize the document is to listen for the DOM tree being modified 418 //TODO: When re-written, the best way to initialize the document is to listen for the DOM tree being modified
diff --git a/js/helper-classes/3D/snap-manager.js b/js/helper-classes/3D/snap-manager.js
index 0a950658..2922edf9 100755
--- a/js/helper-classes/3D/snap-manager.js
+++ b/js/helper-classes/3D/snap-manager.js
@@ -521,7 +521,7 @@ var SnapManager = exports.SnapManager = Montage.create(Component, {
521 521
522 if (!elt.elementModel) 522 if (!elt.elementModel)
523 { 523 {
524 NJUtils.makeElementModel2(elt); 524 NJUtils.makeModelFromElement(elt);
525 } 525 }
526 elt.elementModel.isIn2DSnapCache = true; 526 elt.elementModel.isIn2DSnapCache = true;
527 } 527 }
@@ -588,7 +588,7 @@ var SnapManager = exports.SnapManager = Montage.create(Component, {
588 588
589 if (!elt.elementModel) 589 if (!elt.elementModel)
590 { 590 {
591 NJUtils.makeElementModel2(elt); 591 NJUtils.makeModelFromElement(elt);
592 } 592 }
593 elt.elementModel.isIn2DSnapCache = true; 593 elt.elementModel.isIn2DSnapCache = true;
594 } 594 }
diff --git a/js/lib/NJUtils.js b/js/lib/NJUtils.js
index 887743c5..e16715a4 100755
--- a/js/lib/NJUtils.js
+++ b/js/lib/NJUtils.js
@@ -113,8 +113,8 @@ exports.NJUtils = Object.create(Object.prototype, {
113 }, 113 },
114 114
115 ///// Element Model creation for existing elements based on element type. 115 ///// Element Model creation for existing elements based on element type.
116 ///// TODO: find a different place for this function and return different element models based on type. 116 ///// TODO: Selection and model should be based on the element type
117 makeElementModel2: { 117 makeModelFromElement: {
118 value: function(el) { 118 value: function(el) {
119 this.makeElementModel(el, "Div", "block", false); 119 this.makeElementModel(el, "Div", "block", false);
120 } 120 }
diff --git a/js/mediators/element-mediator.js b/js/mediators/element-mediator.js
index 51923f08..127f73e1 100755
--- a/js/mediators/element-mediator.js
+++ b/js/mediators/element-mediator.js
@@ -463,7 +463,7 @@ exports.ElementMediator = Montage.create(NJComponent, {
463 getColor: { 463 getColor: {
464 value: function(el, isFill) { 464 value: function(el, isFill) {
465 if(!el.elementModel) { 465 if(!el.elementModel) {
466 NJUtils.makeElementModel2(el); 466 NJUtils.makeModelFromElement(el);
467 } 467 }
468 return el.elementModel.controller["getColor"](el, isFill); 468 return el.elementModel.controller["getColor"](el, isFill);
469 } 469 }
@@ -624,7 +624,7 @@ exports.ElementMediator = Montage.create(NJComponent, {
624 getColor2: { 624 getColor2: {
625 value: function(el, prop, mutator) { 625 value: function(el, prop, mutator) {
626 if(!el.elementModel) { 626 if(!el.elementModel) {
627 NJUtils.makeElementModel2(el); 627 NJUtils.makeModelFromElement(el);
628 } 628 }
629 629
630 return this.getColor(el, (prop === "background")); 630 return this.getColor(el, (prop === "background"));
@@ -636,7 +636,7 @@ exports.ElementMediator = Montage.create(NJComponent, {
636 get3DProperty: { 636 get3DProperty: {
637 value: function(el, prop) { 637 value: function(el, prop) {
638 if(!el.elementModel) { 638 if(!el.elementModel) {
639 NJUtils.makeElementModel2(el); 639 NJUtils.makeModelFromElement(el);
640 } 640 }
641 return el.elementModel.controller["get3DProperty"](el, prop); 641 return el.elementModel.controller["get3DProperty"](el, prop);
642 } 642 }
@@ -645,7 +645,7 @@ exports.ElementMediator = Montage.create(NJComponent, {
645 get3DProperties: { 645 get3DProperties: {
646 value: function(el) { 646 value: function(el) {
647 if(!el.elementModel) { 647 if(!el.elementModel) {
648 NJUtils.makeElementModel2(el); 648 NJUtils.makeModelFromElement(el);
649 } 649 }
650// var mat = this.getMatrix(el); 650// var mat = this.getMatrix(el);
651// var dist = this.getPerspectiveDist(el); 651// var dist = this.getPerspectiveDist(el);
@@ -658,7 +658,7 @@ exports.ElementMediator = Montage.create(NJComponent, {
658 getMatrix: { 658 getMatrix: {
659 value: function(el) { 659 value: function(el) {
660 if(!el.elementModel) { 660 if(!el.elementModel) {
661 NJUtils.makeElementModel2(el); 661 NJUtils.makeModelFromElement(el);
662 } 662 }
663 return el.elementModel.controller["getMatrix"](el); 663 return el.elementModel.controller["getMatrix"](el);
664 } 664 }
@@ -667,7 +667,7 @@ exports.ElementMediator = Montage.create(NJComponent, {
667 getPerspectiveDist: { 667 getPerspectiveDist: {
668 value: function(el) { 668 value: function(el) {
669 if(!el.elementModel) { 669 if(!el.elementModel) {
670 NJUtils.makeElementModel2(el); 670 NJUtils.makeModelFromElement(el);
671 } 671 }
672 return el.elementModel.controller["getPerspectiveDist"](el); 672 return el.elementModel.controller["getPerspectiveDist"](el);
673 } 673 }
diff --git a/js/stage/layout.js b/js/stage/layout.js
index 56bb70bf..a94dd10c 100755
--- a/js/stage/layout.js
+++ b/js/stage/layout.js
@@ -53,36 +53,38 @@ exports.Layout = Montage.create(Component, {
53 this.ctx.lineWidth = this.ctxLineWidth; 53 this.ctx.lineWidth = this.ctxLineWidth;
54 this.ctx.fillStyle = this.drawFillColor; 54 this.ctx.fillStyle = this.drawFillColor;
55 55
56 this.eventManager.addEventListener("elementAdded", this, false); 56// this.eventManager.addEventListener("elementAdded", this, false);
57 this.eventManager.addEventListener("elementDeleted", this, false); 57 this.eventManager.addEventListener("elementDeleted", this, false);
58 58
59 this.eventManager.addEventListener("selectionChange", this, false); 59 this.eventManager.addEventListener("selectionChange", this, false);
60 60
61 this.eventManager.addEventListener("deleteSelection", this, false); 61 this.eventManager.addEventListener("deleteSelection", this, false);
62
63// this.addEventListener("change@stage.appModel.layoutView", this.handleLayoutView, false);
64
65 } 62 }
66 }, 63 },
67 64
68 handleLayoutView: { 65 handleOpenDocument: {
69 value: function() { 66 value: function() {
70 console.log(this.stage.appModel.layoutView); 67 // Initial elements to draw is the entire node list
68 this.elementsToDraw = this.application.ninja.documentController.activeDocument._liveNodeList;
69
70 // Draw the elements and the 3d info
71 this.draw();
72 this.draw3DInfo(false);
71 } 73 }
72 }, 74 },
73 75
76 // No need to keep track of the added elements. We now have a live node list of the dom
74 handleElementAdded: { 77 handleElementAdded: {
75 value: function(event) { 78 value: function(event) {
76 this.domTree.push(event.detail); 79 // this.domTree.push(event.detail);
77 80 // this.draw();
78 this.draw(); 81 // this.draw3DInfo(false);
79 this.draw3DInfo(false);
80 } 82 }
81 }, 83 },
82 84
83 handleElementDeleted: { 85 handleElementDeleted: {
84 value: function(event) { 86 value: function(event) {
85 this.domTree.splice(this.domTree.indexOf(event.detail), 1); 87 //this.domTree.splice(this.domTree.indexOf(event.detail), 1);
86 } 88 }
87 }, 89 },
88 90
@@ -96,8 +98,13 @@ exports.Layout = Montage.create(Component, {
96 98
97 handleSelectionChange: { 99 handleSelectionChange: {
98 value: function(event) { 100 value: function(event) {
99 this.elementsToDraw = []; 101 // Make an array copy of the line node list which is not an array like object
102 this.domTree = Array.prototype.slice.call(this.application.ninja.documentController.activeDocument._liveNodeList, 0);
103
104 // Clear the elements to draw
105 this.elementsToDraw.length = 0;
100 106
107 // Draw the non selected elements
101 if(!event.detail.isDocument) { 108 if(!event.detail.isDocument) {
102 var tmp = event.detail.elements.map(function(element){ return element._element}); 109 var tmp = event.detail.elements.map(function(element){ return element._element});
103 110
@@ -111,13 +118,15 @@ exports.Layout = Montage.create(Component, {
111 this.draw(); // Not a reel yet :) 118