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/ShapeTool.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/ShapeTool.js')
-rw-r--r-- | js/tools/ShapeTool.js | 217 |
1 files changed, 217 insertions, 0 deletions
diff --git a/js/tools/ShapeTool.js b/js/tools/ShapeTool.js new file mode 100644 index 00000000..9a4399b4 --- /dev/null +++ b/js/tools/ShapeTool.js | |||
@@ -0,0 +1,217 @@ | |||
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 | viewUtils = require("js/helper-classes/3D/view-utils").ViewUtils, | ||
10 | drawUtils = require("js/helper-classes/3D/draw-utils").DrawUtils, | ||
11 | NJUtils = require("js/lib/NJUtils").NJUtils, | ||
12 | ElementMediator = require("js/mediators/element-mediator").ElementMediator, | ||
13 | ShapesController = require("js/controllers/elements/shapes-controller").ShapesController, | ||
14 | ShapeModel = require("js/models/shape-model").ShapeModel, | ||
15 | TagTool = require("js/tools/TagTool").TagTool; | ||
16 | |||
17 | exports.ShapeTool = Montage.create(DrawingTool, { | ||
18 | drawingFeedback: { value: { mode: "Draw3D", type: "rectangle" } }, | ||
19 | |||
20 | _targetedElement: { value: null, writable: true }, | ||
21 | |||
22 | _mouseDownHitRec: { value: null, writable: true, enumerable: true, configurable: true }, | ||
23 | _mouseUpHitRec: { value: null, writable: true, enumerable: true, configurable: true }, | ||
24 | |||
25 | _canvasCounter: {value: 0, writable: true, enumerable: true, configurable: true }, | ||
26 | |||
27 | HandleLeftButtonDown: | ||
28 | { | ||
29 | value: function (event) | ||
30 | { | ||
31 | if(this._canDraw) { | ||
32 | this._isDrawing = true; | ||
33 | } | ||
34 | |||
35 | this.startDraw(event); | ||
36 | } | ||
37 | }, | ||
38 | |||
39 | HandleMouseMove: | ||
40 | { | ||
41 | value: function (event) | ||
42 | { | ||
43 | |||
44 | /* TAG */ | ||
45 | if(this.isDrawing) { | ||
46 | this.doDraw(event); | ||
47 | } else { | ||
48 | this.doSnap(event); | ||
49 | this._showFeedbackOnMouseMove(event); | ||
50 | } | ||
51 | |||
52 | this.drawLastSnap(); // Required cleanup for both Draw/Feedbacks | ||
53 | |||
54 | } | ||
55 | }, | ||
56 | |||
57 | HandleLeftButtonUp: | ||
58 | { | ||
59 | value: function (event) | ||
60 | { | ||
61 | var drawData; | ||
62 | |||
63 | drawData = this.getDrawingData(); | ||
64 | |||
65 | if(drawData) { | ||
66 | var canvas; | ||
67 | if(!this._useExistingCanvas()) | ||
68 | { | ||
69 | canvas = NJUtils.makeNJElement("canvas", "Canvas", "shape", null, true); | ||
70 | var elementModel = TagTool.makeElement(~~drawData.width, ~~drawData.height, | ||
71 | drawData.planeMat, drawData.midPt, canvas); | ||
72 | |||
73 | ElementMediator.addElement(canvas, elementModel.data, true); | ||
74 | canvas.elementModel.isShape = true; | ||
75 | } | ||
76 | else | ||
77 | { | ||
78 | canvas = this._targetedElement; | ||
79 | canvas.elementModel.controller = ShapesController; | ||
80 | if(!canvas.elementModel.shapeModel) | ||
81 | { | ||
82 | canvas.elementModel.shapeModel = Montage.create(ShapeModel); | ||
83 | } | ||
84 | } | ||
85 | this.RenderShape(drawData.width, drawData.height, drawData.planeMat, drawData.midPt, canvas); | ||
86 | } | ||
87 | |||
88 | this.endDraw(event); | ||
89 | |||
90 | this._isDrawing = false; | ||
91 | this._hasDraw=false; | ||
92 | |||
93 | |||
94 | this.DrawHandles(); | ||
95 | } | ||
96 | }, | ||
97 | |||
98 | Configure: { | ||
99 | value: function(wasSelected) { | ||
100 | if(wasSelected) { | ||
101 | this.AddCustomFeedback(); | ||
102 | } else { | ||
103 | this.RemoveCustomFeedback(); | ||
104 | } | ||
105 | } | ||
106 | }, | ||
107 | |||
108 | AddCustomFeedback: { | ||
109 | value: function (event) { | ||
110 | NJevent("enableStageMove"); | ||
111 | |||
112 | this.application.ninja.stage.stageDeps.snapManager.setupDragPlaneFromPlane( workingPlane ); | ||
113 | } | ||
114 | }, | ||
115 | |||
116 | RemoveCustomFeedback: { | ||
117 | value: function (event) { | ||
118 | if (this._targetedElement) { | ||
119 | this._targetedElement.classList.remove("elem-red-outline"); | ||
120 | this._targetedElement = null; | ||
121 | } | ||
122 | |||
123 | NJevent("disableStageMove"); | ||
124 | |||
125 | this.application.ninja.stage.stageDeps.snapManager.clearDragPlane(); | ||
126 | } | ||
127 | }, | ||
128 | |||
129 | /** Show a border when mousing | ||
130 | * over existing canvas elements to signal to the user that | ||
131 | * the drawing operation will act on the targeted canvas. | ||
132 | **/ | ||
133 | _showFeedbackOnMouseMove: { | ||
134 | value: function (event) { | ||
135 | // TODO - This call is causing the canvas to redraw 3 times per mouse move | ||
136 | var targetedObject = this.application.ninja.stage.GetElement(event); | ||
137 | |||
138 | if (targetedObject) { | ||
139 | // TODO - Clean this up | ||
140 | if((targetedObject.nodeName === "CANVAS") && !ShapesController.isElementAShape(targetedObject)) | ||
141 | { | ||
142 | if (targetedObject !== this._targetedElement) { | ||
143 | if(this._targetedElement) | ||
144 | { | ||
145 | this._targetedElement.classList.remove("elem-red-outline"); | ||
146 | } | ||
147 | this._targetedElement = targetedObject; | ||
148 | this._targetedElement.classList.add("elem-red-outline"); | ||
149 | } | ||
150 | } | ||
151 | else if (this._targetedElement) { | ||
152 | this._targetedElement.classList.remove("elem-red-outline"); | ||
153 | this._targetedElement = null; | ||
154 | } | ||
155 | } | ||
156 | else if (this._targetedElement) { | ||
157 | this._targetedElement.classList.remove("elem-red-outline"); | ||
158 | this._targetedElement = null; | ||
159 | } | ||
160 | } | ||
161 | }, | ||
162 | |||
163 | RenderShape: | ||
164 | { | ||
165 | value: function (w, h, planeMat, midPt) | ||
166 | { | ||
167 | // Override in subclasses | ||
168 | } | ||
169 | }, | ||
170 | |||
171 | getGLWorld: { | ||
172 | value: function (canvas, use3D) | ||
173 | { | ||
174 | var world = ElementMediator.getShapeProperty(canvas, "GLWorld"); | ||
175 | if(!world) | ||
176 | { | ||
177 | // create all the GL stuff | ||
178 | var world = new GLWorld(canvas, use3D); | ||
179 | ElementMediator.setShapeProperty(canvas, "GLWorld", world); | ||
180 | } | ||
181 | |||
182 | return world; | ||
183 | } | ||
184 | }, | ||
185 | |||
186 | createCanvas: { | ||
187 | value: function (left, top, w, h) | ||
188 | { | ||
189 | //var tmpDiv = document.createElement("canvas"); | ||
190 | var tmpDiv = NJUtils.makeNJElement("canvas", "Canvas", "block"); | ||
191 | var rules = { | ||
192 | 'position': 'absolute', | ||
193 | 'top' : top + 'px', | ||
194 | 'left' : left + 'px', | ||
195 | '-webkit-transform-style' : 'preserve-3d', | ||
196 | '-webkit-transform' : 'perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)' | ||
197 | }; | ||
198 | |||
199 | tmpDiv.width = w; | ||
200 | tmpDiv.height = h; | ||
201 | |||
202 | return {el: tmpDiv, rules: rules}; | ||
203 | } | ||
204 | }, | ||
205 | |||
206 | |||
207 | |||
208 | // We can draw on an existing canvas unless it has only a single shape object | ||
209 | _useExistingCanvas: { | ||
210 | value: function() | ||
211 | { | ||
212 | return (this._targetedElement && !ShapesController.isElementAShape(this._targetedElement)); | ||
213 | } | ||
214 | } | ||
215 | |||
216 | }); | ||
217 | |||