aboutsummaryrefslogtreecommitdiff
path: root/js/tools
diff options
context:
space:
mode:
Diffstat (limited to 'js/tools')
-rwxr-xr-xjs/tools/TagTool.js151
1 files changed, 53 insertions, 98 deletions
diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js
index d946db72..6c999df9 100755
--- a/js/tools/TagTool.js
+++ b/js/tools/TagTool.js
@@ -13,18 +13,14 @@ var DrawingToolBase = require("js/tools/drawing-tool-base").DrawingToolBase;
13exports.TagTool = Montage.create(DrawingTool, { 13exports.TagTool = Montage.create(DrawingTool, {
14 drawingFeedback: { value: { mode: "Draw3D", type: "rectangle" } }, 14 drawingFeedback: { value: { mode: "Draw3D", type: "rectangle" } },
15 15
16 _editSymbol: { value: null }, 16 Configure: {
17 17 value: function(wasSelected) {
18 editSymbol:{ 18 if(wasSelected) {
19 get: function() { return this._editSymbol; }, 19 NJevent("enableStageMove");
20 set: function(item) { 20 this.application.ninja.stage.stageDeps.snapManager.setupDragPlaneFromPlane( workingPlane );
21 if(item) {
22// stageManagerModule.stageManager.drawElementBoundingBox(item, true);
23 } else { 21 } else {
24// stageManagerModule.stageManager.drawSelectionRec(true); 22 NJevent("disableStageMove");
25 } 23 }
26
27 this._editSymbol = item;
28 } 24 }
29 }, 25 },
30 26
@@ -59,11 +55,9 @@ exports.TagTool = Montage.create(DrawingTool, {
59 this._escape = false; 55 this._escape = false;
60 return; 56 return;
61 } 57 }
62
63 var drawData, selectedItem;
64 58
65 if(this._hasDraw) { 59 if(this._hasDraw) {
66 drawData = this.getDrawingData(); 60 var drawData = this.getDrawingData();
67 61
68 if(drawData) { 62 if(drawData) {
69 this.insertElement(drawData); 63 this.insertElement(drawData);
@@ -72,82 +66,60 @@ exports.TagTool = Montage.create(DrawingTool, {
72 this._hasDraw = false; 66 this._hasDraw = false;
73 this.endDraw(event); 67 this.endDraw(event);
74 } else { 68 } else {
75 if(this.editSymbol) { 69 this.doSelection(event);
76 this.insertElement();
77 } else {
78 //selectedItem = this.doSelection(event);
79 this.doSelection(event);
80 }
81
82 this._isDrawing = false;
83 } 70 }
84 }
85 },
86 71
87 HandleDoubleClick: { 72 this._isDrawing = false;
88 value: function(event) {
89 /*
90 if(selectionManagerModule.selectionManager.isDocument) {
91 this.editSymbol = documentManagerModule.DocumentManager.activeDocument.documentRoot;
92 } else {
93 this.editSymbol = selectionManagerModule.selectionManager._selectedItems[0];
94 }
95 */
96 } 73 }
97 }, 74 },
98 75
99 /* This will overwrite the existing function in drawing tool. Do not uncomment 76 // TODO: Fix Classname
100 HandleKeyPress: { 77 // TODO: Add position support
101 value: function(event) { 78 insertElement: {
102 if(event.metaKey) { 79 value: function(drawData) {
103 // TODO fix this 80 var element, styles;
104 if(selectionManagerModule.selectionManager.isDocument) {
105 this.editSymbol = documentManagerModule.DocumentManager.activeDocument.documentRoot;
106 } else {
107 this.editSymbol = selectionManagerModule.selectionManager._selectedItems[0];
108 }
109 81
82 // Create the element
83 if(this.options.selectedElement === "custom") {
84 element = document.application.njUtils.make(this.options.customName.value, null, this.application.ninja.currentDocument);
85 } else {
86 element = document.application.njUtils.make(this.options.selectedElement, null, this.application.ninja.currentDocument);
110 } 87 }
111 }
112 },
113 88
89 // Create the model
90 document.application.njUtils.createModel(element);
114 91
115 HandleKeyUp: {
116 value: function(event) {
117 if(event.keyCode === 93 || event.keyCode === 91) { // Command Keycode
118 this.editSymbol = null;
119 }
120 }
121 },
122 */
123 92
124 Configure: { 93 // Create the styles
125 value: function(wasSelected) { 94 styles = this.makeStylesFromDraw(drawData);
126 if(wasSelected) { 95 if(element.nodeName === "CANVAS") {
127 NJevent("enableStageMove"); 96 element.width = parseInt(styles.width);
128 this.application.ninja.stage.stageDeps.snapManager.setupDragPlaneFromPlane( workingPlane ); 97 element.height = parseInt(styles.height);
129 } else { 98 delete styles['width'];
130 NJevent("disableStageMove"); 99 delete styles['height'];
131 } 100 }
101
102 // Add the element and styles
103 this.application.ninja.elementMediator.addElements(element, styles);
132 } 104 }
133 }, 105 },
134
135 insertElement: {
136 value: function(data) {
137 var element;
138 106
139 // TODO Refactor into 1 function 107 makeStylesFromDraw: {
140 if(data) { 108 value: function(drawData) {
141 // Get Tag & CSS -- ~~ shortcut for ABS 109 var styles = {};
142 element = this.makeElement(~~data.width, ~~data.height, data.planeMat, data.midPt, this.makeTag());
143 110
144 // Insert Element 111 styles['position'] = "absolute";
145 this.application.ninja.elementMediator.addElements(element.el, element.data); 112 styles['left'] = (Math.round(drawData.midPt[0] - 0.5 * ~~drawData.width)) - this.application.ninja.currentSelectedContainer.offsetLeft + 'px';
146 } else { 113 styles['top'] = (Math.round(drawData.midPt[1] - 0.5 * ~~drawData.height)) - this.application.ninja.currentSelectedContainer.offsetTop + 'px';
147 element = this.makeStaticElement(this.makeTag()); 114 styles['width'] = ~~drawData.width + 'px';
148 this._insertStatic(this.editSymbol, element.el, element.style); 115 styles['height'] = ~~drawData.height + 'px';
116
117 if(!MathUtils.isIdentityMatrix(drawData.planeMat)) {
118 styles['-webkit-transform-style'] = 'preserve-3d';
119 styles['-webkit-transform'] = DrawingToolBase.getElementMatrix(drawData.planeMat, drawData.midPt);
149 } 120 }
150 121
122 return styles;
151 } 123 }
152 }, 124 },
153 125
@@ -157,17 +129,17 @@ exports.TagTool = Montage.create(DrawingTool, {
157 129
158 selectedTag = this.options.selectedElement; 130 selectedTag = this.options.selectedElement;
159 131
160 if(selectedTag === "divTool") { 132 if(selectedTag === "div") {
161 newTag = NJUtils.makeNJElement("div", "div", "block"); 133 newTag = NJUtils.makeNJElement("div", "div", "block");
162 } else if(selectedTag === "imageTool") { 134 } else if(selectedTag === "image") {
163 newTag = NJUtils.makeNJElement("image", "image", "image"); 135 newTag = NJUtils.makeNJElement("image", "image", "image");
164 } else if(selectedTag === "videoTool") { 136 } else if(selectedTag === "video") {
165 newTag = NJUtils.makeNJElement("video", "video", "video", { 137 newTag = NJUtils.makeNJElement("video", "video", "video", {
166 innerHTML: "Your browser does not support the VIDEO element." 138 innerHTML: "Your browser does not support the VIDEO element."
167 }); 139 });
168 } else if(selectedTag === "canvasTool") { 140 } else if(selectedTag === "canvas") {
169 newTag = NJUtils.makeNJElement("canvas", "canvas", "canvas"); 141 newTag = NJUtils.makeNJElement("canvas", "canvas", "canvas");
170 } else if(selectedTag === "customTool") { 142 } else if(selectedTag === "custom") {
171 newTag = NJUtils.makeNJElement(this.options.customName.value, this.options.customName.value, "block"); 143 newTag = NJUtils.makeNJElement(this.options.customName.value, this.options.customName.value, "block");
172 } 144 }
173 /* SWF Tag tool - Not used for now. Will revisit this at a later time. 145 /* SWF Tag tool - Not used for now. Will revisit this at a later time.
@@ -222,13 +194,13 @@ exports.TagTool = Montage.create(DrawingTool, {
222 194
223 makeElement: { 195 makeElement: {
224 value: function(w, h, planeMat, midPt, tag, isShape) { 196 value: function(w, h, planeMat, midPt, tag, isShape) {
225 var left = Math.round(midPt[0] - 0.5 * w); 197 var left = (Math.round(midPt[0] - 0.5 * w)) - this.application.ninja.currentSelectedContainer.offsetLeft + 'px';
226 var top = Math.round(midPt[1] - 0.5 * h); 198 var top = (Math.round(midPt[1] - 0.5 * h)) - this.application.ninja.currentSelectedContainer.offsetTop + 'px';
227 199
228 var styles = { 200 var styles = {
229 'position': 'absolute', 201 'position': 'absolute',
230 'top' : top + 'px', 202 'top' : top,
231 'left' : left + 'px' 203 'left' : left
232 }; 204 };
233 205
234 if(!MathUtils.isIdentityMatrix(planeMat)) { 206 if(!MathUtils.isIdentityMatrix(planeMat)) {
@@ -250,23 +222,6 @@ exports.TagTool = Montage.create(DrawingTool, {
250 222
251 return {el: tag, data:styles}; 223 return {el: tag, data:styles};
252 } 224 }
253 },
254
255 makeStaticElement: {
256 value: function(tag) {
257 var styles = {
258 "-webkit-transform-style": "preserve-3d",
259 "-webkit-transform": "matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)"
260 };
261 tag.innerHTML = "content";
262
263 return {el: tag, data:styles};
264 }
265 },
266
267 _insertStatic: {
268 value: function(parent, tag, style) {
269 }
270 } 225 }
271}); 226});
272 227