gui details (#25)

* slightly modifying side bar layout * display model name in title * not in use * making plot autosize * models not components * formatting
open-simulation-platform · Jan 4, 2019 · 13752a8 · 13752a8
1 parent 48f034c
commit 13752a8
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 13 deletions.
diff --git a/resources/public/css/style.css b/resources/public/css/style.css
@@ -55,8 +55,4 @@ body {
 
 .pull-right {
     float: right !important;
-}
-
-#charty {
-    width: 1000px;
 }
diff --git a/src/cse_client/trend.cljs b/src/cse_client/trend.cljs
@@ -75,7 +75,9 @@
       {:component-did-mount  (fn [comp]
                                (js/Plotly.plot (r/dom-node comp) (clj->js [{:x []
                                                                             :y []}])
-                                               (clj->js {:xaxis {:title "Time [s]"}}))
+                                               (clj->js {:xaxis              {:title "Time [s]"}
+                                                         :autosize           true
+                                                         :use-resize-handler true}))
                                (.on (r/dom-node comp) "plotly_relayout" relayout-callback))
        :component-did-update update
        :reagent-render       (fn []

diff --git a/src/cse_client/view.cljs b/src/cse_client/view.cljs
@@ -96,11 +96,14 @@
         "Trend"
         [:div.ui.teal.left.pointing.label trend-count]])
      [:div.ui.divider]
-     (map (fn [module]
-            [:a.item {:class (when (= route-module module) :active)
-                      :key   module
-                      :href  (k/path-for [:module {:module module}])} module])
-          modules)]))
+     [:div.item
+      [:div.header "Models"]
+      [:div.menu
+       (map (fn [module]
+              [:a.item {:class (when (= route-module module) :active)
+                        :key   module
+                        :href  (k/path-for [:module {:module module}])} module])
+            modules)]]]))
 
 (defn realtime-button []
   (if @(rf/subscribe [:realtime?])
@@ -128,7 +131,7 @@
        [:tr
         [:td k]
         [:td v]])]]
-   [:div.header "Controls"]
+   [:h3 "Controls"]
    [:table.ui.basic.table.definition
     [:tbody
      [:tr [:td "Real time target"] [:td [realtime-button]]]
@@ -168,7 +171,8 @@
 (defn root-comp []
   (let [socket-state (rf/subscribe [:kee-frame.websocket/state socket-url])
         loaded? (rf/subscribe [:loaded?])
-        status (rf/subscribe [:status])]
+        status (rf/subscribe [:status])
+        module (rf/subscribe [:module])]
     [:div
      [:div.ui.inverted.huge.borderless.fixed.menu
       [:a.header.item {:href "/"} "Core Simulation Environment - demo application"]
@@ -197,7 +201,7 @@
         [:div.ui.grid
          [:div.row
           [:h1.ui.huge.header [k/switch-route (comp :name :data)
-                               :module "Model"
+                               :module (if @module (@module :name) "")
                                :trend "Trend"
                                :index (if @loaded? "Simulation status" "Simulation setup")
                                nil [:div "Loading..."]]]]