nandi/jolt-native · counter.clj

⑂ 789bb134c91bfdee346df2dc9656bf2e7f9bbd1a

counter.clj · 31 lines · 1.3 KBClojure    Blame HistoryRaw
Paint glimmer with nothing under it   1(ns glimmer-gfx.counter
"The glimmer counter, rendered by gfx's own rasterizer.
 Compare examples/ in glimmer-vidya: the component is the same shape, because
 the component never knew which backend it had."
(:require [glimmer.ratom :as ra]
          [glimmer.core :as ui]
          [glimmer-gfx.core]))          ; installs the backend
10(def state (ra/atom {:count 0 :volume 40 :loud? false}))
12(defn app []
(let [{:keys [count volume loud?]} (ra/deref state)]
  [:page {:max-width 440}
   [:card {:spacing 8}
    [:title {:label "Counter"}]
    [:label {:label (str "Count: " count)}]
    [:hbox {:spacing 8}
     [:button {:label "- 1" :on-click #(ra/swap! state update :count dec)}]
     [:button {:label "+ 1" :kind :primary
               :on-click #(ra/swap! state update :count inc)}]
     [:button {:label "reset" :on-click #(ra/swap! state assoc :count 0)}]]
    [:spacer {:size 6}]
    [:label {:label "Volume" :dim true}]
    [:slider {:value volume :min 0 :max 100
              :on-change #(ra/swap! state assoc :volume (long %))}]
    [:checkbox {:label "loud" :checked loud?
                :on-click #(ra/swap! state update :loud? not)}]]]))
30(defn -main [& _]
(ui/run app :title "glimmer-gfx" :width 480 :height 340))

Paint glimmer with nothing under it f554a01 nandi 11d ago	1	(ns glimmer-gfx.counter
	2	"The glimmer counter, rendered by gfx's own rasterizer.
	3
	4	Compare examples/ in glimmer-vidya: the component is the same shape, because
	5	the component never knew which backend it had."
	6	(:require [glimmer.ratom :as ra]
	7	[glimmer.core :as ui]
	8	[glimmer-gfx.core])) ; installs the backend
	9
	10	(def state (ra/atom {:count 0 :volume 40 :loud? false}))
	11
	12	(defn app []
	13	(let [{:keys [count volume loud?]} (ra/deref state)]
	14	[:page {:max-width 440}
	15	[:card {:spacing 8}
	16	[:title {:label "Counter"}]
	17	[:label {:label (str "Count: " count)}]
	18	[:hbox {:spacing 8}
	19	[:button {:label "- 1" :on-click #(ra/swap! state update :count dec)}]
	20	[:button {:label "+ 1" :kind :primary
	21	:on-click #(ra/swap! state update :count inc)}]
	22	[:button {:label "reset" :on-click #(ra/swap! state assoc :count 0)}]]
	23	[:spacer {:size 6}]
	24	[:label {:label "Volume" :dim true}]
	25	[:slider {:value volume :min 0 :max 100
	26	:on-change #(ra/swap! state assoc :volume (long %))}]
	27	[:checkbox {:label "loud" :checked loud?
	28	:on-click #(ra/swap! state update :loud? not)}]]]))
	29
	30	(defn -main [& _]
	31	(ui/run app :title "glimmer-gfx" :width 480 :height 340))