From 429ed50fabe619e8b88a494a3199e5cb1b15118a Mon Sep 17 00:00:00 2001 From: Dan Holmsand Date: Tue, 1 Apr 2014 19:50:28 +0200 Subject: [PATCH] Make demo code more Light Table-friendly --- demo/demo.cljs | 13 +++++++------ demo/reagentdemo/common.cljs | 4 ++-- demo/reagentdemo/intro.cljs | 17 +++++++++-------- demo/reagentdemo/news.cljs | 1 + demo/reagentdemo/news/anyargs.cljs | 16 ++++++++-------- demo/reagentdemo/news/async.cljs | 11 ++++++----- demo/reagentdemo/news/clockpost.cljs | 11 ++++++----- demo/reagentdemo/news/undodemo.cljs | 9 +++++---- demo/reagentdemo/page.cljs | 1 + src/reagent/interop.clj | 4 ++-- test/runtests.cljs | 2 +- 11 files changed, 48 insertions(+), 41 deletions(-) diff --git a/demo/demo.cljs b/demo/demo.cljs index 7d1fb95..4e5f765 100644 --- a/demo/demo.cljs +++ b/demo/demo.cljs @@ -1,5 +1,6 @@ (ns demo (:require [reagent.core :as reagent :refer [atom]] + [reagent.interop :refer-macros [.' .! fvar]] [clojure.string :as string] [reagentdemo.page :as page :refer [page-map page link prefix]] [reagentdemo.common :as common :refer [demo-component]] @@ -8,8 +9,8 @@ [reagent.debug :refer-macros [dbg println]])) (swap! page-map assoc - "index.html" intro/main - "news/index.html" news/main) + "index.html" (fvar intro/main) + "news/index.html" (fvar news/main)) (def github {:href "https://github.com/holmsand/reagent"}) @@ -24,11 +25,11 @@ [:div [:div.nav [:ul.nav - [:li.brand [link {:href intro/main} "Reagent:"]] - [:li [link {:href intro/main} "Intro"]] - [:li [link {:href news/main} "News"]] + [:li.brand [link {:href (fvar intro/main)} "Reagent:"]] + [:li [link {:href (fvar intro/main)} "Intro"]] + [:li [link {:href (fvar news/main)} "News"]] [:li [:a github "GitHub"]]]] - (let [comp (get @page-map @page intro/main)] + (let [comp (get @page-map @page (fvar intro/main))] [comp]) [github-badge]]) diff --git a/demo/reagentdemo/common.cljs b/demo/reagentdemo/common.cljs index 77f2cd2..86246bf 100644 --- a/demo/reagentdemo/common.cljs +++ b/demo/reagentdemo/common.cljs @@ -34,9 +34,9 @@ (defn src-for [funmap defs] [:pre (-> funmap (src-for-names defs) syntaxify)]) -(defn demo-component [{:keys [comp src complete no-heading]}] +(defn demo-component [] (let [showing (atom true)] - (fn [] + (fn [{:keys [comp src complete no-heading]}] [:div (when comp [:div.demo-example.clearfix diff --git a/demo/reagentdemo/intro.cljs b/demo/reagentdemo/intro.cljs index aa19561..f0d78f6 100644 --- a/demo/reagentdemo/intro.cljs +++ b/demo/reagentdemo/intro.cljs @@ -1,6 +1,7 @@ (ns reagentdemo.intro (:require [reagent.core :as reagent :refer [atom]] + [reagent.interop :refer-macros [.' .! fvar]] [reagent.debug :refer-macros [dbg println]] [clojure.string :as string] [reagentdemo.syntax :refer-macros [get-source]] @@ -10,7 +11,7 @@ (defn simple-component [] [:div [:p "I am a component!"] - [:p.someclass + [:p.someclass "I have " [:strong "bold"] [:span {:style {:color "red"}} " and red "] "text."]]) @@ -104,8 +105,8 @@ [:span {:style {:color color}} diagnose] [slider :bmi bmi 10 50]]])) -(def funmap (-> "reagentdemo/intro.cljs" get-source common/fun-map)) -(def src-for (partial common/src-for funmap)) +(defonce funmap (-> "reagentdemo/intro.cljs" get-source common/fun-map)) +(defonce src-for (partial common/src-for funmap)) (defn intro [] (let [github {:href "https://github.com/holmsand/reagent"} @@ -189,10 +190,10 @@ [:p "Here is an example of that, where we call " [:code "setTimeout"] " every time the component is rendered to update a counter:"] - + [demo-component {:comp timer-component :src (src-for [:timer-component])}] - + [:p "The previous example also uses another feature of Reagent: a component function can return another function, that is used to do the actual rendering. This function is called with the same @@ -275,7 +276,7 @@ (defn bmi-demo [] [:div.demo-text [:h2 "Putting it all together"] - + [:p "Here is a slightly less contrived example: a simple BMI calculator."] @@ -293,7 +294,7 @@ [:p "Reagent comes with a couple of complete examples, with Leiningen project files and everything. Here’s one of them in action:"] - + [demo-component {:comp simpleexample/simple-example :complete true :src (-> "simpleexample.cljs" @@ -307,7 +308,7 @@ [:p "The obligatory todo list looks roughly like this in Reagent (cheating a little bit by skipping routing and persistence):"] - + [demo-component {:comp todomvc/todo-app :complete true :src (-> "todomvc.cljs" diff --git a/demo/reagentdemo/news.cljs b/demo/reagentdemo/news.cljs index c079f89..de3f1a3 100644 --- a/demo/reagentdemo/news.cljs +++ b/demo/reagentdemo/news.cljs @@ -1,5 +1,6 @@ (ns reagentdemo.news (:require [reagent.core :as reagent :refer [atom]] + [reagent.interop :refer-macros [.' .! fvar]] [reagent.debug :refer-macros [dbg println]] [reagentdemo.page :refer [title link page-map]] [reagentdemo.common :as common :refer [demo-component]] diff --git a/demo/reagentdemo/news/anyargs.cljs b/demo/reagentdemo/news/anyargs.cljs index 5d395ef..2e244fa 100644 --- a/demo/reagentdemo/news/anyargs.cljs +++ b/demo/reagentdemo/news/anyargs.cljs @@ -1,5 +1,6 @@ (ns reagentdemo.news.anyargs (:require [reagent.core :as r :refer [atom]] + [reagent.interop :refer-macros [.' .! fvar]] [reagent.debug :refer-macros [dbg println]] [reagentdemo.syntax :refer-macros [get-source]] [reagentdemo.page :refer [title link page-map]] @@ -33,9 +34,8 @@ (let [head "All arguments allowed" geometry {:href "https://github.com/holmsand/reagent/tree/master/examples/geometry"} jonase {:href "https://github.com/jonase"}] - [:div.reagent-demo - [:h1 [link {:href main} head]] + [:h1 [link {:href (fvar main)} head]] [title (str "Reagent 0.4.0: " head)] [:div.demo-text @@ -43,7 +43,7 @@ [:p "Calling a component in Reagent looks a lot like a function call. Now it also " [:em "works"] " like one."] - + [:p "Before 0.4.0, component functions were always called with three arguments: a map of attributes, a vector of ”children”, and the current React component."] @@ -53,12 +53,12 @@ them."] (if summary - [link {:href main + [link {:href (fvar main) :class 'news-read-more} "Read more"] [:div.demo-text [:p "In other words, you can now do this:"] - [demo-component {:comp say-hello + [demo-component {:comp (fvar say-hello) :src (src-for [:hello-component :say-hello])}] [:p "In the above example, it wouldn’t make any difference at @@ -77,7 +77,7 @@ and " [:code "for"] " expressions, so it’s safest to always put the call at the top, as in " [:code "my-div"] " here:"] - [demo-component {:comp call-my-div + [demo-component {:comp (fvar call-my-div) :src (src-for [:nsr :my-div :call-my-div])}] [:p [:em "Note: "] [:code "r/props"] " and " @@ -129,7 +129,7 @@ use Reagent’s new calling convensions, and looks like this:"] - [demo-component {:comp geometry-example}]])]])) + [demo-component {:comp (fvar geometry-example)}]])]])) (swap! page-map assoc - "news/any-arguments.html" main) + "news/any-arguments.html" (fvar main)) diff --git a/demo/reagentdemo/news/async.cljs b/demo/reagentdemo/news/async.cljs index 9ad9f32..2e66d18 100644 --- a/demo/reagentdemo/news/async.cljs +++ b/demo/reagentdemo/news/async.cljs @@ -1,5 +1,6 @@ (ns reagentdemo.news.async (:require [reagent.core :as reagent :refer [atom]] + [reagent.interop :refer-macros [.' .! fvar]] [reagent.debug :refer-macros [dbg println]] [reagentdemo.syntax :refer-macros [get-source]] [reagentdemo.page :refer [title link page-map]] @@ -91,13 +92,13 @@ (let [om-article {:href "http://swannodette.github.io/2013/12/17/the-future-of-javascript-mvcs/"}] [:div.reagent-demo [title "Reagent: Faster by waiting"] - [:h1 [link {:href main} "Faster by waiting"]] + [:h1 [link {:href (fvar main)} "Faster by waiting"]] [:div.demo-text [:h2 "Reagent gets async rendering"] [:p "Reagent already separates state from components. Now they are also separated in time."] - + [:p "From version 0.3.0, changes in application state (as represented by Reagent’s " [:code "atom"] "s) are no longer rendered immediately to the DOM. Instead, Reagent waits until @@ -105,13 +106,13 @@ changes are rendered in one single go."] (if summary - [link {:href main + [link {:href (fvar main) :class 'news-read-more} "Read more"] [:div.demo-text [:p "This is good for all sorts of reasons:"] [:ul - + [:li "Reagent doesn't have to spend time doing renderings that no one would ever see (because changes to application state happened faster than the browser could repaint)."] @@ -194,4 +195,4 @@ :palette :color-demo])}]])]])) (swap! page-map assoc - "news/reagent-is-async.html" main) + "news/reagent-is-async.html" (fvar main)) diff --git a/demo/reagentdemo/news/clockpost.cljs b/demo/reagentdemo/news/clockpost.cljs index 6d03634..196f737 100644 --- a/demo/reagentdemo/news/clockpost.cljs +++ b/demo/reagentdemo/news/clockpost.cljs @@ -1,5 +1,6 @@ (ns reagentdemo.news.clockpost (:require [reagent.core :as r :refer [atom]] + [reagent.interop :refer-macros [.' .! fvar]] [reagent.debug :refer-macros [dbg]] [reagentdemo.syntax :refer-macros [get-source]] [reagentdemo.page :refer [title link page-map]] @@ -21,9 +22,9 @@ om {:href "https://github.com/swannodette/om"} hoplon {:href "http://hoplon.io"} clocksrc {:href "https://github.com/holmsand/reagent/blob/master/demo/reagentdemo/news/binaryclock.cljs"}] - + [:div.reagent-demo - [:h1 [link {:href main} head]] + [:h1 [link {:href (fvar main)} head]] [title head] [:div.demo-text @@ -39,9 +40,9 @@ hoplon "Hoplon"] ", can be seen " [:a hopclock "here"] ")."] [:p "So, without further ado, here is a binary clock using Reagent."] - + (if summary - [link {:href main + [link {:href (fvar main) :class 'news-read-more} "Read more"] [:div.demo-text @@ -119,4 +120,4 @@ to React to actually display that UI."]])]])) (swap! page-map assoc - "news/binary-clock.html" main) + "news/binary-clock.html" (fvar main)) diff --git a/demo/reagentdemo/news/undodemo.cljs b/demo/reagentdemo/news/undodemo.cljs index a2d7224..87dabb3 100644 --- a/demo/reagentdemo/news/undodemo.cljs +++ b/demo/reagentdemo/news/undodemo.cljs @@ -1,5 +1,6 @@ (ns reagentdemo.news.undodemo (:require [reagent.core :as reagent :refer [atom]] + [reagent.interop :refer-macros [.' .! fvar]] [reagent.debug :refer-macros [dbg println]] [reagentdemo.syntax :refer-macros [get-source]] [reagentdemo.page :refer [title link page-map]] @@ -47,11 +48,11 @@ (defn main [{:keys [summary]}] (let [head "Cloact becomes Reagent: Undo is trivial"] [:div.reagent-demo - [:h1 [link {:href main} head]] + [:h1 [link {:href (fvar main)} head]] [title head] [:div.demo-text [:h2 "(reset! cloact-name \"Reagent\")"] - + [:p "It turns out that ”Cloact” was a really, really bad name. It made some people think about birds’ behinds, in possibly unhealthy ways, which even Google suggested they @@ -64,7 +65,7 @@ search-and-replace should suffice."] (if summary - [link {:href main + [link {:href (fvar main) :class 'news-read-more} "Read more"] [:div.demo-text @@ -86,4 +87,4 @@ [undo-demo-cleanup]])]])) (swap! page-map assoc - "news/cloact-reagent-undo-demo.html" main) + "news/cloact-reagent-undo-demo.html" (fvar main)) diff --git a/demo/reagentdemo/page.cljs b/demo/reagentdemo/page.cljs index b21585b..b604695 100644 --- a/demo/reagentdemo/page.cljs +++ b/demo/reagentdemo/page.cljs @@ -1,5 +1,6 @@ (ns reagentdemo.page (:require [reagent.core :as reagent :refer [atom partial]] + [reagent.interop :refer-macros [.' .! fvar fvar?]] [reagent.debug :refer-macros [dbg]] [clojure.string :as string] [goog.events :as events] diff --git a/src/reagent/interop.clj b/src/reagent/interop.clj index c6e807c..24cdc55 100644 --- a/src/reagent/interop.clj +++ b/src/reagent/interop.clj @@ -61,8 +61,8 @@ (do (assert (not (nil? ~f)) ~(str "undefined fn: " f)) - (assert (identical? ~f ~(symbol fns (name f))) - ~(str "Not in a namespace: " f)) +;; (assert (identical? ~f ~(symbol fns (name f))) +;; ~(str "Not in a namespace: " f)) (let [old# (aget ~f "-fvar") v# (if (not (nil? old#)) old# diff --git a/test/runtests.cljs b/test/runtests.cljs index abacb86..3c39a1c 100644 --- a/test/runtests.cljs +++ b/test/runtests.cljs @@ -1,7 +1,7 @@ (ns runtests (:require [reagent.core :as reagent :refer [atom]] - [reagent.interop :refer-macros [.' .!]] + [reagent.interop :refer-macros [.' .! fvar]] [reagent.debug :refer-macros [dbg println]] [demo :as demo] [cemerick.cljs.test :as t]))