aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorValerio Virgillito2012-05-02 15:34:49 -0700
committerValerio Virgillito2012-05-02 15:34:49 -0700
commitd2a5fcbaed6b3c3377edecbc27e6a2818b79be40 (patch)
tree75e443147645e70272e89cfe0ec11318fdcf6adf /js
parent5a74b74e8ec76d60cadf623cabaa0b667f1c4058 (diff)
downloadninja-d2a5fcbaed6b3c3377edecbc27e6a2818b79be40.tar.gz
Nesting absolute element in the Tag tool. Refactoring element creation and element models
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'js')
-rwxr-xr-xjs/components/tools-properties/tag-properties.reel/tag-properties.html12
-rwxr-xr-xjs/components/tools-properties/tag-properties.reel/tag-properties.js6
-rwxr-xr-xjs/controllers/elements/controller-factory.js2
-rwxr-xr-xjs/controllers/elements/element-controller.js5
-rwxr-xr-xjs/data/pi/pi-data.js6
-rwxr-xr-xjs/lib/NJUtils.js32
-rwxr-xr-xjs/models/element-model.js61
-rwxr-xr-xjs/tools/TagTool.js151
8 files changed, 138 insertions, 137 deletions
diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.html b/js/components/tools-properties/tag-properties.reel/tag-properties.html
index c80ba36e..4ea9c659 100755
--- a/js/components/tools-properties/tag-properties.reel/tag-properties.html
+++ b/js/components/tools-properties/tag-properties.reel/tag-properties.html
@@ -37,11 +37,11 @@
37 <body> 37 <body>
38 <div id="tagProperties" class="subToolHolderPanel"> 38 <div id="tagProperties" class="subToolHolderPanel">
39 <div id="tagToolContainer" class="tagRadioButtons"> 39 <div id="tagToolContainer" class="tagRadioButtons">
40 <input type="radio" id="divTool" class="tag-type" title="Div Element" name="TagRadios" checked/> 40 <input type="radio" id="divTool" data-montage-id="divTool" class="tag-type" title="Div Element" name="TagRadios" value="div" checked/>
41 <input type="radio" id="imageTool" class="tag-type" title="Image Element" name="TagRadios"/> 41 <input type="radio" id="imageTool" data-montage-id="imageTool" class="tag-type" title="Image Element" value="image" name="TagRadios"/>
42 <input type="radio" id="videoTool" class="tag-type" title="Video Element" name="TagRadios"/> 42 <input type="radio" id="videoTool" data-montage-id="videoTool" class="tag-type" title="Video Element" value="video" name="TagRadios"/>
43 <input type="radio" id="canvasTool" class="tag-type" title="Canvas Element" name="TagRadios"/> 43 <input type="radio" id="canvasTool" data-montage-id="canvasTool" class="tag-type" title="Canvas Element" value="canvas" name="TagRadios"/>
44 <input type="radio" id="customTool" class="tag-type" title="Custom Element" name="TagRadios"/> 44 <input type="radio" id="customTool" data-montage-id="customTool" class="tag-type" title="Custom Element" value="custom" name="TagRadios"/>
45 45
46 <div class="nj-divider divider-vertical">&nbsp;</div> 46 <div class="nj-divider divider-vertical">&nbsp;</div>
47 47
@@ -67,10 +67,10 @@
67 <label class="label"> Position:</label> 67 <label class="label"> Position:</label>
68 68
69 <select id="positionCB" class="nj-skinned"> 69 <select id="positionCB" class="nj-skinned">
70 <option>Static</option>
70 <option>Absolute</option> 71 <option>Absolute</option>
71 <option>Relative</option> 72 <option>Relative</option>
72 <option>Fixed</option> 73 <option>Fixed</option>
73 <option>Static</option>
74 <option>Inherit</option> 74 <option>Inherit</option>
75 </select> 75 </select>
76 76
diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.js b/js/components/tools-properties/tag-properties.reel/tag-properties.js
index 1caabc35..6519d5b8 100755
--- a/js/components/tools-properties/tag-properties.reel/tag-properties.js
+++ b/js/components/tools-properties/tag-properties.reel/tag-properties.js
@@ -33,9 +33,9 @@ exports.TagProperties = Montage.create(ToolProperties, {
33 33
34 handleClick: { 34 handleClick: {
35 value: function(event) { 35 value: function(event) {
36 this.selectedElement = event._event.target.id; 36 this.selectedElement = event._event.target.value;
37 37
38 if(this.selectedElement === "customTool") { 38 if(this.selectedElement === "custom") {
39 this.customName.style["display"] = ""; 39 this.customName.style["display"] = "";
40 this.customLabel.style["display"] = ""; 40 this.customLabel.style["display"] = "";
41 } else { 41 } else {
@@ -46,7 +46,7 @@ exports.TagProperties = Montage.create(ToolProperties, {
46 }, 46 },
47 47
48 _selectedElement: { 48 _selectedElement: {
49 value: "divTool", enumerable: false 49 value: "div", enumerable: false
50 }, 50 },
51 51
52 selectedElement: { 52 selectedElement: {
diff --git a/js/controllers/elements/controller-factory.js b/js/controllers/elements/controller-factory.js
index 1bbbbce0..3ac3fe14 100755
--- a/js/controllers/elements/controller-factory.js
+++ b/js/controllers/elements/controller-factory.js
@@ -42,6 +42,8 @@ exports.ControllerFactory = Montage.create(Montage, {
42 return ImageController; 42 return ImageController;
43 } else if(value.indexOf("video") !== -1) { 43 } else if(value.indexOf("video") !== -1) {
44 return VideoController; 44 return VideoController;
45 } else {
46 return BlockController;
45 } 47 }
46 } catch (err) { 48 } catch (err) {
47 console.log("Could not create Controller Factory " + err); 49 console.log("Could not create Controller Factory " + err);
diff --git a/js/controllers/elements/element-controller.js b/js/controllers/elements/element-controller.js
index 452d09f1..7f553551 100755
--- a/js/controllers/elements/element-controller.js
+++ b/js/controllers/elements/element-controller.js
@@ -11,9 +11,8 @@ exports.ElementController = Montage.create(Component, {
11 11
12 addElement: { 12 addElement: {
13 value: function(el, styles) { 13 value: function(el, styles) {
14 this.application.ninja.currentDocument.documentRoot.appendChild(el); 14 this.application.ninja.currentSelectedContainer.appendChild(el);
15 // Nested elements - TODO make sure the CSS is correct before nesting elements 15
16 // this.application.ninja.currentSelectedContainer.appendChild(el);
17 if(styles) { 16 if(styles) {
18 this.application.ninja.stylesController.setElementStyles(el, styles); 17 this.application.ninja.stylesController.setElementStyles(el, styles);
19 } 18 }
diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js
index 65161b4f..d1dc9f34 100755
--- a/js/data/pi/pi-data.js
+++ b/js/data/pi/pi-data.js
@@ -100,7 +100,7 @@ exports.PiData = Montage.create( Montage, {
100 } 100 }
101 ] 101 ]
102 }, 102 },
103 imagePi: { 103 imgPi: {
104 value: [ 104 value: [
105 { 105 {
106 label: "Image Properties", 106 label: "Image Properties",
@@ -807,8 +807,8 @@ exports.PiData = Montage.create( Montage, {
807 ] 807 ]
808 ] 808 ]
809 } 809 }
810 ] //value: [ 810 ]
811 } //BrushStrokePi: { 811 }
812}); 812});
813 813
814 814
diff --git a/js/lib/NJUtils.js b/js/lib/NJUtils.js
index dae128e4..301af3f1 100755
--- a/js/lib/NJUtils.js
+++ b/js/lib/NJUtils.js
@@ -54,13 +54,25 @@ exports.NJUtils = Object.create(Object.prototype, {
54 return document.createTextNode(text); 54 return document.createTextNode(text);
55 } 55 }
56 }, 56 },
57 57
58 ///// Quick "createElement" function "attr" can be classname or object 58 ///// Quick "createElement" function "attr" can be classname or object
59 ///// with attribute key/values 59 ///// with attribute key/values
60 ///// Suppor for data attributes 60 ///// Support for data attributes
61 make : { 61 ///// Support user/ninja document
62 value: function(tag, attr) { 62 make: {
63 var el = document.createElement(tag); 63 value: function(tag, attr, doc) {
64 var _doc, el;
65
66 _doc = doc ? doc._document : document;
67 el = _doc.createElement(tag);
68 this.decor(el, attr);
69
70 return el;
71 }
72 },
73
74 decor: {
75 value: function(el, attr) {
64 if (typeof attr === 'object') { 76 if (typeof attr === 'object') {
65 for (var a in attr) { 77 for (var a in attr) {
66 if (attr.hasOwnProperty(a)) { 78 if (attr.hasOwnProperty(a)) {
@@ -74,8 +86,12 @@ exports.NJUtils = Object.create(Object.prototype, {
74 } else if (typeof attr === 'string') { 86 } else if (typeof attr === 'string') {
75 el.className = (el.className + ' ' + attr).trim(); 87 el.className = (el.className + ' ' + attr).trim();
76 } 88 }
77 89 }
78 return el; 90 },
91
92 createModel: {
93 value: function(el) {
94 el.elementModel = Montage.create(ElementModel).initialize(el);
79 } 95 }
80 }, 96 },
81 97
@@ -94,8 +110,6 @@ exports.NJUtils = Object.create(Object.prototype, {
94 ///// TODO: find a different place for this function 110 ///// TODO: find a different place for this function
95 makeElementModel: { 111 makeElementModel: {
96 value: function(el, selection, controller, isShape) { 112 value: function(el, selection, controller, isShape) {
97 //el.elementModel = Montage.create(ElementModel).initialize(el.nodeName, selection, controller, isShape);
98
99 var p3d = Montage.create(Properties3D); 113 var p3d = Montage.create(Properties3D);
100 114
101 var shapeProps = null; 115 var shapeProps = null;
diff --git a/js/models/element-model.js b/js/models/element-model.js
index 0e199a67..72d61806 100755
--- a/js/models/element-model.js
+++ b/js/models/element-model.js
@@ -4,10 +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 Properties3D = require("js/models/properties-3d").Properties3D, 8 Properties3D = require("js/models/properties-3d").Properties3D,
9 ShapeModel = require("js/models/shape-model").ShapeModel, 9 ShapeModel = require("js/models/shape-model").ShapeModel,
10 ControllerFactory = require("js/controllers/elements/controller-factory").ControllerFactory; 10 ControllerFactory = require("js/controllers/elements/controller-factory").ControllerFactory,
11 PiData = require("js/data/pi/pi-data").PiData;
11 12
12exports.ElementModel = Montage.create(Montage, { 13exports.ElementModel = Montage.create(Montage, {
13 key: { value: "_model_"}, 14 key: { value: "_model_"},
@@ -35,17 +36,47 @@ exports.ElementModel = Montage.create(Montage, {
35 stroke: { value: null }, 36 stroke: { value: null },
36 37
37 initialize: { 38 initialize: {
38 value: function(type, selection, controller, isShape) { 39 value: function(el, isShape) {
39 /* 40