diff --git a/app/assets/javascripts/turtle.js b/app/assets/javascripts/turtle.js index ddbb27eb..9d8594f3 100644 --- a/app/assets/javascripts/turtle.js +++ b/app/assets/javascripts/turtle.js @@ -9,6 +9,40 @@ function Turtle(pipe, canvas) { this.canvas = canvas; // jQuery object this.items = []; this.canvas.off('click'); + + let sendEvent = function (x, y) { + pipe.send(JSON.stringify({ + 'cmd': 'canvasevent', + 'type': '', + 'x': x, + 'y': y + })); + pipe.send('\n'); + }; + + $(document).keydown(function(e) { + switch(e.which) { + case 37: // left + sendEvent(150, 170); + break; + + case 38: // up + sendEvent(170, 150); + break; + + case 39: // right + sendEvent(190, 170); + break; + + case 40: // down + sendEvent(170, 190); + break; + + default: return; // exit this handler for other keys + } + e.preventDefault(); // prevent the default action (scroll / move caret) + }); + this.canvas.click(function (e) { if (e.eventPhase !== 2) { return; @@ -27,13 +61,7 @@ function Turtle(pipe, canvas) { xpos = e.offsetX; ypos = e.offsetY; } - pipe.send(JSON.stringify({ - 'cmd': 'canvasevent', - 'type': '', - 'x': xpos - dx, - 'y': ypos - dy - })); - pipe.send('\n'); + sendEvent(xpos - dx, ypos - dy); }); }