diff options
author | Pierre Frisch | 2011-12-22 07:25:50 -0800 |
---|---|---|
committer | Valerio Virgillito | 2012-01-27 11:18:17 -0800 |
commit | b89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch) | |
tree | 0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/tools/TagTool.js | |
parent | 2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff) | |
download | ninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz |
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/tools/TagTool.js')
-rw-r--r-- | js/tools/TagTool.js | 273 |
1 files changed, 273 insertions, 0 deletions
diff --git a/js/tools/TagTool.js b/js/tools/TagTool.js new file mode 100644 index 00000000..c527edf3 --- /dev/null +++ b/js/tools/TagTool.js | |||
@@ -0,0 +1,273 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage, | ||
8 | DrawingTool = require("js/tools/drawing-tool").DrawingTool, | ||
9 | NJUtils = require("js/lib/NJUtils").NJUtils; | ||
10 | |||
11 | var DrawingToolBase = require("js/tools/drawing-tool-base").DrawingToolBase; | ||
12 | |||
13 | exports.TagTool = Montage.create(DrawingTool, { | ||
14 | drawingFeedback: { value: { mode: "Draw3D", type: "rectangle" } }, | ||
15 | |||
16 | _editSymbol: { value: null }, | ||
17 | |||
18 | editSymbol:{ | ||
19 | get: function() { return this._editSymbol; }, | ||
20 | set: function(item) { | ||
21 | if(item) { | ||
22 | // stageManagerModule.stageManager.drawElementBoundingBox(item, true); | ||
23 | } else { | ||
24 | // stageManagerModule.stageManager.drawSelectionRec(true); | ||
25 | } | ||
26 | |||
27 | this._editSymbol = item; | ||
28 | } | ||
29 | }, | ||
30 | |||
31 | HandleLeftButtonDown: { | ||
32 | value: function(event) { | ||
33 | this.startDraw(event); | ||
34 | } | ||
35 | }, | ||
36 | |||
37 | HandleMouseMove: { | ||
38 | value: function(event) { | ||
39 | if(this._escape) { | ||
40 | this._escape = false; | ||
41 | this.isDrawing = true; | ||
42 | } | ||
43 | |||
44 | if(this.isDrawing) { | ||
45 | this._hasDraw = true; // Flag for position of element | ||
46 | this.doDraw(event); | ||
47 | } else { | ||
48 | this.doSnap(event); | ||
49 | } | ||
50 | |||
51 | this.drawLastSnap(); // Required cleanup for both Draw/Feedbacks | ||
52 | } | ||
53 | }, | ||
54 | |||
55 | |||
56 | HandleLeftButtonUp: { | ||
57 | value: function(event) { | ||
58 | if(this._escape) { | ||
59 | this._escape = false; | ||
60 | return; | ||
61 | } | ||
62 | |||
63 | var drawData, selectedItem; | ||
64 | |||
65 | if(this._hasDraw) { | ||
66 | drawData = this.getDrawingData(); | ||
67 | |||
68 | if(drawData) { | ||
69 | this.insertElement(drawData); | ||
70 | } | ||
71 | |||
72 | this._hasDraw = false; | ||
73 | this.endDraw(event); | ||
74 | } else { | ||
75 | if(this.editSymbol) { | ||
76 | this.insertElement(); | ||
77 | } else { | ||
78 | //selectedItem = this.doSelection(event); | ||
79 | this.doSelection(event); | ||
80 | } | ||
81 | |||
82 | this._isDrawing = false; | ||
83 | } | ||
84 | } | ||
85 | }, | ||
86 | |||
87 | HandleDoubleClick: { | ||
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]._element; | ||
94 | } | ||
95 | */ | ||
96 | } | ||
97 | }, | ||
98 | |||
99 | /* This will overwrite the existing function in drawing tool. Do not uncomment | ||
100 | HandleKeyPress: { | ||
101 | value: function(event) { | ||
102 | if(event.metaKey) { | ||
103 | // TODO fix this | ||
104 | if(selectionManagerModule.selectionManager.isDocument) { | ||
105 | this.editSymbol = documentManagerModule.DocumentManager.activeDocument.documentRoot; | ||
106 | } else { | ||
107 | this.editSymbol = selectionManagerModule.selectionManager._selectedItems[0]._element; | ||
108 | } | ||
109 | |||
110 | } | ||
111 | } | ||
112 | }, | ||
113 | |||
114 | |||
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 | |||
124 | Configure: { | ||
125 | value: function(wasSelected) { | ||
126 | if(wasSelected) { | ||
127 | NJevent("enableStageMove"); | ||
128 | this.application.ninja.stage.stageDeps.snapManager.setupDragPlaneFromPlane( workingPlane ); | ||
129 | } else { | ||
130 | NJevent("disableStageMove"); | ||
131 | } | ||
132 | } | ||
133 | }, | ||
134 | |||
135 | insertElement: { | ||
136 | value: function(data) { | ||
137 | var element; | ||
138 | |||
139 | // TODO Refactor into 1 function | ||
140 | if(data) { | ||
141 | // Get Tag & CSS -- ~~ shortcut for ABS | ||
142 | element = this.makeElement(~~data.width, ~~data.height, data.planeMat, data.midPt, this.makeTag()); | ||
143 | |||
144 | // Insert Element | ||
145 | NJevent("elementAdding", element); | ||
146 | } else { | ||
147 | element = this.makeStaticElement(this.makeTag()); | ||
148 | this._insertStatic(this.editSymbol, element.el, element.style); | ||
149 | } | ||
150 | |||
151 | } | ||
152 | }, | ||
153 | |||
154 | makeTag: { | ||
155 | value: function() { | ||
156 | var selectedTag, newTag; | ||
157 | |||
158 | selectedTag = this.options.selectedElement; | ||
159 | |||
160 | if(selectedTag === "divTool") { | ||
161 | newTag = NJUtils.makeNJElement("div", "Div", "block"); | ||
162 | } else if(selectedTag === "imageTool") { | ||
163 | newTag = NJUtils.makeNJElement("image", "Image", "image"); | ||
164 | } else if(selectedTag === "videoTool") { | ||
165 | newTag = NJUtils.makeNJElement("video", "Video", "video", { | ||
166 | innerHTML: "Your browser does not support the VIDEO element." | ||
167 | }); | ||
168 | } else if(selectedTag === "canvasTool") { | ||
169 | newTag = NJUtils.makeNJElement("canvas", "Canvas", "canvas"); | ||
170 | } else if(selectedTag === "customTool") { | ||
171 | newTag = document.createElement(this.options.customName.value); | ||
172 | newTag.Ninja = {}; | ||
173 | newTag.Ninja.selectionType = this.options.customName.value; | ||
174 | } | ||
175 | /* SWF Tag tool - Not used for now. Will revisit this at a later time. | ||
176 | else if(selectedTag === "flashTool") { | ||
177 | // Generate the swfobject script tag if not found in the user document | ||
178 | // documentControllerModule.DocumentController.SetSWFObjectScript(); | ||
179 | |||
180 | newTag = NJUtils.makeNJElement("object", "Object", "block", { | ||
181 | classId: "clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" | ||
182 | }); | ||
183 | |||
184 | var param = NJUtils.makeNJElement("param", "Object", "block", { | ||
185 | name: "movie", | ||
186 | value: "" | ||
187 | }); | ||
188 | |||
189 | var param2 = NJUtils.makeNJElement("param", "Object","block", { | ||
190 | name: "wmode", | ||
191 | value: "transparent" | ||
192 | }); | ||
193 | |||
194 | var param3 = NJUtils.makeNJElement("param", "Object","block", { | ||
195 | name: "play", | ||
196 | value: "false" | ||
197 | }); | ||
198 | |||
199 | |||
200 | newTag.appendChild(param); | ||
201 | newTag.appendChild(param2); | ||
202 | newTag.appendChild(param3); | ||
203 | // TODO Alternative Content | ||
204 | |||
205 | } | ||
206 | */ | ||
207 | else { | ||
208 | console.log("Invalid Tool is selected."); | ||
209 | } | ||
210 | |||
211 | try { | ||
212 | // newTag.className = this.options.classField.value; | ||
213 | // TODO: Fix this one | ||
214 | |||
215 | } | ||
216 | |||
217 | catch(err) { | ||
218 | console.log("Could not set Tag ID/Class " + err.description); | ||
219 | } | ||
220 | |||
221 | return newTag; | ||
222 | } | ||
223 | }, | ||
224 | |||
225 | makeElement: { | ||
226 | value: function(w, h, planeMat, midPt,tag) { | ||
227 | var styles; | ||
228 | |||
229 | var left = Math.round(midPt[0] - 0.5 * w); | ||
230 | var top = Math.round(midPt[1] - 0.5 * h); | ||
231 | |||
232 | var matStr = DrawingToolBase.getElementMatrix(planeMat, midPt); | ||
233 | |||
234 | styles = { | ||
235 | 'position': 'absolute', | ||
236 | 'top' : top + 'px', | ||
237 | 'left' : left + 'px', | ||
238 | '-webkit-transform-style' : 'preserve-3d', | ||
239 | '-webkit-transform' : matStr | ||
240 | }; | ||
241 | |||
242 | // TODO - for canvas, set both as style and attribute. | ||
243 | // Otherwise, we need to create a separate controller for canvas elements | ||
244 | if(tag.tagName === "CANVAS") { | ||
245 | tag.width = w; | ||
246 | tag.height = h; | ||
247 | } else { | ||
248 | styles['width'] = w + 'px'; | ||
249 | styles['height'] = h + 'px'; | ||