From 248faf9e6648b25615205a890fd017dd0bc719ac Mon Sep 17 00:00:00 2001 From: mike-thompson-day8 Date: Thu, 5 Mar 2015 00:02:05 +1100 Subject: [PATCH] todomvc --- examples/todomvc/src/todomvc/core.cljs | 5 +-- examples/todomvc/src/todomvc/db.cljs | 6 ++- examples/todomvc/src/todomvc/handlers.cljs | 22 ++++++----- examples/todomvc/src/todomvc/subs.cljs | 44 ++++++++++++++++++---- examples/todomvc/src/todomvc/views.cljs | 11 ++++-- 5 files changed, 64 insertions(+), 24 deletions(-) diff --git a/examples/todomvc/src/todomvc/core.cljs b/examples/todomvc/src/todomvc/core.cljs index c6aee38..15fb01d 100644 --- a/examples/todomvc/src/todomvc/core.cljs +++ b/examples/todomvc/src/todomvc/core.cljs @@ -7,10 +7,7 @@ ;; TODOs ;; Get preoject.cljs up to speed `lein run` lein debug` -;; split into files view, handlers, subs, middleware -;; load todos off localstorage via merge ... and write back -;; Add Prismatic schema - modules called state -;; add middleware to save to local storage +;; load todos off localstorage via merge ... and write back via middleware (enable-console-print!) diff --git a/examples/todomvc/src/todomvc/db.cljs b/examples/todomvc/src/todomvc/db.cljs index e59e1d4..1edde92 100644 --- a/examples/todomvc/src/todomvc/db.cljs +++ b/examples/todomvc/src/todomvc/db.cljs @@ -16,12 +16,16 @@ (def schema {:todos (s/both (s/pred map?) (s/pred sorted?)) :showing (s/enum :all :done :active) + :blah (s/enum :all :done :active) ;; add this bogus schema item in, then watch the console }) (defn valid-schema? [db] - (s/validate schema db)) + (let [res (s/check schema db)] + (if (some? res) + (.error js/console res)) + db)) ;; so it can be used in middleare ;; -- Default Value ---------------------------------------------------------- diff --git a/examples/todomvc/src/todomvc/handlers.cljs b/examples/todomvc/src/todomvc/handlers.cljs index 821ace7..ee9e34a 100644 --- a/examples/todomvc/src/todomvc/handlers.cljs +++ b/examples/todomvc/src/todomvc/handlers.cljs @@ -1,14 +1,17 @@ (ns todomvc.handlers - (:require [re-frame.core :refer [register-pure-handler - path - trim-v - debug]])) + (:require + [todomvc.db :refer [default-value valid-schema?]] + [re-frame.core :refer [register-pure-handler + path after + trim-v + debug validate]])) ;; -- Middleware -------------------------------------------------------------- ;; To be used for handlers operating solely on todos ;; -(def todo-middleware [(path [:todos]) debug trim-v]) +(def check-schema (after valid-schema?)) +(def todo-middleware [check-schema (path [:todos]) debug trim-v]) ;; -- Helpers ----------------------------------------------------------------- @@ -22,15 +25,16 @@ ;; -- Handlers ---------------------------------------------------------------- -(register-pure-handler ;; disptached to on program startup +(register-pure-handler ;; disptached to on app startup :initialise-db ;; event id being handled + check-schema ;; middleware (fn [_ _] ;; the handler - default-initial-state)) ;; all hail the new state + default-value)) ;; all hail the new state -(register-pure-handler ;; disptached to when +(register-pure-handler ;; disptached to when user changes the bottom filter :set-showing ;; event-id - [debug trim-v] ;; middleware (wraps the handler) + [check-schema debug trim-v] ;; middleware (wraps the handler) (fn ;; handler [db [filter-kw]] (assoc db :showing filter-kw))) diff --git a/examples/todomvc/src/todomvc/subs.cljs b/examples/todomvc/src/todomvc/subs.cljs index edcdc56..c3bb5c5 100644 --- a/examples/todomvc/src/todomvc/subs.cljs +++ b/examples/todomvc/src/todomvc/subs.cljs @@ -1,7 +1,6 @@ (ns todomvc.subs - (:require-macros [reagent.ratom :refer [reaction]]) - (:require [re-frame.core :refer [register-sub - subscribe ]])) + (:require-macros [reagent.ratom :refer [reaction]]) ;; remove for v0.2.0-alpha2 + (:require [re-frame.core :refer [register-sub]])) ;; -- Helpers ----------------------------------------------------------------- @@ -16,34 +15,54 @@ (defn completed-count - "return the count of todos where :done is true" + "return the count of todos for which :done is true" [todos] (count (filter :done (vals todos)))) -;; -- Subscriptions ----------------------------------------------------------- +;; -- Subscription handlers and registration --------------------------------- (register-sub ;; has app-db been initialised yet? :initialised? ;; usage: (subscribe [:initialised?]) (fn [db _] (reaction (not (empty? @db))))) +;; in v0.2.0-alpha2 will be +#_(register-sub ;; has app-db been initialised yet? + :initialised? ;; usage: (subscribe [:initialised?]) + (complement empty? deref)) + (register-sub :visible-todos (fn [db _] (reaction (let [filter-fn (filter-fn-for (:showing @db)) - todos (:todos @db)] + todos (vals (:todos @db))] (filter filter-fn todos))))) +;; in v0.2.0-alpha2 will be +#_(register-sub + :visible-todos + [(from [:showing]) (from [:todos])] + (fn [showing todos] + (filter (filter-fn-for @showing) @todos))) + + (register-sub :completed-count (fn [db _] (reaction (completed-count (:todos @db))))) +;; in v0.2.0-alpha2 will be +#_(register-sub + :completed-count + (fn [db _] + (completed-count (:todos @db)))) + + (register-sub :footer-stats (fn @@ -52,6 +71,17 @@ (let [todos (:todos @db) completed-count (completed-count todos) active-count (- (count todos) completed-count) - showing (:showing db)] + showing (:showing @db)] [active-count completed-count showing])))) ;; tuple + +;; in v0.2.0-alpha2 will be +#_(register-sub + :footer-stats + [(from [:showing]) (from [:todos])] + (fn + [showing todos _] + (let [completed-count (completed-count @todos) + active-count (- (count @todos) completed-count)] + [active-count completed-count @showing]))) ;; tuple + diff --git a/examples/todomvc/src/todomvc/views.cljs b/examples/todomvc/src/todomvc/views.cljs index 38f9350..af75334 100644 --- a/examples/todomvc/src/todomvc/views.cljs +++ b/examples/todomvc/src/todomvc/views.cljs @@ -3,6 +3,11 @@ [re-frame.core :refer [subscribe dispatch]])) +;; -- Reagent Components ------------------------------------------------------ +;; +;; The 'V' part of the app +;; + (defn todo-input [{:keys [title on-save on-stop]}] (let [val (atom title) stop #(do (reset! val "") @@ -32,7 +37,6 @@ props-for (fn [filter-kw] {:class (if (= filter-kw filter) "selected") :on-click #(dispatch [:set-showing filter-kw])})] - (println active done filter) [:footer#footer [:div [:span#todo-count @@ -53,7 +57,8 @@ [:li {:class (str (if done "completed ") (if @editing "editing"))} [:div.view - [:input.toggle {:type "checkbox" :checked done + [:input.toggle {:type "checkbox" + :checked done :on-change #(dispatch [:toggle-done id])}] [:label {:on-double-click #(reset! editing true)} title] [:button.destroy {:on-click #(dispatch [:delete-todo id])}]] @@ -81,7 +86,7 @@ [:h1 "todos"] [todo-input {:id "new-todo" :placeholder "What needs to be done?" - :on-save #(dispatch [:add-todo %])}]] + :on-save #(dispatch [:add-todo %1])}]] (when-not (empty? @visible-todos) [:div [:section#main