|
|
@@ -1,111 +1,10 @@
|
|
|
(ns microtables-frontend.views
|
|
|
(:require
|
|
|
- [microtables-frontend.events :as events]
|
|
|
[microtables-frontend.subs :as subs]
|
|
|
- [microtables-frontend.utils :as utils]
|
|
|
+ [microtables-frontend.views.control-panel :refer [control-panel]]
|
|
|
+ [microtables-frontend.views.sheet :refer [sheet]]
|
|
|
[re-frame.core :as re-frame]))
|
|
|
|
|
|
-;; TABLE COMPONENTS
|
|
|
-
|
|
|
-(defn cell [c r data]
|
|
|
- (let [datum (get-in data [c r])]
|
|
|
- ^{:key (str c r)} [:td
|
|
|
- [:input {:id (str c r)
|
|
|
- :class (if (= (:view datum) :highlighted) "highlighted" "")
|
|
|
- :value (if (= (get datum :view nil) :value)
|
|
|
- (get datum :value "")
|
|
|
- (get datum :error (get datum :display (get datum :value ""))));TODO: add "highlight" display mode (possibly just a css class)
|
|
|
- :on-change #(re-frame/dispatch [::events/edit-cell-value c r (.. % -target -value)])
|
|
|
- :on-focus #(re-frame/dispatch [::events/movement-enter-cell c r])
|
|
|
- :on-blur #(re-frame/dispatch [::events/movement-leave-cell c r])
|
|
|
- :on-keyPress #(when (= (.. % -which) 13)
|
|
|
- (re-frame/dispatch [::events/press-enter-in-cell c r]))}]]))
|
|
|
-
|
|
|
-(defn row [r cols data]
|
|
|
- ^{:key (str "row-" r)} [:tr
|
|
|
- (cons
|
|
|
- ^{:key (str "row-head-" r)} [:th (str r)]
|
|
|
- (map #(cell % r data) cols))])
|
|
|
-
|
|
|
-(defn header-row [cols]
|
|
|
- ^{:key "header"} [:tr
|
|
|
- (cons
|
|
|
- ^{:key "corner"} [:th]
|
|
|
- (map (fn [c] ^{:key (str "col-head-" c)} [:th c]) cols))])
|
|
|
-
|
|
|
-(defn sheet [data]
|
|
|
- [:table
|
|
|
- {:id "main-table"}
|
|
|
- [:tbody
|
|
|
- ;TODO: figure out appropriate starting values for maxrow and maxcol (maybe keep them intentionally small)
|
|
|
- ;TODO: figure out movement (maybe allow scroll overflow)
|
|
|
- (let [maxrow 50;(utils/highest-row data)
|
|
|
- maxcol "Z";(utils/highest-col data)
|
|
|
- cols (take-while (partial not= (utils/next-letter maxcol)) utils/col-letters)]
|
|
|
- (cons
|
|
|
- (header-row cols)
|
|
|
- (map #(row % cols data) (range 1 (inc maxrow)))))]])
|
|
|
-
|
|
|
-(defn extend-range
|
|
|
- []
|
|
|
- [:div {:class "control-group"}
|
|
|
- [:div {:class "control-label"}
|
|
|
- "Extend Range"]
|
|
|
- [:button "-cols"]
|
|
|
- [:input]
|
|
|
- [:button]])
|
|
|
-
|
|
|
-(defn controls []
|
|
|
- [:div
|
|
|
- ;[extend-range]
|
|
|
- ;extend range (number field, then shrink/left/up and expand/right/down buttons on either side)
|
|
|
- ;fill range (single tap, single column/row fill? number field and button?)
|
|
|
- ;move range (designate new "top-left corner" cell for range, figure out overwriting destination cells)
|
|
|
- ;empty range (delete contents, re-evaluate)
|
|
|
- ;delete range (figure out how to move cells over)
|
|
|
- ;copy range (figure out clipboard)
|
|
|
- [:div
|
|
|
- {:class "control-group"}
|
|
|
- #_[:a ;TODO: consider making the "About" info an overlay rather than a link
|
|
|
- {:href "/about.html"
|
|
|
- :target "_blank"}
|
|
|
- "About"]
|
|
|
- "This is a demo version only, and still in development. Nothing gets saved for the moment."
|
|
|
- [:br]
|
|
|
- "Try adding values (plain numbers) or formulae (ex: \"=B2 + sum(A1:A6)\") into the cells."
|
|
|
- [:br]
|
|
|
- "Created by "
|
|
|
- [:a
|
|
|
- {:href "https://betweentwocommits.com/about"
|
|
|
- :target "_blank"}
|
|
|
- "Brandon Wong"]]])
|
|
|
-
|
|
|
-(defn control-panel [state]
|
|
|
- [:div
|
|
|
- {:id "controls"}
|
|
|
- [:div
|
|
|
- ;TODO: link left controls with position of the whole table
|
|
|
- {:id "controls-left"
|
|
|
- :class (if (= state :left) "open" "")}
|
|
|
- [controls]]
|
|
|
- [:div
|
|
|
- {:id "controls-bottom"
|
|
|
- :class (if (= state :bottom) "open" "")}
|
|
|
- [controls]]
|
|
|
- ;←↑→↓
|
|
|
- [:div
|
|
|
- {:id "left-controls-button"
|
|
|
- :on-click #(re-frame/dispatch [::events/set-controls-state (if (= state :left) nil :left)])}
|
|
|
- (if (= state :left) "←" "→")]
|
|
|
- [:div
|
|
|
- {:id "bottom-controls-button"
|
|
|
- :on-click #(re-frame/dispatch [::events/set-controls-state (if (= state :bottom) nil :bottom)])}
|
|
|
- (if (= state :bottom) "↓" "↑")]
|
|
|
- [:div
|
|
|
- {:id "main-logo"
|
|
|
- :title "Microtables"}
|
|
|
- [:img {:src "logo.svg"}]]])
|
|
|
-
|
|
|
(defn main-panel []
|
|
|
(let [data (re-frame/subscribe [::subs/table-data])
|
|
|
controls-state (re-frame/subscribe [::subs/controls-state])]
|
Brandon Wong