diff options
author | Pushkar Joshi | 2012-03-23 14:32:46 -0700 |
---|---|---|
committer | Pushkar Joshi | 2012-03-23 14:32:46 -0700 |
commit | 9b7dac9215fbd7c0fe7a80d3e8f1ff378332fec3 (patch) | |
tree | cf0cad815fe98ee8d493cbf42c4d8e13a3e0aaac | |
parent | 92bc54df4acfec849568ab619150a5da49c087fa (diff) | |
download | ninja-9b7dac9215fbd7c0fe7a80d3e8f1ff378332fec3.tar.gz |
Almost working version of brush tool that uses only local coordinates to store the brush stroke points. Current version does not yet update the width and height of the brush stroke canvas upon changing the brush stroke through the PI. Also, current version does not obtain 3D position of points properly from the drawing tool base (see BrushTool _getUnsnappedPosition)
-rwxr-xr-x | js/helper-classes/3D/vec-utils.js | 2 | ||||
-rwxr-xr-x | js/helper-classes/3D/view-utils.js | 13 | ||||
-rwxr-xr-x | js/lib/geom/brush-stroke.js | 460 | ||||
-rwxr-xr-x | js/lib/geom/sub-path.js | 2 | ||||
-rw-r--r-- | js/tools/BrushTool.js | 116 |
5 files changed, 417 insertions, 176 deletions
diff --git a/js/helper-classes/3D/vec-utils.js b/js/helper-classes/3D/vec-utils.js index e6db4a8d..4eacd856 100755 --- a/js/helper-classes/3D/vec-utils.js +++ b/js/helper-classes/3D/vec-utils.js | |||
@@ -259,6 +259,6 @@ var VecUtils = exports.VecUtils = Object.create(Object.prototype, | |||
259 | glmat4.rotate(mat, angle, axis); | 259 | glmat4.rotate(mat, angle, axis); |
260 | return mat; | 260 | return mat; |
261 | } | 261 | } |
262 | }, | 262 | } |
263 | 263 | ||
264 | }); \ No newline at end of file | 264 | }); \ No newline at end of file |
diff --git a/js/helper-classes/3D/view-utils.js b/js/helper-classes/3D/view-utils.js index 5a820fc2..a72b7906 100755 --- a/js/helper-classes/3D/view-utils.js +++ b/js/helper-classes/3D/view-utils.js | |||
@@ -1200,10 +1200,19 @@ exports.ViewUtils = Montage.create(Component, { | |||
1200 | // MISCELLANEOUS | 1200 | // MISCELLANEOUS |
1201 | // event.layerX/Y: var pt = viewUtils.getMousePoint(event); | 1201 | // event.layerX/Y: var pt = viewUtils.getMousePoint(event); |
1202 | 1202 | ||
1203 | getStageDimension: { | ||
1204 | value: function() | ||
1205 | { | ||
1206 | var width = parseInt(this.application.ninja.stage.documentRoot.elementModel.stageDimension.style.getProperty("width")); | ||
1207 | var height= parseInt(this.application.ninja.stage.documentRoot.elementModel.stageDimension.style.getProperty("height")); | ||
1208 | return[width,height]; | ||
1209 | } | ||
1210 | }, | ||
1211 | |||
1203 | getStage: { | 1212 | getStage: { |
1204 | value: function() | 1213 | value: function() |
1205 | { | 1214 | { |
1206 | return snapManagerModule.SnapManager.getStage(); | 1215 | return this.application.ninja.stage.snapManager.getStage(); |
1207 | } | 1216 | } |
1208 | }, | 1217 | }, |
1209 | 1218 | ||
@@ -1303,7 +1312,7 @@ exports.ViewUtils = Montage.create(Component, { | |||
1303 | { | 1312 | { |
1304 | value: function() | 1313 | value: function() |
1305 | { | 1314 | { |
1306 | return this.application.ninjs.stage.canvas; | 1315 | return this.application.ninja.stage.canvas; |
1307 | } | 1316 | } |
1308 | }, | 1317 | }, |
1309 | 1318 | ||
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js index afeaf6e6..a3a5ed9a 100755 --- a/js/lib/geom/brush-stroke.js +++ b/js/lib/geom/brush-stroke.js | |||
@@ -7,6 +7,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
7 | var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; | 7 | var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; |
8 | var GeomObj = require("js/lib/geom/geom-obj").GeomObj; | 8 | var GeomObj = require("js/lib/geom/geom-obj").GeomObj; |
9 | var CanvasController = require("js/controllers/elements/canvas-controller").CanvasController; | 9 | var CanvasController = require("js/controllers/elements/canvas-controller").CanvasController; |
10 | var ViewUtils = require("js/helper-classes/3D/view-utils").ViewUtils; | ||
10 | 11 | ||
11 | // Todo: This entire class should be converted to a module | 12 | // Todo: This entire class should be converted to a module |
12 | 13 | ||
@@ -19,14 +20,15 @@ var BrushStroke = function GLBrushStroke() { | |||
19 | /////////////////////////////////////////////////// | 20 | /////////////////////////////////////////////////// |
20 | // Instance variables | 21 | // Instance variables |
21 | /////////////////////////////////////////////////// | 22 | /////////////////////////////////////////////////// |
22 | this._Points = []; | 23 | this._Points = []; //current state of points in stage-world space (may be different from input) |
23 | this._OrigPoints = []; | 24 | this._OrigPoints = []; //copy of input points without any smoothing |
25 | this._LocalPoints = []; //_Points in local coordinates...do this before rendering the points in the canvas | ||
26 | this._stageWorldCenter = [0,0,0]; //coordinate for the canvas midPoint: a 3D vector in stage world space | ||
24 | this._BBoxMin = [0, 0, 0]; | 27 | this._BBoxMin = [0, 0, 0]; |
25 | this._BBoxMax = [0, 0, 0]; | 28 | this._BBoxMax = [0, 0, 0]; |
26 | this._dirty = true; | 29 | this._isDirty = true; |
27 | this._isInit = false; | 30 | this._isInit = false; |
28 | this._addedSamples = false; | 31 | |
29 | this._storedOrigPoints = false; | ||
30 | 32 | ||
31 | //whether or not to use the canvas drawing to stroke/fill | 33 | //whether or not to use the canvas drawing to stroke/fill |
32 | this._useCanvasDrawing = true; | 34 | this._useCanvasDrawing = true; |
@@ -57,7 +59,7 @@ var BrushStroke = function GLBrushStroke() { | |||
57 | this._MIN_SAMPLE_DISTANCE_THRESHOLD = 2; | 59 | this._MIN_SAMPLE_DISTANCE_THRESHOLD = 2; |
58 | 60 | ||
59 | //prevent extremely long paths that can take a long time to render | 61 | //prevent extremely long paths that can take a long time to render |
60 | this._MAX_ALLOWED_SAMPLES = 500; | 62 | this._MAX_ALLOWED_SAMPLES = 5000; |
61 | 63 | ||
62 | //drawing context | 64 | //drawing context |
63 | this._world = null; | 65 | this._world = null; |
@@ -67,6 +69,7 @@ var BrushStroke = function GLBrushStroke() { | |||
67 | this._planeMat = null; | 69 | this._planeMat = null; |
68 | this._planeMatInv = null; | 70 | this._planeMatInv = null; |
69 | this._planeCenter = null; | 71 | this._planeCenter = null; |
72 | this._dragPlane = null; | ||
70 | 73 | ||
71 | ///////////////////////////////////////////////////////// | 74 | ///////////////////////////////////////////////////////// |
72 | // Property Accessors/Setters | 75 | // Property Accessors/Setters |
@@ -107,6 +110,10 @@ var BrushStroke = function GLBrushStroke() { | |||
107 | this._planeCenter = pc; | 110 | this._planeCenter = pc; |
108 | }; | 111 | }; |
109 | 112 | ||
113 | this.setDragPlane = function(p){ | ||
114 | this._dragPlane = p; | ||
115 | }; | ||
116 | |||
110 | this.getCanvasX = function(){ | 117 | this.getCanvasX = function(){ |
111 | return this._canvasX; | 118 | return this._canvasX; |
112 | }; | 119 | }; |
@@ -141,25 +148,32 @@ var BrushStroke = function GLBrushStroke() { | |||
141 | var diffPtMag = Math.sqrt(diffPt[0]*diffPt[0] + diffPt[1]*diffPt[1]); | 148 | var diffPtMag = Math.sqrt(diffPt[0]*diffPt[0] + diffPt[1]*diffPt[1]); |
142 | if (diffPtMag>threshold){ | 149 | if (diffPtMag>threshold){ |
143 | this._Points.push(pt); | 150 | this._Points.push(pt); |
144 | this._dirty=true; | 151 | this._isDirty=true; |
152 | this._isInit = false; | ||
145 | } | 153 | } |
146 | } else { | 154 | } else { |
147 | this._Points.push(pt); | 155 | this._Points.push(pt); |
148 | this._dirty=true; | 156 | this._isDirty=true; |
157 | this._isInit = false; | ||
149 | } | 158 | } |
150 | }; | 159 | }; |
151 | 160 | ||
152 | this.insertPoint = function(pt, index){ | 161 | this.insertPoint = function(pt, index){ |
153 | this._Points.splice(index, 0, pt); | 162 | this._Points.splice(index, 0, pt); |
154 | this._dirty=true; | 163 | this._isDirty=true; |
164 | this._isInit = false; | ||
155 | }; | 165 | }; |
156 | 166 | ||
157 | this.isDirty = function(){ | 167 | this.isDirty = function(){ |
158 | return this._dirty; | 168 | return this._isDirty; |
159 | }; | 169 | }; |
160 | 170 | ||
161 | this.makeDirty = function(){ | 171 | this.makeDirty = function(){ |
162 | this._dirty=true; | 172 | this._isDirty=true; |
173 | }; | ||
174 | |||
175 | this.getStageWorldCenter = function() { | ||
176 | return this._stageWorldCenter; | ||
163 | }; | 177 | }; |
164 | 178 | ||
165 | this.getBBoxMin = function () { | 179 | this.getBBoxMin = function () { |
@@ -176,7 +190,7 @@ var BrushStroke = function GLBrushStroke() { | |||
176 | 190 | ||
177 | this.setStrokeWidth = function (w) { | 191 | this.setStrokeWidth = function (w) { |
178 | this._strokeWidth = w; | 192 | this._strokeWidth = w; |
179 | this._dirty=true; | 193 | this._isDirty=true; |
180 | }; | 194 | }; |
181 | 195 | ||
182 | this.getStrokeMaterial = function () { | 196 | this.getStrokeMaterial = function () { |
@@ -184,7 +198,7 @@ var BrushStroke = function GLBrushStroke() { | |||
184 | }; | 198 | }; |
185 | 199 | ||
186 | this.setStrokeMaterial = function (m) { | 200 | this.setStrokeMaterial = function (m) { |
187 | this._strokeMaterial = m; this._dirty = true; | 201 | this._strokeMaterial = m; this._isDirty = true; |
188 | }; | 202 | }; |
189 | 203 | ||
190 | this.getStrokeColor = function () { | 204 | this.getStrokeColor = function () { |
@@ -192,17 +206,17 @@ var BrushStroke = function GLBrushStroke() { | |||
192 | }; | 206 | }; |
193 | 207 | ||
194 | this.setStrokeColor = function (c) { | 208 | this.setStrokeColor = function (c) { |
195 | this._strokeColor = c; this._dirty = true; | 209 | this._strokeColor = c; this._isDirty = true; |
196 | }; | 210 | }; |
197 | 211 | ||
198 | this.setSecondStrokeColor = function(c){ | 212 | this.setSecondStrokeColor = function(c){ |
199 | this._secondStrokeColor=c; this._dirty = true; | 213 | this._secondStrokeColor=c; this._isDirty = true; |
200 | } | 214 | } |
201 | 215 | ||
202 | this.setStrokeHardness = function(h){ | 216 | this.setStrokeHardness = function(h){ |
203 | if (this._strokeHardness!==h){ | 217 | if (this._strokeHardness!==h){ |
204 | this._strokeHardness=h; | 218 | this._strokeHardness=h; |
205 | this._dirty = true; | 219 | this._isDirty = true; |
206 | } | 220 | } |
207 | } | 221 | } |
208 | this.getStrokeHardness = function(){ | 222 | this.getStrokeHardness = function(){ |
@@ -212,7 +226,7 @@ var BrushStroke = function GLBrushStroke() { | |||
212 | this.setDoSmoothing = function(s){ | 226 | this.setDoSmoothing = function(s){ |
213 | if (this._strokeDoSmoothing!==s) { | 227 | if (this._strokeDoSmoothing!==s) { |
214 | this._strokeDoSmoothing = s; | 228 | this._strokeDoSmoothing = s; |
215 | this._dirty = true; | 229 | this._isDirty = true; |
216 | } | 230 | } |
217 | } | 231 | } |
218 | 232 | ||
@@ -223,7 +237,7 @@ var BrushStroke = function GLBrushStroke() { | |||
223 | this.setSmoothingAmount = function(a){ | 237 | this.setSmoothingAmount = function(a){ |
224 | if (this._strokeAmountSmoothing!==a) { | 238 | if (this._strokeAmountSmoothing!==a) { |
225 | this._strokeAmountSmoothing = a; | 239 | this._strokeAmountSmoothing = a; |
226 |