diff options
Diffstat (limited to 'js')
-rwxr-xr-x | js/helper-classes/RDGE/GLCircle.js | 140 | ||||
-rwxr-xr-x | js/helper-classes/RDGE/GLGeomObj.js | 4 | ||||
-rwxr-xr-x | js/helper-classes/RDGE/GLLine.js | 67 | ||||
-rwxr-xr-x | js/helper-classes/RDGE/GLRectangle.js | 81 | ||||
-rwxr-xr-x | js/helper-classes/RDGE/GLWorld.js | 2 | ||||
-rwxr-xr-x | js/tools/LineTool.js | 5 | ||||
-rwxr-xr-x | js/tools/PanTool.js | 23 |
7 files changed, 174 insertions, 148 deletions
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(); | ||
509 | } | ||
512 | } | 510 | } |
513 | } | 511 | } |
514 | 512 | ||
diff --git a/js/helper-classes/RDGE/GLGeomObj.js b/js/helper-classes/RDGE/GLGeomObj.js index 5d7497ad..c1ee01ba 100755 --- a/js/helper-classes/RDGE/GLGeomObj.js +++ b/js/helper-classes/RDGE/GLGeomObj.js | |||
@@ -38,8 +38,8 @@ function GLGeomObj() | |||
38 | this.m_world = null; | 38 | this.m_world = null; |
39 | 39 | ||
40 | // stroke and fill colors | 40 | // stroke and fill colors |
41 | this._strokeColor; | 41 | this._strokeColor = [0,0,0,0]; |
42 | this._fillColor; | 42 | this._fillColor = [0,0,0,0]; |
43 | 43 | ||
44 | // stroke and fill materials | 44 | // stroke and fill materials |
45 | this._fillMaterial; | 45 | this._fillMaterial; |