aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rwxr-xr-xjs/document/html-document.js2
-rwxr-xr-xjs/helper-classes/RDGE/GLCircle.js140
-rwxr-xr-xjs/helper-classes/RDGE/GLGeomObj.js4
-rwxr-xr-xjs/helper-classes/RDGE/GLLine.js67
-rwxr-xr-xjs/helper-classes/RDGE/GLRectangle.js89
-rwxr-xr-xjs/helper-classes/RDGE/GLWorld.js7
-rw-r--r--js/helper-classes/RDGE/runtime/CanvasDataManager.js10
-rw-r--r--js/helper-classes/RDGE/runtime/GLRuntime.js87
-rwxr-xr-xjs/tools/LineTool.js5
-rwxr-xr-xjs/tools/PanTool.js23
10 files changed, 244 insertions, 190 deletions
<
diff --git a/js/document/html-document.js b/js/document/html-document.js
index 76436732..7dd28385 100755
--- a/js/document/html-document.js
+++ b/js/document/html-document.js
@@ -185,7 +185,7 @@ exports.HTMLDocument = Montage.create(TextDocument, {
185 var elt = this.documentRoot; 185 var elt = this.documentRoot;
186 if (elt) 186 if (elt)
187 { 187 {
188 console.log( "load canvas data: " , value ); 188 //console.log( "load canvas data: " , value );
189 var cdm = new CanvasDataManager(); 189 var cdm = new CanvasDataManager();
190 cdm.loadGLData(elt, value); 190 cdm.loadGLData(elt, value);
191 } 191 }
diff --git a/js/helper-classes/RDGE/GLCircle.js b/js/helper-classes/RDGE/GLCircle.js
index 712544c0..15ed6b6d 100755
--- a/js/helper-classes/RDGE/GLCircle.js
+++ b/js/helper-classes/RDGE/GLCircle.js
@@ -47,8 +47,8 @@ function GLCircle()
47 47
48 this._strokeWidth = strokeSize; 48 this._strokeWidth = strokeSize;
49 this._innerRadius = innerRadius; 49 this._innerRadius = innerRadius;
50 this._strokeColor = strokeColor; 50 if (strokeColor) this._strokeColor = strokeColor;
51 this._fillColor = fillColor; 51 if (fillColor) this._fillColor = fillColor;
52 52
53 this._strokeStyle = strokeStyle; 53 this._strokeStyle = strokeStyle;
54 } 54 }
@@ -398,59 +398,58 @@ function GLCircle()
398 // set up the fill style 398 // set up the fill style
399 ctx.beginPath(); 399 ctx.beginPath();
400 ctx.lineWidth = 0; 400 ctx.lineWidth = 0;
401 ctx.fillStyle = "#990000";
402 if (this._fillColor) 401 if (this._fillColor)
403 { 402 {
404 var c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")"; 403 var c = "rgba(" + 255*this._fillColor[0] + "," + 255*this._fillColor[1] + "," + 255*this._fillColor[2] + "," + this._fillColor[3] + ")";
405 ctx.fillStyle = c; 404 ctx.fillStyle = c;
406 }
407 405
408 // draw the fill 406 // draw the fill
409 ctx.beginPath(); 407 ctx.beginPath();
410 var p = MathUtils.transformPoint( bezPts[0], mat ); 408 var p = MathUtils.transformPoint( bezPts[0], mat );
411 ctx.moveTo( p[0], p[1] ); 409 ctx.moveTo( p[0], p[1] );
412 var index = 1; 410 var index = 1;
413 while (index < n) 411 while (index < n)
414 { 412 {
415 p0 = MathUtils.transformPoint( bezPts[index], mat ); 413 p0 = MathUtils.transformPoint( bezPts[index], mat );
416 p1 = MathUtils.transformPoint( bezPts[index+1], mat ); 414 p1 = MathUtils.transformPoint( bezPts[index+1], mat );
417 415
418 x0 = p0[0]; y0 = p0[1]; 416 x0 = p0[0]; y0 = p0[1];
419 x1 = p1[0]; y1 = p1[1]; 417 x1 = p1[0]; y1 = p1[1];
420 ctx.quadraticCurveTo( x0, y0, x1, y1 ); 418 ctx.quadraticCurveTo( x0, y0, x1, y1 );
421 index += 2; 419 index += 2;
422 } 420 }
423 421
424 if ( MathUtils.fpSign(innerRad) > 0) 422 if ( MathUtils.fpSign(innerRad) > 0)
425 {
426 xScale = 0.5*innerRad*this._width;
427 yScale = 0.5*innerRad*this._height;
428 mat[0] = xScale;
429 mat[5] = yScale;
430
431 // get the bezier points
432 var bezPts = MathUtils.circularArcToBezier( Vector.create([0,0,0]), Vector.create([1,0,0]), -2.0*Math.PI );
433 if (bezPts)
434 { 423 {
435 var n = bezPts.length; 424 xScale = 0.5*innerRad*this._width;
436 p = MathUtils.transformPoint( bezPts[0], mat ); 425 yScale = 0.5*innerRad*this._height;
437 ctx.moveTo( p[0], p[1] ); 426 mat[0] = xScale;
438 index = 1; 427 mat[5] = yScale;
439 while (index < n) 428
429 // get the bezier points
430 var bezPts = MathUtils.circularArcToBezier( Vector.create([0,0,0]), Vector.create([1,0,0]), -2.0*Math.PI );
431 if (bezPts)
440 { 432 {
441 p0 = MathUtils.transformPoint( bezPts[index], mat ); 433 var n = bezPts.length;
442 p1 = MathUtils.transformPoint( bezPts[index+1], mat ); 434 p = MathUtils.transformPoint( bezPts[0], mat );
443 435 ctx.moveTo( p[0], p[1] );
444 var x0 = p0[0], y0 = p0[1], 436 index = 1;
445 x1 = p1[0], y1 = p1[1]; 437 while (index < n)
446 ctx.quadraticCurveTo( x0, y0, x1, y1 ); 438 {
447 index += 2; 439 p0 = MathUtils.transformPoint( bezPts[index], mat );
440 p1 = MathUtils.transformPoint( bezPts[index+1], mat );
441
442 var x0 = p0[0], y0 = p0[1],
443 x1 = p1[0], y1 = p1[1];
444 ctx.quadraticCurveTo( x0, y0, x1, y1 );
445 index += 2;
446 }
448 } 447 }
449 } 448 }
450 }
451 449
452 // fill the path 450 // fill the path
453 ctx.fill(); 451 ctx.fill();
452 }
454 453
455 // calculate the stroke matrix 454 // calculate the stroke matrix
456 xScale = 0.5*this._width - 0.5*lineWidth; 455 xScale = 0.5*this._width - 0.5*lineWidth;
@@ -461,35 +460,10 @@ function GLCircle()
461 // set up the stroke style 460 // set up the stroke style
462 ctx.beginPath(); 461 ctx.beginPath();
463 ctx.lineWidth = lineWidth; 462 ctx.lineWidth = lineWidth;
464 ctx.strokeStyle = "#0000ff";
465 if (this._strokeColor) 463 if (this._strokeColor)
466 { 464 {
467 var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")"; 465 var c = "rgba(" + 255*this._strokeColor[0] + "," + 255*this._strokeColor[1] + "," + 255*this._strokeColor[2] + "," + this._strokeColor[3] + ")";
468 ctx.strokeStyle = c; 466 ctx.strokeStyle = c;
469 }
470
471 // draw the stroke
472 p = MathUtils.transformPoint( bezPts[0], mat );
473 ctx.moveTo( p[0], p[1] );
474 index = 1;
475 while (index < n)
476 {
477 var p0 = MathUtils.transformPoint( bezPts[index], mat );
478 var p1 = MathUtils.transformPoint( bezPts[index+1], mat );
479
480 var x0 = p0[0], y0 = p0[1],
481 x1 = p1[0], y1 = p1[1];
482 ctx.quadraticCurveTo( x0, y0, x1, y1 );
483 index += 2;
484 }
485
486 if (MathUtils.fpSign(innerRad) > 0)
487 {
488 // calculate the stroke matrix
489 xScale = 0.5*innerRad*this._width - 0.5*lineWidth;
490 yScale = 0.5*innerRad*this._height - 0.5*lineWidth;
491 mat[0] = xScale;
492 mat[5] = yScale;
493 467
494 // draw the stroke 468 // draw the stroke
495 p = MathUtils.transformPoint( bezPts[0], mat ); 469 p = MathUtils.transformPoint( bezPts[0], mat );
@@ -505,10 +479,34 @@ function GLCircle()
505 ctx.quadraticCurveTo( x0, y0, x1, y1 ); 479 ctx.quadraticCurveTo( x0, y0, x1, y1 );
506 index += 2; 480 index += 2;
507 } 481 }
508 }
509 482
510 // render the stroke 483 if (MathUtils.fpSign(innerRad) > 0)
511 ctx.stroke(); 484 {
485 // calculate the stroke matrix
486 xScale = 0.5*innerRad*this._width - 0.5*lineWidth;
487 yScale = 0.5*innerRad*this._height - 0.5*lineWidth;
488 mat[0] = xScale;
489 mat[5] = yScale;
490
491 // draw the stroke
492 p = MathUtils.transformPoint( bezPts[0], mat );
493 ctx.moveTo( p[0], p[1] );
494 index = 1;
495 while (index < n)
496 {
497 var p0 = MathUtils.transformPoint( bezPts[index], mat );
498 var p1 = MathUtils.transformPoint( bezPts[index+1], mat );
499
500 var x0 = p0[0], y0 = p0[1],
501 x1 = p1[0], y1 = p1[1];
502 ctx.quadraticCurveTo( x0, y0, x1, y1 );
503 index += 2;
504 }
505 }
506
507 // render the stroke
508 ctx.stroke();