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

Refactored Overview to Event, added Timing panel and hid View panel

This commit is contained in:
Gregg8 2018-01-10 16:34:35 +11:00
parent 841b206778
commit 6dbdd4c8c7
5 changed files with 92 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/day8/re_frame/trace/db.cljs
View File

@ -5,7 +5,7 @@
(defn init-db [] (defn init-db []
(let [panel-width% (localstorage/get "panel-width-ratio" 0.35) (let [panel-width% (localstorage/get "panel-width-ratio" 0.35)
show-panel? (localstorage/get "show-panel" false) show-panel? (localstorage/get "show-panel" false)
selected-tab (localstorage/get "selected-tab" :overview) selected-tab (localstorage/get "selected-tab" :event)
filter-items (localstorage/get "filter-items" []) filter-items (localstorage/get "filter-items" [])
app-db-paths (localstorage/get "app-db-paths" '()) app-db-paths (localstorage/get "app-db-paths" '())
json-ml-paths (localstorage/get "app-db-json-ml-expansions" #{}) json-ml-paths (localstorage/get "app-db-json-ml-expansions" #{})

120
src/day8/re_frame/trace/view/container.cljs
View File

@ -2,11 +2,12 @@
(:require-macros [day8.re-frame.trace.utils.macros :as macros]) (:require-macros [day8.re-frame.trace.utils.macros :as macros])
(:require [mranderson047.re-frame.v0v10v2.re-frame.core :as rf] (:require [mranderson047.re-frame.v0v10v2.re-frame.core :as rf]
[re-frame.db :as db] [re-frame.db :as db]
[day8.re-frame.trace.view.overview :as overview] [day8.re-frame.trace.view.event :as event]
[day8.re-frame.trace.view.app-db :as app-db] [day8.re-frame.trace.view.app-db :as app-db]
[day8.re-frame.trace.view.subs :as subs] [day8.re-frame.trace.view.subs :as subs]
[day8.re-frame.trace.view.views :as views] [day8.re-frame.trace.view.views :as views]
[day8.re-frame.trace.view.traces :as traces] [day8.re-frame.trace.view.traces :as traces]
[day8.re-frame.trace.view.timing :as timing]
[day8.re-frame.trace.view.debug :as debug] [day8.re-frame.trace.view.debug :as debug]
[day8.re-frame.trace.view.settings :as settings] [day8.re-frame.trace.view.settings :as settings]
[garden.core :refer [css style]] [garden.core :refer [css style]]
@ -31,27 +32,26 @@
(let [selected-tab (rf/subscribe [:settings/selected-tab]) (let [selected-tab (rf/subscribe [:settings/selected-tab])
showing-settings? (= @selected-tab :settings)] showing-settings? (= @selected-tab :settings)]
[rc/h-box [rc/h-box
:align :center :align :center
:children :children [(when showing-settings?
[(when showing-settings? [:button {:class "bm-active-button"
[:button {:class "bm-active-button" :on-click #(rf/dispatch [:settings/toggle-settings])} "Done"])
:on-click #(rf/dispatch [:settings/toggle-settings])} "Done"]) [:img.nav-icon.noselect
[:img.nav-icon.noselect {:title "Pause"
{:title "Pause" :src (str "data:image/svg+xml;utf8,"
:src (str "data:image/svg+xml;utf8," pause-svg)
pause-svg) :on-click #(rf/dispatch [:settings/pause])}]
:on-click #(rf/dispatch [:settings/pause])}] [:img.nav-icon.noselect
[:img.nav-icon.noselect {:title "Settings"
{:title "Settings" :src (str "data:image/svg+xml;utf8,"
:src (str "data:image/svg+xml;utf8," (if showing-settings? orange-settings-svg settings-svg))
(if showing-settings? orange-settings-svg settings-svg)) :on-click #(rf/dispatch [:settings/toggle-settings])}]
:on-click #(rf/dispatch [:settings/toggle-settings])}] (when-not external-window?
(when-not external-window? [:img.nav-icon.active.noselect
[:img.nav-icon.active.noselect {:title "Pop out"
{:title "Pop out" :src (str "data:image/svg+xml;utf8,"
:src (str "data:image/svg+xml;utf8," open-external)
open-external) :on-click #(rf/dispatch-sync [:global/launch-external])}])]])
:on-click #(rf/dispatch-sync [:global/launch-external])}])]])
) )
(defn settings-header [external-window?] (defn settings-header [external-window?]
@ -59,8 +59,7 @@
:align :center :align :center
:size "auto" :size "auto"
:gap common/gs-12s :gap common/gs-12s
:children :children [[rc/label :class "bm-title-text" :label "Settings"]]]
[[rc/label :class "bm-title-text" :label "Settings"]]]
;; TODO: this line needs to be between Done and other buttons ;; TODO: this line needs to be between Done and other buttons
[rc/gap-f :size common/gs-12s] [rc/gap-f :size common/gs-12s]
[rc/line :size "2px" :color common/sidebar-heading-divider-color] [rc/line :size "2px" :color common/sidebar-heading-divider-color]
@ -70,15 +69,14 @@
(defn standard-header [external-window?] (defn standard-header [external-window?]
(let [current-event @(rf/subscribe [:epochs/current-event])] (let [current-event @(rf/subscribe [:epochs/current-event])]
[[rc/h-box [[rc/h-box
:align :center :align :center
:size "auto" :size "auto"
:gap common/gs-12s :gap common/gs-12s
:children :children [[:span.arrow {:on-click #(rf/dispatch [:epochs/previous-epoch])} "◀"]
[[:span.arrow {:on-click #(rf/dispatch [:epochs/previous-epoch])} "◀"] [rc/v-box
[rc/v-box :size "auto"
:size "auto" :children [[:span.event-header (prn-str current-event)]]]
:children [[:span.event-header (prn-str current-event)]]] [:span.arrow {:on-click #(rf/dispatch [:epochs/next-epoch])} "▶"]]]
[:span.arrow {:on-click #(rf/dispatch [:epochs/next-epoch])} "▶"]]]
[rc/gap-f :size common/gs-12s] [rc/gap-f :size common/gs-12s]
[rc/line :size "2px" :color common/sidebar-heading-divider-color] [rc/line :size "2px" :color common/sidebar-heading-divider-color]
[right-hand-buttons external-window?]]) [right-hand-buttons external-window?]])
@ -94,31 +92,27 @@
{:style {:width "100%" :display "flex" :flex-direction "column" :background-color common/standard-background-color}} {:style {:width "100%" :display "flex" :flex-direction "column" :background-color common/standard-background-color}}
(if showing-settings? (if showing-settings?
[rc/h-box [rc/h-box
:class "panel-content-top nav" :class "panel-content-top nav"
:style {:padding "0px 19px"} :style {:padding "0px 19px"}
:children :children (settings-header external-window?)]
(settings-header external-window?)]
[rc/h-box [rc/h-box
:class "panel-content-top nav" :class "panel-content-top nav"
:style {:padding "0px 19px"} :style {:padding "0px 19px"}
:children :children (standard-header external-window?)])
(standard-header external-window?)])
(when-not showing-settings? (when-not showing-settings?
[rc/h-box [rc/h-box
:class "panel-content-tabs" :class "panel-content-tabs"
:justify :between :justify :between
:children :children [[rc/h-box
[[rc/h-box :gap "7px"
:gap "7px" :align :center
:align :center :children [(tab-button :event "Event")
:children (tab-button :app-db "app-db")
[(tab-button :overview "Overview") (tab-button :subs "Subs")
(tab-button :app-db "app-db") ;(tab-button :views "Views")
(tab-button :subs "Subs") (tab-button :traces "Trace")
(tab-button :views "Views") (tab-button :timing "Timing")
(tab-button :traces "Trace") (tab-button :debug "Debug")]]]])
(tab-button :debug "Debug")]]
]])
[rc/line :color "#EEEEEE"] [rc/line :color "#EEEEEE"]
(when (and external-window? @unloading?) (when (and external-window? @unloading?)
[:h1.host-closed "Host window has closed. Reopen external window to continue tracing."]) [:h1.host-closed "Host window has closed. Reopen external window to continue tracing."])
@ -127,13 +121,13 @@
[rc/v-box [rc/v-box
:size "auto" :size "auto"
:style {:margin-left common/gs-19s :overflow "auto"} :style {:margin-left common/gs-19s :overflow "auto"}
:children :children [(case @selected-tab
[(case @selected-tab :event [event/render traces]
:overview [overview/render traces] :app-db [app-db/render-state db/app-db]
:app-db [app-db/render-state db/app-db] :subs [subs/subs-panel]
:subs [subs/subs-panel] :views [views/render]
:views [views/render] :traces [traces/render-trace-panel traces]
:traces [traces/render-trace-panel traces] :timing [timing/render]
:debug [debug/render-debug] :debug [debug/render-debug]
:settings [settings/render] :settings [settings/render]
[app-db/render-state db/app-db])]]])) [app-db/render-state db/app-db])]]]))

19
src/day8/re_frame/trace/view/event.cljs Normal file
View File

@ -0,0 +1,19 @@
(ns day8.re-frame.trace.view.event
(:require [day8.re-frame.trace.utils.re-com :as rc]
[day8.re-frame.trace.metamorphic :as metam]))
(defn render [traces]
[rc/v-box
:padding "12px 0px"
:children [[rc/label :label "Event"]
[rc/label :label "Dispatch Point"]
[rc/label :label "Coeffects"]
[rc/label :label "Effects"]
[rc/label :label "Interceptors"]
[rc/h-box
:children [[:p "Subs Run"] [:p "Created"] [:p "Destroyed"]]]
[:p "Views Rendered"]
[rc/h-box
:children [[:p "Timing"] [:p "Animation Frames"]]]
]])

19
src/day8/re_frame/trace/view/overview.cljs
View File

@ -1,19 +0,0 @@
(ns day8.re-frame.trace.view.overview
(:require [day8.re-frame.trace.utils.re-com :as rc]
[day8.re-frame.trace.metamorphic :as metam]))
(defn render [traces]
[rc/v-box
:children
[[rc/label :label "Event"]
[rc/label :label "Dispatch Point"]
[rc/label :label "Coeffects"]
[rc/label :label "Effects"]
[rc/label :label "Interceptors"]
[rc/h-box
:children [[:p "Subs Run"] [:p "Created"] [:p "Destroyed"]]]
[:p "Views Rendered"]
[rc/h-box
:children [[:p "Timing"] [:p "Animation Frames"]]]
]])

15
src/day8/re_frame/trace/view/timing.cljs Normal file
View File

@ -0,0 +1,15 @@
(ns day8.re-frame.trace.view.timing
(:require [clojure.string :as str]
[devtools.prefs]
[devtools.formatters.core]
[day8.re-frame.trace.view.components :as components]
[mranderson047.re-frame.v0v10v2.re-frame.core :as rf]
[mranderson047.reagent.v0v6v0.reagent.core :as r]
[day8.re-frame.trace.utils.re-com :as rc]
[day8.re-frame.trace.common-styles :as common])
(:require-macros [day8.re-frame.trace.utils.macros :as macros]))
(defn render []
[rc/v-box
:padding "12px 0px"
:children [[rc/label :label "Timing panel"]]])