Add initial implementation of keyboard shortcuts to workspace.

frontend/uxbox/core.cljs

@@ -1,9 +1,10 @@
 (ns uxbox.core
   (:require [beicon.core :as rx]
             [uxbox.state :as s]
-            [uxbox.router :as r]
+            [uxbox.router :as rt]
             [uxbox.rstore :as rs]
             [uxbox.ui :as ui]
+            [uxbox.ui.keyboard :as kb]
             [uxbox.data.load :as dl]))
 
 (enable-console-print!)
@@ -11,7 +12,10 @@
 (defonce +setup+
   (do
     (println "bootstrap")
-    (r/init)
+
+    (rt/init)
     (ui/init)
+    (kb/init)
+
     (rs/emit! (dl/load-data))
     (rx/on-value s/stream #(dl/persist-state %))))

frontend/uxbox/ui/keyboard.cljs

@@ -1,8 +1,14 @@
 (ns uxbox.ui.keyboard
-  (:require [goog.events :as events])
+  (:require [goog.events :as events]
-  (:import [goog.events EventType KeyCodes]
+            [beicon.core :as rx])
-           [goog.ui KeyboardShortcutHandler]))
+  (:import goog.events.EventType
+           goog.events.KeyCodes
+           goog.ui.KeyboardShortcutHandler
+           goog.ui.KeyboardShortcutHandler))
 
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; Public Api
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
 
 (defn is-keycode?
   [keycode]
@@ -12,28 +18,32 @@
 (def esc? (is-keycode? 27))
 (def enter? (is-keycode? 13))
 
-;; (def workspace-event-keys
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
-;;   ["DELETE" "ESC" "CTRL+C" "CTRL+V" "CTRL+B" "CTRL+E" "CTRL+L" "SHIFT+Q"
+;; Shortcuts
-;;    "SHIFT+W" "SHIFT+E" "CTRL+SHIFT+I" "CTRL+SHIFT+F" "CTRL+SHIFT+C"
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
-;;    "CTRL+SHIFT+L" "CTRL+G" "CTRL+UP" "CTRL+DOWN" "CTRL+SHIFT+UP"
-;;    "CTRL+SHIFT+DOWN" "SHIFT+I" "SHIFT+0" "SHIFT+O"])
 
-;; ;; Mixins
+(defonce ^:static +shortcuts+
+  #{:ctrl+g
+    :esc
+    :ctrl+shift+f
+    :ctrl+shift+l})
 
-;; (defn keyboard-keypress
+(defonce ^:static +handler+
-;;   "A mixin for capture keyboard events."
+  (KeyboardShortcutHandler. js/document))
-;;   [event-keys]
-;;   (let [handler (KeyboardShortcutHandler. js/document)]
-;;     (doseq [shortcut event-keys]
-;;       (.registerShortcut handler shortcut shortcut))
 
-;;     {:will-mount (fn [state]
+(defonce ^:static ^:private +bus+
-;;                    (events/listen handler
+  (rx/bus))
-;;                                   KeyboardShortcutHandler.EventType.SHORTCUT_TRIGGERED
+
-;;                                   ws/on-workspace-keypress)
+(defonce ^:static +stream+
-;;                    state)
+  (rx/to-observable +bus+))
-;;      :will-unmount (fn [state]
+
-;;                    (events/unlisten js/document
+(defn init
-;;                                     EventType.KEYDOWN
+  "Initialize the shortcuts handler."
-;;                                     ws/on-workspace-keypress)
+  []
-;;                      state)}))
+  (doseq [item +shortcuts+]
+    (let [identifier (name item)]
+      (.registerShortcut +handler+ identifier identifier)))
+  (let [event KeyboardShortcutHandler.EventType.SHORTCUT_TRIGGERED]
+    (events/listen +handler+ event #(rx/push! +bus+ (keyword (.-identifier %))))))
+
+(rx/on-value +stream+ #(println "[debug]: shortcut:" %))

frontend/uxbox/ui/workspace.cljs

@@ -7,6 +7,7 @@
             [uxbox.data.workspace :as dw]
             [uxbox.ui.util :as util]
             [uxbox.ui.mixins :as mx]
+            [uxbox.ui.workspace.keyboard :as wkbd]
             [uxbox.ui.workspace.base :as wb]
             [uxbox.ui.workspace.lateralmenu :refer (lateralmenu)]
             [uxbox.ui.workspace.pagesmngr :refer (pagesmngr)]
@@ -20,7 +21,7 @@
 
 (defn- workspace-render
   [own projectid]
-  (let [workspace (rum/react wb/workspace-state )]
+  (let [workspace (rum/react wb/workspace-state)]
     (html
      [:div
       (header)
@@ -61,5 +62,5 @@
     :will-mount workspace-will-mount
     :transfer-state workspace-transfer-state
     :name "workspace"
-    :mixins [mx/static rum/reactive]}))
+    :mixins [mx/static rum/reactive wkbd/mixin]}))
 

frontend/uxbox/ui/workspace/base.cljs

@@ -31,11 +31,9 @@
     (l/focus-atom $ s/state)))
 
 ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
-;; Streams
+;; Scroll Stream
 ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
 
-;; Scroll
-
 (defonce ^:private scroll-bus (rx/bus))
 (defonce scroll-s (rx/dedupe scroll-bus))
 
@@ -52,7 +50,9 @@
 (defonce top-scroll (rx/to-atom top-scroll-s))
 (defonce left-scroll (rx/to-atom left-scroll-s))
 
-;; Mouse pos
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
+;; Mouse Position Stream
+;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
 
 ;; (defn- coords-delta
 ;;   [[old new]]
@@ -65,11 +65,6 @@
 ;;   delta
 ;;   (s/map coords-delta (s/partition 2 client-position)))
 
-;; DEBUG
-;; (rx/on-value (rx/dedupe scroll-bus)
-;;              (fn [event]
-;;                (println event)))
-
 (defonce mouse-bus (rx/bus))
 (defonce mouse-s (rx/dedupe mouse-bus))
 (defonce mouse-position (rx/to-atom (rx/throttle 50 mouse-s)))

frontend/uxbox/ui/workspace/keyboard.cljs

@@ -0,0 +1,43 @@
+(ns uxbox.ui.workspace.keyboard
+  (:require [beicon.core :as rx]
+            [uxbox.rstore :as rs]
+            [uxbox.ui.keyboard :as kbd]
+            [uxbox.data.workspace :as dw]))
+
+(defmulti -handle-event identity)
+
+(defmethod -handle-event :default
+  [ev]
+  (println "[warn]: shortcut" ev "not implemented"))
+
+(defmethod -handle-event :ctrl+shift+l
+  [_]
+  (rs/emit! (dw/toggle-toolbox :layers)))
+
+(defmethod -handle-event :ctrl+shift+f
+  [_]
+  (rs/emit! (dw/toggle-toolbox :draw)))
+
+(defmethod -handle-event :ctrl+g
+  [_]
+  (rs/emit! (dw/toggle-tool :grid)))
+
+(defn -will-mount
+  [own]
+  (let [sub (rx/on-value kbd/+stream+ #(-handle-event %))]
+    (assoc own ::subscription sub)))
+
+(defn -will-unmount
+  [own]
+  (let [sub (::subscription own)]
+    (sub)
+    (dissoc own ::subscription)))
+
+(defn -transfer-state
+  [old-own own]
+  (assoc own ::subscription (::subscription old-own)))
+
+(def mixin
+  {:will-mount -will-mount
+   :will-unmount -will-unmount
+   :transfer-state -transfer-state})

frontend/uxbox/ui/workspace/pagesmngr.cljs

@@ -5,8 +5,8 @@
             [uxbox.rstore :as rs]
             [uxbox.data.projects :as dp]
             [uxbox.data.workspace :as dw]
-            [uxbox.ui.icons :as i]
             [uxbox.ui.keyboard :as k]
+            [uxbox.ui.icons :as i]
             [uxbox.ui.mixins :as mx]
             [uxbox.ui.workspace.base :as wb]
             [uxbox.ui.dom :as dom]