From d14b375d532c9d24b9deb4eb297644590b7b03c0 Mon Sep 17 00:00:00 2001 From: Devine Lu Linvega Date: Sat, 31 Dec 2016 11:16:00 -0700 Subject: [PATCH] Fixed issue with arcs --- index.html | 11 +++++++---- links/main.css | 3 ++- scripts/dotgrid.js | 27 ++------------------------- scripts/keyboard.js | 7 +++---- 4 files changed, 14 insertions(+), 34 deletions(-) diff --git a/index.html b/index.html index 533b1db..3b2c66e 100644 --- a/index.html +++ b/index.html @@ -9,10 +9,13 @@ Dotgrid - - - - + 
+      aA ARC CLOCKWISE
+      sS ARC COUNTERWISE
+      d  LINE
+      f  CLEAR
+      g  DELETE LAST
+
diff --git a/links/main.css b/links/main.css index 8772ba9..ae9ae1c 100644 --- a/links/main.css +++ b/links/main.css @@ -6,4 +6,5 @@ body { background:#fff; padding:50px;} #dotgrid #cursor_from { width:6px; height:6px; background:black; margin-top:-3px; margin-left:-3px; position:absolute; z-index:25; border-radius:10px;} #dotgrid #cursor_to { width:6px; height:6px; background:black; margin-top:-3px; margin-left:-3px; position:absolute; z-index:25; border-radius:10px;} input { padding:2px 5px; border-radius:20px; margin:0px auto; display:none;} -.vector { position:relative; z-index:900; } \ No newline at end of file +.vector { position:relative; z-index:900; } +pre { font-family:courier; font-size:11px; position:fixed; left:20px; bottom:20px;} \ No newline at end of file diff --git a/scripts/dotgrid.js b/scripts/dotgrid.js index 5269a28..19d530a 100644 --- a/scripts/dotgrid.js +++ b/scripts/dotgrid.js @@ -130,33 +130,10 @@ function Dotgrid(width,height,grid_x,grid_y) reset(); } - this.draw_arc_c = function() - { - draw_arc_c(); - } - - draw_arc_c = function() + this.draw_arc = function(orientation) { var s = document.createElementNS("http://www.w3.org/2000/svg", "path"); - s.setAttribute("d","M"+(-from[0])+","+(from[1])+" A15,15 0 0,1 "+(-to[0])+","+(to[1])+""); - s.setAttribute('stroke', "#000000"); - s.setAttribute('stroke-width', "5"); - s.setAttribute('fill', "none"); - s.setAttribute('stroke-linecap', "round"); - vector_element.appendChild(s); - - reset(); - } - - this.draw_arc_a = function() - { - draw_arc_a(); - } - - function draw_arc_a() - { - var s = document.createElementNS("http://www.w3.org/2000/svg", "path"); - s.setAttribute("d","M"+(-from[0])+","+(from[1])+" A15,15 0 1,0 "+(-to[0])+","+(to[1])+""); + s.setAttribute("d","M"+(-from[0])+","+(from[1])+" A15,15 0 "+orientation+" "+(-to[0])+","+(to[1])+""); s.setAttribute('stroke', "#000000"); s.setAttribute('stroke-width', "5"); s.setAttribute('fill', "none"); diff --git a/scripts/keyboard.js b/scripts/keyboard.js index ffb4ce9..decd424 100644 --- a/scripts/keyboard.js +++ b/scripts/keyboard.js @@ -2,11 +2,10 @@ function Keyboard() { this.listen = function(event) { - console.log(event.keyCode); - + console.log(event); switch (event.keyCode) { - case 65 : dotgrid.draw_arc_a(); break; - case 83 : dotgrid.draw_arc_c(); break; + case 65 : dotgrid.draw_arc(event.shiftKey ? "1,1" : "0,1"); break; + case 83 : dotgrid.draw_arc(event.shiftKey ? "1,0" : "0,0"); break; case 68 : dotgrid.draw_line(); break; case 70 : dotgrid.reset(); break; case 71 : dotgrid.erase(); break;