aboutsummaryrefslogtreecommitdiff
path: root/js/lib
diff options
context:
space:
mode:
Diffstat (limited to 'js/lib')
-rwxr-xr-xjs/lib/geom/brush-stroke.js46
-rwxr-xr-xjs/lib/geom/sub-path.js16
2 files changed, 56 insertions, 6 deletions
diff --git a/js/lib/geom/brush-stroke.js b/js/lib/geom/brush-stroke.js
index 0278e49c..02a39ccd 100755
--- a/js/lib/geom/brush-stroke.js
+++ b/js/lib/geom/brush-stroke.js
@@ -4,9 +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
7// Todo: This entire class should be converted to a module
8var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; 7var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils;
9var GeomObj = require("js/lib/geom/geom-obj").GeomObj; 8var GeomObj = require("js/lib/geom/geom-obj").GeomObj;
9var CanvasController = require("js/controllers/elements/canvas-controller").CanvasController;
10
11// Todo: This entire class should be converted to a module
10 12
11/////////////////////////////////////////////////////////////////////// 13///////////////////////////////////////////////////////////////////////
12// Class GLBrushStroke 14// Class GLBrushStroke
@@ -28,7 +30,10 @@ var BrushStroke = function GLBrushStroke() {
28 //whether or not to use the canvas drawing to stroke/fill 30 //whether or not to use the canvas drawing to stroke/fill
29 this._useCanvasDrawing = true; 31 this._useCanvasDrawing = true;
30 32
31 //the X and Y location of this subpath's canvas in stage world space of Ninja 33 //the HTML5 canvas that holds this brush stroke
34 this._canvas = null;
35
36 //the X and Y location of this brush stroke canvas in stage world space of Ninja
32 this._canvasX = 0; 37 this._canvasX = 0;
33 this._canvasY = 0; 38 this._canvasY = 0;
34 39
@@ -65,6 +70,10 @@ var BrushStroke = function GLBrushStroke() {
65 ///////////////////////////////////////////////////////// 70 /////////////////////////////////////////////////////////
66 // Property Accessors/Setters 71 // Property Accessors/Setters
67 ///////////////////////////////////////////////////////// 72 /////////////////////////////////////////////////////////
73 this.setCanvas = function(c) {
74 this._canvas = c;
75 }
76
68 this.setWorld = function (world) { 77 this.setWorld = function (world) {
69 this._world = world; 78 this._world = world;
70 }; 79 };
@@ -195,6 +204,9 @@ var BrushStroke = function GLBrushStroke() {
195 this._dirty = true; 204 this._dirty = true;
196 } 205 }
197 } 206 }
207 this.getStrokeHardness = function(){
208 return this._strokeHardness;
209 }
198 210
199 this.setDoSmoothing = function(s){ 211 this.setDoSmoothing = function(s){
200 if (this._strokeDoSmoothing!==s) { 212 if (this._strokeDoSmoothing!==s) {
@@ -203,12 +215,19 @@ var BrushStroke = function GLBrushStroke() {
203 } 215 }
204 } 216 }
205 217
218 this.getDoSmoothing = function(){
219 return this._strokeDoSmoothing;
220 }
221
206 this.setSmoothingAmount = function(a){ 222 this.setSmoothingAmount = function(a){
207 if (this._strokeAmountSmoothing!==a) { 223 if (this._strokeAmountSmoothing!==a) {
208 this._strokeAmountSmoothing = a; 224 this._strokeAmountSmoothing = a;
209 this._dirty = true; 225 this._dirty = true;
210 } 226 }
227 }
211 228
229 this.getSmoothingAmount = function(){
230 return this._strokeAmountSmoothing;
212 } 231 }
213 232
214 this.setStrokeUseCalligraphic = function(c){ 233 this.setStrokeUseCalligraphic = function(c){
@@ -225,6 +244,14 @@ var BrushStroke = function GLBrushStroke() {
225 }; 244 };
226 } 245 }
227 246
247 this.getStrokeUseCalligraphic = function(){
248 return this._strokeUseCalligraphic;
249 }
250
251 this.getStrokeAngle = function(){
252 this._strokeAngle = a;
253 }
254
228 this.getStrokeStyle = function () { 255 this.getStrokeStyle = function () {
229 return this._strokeStyle; 256 return this._strokeStyle;
230 }; 257 };
@@ -301,12 +328,13 @@ var BrushStroke = function GLBrushStroke() {
301 console.log("Inserted "+numInsertedPoints+" additional CatmullRom points"); 328 console.log("Inserted "+numInsertedPoints+" additional CatmullRom points");
302 this._addedSamples = true; 329 this._addedSamples = true;
303 this._dirty=true; 330 this._dirty=true;
304 } 331 } //if we need to add samples to this curve (done only once)
332
305 //build a copy of the original points...this should be done only once 333 //build a copy of the original points...this should be done only once
306 if (this._storedOrigPoints === false) { 334 if (this._storedOrigPoints === false) {
307 this._OrigPoints = this._Points.slice(0); 335 this._OrigPoints = this._Points.slice(0);
308 this._storedOrigPoints = true; 336 this._storedOrigPoints = true;
309 } 337 } //if we need to store a copy of the original points (done only once)
310 338
311 if (this._dirty) { 339 if (this._dirty) {
312 this._Points = this._OrigPoints.slice(0); 340 this._Points = this._OrigPoints.slice(0);
@@ -377,7 +405,7 @@ var BrushStroke = function GLBrushStroke() {
377 405
378 // get the context 406 // get the context
379 var ctx = world.get2DContext(); 407 var ctx = world.get2DContext();
380 if (!ctx) throw ("null context in brushstroke render") 408 if (!ctx) throw ("null context in brushstroke render");
381 409
382 var numPoints = this.getNumPoints(); 410 var numPoints = this.getNumPoints();
383 if (numPoints === 0) { 411 if (numPoints === 0) {
@@ -391,6 +419,14 @@ var BrushStroke = function GLBrushStroke() {
391 var bboxMax = this.getBBoxMax(); 419 var bboxMax = this.getBBoxMax();
392 var bboxWidth = bboxMax[0] - bboxMin[0]; 420 var bboxWidth = bboxMax[0] - bboxMin[0];
393 var bboxHeight = bboxMax[1] - bboxMin[1]; 421 var bboxHeight = bboxMax[1] - bboxMin[1];
422
423 //assign the new width and height as the canvas dimensions through the canvas controller
424 if (this._canvas) {
425 CanvasController.setProperty(this._canvas, "width", bboxWidth+"px");
426 CanvasController.setProperty(this._canvas, "height", bboxHeight+"px");
427 this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas);
428 }
429
394 ctx.clearRect(0, 0, bboxWidth, bboxHeight); 430 ctx.clearRect(0, 0, bboxWidth, bboxHeight);
395 431
396 if (this._strokeUseCalligraphic) { 432 if (this._strokeUseCalligraphic) {
diff --git a/js/lib/geom/sub-path.js b/js/lib/geom/sub-path.js
index 017cca92..e95be0e7 100755
--- a/js/lib/geom/sub-path.js
+++ b/js/lib/geom/sub-path.js
@@ -6,7 +6,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
6 6
7 7
8var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils; 8var VecUtils = require("js/helper-classes/3D/vec-utils").VecUtils;
9 9var CanvasController = require("js/controllers/elements/canvas-controller").CanvasController;
10var GeomObj = require("js/lib/geom/geom-obj").GeomObj; 10var GeomObj = require("js/lib/geom/geom-obj").GeomObj;
11var AnchorPoint = require("js/lib/geom/anchor-point").AnchorPoint; 11var AnchorPoint = require("js/lib/geom/anchor-point").AnchorPoint;
12var MaterialsModel = require("js/models/materials-model").MaterialsModel; 12var MaterialsModel = require("js/models/materials-model").MaterialsModel;
@@ -61,6 +61,9 @@ var GLSubpath = function GLSubpath() {
61 //whether or not to use the canvas drawing to stroke/fill 61 //whether or not to use the canvas drawing to stroke/fill
62 this._useCanvasDrawing = true; 62 this._useCanvasDrawing = true;
63 63
64 //the canvas that will draw this subpath
65 this._canvas = null;
66
64 //the X and Y location of this subpath's canvas in stage world space of Ninja 67 //the X and Y location of this subpath's canvas in stage world space of Ninja
65 this._canvasX = 0; 68 this._canvasX = 0;
66 this._canvasY = 0; 69 this._canvasY = 0;
@@ -131,6 +134,11 @@ var GLSubpath = function GLSubpath() {
131 var bboxHeight = bboxMax[1] - bboxMin[1]; 134 var bboxHeight = bboxMax[1] - bboxMin[1];
132 var bboxMid = [0.5 * (bboxMax[0] + bboxMin[0]), 0.5 * (bboxMax[1] + bboxMin[1]), 0.5 * (bboxMax[2] + bboxMin[2])]; 135 var bboxMid = [0.5 * (bboxMax[0] + bboxMin[0]), 0.5 * (bboxMax[1] + bboxMin[1]), 0.5 * (bboxMax[2] + bboxMin[2])];
133 136
137 if (this._canvas) {
138 CanvasController.setProperty(this._canvas, "width", bboxWidth+"px");
139 CanvasController.setProperty(this._canvas, "height", bboxHeight+"px");
140 this._canvas.elementModel.shapeModel.GLWorld.setViewportFromCanvas(this._canvas);
141 }
134 ctx.clearRect(0, 0, bboxWidth, bboxHeight); 142 ctx.clearRect(0, 0, bboxWidth, bboxHeight);
135 143
136 ctx.lineWidth = this._strokeWidth; 144 ctx.lineWidth = this._strokeWidth;
@@ -144,6 +152,7 @@ var GLSubpath = function GLSubpath() {
144 //ctx.fillStyle = MathUtils.colorToHex( this._fillColor ); 152 //ctx.fillStyle = MathUtils.colorToHex( this._fillColor );
145 var fillColorStr = "rgba("+parseInt(255*this._fillColor[0])+","+parseInt(255*this._fillColor[1])+","+parseInt(255*this._fillColor[2])+","+this._fillColor[3]+")"; 153 var fillColorStr = "rgba("+parseInt(255*this._fillColor[0])+","+parseInt(255*this._fillColor[1])+","+parseInt(255*this._fillColor[2])+","+this._fillColor[3]+")";
146 ctx.fillStyle = fillColorStr; 154 ctx.fillStyle = fillColorStr;
155 console.log("Fill color:" + fillColorStr);
147 } 156 }
148 var lineCap = ['butt','round','square']; 157 var lineCap = ['butt','round','square'];
149 ctx.lineCap = lineCap[1]; 158 ctx.lineCap = lineCap[1];
@@ -256,6 +265,10 @@ GLSubpath.prototype = new GeomObj();
256///////////////////////////////////////////////////////// 265/////////////////////////////////////////////////////////
257// Property Accessors/Setters 266// Property Accessors/Setters
258///////////////////////////////////////////////////////// 267/////////////////////////////////////////////////////////
268GLSubpath.prototype.setCanvas = function (c) {
269 this._canvas = c;
270};
271
259GLSubpath.prototype.setWorld = function (world) { 272GLSubpath.prototype.setWorld = function (world) {
260 this._world = world; 273 this._world = world;
261}; 274};
@@ -773,6 +786,7 @@ GLSubpath.prototype.getStrokeWidth = function () {
773 786
774GLSubpath.prototype.setStrokeWidth = function (w) { 787GLSubpath.prototype.setStrokeWidth = function (w) {
775 this._strokeWidth = w; 788 this._strokeWidth = w;
789 this._dirty=true;
776}; 790};
777 791
778GLSubpath.prototype.getStrokeMaterial = function () { 792GLSubpath.prototype.getStrokeMaterial = function () {