| Bring vidya in cfd3e36 nandi 19d ago | 1 | (ns glimmer-vidya.showcase |
| 2 | "Every tag this backend paints, in one scrolling page. |
| 3 | |
| 4 | It is also the reconciler's exercise: the task list is a keyed list that is |
| 5 | added to, removed from and reordered, so widgets are reused and moved rather |
| 6 | than rebuilt." |
| 7 | (:require [glimmer.ratom :as r :refer [atom]] |
| 8 | [glimmer.core :as ui] |
| 9 | [glimmer-vidya.core :as vidya])) |
| 10 | |
| 11 | (defonce tasks (atom [{:id 1 :text "Wire egui into glimmer" :done true} |
| 12 | {:id 2 :text "Reconcile a keyed list" :done false} |
| 13 | {:id 3 :text "Ship it" :done false}])) |
| 14 | (defonce draft (atom "")) |
| 15 | (defonce next-id (atom 4)) |
| 16 | (defonce progress (atom 0.0)) |
| 17 | (defonce live? (atom true)) |
| 18 | |
| 19 | (defn- add-task! [] |
| 20 | (let [text @draft] |
| 21 | (when (seq text) |
| 22 | (swap! tasks conj {:id (swap! next-id inc) :text text :done false}) |
| 23 | (reset! draft "")))) |
| 24 | |
| 25 | (defn- toggle! [id] |
| 26 | (swap! tasks (fn [ts] (mapv #(if (= id (:id %)) (update % :done not) %) ts)))) |
| 27 | |
| 28 | (defn- drop-task! [id] |
| 29 | (swap! tasks (fn [ts] (filterv #(not= id (:id %)) ts)))) |
| 30 | |
| 31 | (defn task-row [task] |
| 32 | [:hbox {:key (:id task) :spacing 12} |
| 33 | [:checkbutton {:label (:text task) |
| 34 | :active (:done task) |
| 35 | :on-toggled #(toggle! (:id task))}] |
| 36 | [:button {:label "remove" |
| 37 | :kind :destructive |
| 38 | :on-click #(drop-task! (:id task))}]]) |
| 39 | |
| 40 | (defn app [] |
| 41 | [:page {:max-width 620} |
| 42 | [:title {:label "Vidya + glimmer"}] |
| 43 | [:dim-label {:label "Reactive components, painted by egui."}] |
| 44 | |
| 45 | [:card {} |
| 46 | [:title-2 {:label "Tasks"}] |
| 47 | (for [task @tasks] [task-row task]) |
| 48 | (when (empty? @tasks) [:dim-label {:label "Nothing left."}]) |
| 49 | [:separator {}] |
| 50 | [:hbox {:spacing 8} |
| 51 | [:entry {:text @draft |
| 52 | :width-request 380 |
| 53 | :placeholder "What needs doing?" |
| 54 | :on-change #(reset! draft %) |
| 55 | :on-activate add-task!}] |
| 56 | [:button {:label "Add" :kind :primary :on-click add-task!}]]] |
| 57 | |
| 58 | [:card {} |
| 59 | [:title-2 {:label "Feedback"}] |
| 60 | [:status {:label (if @live? "Connected" "Offline") :live @live?}] |
| 61 | [:progress {:value @progress :label (str (int (* 100 @progress)) "%")}] |
| 62 | [:hbox {:spacing 8} |
| 63 | [:button {:label "Toggle connection" :on-click #(swap! live? not)}] |
| 64 | [:button {:label "Advance" |
| 65 | :on-click #(swap! progress (fn [v] (if (>= v 1.0) 0.0 (+ v 0.2))))}]]] |
| 66 | |
| 67 | [:card {} |
| 68 | [:title-2 {:label "Disabled subtree"}] |
| 69 | [:vbox {:spacing 6 :sensitive false} |
| 70 | [:label {:label "Nothing in here answers to the pointer."}] |
| 71 | [:button {:label "Unreachable"}]]] |
| 72 | |
| 73 | [:hbox {:spacing 8} |
| 74 | [:button {:label "Quit" :on-click vidya/quit!}]]]) |
| 75 | |
| 76 | (defn -main [& _] |
| 77 | (ui/run app :title "glimmer-vidya showcase" :width 760 :height 720)) |