JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
gitweb / crayon_mockup.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: fc88916)
add keybindings
authorJason Woofenden <jason@jasonwoof.com>
Sun, 24 May 2015 17:49:06 +0000 (13:49 -0400)
committerJason Woofenden <jason@jasonwoof.com>
Sun, 24 May 2015 17:49:06 +0000 (13:49 -0400)
auto.coffee patch | blob | history
index.html patch | blob | history

diff --git a/auto.coffee b/auto.coffee
index c4cd5b4..bfd84af 100644 (file)
--- a/auto.coffee
+++ b/auto.coffee
@@ -46,6 +46,13 @@ mousemove = (x, y) ->
        if selection?
                update_path selection.element, selection.data, to_mouse: true
 
        if selection?
                update_path selection.element, selection.data, to_mouse: true
 
+keydown = (keycode) ->
+       switch keycode
+               when 'O'.charCodeAt 0
+                       return stop_close_drawing()
+               when (' '.charCodeAt 0), 13, 10, 27
+                       return stop_drawing()
+
 # called automatically on domcontentloaded
 init = ->
        $container = $ '.crayon_mockup'
 # called automatically on domcontentloaded
 init = ->
        $container = $ '.crayon_mockup'
@@ -70,5 +77,7 @@ init = ->
        $svg.mousemove (e) ->
                offset = $svg.offset()
                mousemove e.pageX - offset.left, e.pageY - offset.top
        $svg.mousemove (e) ->
                offset = $svg.offset()
                mousemove e.pageX - offset.left, e.pageY - offset.top
+       ($ document).keydown (e) ->
+               return keydown e.keyCode
 
 $ init
 
 $ init
diff --git a/index.html b/index.html
index 1556263..4326c81 100644 (file)
--- a/index.html
+++ b/index.html
@@ -34,6 +34,7 @@
 <body>
        <h1>Crayon Mockup (working title)</h1>
        <p>Instructions: click in multiple different places in the box below to draw.</p>
 <body>
        <h1>Crayon Mockup (working title)</h1>
        <p>Instructions: click in multiple different places in the box below to draw.</p>
+       <p>Tip: press <code>space</code> to stop drawing, or <code>o</code> to stop and close the loop.</p>
        <div class="crayon_mockup"></div>
 </body>
 </html>
        <div class="crayon_mockup"></div>
 </body>
 </html>
crayon_mockup: a web-based widget to sketch out design ideas. Live demo http://crayon_mockup.jasonwoof.com/