moved example to re-frame 0.1.7

examples/simple/project.clj

@@ -1,9 +1,9 @@
 
-(defproject simple-reagent "0.5.0-alpha3"
+(defproject simple-re-frame "0.5.0-alpha3"
   :dependencies [[org.clojure/clojure "1.6.0"]
                  [org.clojure/clojurescript "0.0-2816"]
                  [reagent "0.5.0-alpha3"]
-                 [re-frame "0.1.5"]
+                 [re-frame "0.1.7"]
                  [figwheel "0.2.3-SNAPSHOT"]]
 
   :plugins [[lein-cljsbuild "1.0.4"]

examples/simple/src/simpleexample/core.cljs

@@ -1,52 +1,54 @@
 (ns simpleexample.core
   (:require-macros [reagent.ratom :refer [reaction]])  
   (:require [reagent.core :as reagent :refer [atom]]
-            [re-frame.handlers :as handlers]
-            [re-frame.subs :as subs]
-            [re-frame.handlers :refer [dispatch]]))
+            [re-frame.core :refer [register-handler 
+                                   register-pure-handler
+                                   pure
+                                   register-subs 
+                                   dispatch 
+                                   subscribe]]))
 
 (defonce timer (atom (js/Date.)))
 
 (defonce time-updater (js/setInterval
                         #(dispatch [:timer (js/Date.)]) 1000))
 
-;;; re-frame stuff
-;;; add an initialize handler
-;;; this will set the initial state
+;;; this is the initial state
 (defonce initial-state
   {:timer (js/Date.)
    :time-color "#f34"})
 
-(handlers/register
+;; Handlers
+;-------------------------------------------------------------
+
+;; This handler sets the initial state
+(register-pure-handler
+  ;; register-pure-handler is a convience macro that will be used 90% of the 
+  ;; time  
+  ;; the handler is passed a map (not an atom) and must return the new state
+  ;; of the db
   :initialize
   (fn 
     [db _]
-    (swap! db merge initial-state)))
+    (merge db initial-state)))
 
-;; add subscriptions to :timer and :time-color
-(subs/register
-  :timer
-  (fn 
-    [db _]
-    ;; you need to wrap your subscription code in a reaction
-    (reaction (:timer @db))))
-
-(subs/register
-  :time-color
-  (fn 
-    [db _]
-    ;; you need to wrap your subscription code in a reaction
-    (reaction (:time-color @db))))
-
-(handlers/register
+;; This handler changes the color of the displayed time
+(register-handler
+  ;;; register-handler can take 3 arguments to allow you to insert middleware
+  ;;; see https://github.com/Day8/re-frame/wiki/Handler-Middleware
   :time-color
+  pure
   (fn
     ;; the first item in the second argument is :time-color the second is the 
     ;; new value
     [db [_ value]]
-    (swap! db assoc :time-color value)))
+    (assoc db :time-color value)))
 
-(handlers/register
+;; This handler changes the value of the time
+(register-handler
+  ;; This is a non-pure handler (NOT RECCOMENDED), no middleware is called
+  ;; and the app-db is passed directly as a atom.
+  ;; Note, there is no reason why this particular handler should not be pure
   :timer
   (fn
     ;; the first item in the second argument is :timer the second is the 
@@ -54,6 +56,21 @@
     [db [_ value]]
     (swap! db assoc :timer value)))
 
+;; add subscriptions to :timer and :time-color
+(register-subs
+  :timer
+  (fn 
+    [db _]
+    ;; you need to wrap your subscription code in a reaction
+    (reaction (:timer @db))))
+
+(register-subs
+  :time-color
+  (fn 
+    [db _]
+    ;; you need to wrap your subscription code in a reaction
+    (reaction (:time-color @db))))
+
 (dispatch [:initialize])
 
 
@@ -61,8 +78,8 @@
   [:h1 message])
 
 (defn clock []
-  (let [time-color (subs/subscribe [:time-color])
-        timer (subs/subscribe [:timer])]
+  (let [time-color (subscribe [:time-color])
+        timer (subscribe [:timer])]
     ;;; wrap your component in a function to use the suscription
     (fn [] 
       ;; note that the initialize call will not be dispatched immediately
@@ -74,7 +91,7 @@
            time-str])))))
 
 (defn color-input []
-  (let [time-color (subs/subscribe [:time-color])]
+  (let [time-color (subscribe [:time-color])]
     ;;; wrap your component in a function to use the suscription
     (fn []
       [:div.color-input