app: redesign the UI to have a dashboard

The dashboard contains:

- GStreamer elements
- Element's property
- Preview

src/app.rs

@@ -91,14 +91,23 @@ impl GPSApp {
 
         let settings = Settings::load_settings();
         window.set_size_request(settings.app_width, settings.app_height);
+        let paned: Paned = builder
+            .object("graph_dashboard-paned")
+            .expect("Couldn't get graph_dashboard-paned");
+        paned.set_position(settings.app_graph_dashboard_paned_pos);
         let paned: Paned = builder
             .object("graph_logs-paned")
             .expect("Couldn't get graph_logs-paned");
         paned.set_position(settings.app_graph_logs_paned_pos);
         let paned: Paned = builder
-            .object("graph_favorites-paned")
+            .object("elements_preview-paned")
-            .expect("Couldn't get graph_favorites-paned");
+            .expect("Couldn't get elements_preview-paned");
-        paned.set_position(settings.app_graph_favorites_paned_pos);
+        paned.set_position(settings.app_elements_preview_paned_pos);
+        let paned: Paned = builder
+            .object("elements_properties-paned")
+            .expect("Couldn't get elements_properties-paned");
+        paned.set_position(settings.app_elements_properties_paned_pos);
+
         if settings.app_maximized {
             window.maximize();
         }
@@ -147,6 +156,11 @@ impl GPSApp {
             settings.app_maximized = window.is_maximized();
             settings.app_width = window.width();
             settings.app_height = window.height();
+            let paned: Paned = app
+                .builder
+                .object("graph_dashboard-paned")
+                .expect("Couldn't get graph_dashboard-paned");
+            settings.app_graph_dashboard_paned_pos = paned.position();
             let paned: Paned = app
                 .builder
                 .object("graph_logs-paned")
@@ -154,9 +168,14 @@ impl GPSApp {
             settings.app_graph_logs_paned_pos = paned.position();
             let paned: Paned = app
                 .builder
-                .object("graph_favorites-paned")
+                .object("elements_preview-paned")
-                .expect("Couldn't get graph_favorites-paned");
+                .expect("Couldn't get elements_preview-paned");
-            settings.app_graph_favorites_paned_pos = paned.position();
+            settings.app_elements_preview_paned_pos = paned.position();
+            let paned: Paned = app
+                .builder
+                .object("elements_properties-paned")
+                .expect("Couldn't get elements_properties-paned");
+            settings.app_elements_properties_paned_pos = paned.position();
             Settings::save_settings(&settings);
 
             let pop_menu: PopoverMenu = app

src/gps.ui

@@ -226,16 +226,18 @@
             <property name="round-digits">1</property>
           </object>
         </child>
+        <!--Graph and DashBoard paned-->
         <child>
-          <object class="GtkPaned" id="graph_logs-paned">
+          <object class="GtkPaned" id="graph_dashboard-paned">
-          <property name="orientation">vertical</property>
-          <property name="position">400</property>
-          <child>
-            <object class="GtkPaned" id="graph_favorites-paned">
             <property name="position">600</property>
             <property name="position-set">True</property>
             <property name="hexpand">True</property>
             <property name="vexpand">True</property>
+            <child>
+              <!--Graph and Logs paned-->
+              <object class="GtkPaned" id="graph_logs-paned">
+                <property name="orientation">vertical</property>
+                <property name="position">400</property>
                 <child>
                   <object class="GtkScrolledWindow" id="drawing_area-window">
                     <property name="hexpand">True</property>
@@ -249,6 +251,25 @@
                     </property>
                   </object>
                 </child>
+                <child>
+                  <object class="GtkScrolledWindow">
+                    <property name="child">
+                      <object class="GtkTreeView" id="treeview-logger"/>
+                    </property>
+                  </object>
+                </child>
+              </object>
+            </child>
+            <!--Elements and Preview paned-->
+            <child>
+              <object class="GtkPaned" id="elements_preview-paned">
+                <property name="orientation">vertical</property>
+                <property name="position">400</property>
+                <child>
+                  <!--Elements and property paned-->
+                  <object class="GtkPaned" id="elements_properties-paned">
+                  <property name="orientation">vertical</property>
+                  <property name="position">400</property>
                   <child>
                     <object class="GtkScrolledWindow">
                       <property name="hexpand">True</property>
@@ -259,17 +280,32 @@
                       </property>
                     </object>
                   </child>
+                  <child>
+                    <object class="GtkScrolledWindow">
+                      <property name="hexpand">True</property>
+                      <property name="vexpand">True</property>
+                      <property name="child">
+                        <object class="GtkBox" id="box-property">
+                        </object>
+                      </property>
+                    </object>
+                  </child>
                   </object>
                 </child>
                 <child>
                   <object class="GtkScrolledWindow">
+                    <property name="hexpand">True</property>
+                    <property name="vexpand">True</property>
                     <property name="child">
-                <object class="GtkTreeView" id="treeview-logger"/>
+                      <object class="GtkBox" id="box-preview">
+                      </object>
                     </property>
                   </object>
                 </child>
               </object>
               </child>
+          </object>
+        </child>
         <child>
           <object class="GtkStatusbar" id="status_bar">
           </object>

src/settings.rs

@@ -13,8 +13,10 @@ pub struct Settings {
     pub app_maximized: bool,
     pub app_width: i32,
     pub app_height: i32,
+    pub app_graph_dashboard_paned_pos: i32,
     pub app_graph_logs_paned_pos: i32,
-    pub app_graph_favorites_paned_pos: i32,
+    pub app_elements_preview_paned_pos: i32,
+    pub app_elements_properties_paned_pos: i32,
 }
 
 impl Settings {
@@ -102,8 +104,10 @@ impl Settings {
             Settings {
                 app_width: 800,
                 app_height: 600,
+                app_graph_dashboard_paned_pos: 600,
                 app_graph_logs_paned_pos: 400,
-                app_graph_favorites_paned_pos: 600,
+                app_elements_preview_paned_pos: 300,
+                app_elements_properties_paned_pos: 150,
                 ..Default::default()
             }
         }