aboutsummaryrefslogtreecommitdiff
path: root/js/helper-classes/RDGE/GLRectangle.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/helper-classes/RDGE/GLRectangle.js')
-rw-r--r--js/helper-classes/RDGE/GLRectangle.js377
1 files changed, 228 insertions, 149 deletions
diff --git a/js/helper-classes/RDGE/GLRectangle.js b/js/helper-classes/RDGE/GLRectangle.js
index 1334d7e6..4216fe53 100644
--- a/js/helper-classes/RDGE/GLRectangle.js
+++ b/js/helper-classes/RDGE/GLRectangle.js
@@ -33,14 +33,6 @@ function GLRectangle()
33 33
34 this._strokeWidth = 0.25; 34 this._strokeWidth = 0.25;
35 35
36 // stroke and fill colors
37 this._strokeColor;
38 this._fillColor;
39
40 // stroke and fill materials
41 this._fillMaterial;
42 this._strokeMaterial;
43
44 this._strokeStyle = "Solid"; 36 this._strokeStyle = "Solid";
45 this.init = function(world, xOffset, yOffset, width, height, strokeSize, strokeColor, fillColor, 37 this.init = function(world, xOffset, yOffset, width, height, strokeSize, strokeColor, fillColor,
46 tlRadius, trRadius, blRadius, brRadius, strokeMaterial, fillMaterial, strokeStyle) 38 tlRadius, trRadius, blRadius, brRadius, strokeMaterial, fillMaterial, strokeStyle)
@@ -80,13 +72,14 @@ function GLRectangle()
80 this._materialSpecular = [0.4, 0.4, 0.4, 1.0]; 72 this._materialSpecular = [0.4, 0.4, 0.4, 1.0];
81 73
82 if(strokeMaterial) 74 if(strokeMaterial)
83 {
84 this._strokeMaterial = strokeMaterial; 75 this._strokeMaterial = strokeMaterial;
85 } 76 else
77 this._strokeMaterial = new FlatMaterial();
78
86 if(fillMaterial) 79 if(fillMaterial)
87 {
88 this._fillMaterial = fillMaterial; 80 this._fillMaterial = fillMaterial;
89 } 81 else
82 this._fillMaterial = new FlatMaterial();
90 } 83 }
91 84
92 /////////////////////////////////////////////////////////////////////// 85 ///////////////////////////////////////////////////////////////////////
@@ -185,9 +178,9 @@ function GLRectangle()
185 this._strokeWidth = Number( this.getPropertyFromString( "strokeWidth: ", importStr ) ); 178 this._strokeWidth = Number( this.getPropertyFromString( "strokeWidth: ", importStr ) );
186 this._innerRadius = Number( this.getPropertyFromString( "innerRadius: ", importStr ) ); 179 this._innerRadius = Number( this.getPropertyFromString( "innerRadius: ", importStr ) );
187 this._strokeStyle = Number( this.getPropertyFromString( "strokeStyle: ", importStr ) ); 180 this._strokeStyle = Number( this.getPropertyFromString( "strokeStyle: ", importStr ) );
188 var strokeMaterialName = Number( this.getPropertyFromString( "strokeMat: ", importStr ) ); 181 var strokeMaterialName = this.getPropertyFromString( "strokeMat: ", importStr );
189 var fillMaterialName = Number( this.getPropertyFromString( "fillMat: ", importStr ) ); 182 var fillMaterialName = this.getPropertyFromString( "fillMat: ", importStr );
190 this._strokeStyle = Number( this.getPropertyFromString( "strokeColor: ", importStr ) ); 183 this._strokeStyle = this.getPropertyFromString( "strokeStyle: ", importStr );
191 this._fillColor = eval( "[" + this.getPropertyFromString( "fillColor: ", importStr ) + "]" ); 184 this._fillColor = eval( "[" + this.getPropertyFromString( "fillColor: ", importStr ) + "]" );
192 this._strokeColor = eval( "[" + this.getPropertyFromString( "strokeColor: ", importStr ) + "]" ); 185 this._strokeColor = eval( "[" + this.getPropertyFromString( "strokeColor: ", importStr ) + "]" );
193 this._tlRadius = Number( this.getPropertyFromString( "tlRadius: ", importStr ) ); 186 this._tlRadius = Number( this.getPropertyFromString( "tlRadius: ", importStr ) );
@@ -217,8 +210,11 @@ function GLRectangle()
217 // get the world 210 // get the world
218 var world = this.getWorld(); 211 var world = this.getWorld();
219 if (!world) throw( "null world in buildBuffers" ); 212 if (!world) throw( "null world in buildBuffers" );
220 213 //console.log( "GLRectangle.buildBuffers " + world._worldCount );
221 if (!world._useWebGL) return; 214 if (!world._useWebGL) return;
215
216 // make sure RDGE has the correct context
217 g_Engine.setContext( world.getCanvas().uuid );
222 218
223 // create the gl buffer 219 // create the gl buffer
224 var gl = world.getGLContext(); 220 var gl = world.getGLContext();
@@ -279,8 +275,8 @@ function GLRectangle()
279 275
280 // stroke 276 // stroke
281 var strokeMaterial = this.makeStrokeMaterial(); 277 var strokeMaterial = this.makeStrokeMaterial();
282 prim = this.createStroke([x,y], 2*xFill, 2*yFill, strokeSize, tlRadius, blRadius, brRadius, trRadius, strokeMaterial) 278 var strokePrim = this.createStroke([x,y], 2*xFill, 2*yFill, strokeSize, tlRadius, blRadius, brRadius, trRadius, strokeMaterial);
283 this._primArray.push( prim ); 279 this._primArray.push( strokePrim );
284 this._materialNodeArray.push( strokeMaterial.getMaterialNode() ); 280 this._materialNodeArray.push( strokeMaterial.getMaterialNode() );
285 281
286 // fill 282 // fill
@@ -291,60 +287,14 @@ function GLRectangle()
291 xFill -= strokeSize; 287 xFill -= strokeSize;
292 yFill -= strokeSize; 288 yFill -= strokeSize;
293 var fillMaterial = this.makeFillMaterial(); 289 var fillMaterial = this.makeFillMaterial();
294 prim = this.createFill([x,y], 2*xFill, 2*yFill, tlRadius, blRadius, brRadius, trRadius, fillMaterial) 290 //console.log( "fillMaterial: " + fillMaterial.getName() );
295 this._primArray.push( prim ); 291 var fillPrim = this.createFill([x,y], 2*xFill, 2*yFill, tlRadius, blRadius, brRadius, trRadius, fillMaterial);
292 this._primArray.push( fillPrim );
296 this._materialNodeArray.push( fillMaterial.getMaterialNode() ); 293 this._materialNodeArray.push( fillMaterial.getMaterialNode() );
297 294
298 world.updateObject(this); 295 world.updateObject(this);
299 } 296 }
300 297
301 this.makeStrokeMaterial = function()
302 {
303 var strokeMaterial;
304 if (this.getStrokeMaterial())
305 strokeMaterial = this.getStrokeMaterial().dup();
306 else
307 strokeMaterial = new FlatMaterial();
308
309 if (strokeMaterial)
310 {
311 strokeMaterial.init( this.getWorld() );
312 if(this._strokeColor)
313 {
314 strokeMaterial.setProperty("color", this._strokeColor);
315 }
316 }
317
318 this._materialArray.push( strokeMaterial );
319 this._materialTypeArray.push( "stroke" );
320
321 return strokeMaterial;
322 }
323
324 this.makeFillMaterial = function()
325 {
326 var fillMaterial;
327 if (this.getFillMaterial())
328 fillMaterial = this.getFillMaterial().dup();
329 else
330 fillMaterial = new FlatMaterial();
331
332 if (fillMaterial)
333 {
334 fillMaterial.init( this.getWorld() );
335 //if(!this.getFillMaterial() && this._fillColor)
336 if (this._fillColor)
337 {
338 fillMaterial.setProperty("color", this._fillColor);
339 }
340 }
341
342 this._materialArray.push( fillMaterial );
343 this._materialTypeArray.push( "fill" );
344
345 return fillMaterial;
346 }
347
348 this.renderQuadraticBezier = function( bPts, ctx ) 298 this.renderQuadraticBezier = function( bPts, ctx )
349 { 299 {
350 if (!bPts) return; 300 if (!bPts) return;
@@ -367,72 +317,71 @@ function GLRectangle()
367 var width = Math.round(this.getWidth()), 317 var width = Math.round(this.getWidth()),
368 height = Math.round(this.getHeight()); 318 height = Math.round(this.getHeight());
369 319
370 // get the top left point
371 pt = [inset, inset]; // top left corner 320 pt = [inset, inset]; // top left corner
372 rad = this.getTLRadius() - inset;
373 if (rad < 0) rad = 0;
374 pt[1] += rad;
375 if (MathUtils.fpSign(rad) == 0) pt[1] = 0;
376 ctx.moveTo( pt[0], pt[1] );
377
378 // get the bottom left point
379 pt = [inset, height - inset];
380 rad = this.getBLRadius() - inset;
381 if (rad < 0) rad = 0;
382 pt[1] -= rad;
383 ctx.lineTo( pt[0], pt[1] );
384
385 // get the bottom left arc
386 if (MathUtils.fpSign(rad) > 0)
387 {
388 ctr = [ this.getBLRadius(), height - this.getBLRadius() ];
389 //this.renderQuadraticBezier( MathUtils.circularArcToBezier( ctr, pt, -0.5*Math.PI ), ctx );
390 ctx.arc( ctr[0], ctr[1], rad, Math.PI, 0.5*Math.PI, true );
391 }
392
393 // do the bottom of the rectangle
394 pt = [width - inset, height - inset];
395 rad = this.getBRRadius() - inset;
396 if (rad < 0) rad = 0;
397 pt[0] -= rad;
398 ctx.lineTo( pt[0], pt[1] );
399
400 // get the bottom right arc
401 if (MathUtils.fpSign(rad) > 0)
402 {
403 ctr = [width - this.getBRRadius(), height - this.getBRRadius()];
404 //this.renderQuadraticBezier( MathUtils.circularArcToBezier( ctr, pt, -0.5*Math.PI ), ctx );
405 ctx.arc( ctr[0], ctr[1], rad, 0.5*Math.PI, 0.0, true );
406 }
407 321
408 // get the right of the rectangle 322 var tlRad = this._tlRadius; //top-left radius
409 pt = [width - inset, inset]; 323 var trRad = this._trRadius;
410 rad = this.getTRRadius() - inset; 324 var blRad = this._blRadius;
411 if (rad < 0) rad = 0; 325 var brRad = this._brRadius;
412 pt[1] += rad;
413 ctx.lineTo( pt[0], pt[1] );
414 326
415 // do the top right corner 327 if ((tlRad <= 0) && (blRad <= 0) && (brRad <= 0) && (trRad <= 0))
416 if (MathUtils.fpSign(rad) > 0)
417 { 328 {
418 ctr = [width - this.getTRRadius(), this.getTRRadius()]; 329 ctx.rect(pt[0], pt[1], width - 2*inset, height - 2*inset);
419 //this.renderQuadraticBezier( MathUtils.circularArcToBezier( ctr, pt, -0.5*Math.PI ), ctx );
420 ctx.arc( ctr[0], ctr[1], rad, 0.0, -0.5*Math.PI, true );
421 } 330 }
422 331 else
423 // do the top of the rectangle