(ns app
  (:require
   [reagent.core :as r]
   [reagent.dom :as rdom]
   [data :as data]
   [cheatsheet :as cheatsheet]
   [companion :as companion]))

(defonce state
  (r/atom {:view :cheatsheet
           :search ""
           :selected-category nil
           :categories data/categories
           :companion {:running? false
                       :interval 10000
                       :current-item nil
                       :filter-categories #{}}}))

(defn header [state]
  (let [view @(r/cursor state [:view])]
    [:header.app-header
     [:h1 "Bits of Tidal"]
     [:nav.view-toggle
      [:button {:class (when (= view :cheatsheet) "selected")
                :on-click #(swap! state assoc :view :cheatsheet)}
       "Cheatsheet"]
      [:button {:class (when (= view :companion) "selected")
                :on-click #(do
                             (companion/stop-timer! state)
                             (swap! state assoc :view :companion))}
       "Practice"]]]))

(defn app []
  (let [view @(r/cursor state [:view])]
    [:div.app
     [header state]
     (case view
       :cheatsheet [cheatsheet/cheatsheet-view state]
       :companion [companion/companion-view state])]))

;; Keyboard shortcuts
(defn handle-keydown [e]
  (let [key (.-key e)
        view @(r/cursor state [:view])]
    (when (= view :companion)
      (case key
        " " (do (.preventDefault e) (companion/toggle-timer! state))
        "n" (companion/next-item! state)
        nil))))

(.addEventListener js/document "keydown" handle-keydown)

;; Mount app
(rdom/render [app] (.getElementById js/document "app"))