diff --git a/README.md b/README.md index f30a143..9b27e80 100644 --- a/README.md +++ b/README.md @@ -76,12 +76,9 @@ # demo -The demo uses the extension manager from goldly to add options to goldly. - ``` cd demo -clj -X:demo:npm-install -clj -X:demo:compile +clj -X:npm-install clj -X:demo ``` diff --git a/demo/deps.edn b/demo/deps.edn index ad3b62d..3b115b4 100644 --- a/demo/deps.edn +++ b/demo/deps.edn @@ -3,31 +3,23 @@ "target/webly"] :deps {org.clojure/clojure {:mvn/version "1.11.1"} - org.pinkgorilla/goldly {:mvn/version "0.4.621"} + org.pinkgorilla/webly {:mvn/version "0.7.702"} ; build tool ; goldly extensions: - org.pinkgorilla/ui-tailwind {:mvn/version "0.0.5"} ; tailwind css classes - org.pinkgorilla/ui-repl {:mvn/version "0.0.72"} - org.pinkgorilla/ui-fonts {:mvn/version "0.0.3"} ; font awesome - org.pinkgorilla/options {:local/root "../" :deps/manifest :deps} - } + org.pinkgorilla/ui-tailwind {:mvn/version "0.1.8"} ; tailwind css classes + ;org.pinkgorilla/ui-repl {:mvn/version "0.0.72"} + ;org.pinkgorilla/ui-fonts {:mvn/version "0.2.5"} ; font awesome + org.pinkgorilla/options {:local/root "../" :deps/manifest :deps}} - :aliases {:demo - {:exec-fn modular.system/start! - :exec-args {:profile "jetty" - :config ["webly/config.edn" - "goldly/config.edn" - "demo-config.edn"] - :services "goldly/services.edn"}} - - :npm-install - {:exec-fn goldly.app.build/goldly-build + :aliases {:npm-install + {:exec-fn webly.app.app/webly-build + :config {} :exec-args {:profile "npm-install"}} - - :compile - {:exec-fn goldly.app.build/goldly-build - :exec-args {:profile "compile2"}} - - } + :demo + {:exec-fn modular.system/start! + :exec-args {;:profile "jetty" + :profile "watch" + :config {} + :services "demo-services.edn"}}} ; } \ No newline at end of file diff --git a/demo/resources/demo-config.edn b/demo/resources/demo-config.edn deleted file mode 100644 index 31079ec..0000000 --- a/demo/resources/demo-config.edn +++ /dev/null @@ -1,14 +0,0 @@ - {:goldly {; build - :lazy true - ; run - :autoload-cljs-dir [] - ; it should not be necessary to define routes, as - ; we use the extension system here. - ; todo: fix this bug in goldly. - :routes {:app {;"" demo.page.main/main-page - } - :api {}}} - - ; - } - diff --git a/demo/resources/demo-services.edn b/demo/resources/demo-services.edn new file mode 100644 index 0000000..d448fe5 --- /dev/null +++ b/demo/resources/demo-services.edn @@ -0,0 +1,12 @@ +{:modular (modular.system/modular-env) + ;:secrets #include "secrets.edn" ;; externalised and usually "mounted" as a docker/kubernetes secret + :components + {:config {:start (modular.config/load-config! (:config #ref [:modular]))} + + :exts {:start (extension/discover)} + + :webly {:start (webly.app.app/start-webly + (clip/ref :exts) + (deref (clip/ref :config)) + (:profile #ref [:modular])) + :stop (webly.app.app/stop-webly this)}}} \ No newline at end of file diff --git a/demo/resources/ext/demo.edn b/demo/resources/ext/demo.edn index d938ba9..3030e3f 100644 --- a/demo/resources/ext/demo.edn +++ b/demo/resources/ext/demo.edn @@ -1,10 +1,13 @@ -{:name "demo" - :cljs-routes {"" demo.page.options/page-options - "controls" demo.page.controls/page-controls - "trateg" demo.page.trateg/page-trateg} - :sci-cljs-ns [demo.page.options - demo.page.controls - demo.page.trateg] - - -} \ No newline at end of file +{:name "demo-app" + :lazy true + :depends-on #{;:options + } + :cljs-namespace [demo.page.core + demo.page.controls + demo.page.quanta] + :cljs-ns-bindings {'demo.page.core {'page demo.page.core/page} + 'demo.page.controls {'page demo.page.controls/page} + 'demo.page.quanta {'page demo.page.quanta/page}} + :cljs-routes {"" demo.page.core/page + "controls" demo.page.controls/page + "quanta" demo.page.quanta/page}} \ No newline at end of file diff --git a/demo/src/demo/page/controls.cljs b/demo/src/demo/page/controls.cljs index d66ee3f..3a68968 100644 --- a/demo/src/demo/page/controls.cljs +++ b/demo/src/demo/page/controls.cljs @@ -12,7 +12,7 @@ (def state-pet (r/atom :cat)) (def state-bool (r/atom true)) -(defn page-controls [_] +(defn page [_] [:div [:a {:href "/"} [:p "goto options"]] @@ -21,10 +21,12 @@ [:div " pet: " (pr-str @state-pet) " bool: " (pr-str @state-bool)] + [h1 "editor bool"] [edit/bool {:set-fn #(reset! state-bool %) :options {:class "bg-red-300 p-2"}} @state-bool] + [h1 "editor select"] [edit/select {:set-fn #(reset! state-pet %) :options {:class "placeholder-gray-400 text-gray-700 relative bg-white rounded text-sm border border-gray-400 outline-none focus:outline-none focus:shadow-outline" diff --git a/demo/src/demo/page/options.cljs b/demo/src/demo/page/core.cljs similarity index 97% rename from demo/src/demo/page/options.cljs rename to demo/src/demo/page/core.cljs index b958d51..77b8d00 100644 --- a/demo/src/demo/page/options.cljs +++ b/demo/src/demo/page/core.cljs @@ -1,4 +1,4 @@ -(ns demo.page.options +(ns demo.page.core (:require [reagent.core :as r] [options.core :refer [options-ui]])) @@ -78,11 +78,11 @@ [:br] [:h1 {:class "pt-5 pb-5 text-xl text-bold text-blue-700"} s]]) -(defn page-options [_] +(defn page [_] [:div [:a {:href "/controls"} [:p "goto controls"]] - [:a {:href "/trateg"} [:p "goto trateg"]] + [:a {:href "/quanta"} [:p "goto quanta"]] [h1 "state"] [:div (pr-str @state)] diff --git a/demo/src/demo/page/trateg.cljs b/demo/src/demo/page/quanta.cljs similarity index 56% rename from demo/src/demo/page/trateg.cljs rename to demo/src/demo/page/quanta.cljs index 969532a..6a22706 100644 --- a/demo/src/demo/page/trateg.cljs +++ b/demo/src/demo/page/quanta.cljs @@ -1,13 +1,16 @@ -(ns demo.page.trateg +(ns demo.page.quanta (:require [reagent.core :as r] - [options.core :refer [options-ui]])) + [options.core :refer [options-ui2]])) -(def state (r/atom {})) +(def state (r/atom {[0 :asset] "USD/JPY", + [2 :trailing-n] 120, + [2 :atr-n] 10, + [2 :percentile] 70, + [2 :step] 1.0E-4, + [4 :max-open-close-over-low-high] 0.3})) -(def config - {:state state - :options [{:type :select +(def options [{:type :select :path [0 :asset], :name "asset", :spec @@ -17,14 +20,7 @@ {:type :select :path [2 :atr-n], :name "dATR#", :spec [5 10 20 30]} {:type :select :path [2 :percentile], :name "dPercentile", :spec [10 20 30 40 50 60 70 80 90]} {:type :select :path [2 :step], :name "dStep", :spec [0.001 1.0E-4 4.0E-5]} - {:type :select :path [4 :max-open-close-over-low-high], :name "doji-co/lh max", :spec [0.1 0.2 0.3 0.4 0.5 0.6 0.7 0.8 0.9]}], - :current - {[0 :asset] "USD/JPY", - [2 :trailing-n] 120, - [2 :atr-n] 10, - [2 :percentile] 70, - [2 :step] 1.0E-4, - [4 :max-open-close-over-low-high] 0.3}}) + {:type :select :path [4 :max-open-close-over-low-high], :name "doji-co/lh max", :spec [0.1 0.2 0.3 0.4 0.5 0.6 0.7 0.8 0.9]}]) (defn h1 [s] [:<> @@ -32,7 +28,7 @@ [:br] [:h1 {:class "pt-5 pb-5 text-xl text-bold text-blue-700"} s]]) -(defn page-trateg [_] +(defn page [_] [:div [:a {:href "/controls"} [:p "goto controls"]] @@ -41,7 +37,20 @@ [:div (pr-str @state)] [h1 "unstyled"] - [options-ui {:class "bg-blue-300 options-debug" - :style {:width "50vw" + [options-ui2 {:class "bg-blue-300 options-debug" + :style {:width "50vw" ;:height "40vh" - }} config]]) \ No newline at end of file + } + :edit options + :state state + } ] + + [h1 "labels-left"] + [options-ui2 {:class "bg-blue-300 options-label-left" + :style {:width "50vw" + ;:height "40vh" + } + :edit options + :state state}] + + ]) \ No newline at end of file diff --git a/resources/ext/options.edn b/resources/ext/options.edn index 1f14a8d..56615b6 100644 --- a/resources/ext/options.edn +++ b/resources/ext/options.edn @@ -4,6 +4,7 @@ :cljs-namespace [options.core options.edit] :cljs-ns-bindings {'options.core {'options-ui options.core/options-ui + 'options-ui2 options.core/options-ui2 'register-editor options.core/register-editor} 'options.edit {'bool options.edit/bool 'button options.edit/button diff --git a/src/options/core.cljs b/src/options/core.cljs index d789a28..be44497 100644 --- a/src/options/core.cljs +++ b/src/options/core.cljs @@ -20,33 +20,37 @@ (defn register-editor [t f] (swap! editors assoc t f)) -(defn get-editor [t] +(defn get-editor [t] (or (get @editors t) editor-view)) - -(defn get-value [state path] - (when path - (get @state path))) - -(defn set-value [state path v] - (when path - (println "set-value path: " path " value: " v) - (swap! state assoc path v))) - -(defn create-edit-element [state {:keys [path name type] :as options}] +(defn create-edit-element [{:keys [set-fn get-fn]} {:keys [path name type] :as options}] (let [editor (get-editor type)] [:<> [:span name] ; - [editor {:state state - :set-fn #(set-value state path %) + [editor {:set-fn (partial set-fn path) :options options} - (get-value state path)]])) + (get-fn path)]])) + +(defn options-ui2 [{:keys [class style + edit + state + set-fn + get-fn] + :or {set-fn (fn [path v] + ;(println "setting " path " to: " v) + (swap! state assoc path v)) + get-fn (fn [path] + (get @state path))}}] + (into [:div {:style style + :class class}] + (map #(create-edit-element {:set-fn set-fn + :get-fn get-fn} %) edit))) (defn options-ui [{:keys [class style]} ; styling {:keys [current state options] :or {state (r/atom current)} :as config}] ; data (reset! state current) - (fn [_styling {:keys [state options] :as config}] - (into [:div {:style style - :class class}] - (map #(create-edit-element state %) options)))) + [options-ui2 {:class class + :style style + :state state + :edit options}]) \ No newline at end of file diff --git a/src/options/editor/bool.cljs b/src/options/editor/bool.cljs index 360cd51..e0b2ba8 100644 --- a/src/options/editor/bool.cljs +++ b/src/options/editor/bool.cljs @@ -7,5 +7,5 @@ :checked current-val :on-change (fn [e] (let [v (-> e .-target .-checked)] - (println "setting checkbox to: " v) + ;(println "setting checkbox to: " v) (set-fn v)))}])) \ No newline at end of file diff --git a/src/options/editor/select.cljs b/src/options/editor/select.cljs index 39f7340..021db98 100644 --- a/src/options/editor/select.cljs +++ b/src/options/editor/select.cljs @@ -33,7 +33,7 @@ [:option {:value id} name])) (defn get-id [spec id] - (println "get-id: " id " in spec: " spec) + ;(println "get-id: " id " in spec: " spec) (-> (filter #(= id (:id %)) spec) first)) @@ -41,14 +41,17 @@ (let [{:keys [class spec] :or {class "" spec []}} options - mapped? (map? (first spec)) - spec (if mapped? + spec? (map? (first spec)) + spec (if spec? (spec->spec spec) - (vals->spec spec))] + (vals->spec spec)) + current-val (if spec? + current-val + (str current-val))] (into [:select {:class class :on-change (fn [e] (let [id-str (-> e .-target .-value) - entry (get-id spec id-str) + entry (get-id spec id-str) v (:val entry)] ;(println "entry: " entry) ;(println "setting select to id: " id-str "val: " v) diff --git a/src/options/editor/string.cljs b/src/options/editor/string.cljs index e920f64..60fdf9a 100644 --- a/src/options/editor/string.cljs +++ b/src/options/editor/string.cljs @@ -8,5 +8,5 @@ :placeholder name :on-change (fn [e] (let [v (-> e .-target .-value)] - (println "setting checkbox to: " v) + ;(println "setting string to: " v) (set-fn v)))}])) \ No newline at end of file