From d26a13de2aca25c36cb35f85604de1ac2b9befbb Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Wed, 1 Feb 2012 14:37:30 -0800 Subject: Simple button native widget test. Added a controller, pi and panel code. Signed-off-by: Valerio Virgillito --- js/controllers/elements/component-controller.js | 23 +++++++++++ js/data/pi/pi-data.js | 18 ++++++++- js/io/document/html-document.js | 47 +++++++++++++--------- .../ComponentsPanelBase.js | 33 ++++++--------- 4 files changed, 80 insertions(+), 41 deletions(-) diff --git a/js/controllers/elements/component-controller.js b/js/controllers/elements/component-controller.js index 458e6b46..7a8acb3a 100644 --- a/js/controllers/elements/component-controller.js +++ b/js/controllers/elements/component-controller.js @@ -9,4 +9,27 @@ var Montage = require("montage/core/core").Montage, exports.ComponentController = Montage.create(ElementController, { + getProperty: { + value: function(el, prop) { + switch(prop) { + case "label": + return this.application.ninja.currentDocument.getComponentFromElement(el).label; + break; + default: + return ElementController.getProperty(el, prop); + } + } + }, + + setProperty: { + value: function(el, p, value) { + switch(p) { + case "label": + this.application.ninja.currentDocument.getComponentFromElement(el).label = value; + break; + default: + ElementController.setProperty(el, p, value); + } + } + } }); diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js index 189d1dae..30b1f60d 100644 --- a/js/data/pi/pi-data.js +++ b/js/data/pi/pi-data.js @@ -508,7 +508,23 @@ exports.PiData = Montage.create( Montage, { }, componentPi: { - value: [] + value: [ + { + label: "Button", + + Section: [ + [ + { + type: "textbox", + id: "Label", + prop: "label", + defaultValue: "Button", + label: "Label" + } + ] + ] + } + ] } }); diff --git a/js/io/document/html-document.js b/js/io/document/html-document.js index c44dfe75..a8e06c69 100644 --- a/js/io/document/html-document.js +++ b/js/io/document/html-document.js @@ -27,6 +27,7 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base _initialUserDocument: { value: null, enumerable: false }, _htmlSource: {value: "", enumerable: false}, _glData: {value: null, enumerable: false }, + _userComponents: { value: {}, enumarable: false}, _elementCounter: { value: 1, enumerable: false }, _snapping : { value: true, enumerable: false }, @@ -108,23 +109,11 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base } }, - _userComponentSet: { - value: {}, - writable: true, - enumerable:true + userComponents: { + get: function() { + return this._userComponents; + } }, - -// userComponentSet:{ -// enumerable: true, -// get: function() { -// return this._userComponentSet; -// }, -// set: function(value) { -// this._userComponentSet = value; -// this._drawUserComponentsOnOpen(); -// } -// }, -// // _drawUserComponentsOnOpen:{ // value:function(){ // for(var i in this._userComponentSet){ @@ -191,6 +180,29 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base set: function(value) { this._zoomFactor = value; } }, + /** + * Add a reference to a component instance to the userComponents hash using the + * element UUID + */ + setComponentInstance: { + value: function(instance, el) { + this.userComponents[el.uuid] = instance; + } + }, + + /** + * Returns the component instance obj from the element + */ + getComponentFromElement: { + value: function(el) { + if(el) { + if(el.uuid) return this.userComponents[el.uuid]; + } else { + return null; + } + } + }, + //****************************************// // PUBLIC METHODS initialize: { @@ -353,9 +365,6 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base this.callback(this); } }.bind(this), 50); - - // TODO - Not sure where this goes - this._userComponentSet = {}; } else { this._styles = this._document.styleSheets[this._document.styleSheets.length - 1]; this._stylesheets = this._document.styleSheets; // Entire stlyesheets array diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js index c8624b29..58a798d8 100644 --- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js +++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js @@ -27,18 +27,6 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component this.eventManager.addEventListener( "executeAddComponent", this, false); } }, - willDraw: { - enumerable: false, - value: function() { - - } - }, - draw: { - enumerable: false, - value: function() { - - } - }, _loadXMLDoc: { value:function(dname) { @@ -61,18 +49,17 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component value:function(componentType, dropX, dropY){ // var compW = 100, // compH = 100, -// elementType = "div", -// componentContainer, -// componentElement; - var componentEl; +// + var componentEl, componentInstance; if(componentType == "Button"){ componentEl = NJUtils.makeNJElement("button", componentType, "component");//, {"type": "button"}); componentEl.setAttribute("type", "button"); - componentEl.innerHTML = "Button"; - console.log(componentEl); -// compW = 118; -// compH = 52; + //componentEl.innerHTML = "Button"; + + componentInstance = this.application.ninja.currentDocument._window.addComponent(componentEl, {type: componentType, path: "montage/ui/button.reel", name: "Button"}); + + }else if(componentType == "Checkbox"){ compW = 53; compH = 53; @@ -142,12 +129,16 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component //componentContainer.appendChild(componentElement); + this.application.ninja.currentDocument.setComponentInstance(componentInstance, componentEl); + NJevent("elementAdding", {"el": componentEl, "data":styles}); /* var componentRef = this.application.ninja.currentDocument._window.addComponent(componentElement, componentType); - this.application.ninja.currentDocument._userComponentSet[componentContainer.uuid] = componentRef; + */ + + } } }); \ No newline at end of file -- cgit v1.2.3