status-im
/
reagent
mirror of https://github.com/status-im/reagent.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Make simple-example use figwheel

This commit is contained in:
Dan Holmsand 2015-02-09 09:43:43 +01:00
parent a29e0c75c7
commit 0b1c7ffc33
5 changed files with 52 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
examples/simple/Makefile
View File

@ -1,21 +0,0 @@
PROF = dev
# PROF = dev,test,srcmap
# PROF = prod,test
# PROF = prod
CLJSBUILD = client
all: autocompile
run: openbrowser autocompile
openbrowser:
(sleep 1 && open example.html) &
autocompile:
rm -rf target
lein with-profile $(PROF) cljsbuild auto $(CLJSBUILD)
clean:
lein -o clean

6
examples/simple/devsrc/devsetup.cljs Normal file
View File

@ -0,0 +1,6 @@
(ns devsetup
(:require [simpleexample :as example]
[figwheel.client :as fw]))
(fw/start {:on-jsload example/run
:websocket-url "ws://localhost:3449/figwheel-ws"})

14
examples/simple/example.html
View File

@ -6,9 +6,17 @@
<link rel="stylesheet" href="example.css">
</head>
<body>
<h1>This will become an example when the ClojureScript is compiled</h1>
<script type="text/javascript" src="target/client.js"></script>
<script type="text/javascript">
<div id="app">
<h1>Reagent example app</h1>
<p> Run "lein figwheel" in a terminal to compile, wait a while, and then refresh the browser. </p>
<p> Any changes to .cljs files will be reflected in the running page immediately. </p>
<p> Run "lein clean; lein with-profile prod compile" to compile an optimized version. </p>
</div>
<script src="target/client.js"></script>
<script>
simpleexample.run();
</script>
</body>

50
examples/simple/project.clj
View File

@ -1,28 +1,32 @@
(defproject simple-reagent "0.5.0-alpha"
:dependencies [[org.clojure/clojure "1.6.0"]
[org.clojure/clojurescript "0.0-2342"]
[reagent "0.5.0-alpha"]]
:plugins [[lein-cljsbuild "1.0.3"]]
[org.clojure/clojurescript "0.0-2760"]
[reagent "0.5.0-alpha2"]
[figwheel "0.2.3-SNAPSHOT"]]
:plugins [[lein-cljsbuild "1.0.4"]
[lein-figwheel "0.2.3-SNAPSHOT"]]
:hooks [leiningen.cljsbuild]
:profiles {:prod {:cljsbuild
{:builds
{:client {:compiler
{:optimizations :advanced
:preamble ^:replace ["reagent/react.min.js"]
:pretty-print false}}}}}
:srcmap {:cljsbuild
{:builds
{:client {:compiler
{:source-map "target/client.js.map"
:source-map-path "client"}}}}}}
:source-paths ["src"]
:cljsbuild
{:builds
{:client {:source-paths ["src"]
:profiles {:dev {:cljsbuild
{:builds {:client {:source-paths ["devsrc"]
:compiler
{:preamble ["reagent/react.js"]
:output-dir "target/client"
:output-to "target/client.js"
:pretty-print true}}}})
{:main devsetup
:optimizations :none
:source-map true
:source-map-timestamp true}}}}}
:prod {:cljsbuild
{:builds {:client {:compiler
{:optimizations :advanced
:elide-asserts true
:pretty-print false}}}}}}
:figwheel {:repl false}
:cljsbuild {:builds {:client {:source-paths ["src"]
:compiler
{:output-dir "target/client"
:output-to "target/client.js"}}}})

15
examples/simple/src/simpleexample.cljs
View File

@ -2,18 +2,17 @@
(ns simpleexample
(:require [reagent.core :as reagent :refer [atom]]))
(def timer (atom (js/Date.)))
(def time-color (atom "#f34"))
(defonce timer (atom (js/Date.)))
(defn update-time [time]
;; Update the time every 1/10 second to be accurate...
(js/setTimeout #(reset! time (js/Date.)) 100))
(defonce time-color (atom "#f34"))
(defonce time-updater (js/setInterval
#(reset! timer (js/Date.)) 1000))
(defn greeting [message]
[:h1 message])
(defn clock []
(update-time timer)
(let [time-str (-> @timer .toTimeString (clojure.string/split " ") first)]
[:div.example-clock
{:style {:color @time-color}}
@ -33,5 +32,5 @@
[color-input]])
(defn ^:export run []
(reagent/render-component (fn [] [simple-example])
(.-body js/document)))
(reagent/render-component [simple-example]
(js/document.getElementById "app")))