Created
March 21, 2017 14:59
-
-
Save saevarb/2e57e8b9b5d8ecc6c32ee50da6bde220 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(ns theland.core | |
(:require-macros [cljs.core.async.macros :refer [go]]) | |
(:require [om.core :as om :include-macros true] | |
[om.dom :as dom :include-macros true] | |
[cljs.core.async :refer [put! chan <!]] | |
)) | |
(enable-console-print!) | |
;; define your app data so that it doesn't get over-written on reload | |
(def activities | |
'[traveling fighting training]) | |
(def init-state | |
{:name "Hello" | |
:activity (first activities) | |
:stats {:str {:name "Strength" :value 10 :progress 50.0} | |
:wis {:name "Wisdom" :value 10 :progress 50.0} | |
:cha {:name "Charisma" :value 10 :progress 50.0} | |
:int {:name "Intelligence" :value 10 :progress 50.0} | |
:agi {:name "Agility" :value 10 :progress 50.0} | |
:dex {:name "Dexterity" :value 10 :progress 50.0} | |
:end {:name "Endurance" :value 10 :progress 50.0}} | |
}) | |
(defonce app-state | |
(atom init-state)) | |
(defn render-stat | |
"" | |
[stat] | |
(dom/div | |
#js {:className "row"} | |
(dom/div | |
#js {:className "col-sm-3"} | |
(:name stat) | |
) | |
(dom/div | |
#js {:className "col-sm-1"} | |
(:value stat)) | |
(dom/div | |
#js {:className "col-sm-8"} | |
(dom/div | |
#js {:className "progress" | |
:key (:name stat)} | |
(dom/div | |
#js {:className "progress-bar" | |
:role "progressbar" | |
:aria-valuenow (:progress stat) | |
:aria-valuemin 0 | |
:aria-valuemax 100 | |
:style #js {:width (str (:progress stat) "%")} | |
} | |
(str (:progress stat) "%") | |
) | |
) | |
)) | |
) | |
(defn activity-view [data owner] | |
(reify | |
om/IRenderState | |
(render-state [this {:keys [switch]}] | |
(dom/div | |
nil | |
(map | |
(fn [act] | |
(dom/button | |
#js {:onClick (fn [e] (put! switch @act))} | |
(str act)) | |
) | |
activities)))) | |
) | |
(defn character-view [data owner] | |
(println (str (:name data))) | |
(reify | |
om/IRender | |
(render [this] | |
(dom/div | |
nil | |
(dom/p nil (str "Name: " (:name data))) | |
(dom/p nil (str "Current activity: " (:activity data))) | |
(map render-stat (vals (:stats data))) | |
)))) | |
(defn main-view [data owner] | |
(reify | |
om/IInitState | |
(init-state [_] | |
{:switch (chan)}) | |
om/IWillMount | |
(will-mount [_] | |
(let [switch (om/get-state owner :switch)] | |
(go (loop [] | |
(let [new-act (<! switch)] | |
(println new-act) | |
;; (om/transact! data :activity (:new-act new-act)) | |
) | |
)) | |
)) | |
om/IRender | |
(render [this] | |
(dom/div | |
#js {:className "container"} | |
(dom/div | |
#js {:className "row"} | |
(dom/div | |
#js {:className "col-sm-4"} | |
(om/build activity-view data) | |
) | |
(dom/div | |
#js {:className "col-sm-4"} | |
(om/build character-view data) | |
) | |
(dom/div #js {:className "col-sm-4"} | |
(dom/p nil "dummy content")) | |
))))) | |
(om/root | |
main-view | |
app-state | |
{:target (. js/document (getElementById "app"))}) | |
(defn on-js-reload [] | |
;; optionally touch your app-state to force rerendering depending on | |
;; your application | |
(swap! app-state assoc init-state) | |
) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment