diff options
Diffstat (limited to 'js/stage')
-rw-r--r-- | js/stage/layout.js | 53 |
1 files changed, 4 insertions, 49 deletions
diff --git a/js/stage/layout.js b/js/stage/layout.js index 89fa44f3..dd5be081 100644 --- a/js/stage/layout.js +++ b/js/stage/layout.js | |||
@@ -290,8 +290,9 @@ exports.Layout = Montage.create(Component, { | |||
290 | } | 290 | } |
291 | }, | 291 | }, |
292 | 292 | ||
293 | // Alternate dashed line method. | 293 | // Dashed line function found at http://stackoverflow.com/questions/4576724/dotted-stroke-in-canvas/ |
294 | ___dashedLine: { | 294 | // Portions used with permission of Gavin Kistner (phrogz) |
295 | _dashedLine: { | ||
295 | value: function(x, y, x2, y2, dashArray) { | 296 | value: function(x, y, x2, y2, dashArray) { |
296 | this.ctx.lineCap = "square"; | 297 | this.ctx.lineCap = "square"; |
297 | this.ctx.beginPath(); | 298 | this.ctx.beginPath(); |
@@ -311,7 +312,7 @@ exports.Layout = Montage.create(Component, { | |||
311 | var step = Math.sqrt(dashLength * dashLength / (1 + slope * slope)); | 312 | var step = Math.sqrt(dashLength * dashLength / (1 + slope * slope)); |
312 | if(xSlope){ | 313 | if(xSlope){ |
313 | if(dx < 0) step = -step; | 314 | if(dx < 0) step = -step; |
314 | x += step | 315 | x += step; |
315 | y += slope * step; | 316 | y += slope * step; |
316 | }else{ | 317 | }else{ |
317 | if(dy < 0) step = -step; | 318 | if(dy < 0) step = -step; |
@@ -329,52 +330,6 @@ exports.Layout = Montage.create(Component, { | |||
329 | } | 330 | } |
330 | }, | 331 | }, |
331 | 332 | ||
332 | _dashedLine: { | ||
333 | value: function (fromX, fromY, toX, toY, pattern){ | ||
334 | this.ctx.beginPath(); | ||
335 | // Our growth rate for our line can be one of the following: | ||
336 | // (+,+), (+,-), (-,+), (-,-) | ||
337 | // Because of this, our algorithm needs to understand if the x-coord and | ||
338 | // y-coord should be getting smaller or larger and properly cap the values | ||
339 | // based on (x,y). | ||
340 | var lt = function (a, b) { return a <= b; }; | ||
341 | var gt = function (a, b) { return a >= b; }; | ||
342 | var capmin = function (a, b) { return Math.min(a, b); }; | ||
343 | var capmax = function (a, b) { return Math.max(a, b); }; | ||
344 | |||
345 | var checkX = { thereYet: gt, cap: capmin }; | ||
346 | var checkY = { thereYet: gt, cap: capmin }; | ||
347 | |||
348 | if (fromY - toY > 0) { | ||
349 | checkY.thereYet = lt; | ||
350 | checkY.cap = capmax; | ||
351 | } | ||
352 | if (fromX - toX > 0) { | ||
353 | checkX.thereYet = lt; | ||
354 | checkX.cap = capmax; | ||
355 | } | ||
356 | |||
357 | this.ctx.moveTo(fromX, fromY); | ||
358 | var offsetX = fromX; | ||
359 | var offsetY = fromY; | ||
360 | var idx = 0, dash = true; | ||
361 | while (!(checkX.thereYet(offsetX, toX) && checkY.thereYet(offsetY, toY))) { | ||
362 | var ang = Math.atan2(toY - fromY, toX - fromX); | ||
363 | var len = pattern[idx]; | ||
364 | |||
365 | offsetX = checkX.cap(toX, offsetX + (Math.cos(ang) * len)); | ||
366 | offsetY = checkY.cap(toY, offsetY + (Math.sin(ang) * len)); | ||
367 | |||
368 | if (dash) this.ctx.lineTo(offsetX, offsetY); | ||
369 | else this.ctx.moveTo(offsetX, offsetY); | ||
370 | |||
371 | idx = (idx + 1) % pattern.length; | ||
372 | dash = !dash; | ||
373 | } | ||
374 | this.ctx.stroke(); | ||
375 | } | ||
376 | }, | ||
377 | |||
378 | _elementName: { | 333 | _elementName: { |
379 | value: function(item) { | 334 | value: function(item) { |
380 | return this.application.ninja.elementMediator.getNJProperty(item, "selection"); | 335 | return this.application.ninja.elementMediator.getNJProperty(item, "selection"); |