aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorValerio Virgillito2012-06-04 23:33:32 -0700
committerValerio Virgillito2012-06-04 23:45:57 -0700
commit563935933c191093b8ccd88fd1377775c5641b0d (patch)
tree64644c457fae0e76064e021d0b1520067f061e6a /js
parentc1ec69879028220b0c3f11ad6e24035bf527802c (diff)
downloadninja-563935933c191093b8ccd88fd1377775c5641b0d.tar.gz
components fix: adding a first draw event to components
Adding a first draw allows the component to have the right element so that ninja can use it's controller to get the component instance Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'js')
-rwxr-xr-xjs/controllers/elements/component-controller.js4
-rw-r--r--js/document/templates/app/main.js52
-rwxr-xr-xjs/panels/components-panel.reel/components-panel.js56
3 files changed, 80 insertions, 32 deletions
diff --git a/js/controllers/elements/component-controller.js b/js/controllers/elements/component-controller.js
index 5b0aaeac..dd0766df 100755
--- a/js/controllers/elements/component-controller.js
+++ b/js/controllers/elements/component-controller.js
@@ -11,7 +11,7 @@ exports.ComponentController = Montage.create(ElementController, {
11 11
12 getProperty: { 12 getProperty: {
13 value: function(el, prop) { 13 value: function(el, prop) {
14 var component = el.controller || this.application.ninja.currentDocument.model.getComponentFromElement(el); 14 var component = el.controller;
15 15
16 switch(prop) { 16 switch(prop) {
17 case "id": 17 case "id":
@@ -34,7 +34,7 @@ exports.ComponentController = Montage.create(ElementController, {
34 34
35 setProperty: { 35 setProperty: {
36 value: function(el, p, value) { 36 value: function(el, p, value) {
37 var component = el.controller || this.application.ninja.currentDocument.model.getComponentFromElement(el); 37 var component = el.controller;
38 38
39 switch(p) { 39 switch(p) {
40 case "id": 40 case "id":
diff --git a/js/document/templates/app/main.js b/js/document/templates/app/main.js
index a406abdb..fbd2e138 100644
--- a/js/document/templates/app/main.js
+++ b/js/document/templates/app/main.js
@@ -8,12 +8,38 @@ var Montage = require("montage/core/core").Montage,
8 Template = require("montage/ui/template").Template, 8 Template = require("montage/ui/template").Template,
9 TemplateCreator = require("tools/template/template-creator").TemplateCreator; 9 TemplateCreator = require("tools/template/template-creator").TemplateCreator;
10 10
11
12//var njmodelGet = function njmodelGet() {
13// return (this.hasOwnProperty("_model") ? this._model: document.modelGenerator.call(this));
14//};
15//
16//Object.defineProperty(Object.prototype, "_model", {
17// enumerable: false,
18// value: null,
19// writable: true
20//});
21//
22//Object.defineProperty(Object.prototype, "elementModel", {
23// configurable: true,
24// get: njmodelGet,
25// set: function() {
26// }
27//});
28
11exports.Main = Montage.create(Component, { 29exports.Main = Montage.create(Component, {
12 30
13 hasTemplate: { 31 hasTemplate: {
14 value: false 32 value: false
15 }, 33 },
16 34
35 componentToInsert: {
36 value: null
37 },
38
39 firstDrawCallback: {
40 value: null
41 },
42
17 /** 43 /**
18 * Adding window hooks to callback into this object from Ninja. 44 * Adding window hooks to callback into this object from Ninja.
19 */ 45 */
@@ -24,6 +50,12 @@ exports.Main = Montage.create(Component, {
24 window.addComponent = function(element, data, callback) { 50 window.addComponent = function(element, data, callback) {
25 var component; 51 var component;
26 52
53 if(!self.firstDrawCallback) {
54 self.firstDrawCallback = {};
55 self.firstDrawCallback.callback = data.firstDraw.cb;
56 self.firstDrawCallback.context = data.firstDraw.ctx;
57 }
58
27 component = require.async(data.path) 59 component = require.async(data.path)
28 .then(function(component) { 60 .then(function(component) {
29 var componentRequire = component[data.name]; 61 var componentRequire = component[data.name];
@@ -34,6 +66,9 @@ exports.Main = Montage.create(Component, {
34 componentInstance.needsDraw = true; 66 componentInstance.needsDraw = true;
35 componentInstance.ownerComponent = self; 67 componentInstance.ownerComponent = self;
36 68
69 self.componentToInsert = componentInstance;
70 componentInstance.addEventListener("firstDraw", self, false);
71
37 callback(componentInstance, element); 72 callback(componentInstance, element);
38 }) 73 })
39 .end(); 74 .end();
@@ -46,16 +81,15 @@ exports.Main = Montage.create(Component, {
46 // 81 //
47 var templateEvent = document.createEvent("CustomEvent"); 82 var templateEvent = document.createEvent("CustomEvent");
48 templateEvent.initCustomEvent("mjsTemplateReady", false, true); 83 templateEvent.initCustomEvent("mjsTemplateReady", false, true);
49 document.body.dispatchEvent(templateEvent); 84 }
50 85 },
51 86
52 // Dispatch event when this template has loaded. 87 handleFirstDraw: {
53 /* 88 value: function() {
54 var newEvent = document.createEvent( "CustomEvent" ); 89 this.firstDrawCallback.callback.call(this.firstDrawCallback.context, this.componentToInsert);
55 newEvent.initCustomEvent( "userTemplateDidLoad", false, true );
56 document.body.dispatchEvent( newEvent );
57 */
58 90
91 this.componentToInsert.removeEventListener("firstDraw", this, false);
92 this.componentToInsert = null;
59 } 93 }
60 } 94 }
61}); \ No newline at end of file 95}); \ No newline at end of file
diff --git a/js/panels/components-panel.reel/components-panel.js b/js/panels/components-panel.reel/components-panel.js
index 5a9d2ca5..0b453c4a 100755
--- a/js/panels/components-panel.reel/components-panel.js
+++ b/js/panels/components-panel.reel/components-panel.js
@@ -4,11 +4,11 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */ 5</copyright> */
6 6
7var Montage = require("montage/core/core").Montage, 7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component, 8 Component = require("montage/ui/component").Component,
9 NJUtils = require("js/lib/NJUtils").NJUtils; 9 ElementController = require("js/controllers/elements/element-controller").ElementController,
10 ClassUUID = require("js/components/core/class-uuid").ClassUuid, 10 ClassUUID = require("js/components/core/class-uuid").ClassUuid,
11 PIData = require("js/data/pi/pi-data").PiData; 11 PIData = require("js/data/pi/pi-data").PiData;
12 12
13String.prototype.capitalizeFirstChar = function() { 13String.prototype.capitalizeFirstChar = function() {
14 return this.charAt(0).toUpperCase() + this.slice(1); 14 return this.charAt(0).toUpperCase() + this.slice(1);
@@ -273,28 +273,42 @@ exports.ComponentsPanel = Montage.create(Component, {
273 that = this; 273 that = this;
274 element = this.makeComponent(component.component); 274 element = this.makeComponent(component.component);
275 275
276 this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addComponent(element, {name: component.name, path: component.module}, function(instance, element) { 276 this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addComponent(element,
277 {name: component.name, path: component.module, firstDraw: {cb: this.componentInstanceOnFirstDraw, ctx: this}},
278 function(instance, element) {
277 279
278 //var pos = that.getStageCenter(); 280 //var pos = that.getStageCenter();
279 281
280 var styles = { 282 var styles = {
281 'position': 'absolute', 283 'position': 'absolute',
282 'left' : that.dragPosition[0] + 'px', 284 'left' : that.dragPosition[0] + 'px',
283 'top' : that.dragPosition[1] + 'px' 285 'top' : that.dragPosition[1] + 'px'
284 }; 286 };
285 287
286 var defaultStyles = component.defaultStyles; 288 var defaultStyles = component.defaultStyles;
287 if(defaultStyles) { 289 if(defaultStyles) {
288 for(var n in defaultStyles) { 290 for(var n in defaultStyles) {
289 styles[n] = defaultStyles[n]; 291 styles[n] = defaultStyles[n];
292 }
290 } 293 }
291 }
292
293 that.application.ninja.currentDocument.model.setComponentInstance(instance, element);
294 294
295 that.application.ninja.elementMediator.addElements(element, styles); 295// that.application.ninja.currentDocument.model.setComponentInstance(instance, element);
296 });
297 296
297 //that.application.ninja.elementMediator.addElements(element, styles);
298 ElementController.addElement(element, styles);
299 });
300
301 }
302 },
303
304 componentInstanceOnFirstDraw: {
305 value: function(instance) {
306 // Temporary hack until the element model rework goes into place
307 // TODO: Remove this once we have the element model define property code in place.
308 if(!instance.element.elementModel) {
309 this.application.njUtils.makeModelFromElement(instance.element);
310 }
311 this.application.ninja.elementMediator.addElements(instance.element);
298 } 312 }
299 }, 313 },
300 314