Graph Width customization, Header Height/Margin, Prefs Review

Fix #7
AstraExt · Jan 14, 2024 · 4d479b1 · 4d479b1
1 parent 0040e17
commit 4d479b1
Show file tree

Hide file tree

Showing 18 changed files with 631 additions and 330 deletions.
diff --git a/po/[email protected] b/po/[email protected]
diff --git a/prefs.js b/prefs.js
diff --git a/schemas/org.gnome.shell.extensions.astra-monitor.gschema.xml b/schemas/org.gnome.shell.extensions.astra-monitor.gschema.xml
@@ -56,6 +56,18 @@
       <summary>Preferred Theme Style</summary>
       <description>Select the preferred theme style</description>
     </key>
+    <key name="headers-height" type="i">
+      <default>28</default>
+      <summary>Headers Height</summary>
+      <description>Set the height of the headers</description>
+      <range min="15" max="80"/>
+    </key>
+    <key name="headers-margins" type="i">
+      <default>2</default>
+      <summary>Headers Margins</summary>
+      <description>Set the margins of the headers</description>
+      <range min="0" max="15"/>
+    </key>
 
     <!-- PROCESSOR -->
     <key name="processor-update" type="d">
@@ -74,6 +86,11 @@
       <summary>CPU Header Icon</summary>
       <description>Show the icon on the header of the CPU monitor</description>
     </key>
+    <key name="processor-header-icon-size" type="i">
+      <default>18</default>
+      <summary>Header Icon Size</summary>
+      <description>Size in pixel of the icon</description>
+    </key>
     <key name="processor-header-percentage" type="b">
       <default>false</default>
       <summary>CPU Header Percentage</summary>
@@ -89,6 +106,12 @@
       <summary>Show History Graph</summary>
       <description>Show a graph of the CPU percentage through time</description>
     </key>
+    <key name="processor-header-graph-width" type="i">
+      <default>30</default>
+      <summary>Graph Width</summary>
+      <description>The width in pixels of the header history graph</description>
+      <range min="10" max="500"/>
+    </key>
     <key name="processor-header-graph-breakdown" type="b">
       <default>true</default>
       <summary>Graph Category Breakdown</summary>
@@ -148,6 +171,11 @@
       <summary>Memory Header Icon</summary>
       <description>Show the icon on the header of the memory monitor</description>
     </key>
+    <key name="memory-header-icon-size" type="i">
+      <default>18</default>
+      <summary>Header Icon Size</summary>
+      <description>Size in pixel of the icon</description>
+    </key>
     <key name="memory-header-percentage" type="b">
       <default>false</default>
       <summary>Memory Header Percentage</summary>
@@ -163,6 +191,12 @@
       <summary>Graph Category Breakdown</summary>
       <description>Color the graph with categories</description>
     </key>
+    <key name="memory-header-graph-width" type="i">
+      <default>30</default>
+      <summary>Graph Width</summary>
+      <description>The width in pixels of the header history graph</description>
+      <range min="10" max="500"/>
+    </key>
     <key name="memory-header-bars" type="b">
       <default>true</default>
       <summary>Show Memory Bar</summary>
@@ -207,6 +241,11 @@
       <summary>Storage Header Icon</summary>
       <description>Show the icon on the header of the storage monitor</description>
     </key>
+    <key name="storage-header-icon-size" type="i">
+      <default>18</default>
+      <summary>Header Icon Size</summary>
+      <description>Size in pixel of the icon</description>
+    </key>
     <key name="storage-header-percentage" type="b">
       <default>false</default>
       <summary>Storage Header Use Percentage</summary>
@@ -222,6 +261,12 @@
       <summary>Show Storage IO History Graph</summary>
       <description>Show a graph of the storage IO through time</description>
     </key>
+    <key name="storage-header-graph-width" type="i">
+      <default>30</default>
+      <summary>Graph Width</summary>
+      <description>The width in pixels of the header history graph</description>
+      <range min="10" max="500"/>
+    </key>
     <key name="storage-header-io" type="b">
       <default>false</default>
       <summary>Show Storage IO realtime speed</summary>
@@ -250,6 +295,11 @@
       <summary>Network Header Icon</summary>
       <description>Show the icon on the header of the network monitor</description>
     </key>
+    <key name="network-header-icon-size" type="i">
+      <default>18</default>
+      <summary>Header Icon Size</summary>
+      <description>Size in pixel of the icon</description>
+    </key>
     <key name="network-header-bars" type="b">
       <default>false</default>
       <summary>Show Network Usage Bar</summary>
@@ -260,6 +310,12 @@
       <summary>Show Network IO History Graph</summary>
       <description>Show a graph of the network IO through time</description>
     </key>
+    <key name="network-header-graph-width" type="i">
+      <default>30</default>
+      <summary>Graph Width</summary>
+      <description>The width in pixels of the header history graph</description>
+      <range min="10" max="500"/>
+    </key>
     <key name="network-header-io" type="b">
       <default>false</default>
       <summary>Show Network IO realtime speed</summary>
@@ -288,6 +344,11 @@
       <summary>Sensors Header Icon</summary>
       <description>Show the icon on the header of the sensors monitor</description>
     </key>
+    <key name="sensors-header-icon-size" type="i">
+      <default>18</default>
+      <summary>Header Icon Size</summary>
+      <description>Size in pixel of the icon</description>
+    </key>
     <key name="sensors-header-sensor1-show" type="b">
       <default>false</default>
       <summary>Sensors Header Sensor 1</summary>

diff --git a/src/bars.js b/src/bars.js
@@ -60,6 +60,9 @@ export const BarsBase = GObject.registerClass({
                 style += `width:${params.width}px;`;
         }
         style += params.style;
+
+        if(params.mini)
+            params.y_align = Clutter.ActorAlign.FILL;
 
         super({
             style: style,

diff --git a/src/container.js b/src/container.js
@@ -17,6 +17,7 @@
 
 import GObject from 'gi://GObject';
 import St from 'gi://St';
+import Clutter from 'gi://Clutter';
 
 import * as Main from 'resource:///org/gnome/shell/ui/main.js';
 import * as PanelMenu from 'resource:///org/gnome/shell/ui/panelMenu.js';
@@ -38,7 +39,14 @@ class Container extends PanelMenu.Button {
         Utils.container = this;
 
         this.widgets = new Map();
-        this.box = new St.BoxLayout();
+        this.box = new St.BoxLayout({
+            vertical: false,
+            x_expand: true,
+            y_expand: true,
+            x_align: Clutter.ActorAlign.FILL,
+            y_align: Clutter.ActorAlign.FILL,
+        });
+
         // @ts-ignore
         this.add_child(this.box);
 

diff --git a/src/graph.js b/src/graph.js
@@ -31,16 +31,24 @@ export const GraphBase = GObject.registerClass({
             params.width = 50;
         if(params.mini === undefined)
             params.mini = false;
+        if(params.x_align === undefined)
+            params.x_align = Clutter.ActorAlign.CENTER;
+        if(params.y_align === undefined)
+            params.y_align = Clutter.ActorAlign.CENTER;
+
+        if(params.mini)
+            params.y_align = Clutter.ActorAlign.FILL;
 
         super({
             style_class: 'astra-monitor-graph-container',
-            x_align: Clutter.ActorAlign.CENTER,
+            x_align: params.x_align,
             x_expand: true,
-            y_align: Clutter.ActorAlign.CENTER,
+            y_align: params.y_align,
             y_expand: true
         });
 
         this.mini = params.mini;
+        this.historyLimit = params.width;
 
         let style_class = this.mini ? 'astra-monitor-graph-mini' : 'astra-monitor-graph';
 
@@ -80,6 +88,11 @@ export const GraphBase = GObject.registerClass({
 
     }
 
+    setWidth(width) {
+        this.historyLimit = width;
+        this.historyChart.style = `width:${width}px;`;
+    }
+
     setupClipping(ctx, width, height, cornerRadius) {
         if(this.mini) {
             ctx.moveTo(cornerRadius, 0);

diff --git a/src/grid.js b/src/grid.js
@@ -26,24 +26,35 @@ export const Grid = GObject.registerClass({
 }, class GridBase extends St.Widget {
 
     /**
-     * @param {{numCols?:number, style?:string, styleClass?:string, x_expand?:boolean}} params
+     * @param {{
+     *     numCols?:number,
+     *     style?:string,
+     *     styleClass?:string,
+     *     x_expand?:boolean,
+     *     y_expand?:boolean,
+     *     orientation?:Clutter.Orientation,
+     * }} params
      */
     constructor(params) {
         //defaultParams
         if(params.styleClass === undefined)
             params.styleClass = 'astra-monitor-menu-grid';
         if(params.numCols === undefined)
             params.numCols = 2;
+        if(params.orientation === undefined)
+            params.orientation = Clutter.Orientation.VERTICAL;
 
         const data = {
             style_class: params.styleClass,
             name: 'AstraMonitorGrid',
-            layout_manager: new Clutter.GridLayout({orientation: Clutter.Orientation.VERTICAL}),
+            layout_manager: new Clutter.GridLayout({orientation: params.orientation}),
         };
         if(params.style)
             data.style = params.style;
         if(params.x_expand)
             data.x_expand = params.x_expand;
+        if(params.y_expand)
+            data.y_expand = params.y_expand;
         super(data);
 
         this.lm = this.layout_manager;