Adjust clock location

README.md

@@ -23,14 +23,13 @@ to install the extension in your home directory. A Shell reload is required <cod
 
 ## TODO
 - disable built-in dash
-- allow tray items to be reordered
 - reorder "activities" and open apps view" buttons when both visible
 - replace activities (overview) button text with an icon
 - allow moving running apps indicator to above icons
-- configure icon spacing
+- configure dash icon spacing and tray item spacing
 - allow moving overview hotspot to bottom left
 - allow moving notifications popup
-- add desktop button
+- add "show desktop" button
 
 
 ## Bug Reporting
@@ -44,4 +43,5 @@ version 2 or later. See the COPYING file for details.
 ## Credits
 Much of the code in this extension comes from [Dash-to-Dock](https://micheleg.github.io/dash-to-dock/index.html).
 This extension leverages the work for [ZorinOS Taskbar](https://github.com/ZorinOS/zorin-taskbar) used in [ZorinOS](https://zorinos.com/) to allow the dash from [Dash-to-Dock](https://micheleg.github.io/dash-to-dock/index.html) to be embedded in the Gnome main panel.
-Code to set anchor position taken from [Thoma5/gnome-shell-extension-bottompanel](https://github.com/Thoma5/gnome-shell-extension-bottompanel)
+Code to set anchor position taken from [Thoma5/gnome-shell-extension-bottompanel](https://github.com/Thoma5/gnome-shell-extension-bottompanel)
+Pattern for moving panel contents based on [Frippery Move Clock](http://frippery.org/extensions/) by R M Yorston

Settings.ui

@@ -461,7 +461,72 @@
           </packing>
         </child>
         <child>
-          <placeholder/>
+          <object class="GtkFrame" id="relocate_frame">
+            <property name="visible">True</property>
+            <property name="can_focus">False</property>
+            <property name="label_xalign">0</property>
+            <property name="shadow_type">in</property>
+            <child>
+              <object class="GtkListBox" id="listbox2">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="selection_mode">none</property>
+                <child>
+                  <object class="GtkListBoxRow" id="listboxrow2">
+                    <property name="width_request">100</property>
+                    <property name="visible">True</property>
+                    <property name="can_focus">True</property>
+                    <child>
+                      <object class="GtkGrid" id="relocate_grid">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                        <property name="margin_top">12</property>
+                        <property name="margin_bottom">12</property>
+                        <property name="row_spacing">32</property>
+                        <property name="column_spacing">32</property>
+                        <child>
+                          <object class="GtkLabel" id="location_clock_label">
+                            <property name="visible">True</property>
+                            <property name="can_focus">False</property>
+                            <property name="label" translatable="yes">Clock location</property>
+                            <property name="xalign">0</property>
+                          </object>
+                          <packing>
+                            <property name="left_attach">0</property>
+                            <property name="top_attach">0</property>
+                          </packing>
+                        </child>
+                        <child>
+                          <object class="GtkComboBoxText" id="location_clock_combo">
+                            <property name="visible">True</property>
+                            <property name="can_focus">False</property>
+                            <property name="valign">center</property>
+                            <items>
+                              <item id="NATURAL" translatable="yes">Natural</item>
+                              <item id="STATUSLEFT" translatable="yes">Left of status menu</item>
+                              <item id="STATUSRIGHT" translatable="yes">Right of status menu</item>
+                            </items>
+                          </object>
+                          <packing>
+                            <property name="left_attach">1</property>
+                            <property name="top_attach">0</property>
+                          </packing>
+                        </child>
+                      </object>
+                    </child>
+                  </object>
+                </child>
+              </object>
+            </child>
+            <child type="label_item">
+              <placeholder/>
+            </child>
+          </object>
+          <packing>
+            <property name="expand">False</property>
+            <property name="fill">True</property>
+            <property name="position">2</property>
+          </packing>
         </child>
       </object>
     </child>

panel.js

@@ -21,6 +21,9 @@
  * Code to re-anchor the panel was taken from Thoma5 BottomPanel:
  * https://github.com/Thoma5/gnome-shell-extension-bottompanel
  * 
+ * Pattern for moving clock based on Frippery Move Clock by R M Yorston
+ * http://frippery.org/extensions/
+ * 
  * Some code was also adapted from the upstream Gnome Shell source code.
  */
 
@@ -74,6 +77,7 @@ const taskbarPanel = new Lang.Class({
         this._oldRightBoxStyle = this.panel._rightBox.get_style();
         this._setTraySize(this._dtpSettings.get_int('tray-size'));
         this._setLeftBoxSize(this._dtpSettings.get_int('tray-size'));
+        this._setClockLocation(this._dtpSettings.get_string('location-clock'));
         
         this.panel.actor.add_style_class_name("popup-menu");
 
@@ -106,6 +110,13 @@ const taskbarPanel = new Lang.Class({
                 Lang.bind(this, function() {
                     Main.overview.dashIconSize = this.taskbar.iconSize;
                 })
+            ],
+            [
+                this.panel._rightBox,
+                'actor-added',
+                Lang.bind(this, function() {
+                    this._setClockLocation(this._dtpSettings.get_string('location-clock'));
+                })
             ]
         );
 
@@ -135,6 +146,7 @@ const taskbarPanel = new Lang.Class({
         Main.overview._panelGhost.set_height(this._oldPanelHeight);
         this._setTraySize(0);
         this._setLeftBoxSize(0);
+        this._setClockLocation("NATURAL");
         this.panel.actor.remove_style_class_name("popup-menu");
 
         this.appMenu = null;
@@ -163,6 +175,10 @@ const taskbarPanel = new Lang.Class({
         this._dtpSettings.connect('changed::leftbox-size', Lang.bind(this, function() {
             this._setLeftBoxSize(this._dtpSettings.get_int('leftbox-size'));
         }));
+
+        this._dtpSettings.connect('changed::location-clock', Lang.bind(this, function() {
+            this._setClockLocation(this._dtpSettings.get_string('location-clock'));
+        }));
     },
 
     _allocate: function(actor, box, flags) {
@@ -246,5 +262,41 @@ const taskbarPanel = new Lang.Class({
 
     _setLeftBoxSize: function(size) {
         size ? this.panel._leftBox.set_style("font-size: " + size + "px;" + (this._oldLeftBoxStyle || "")) : this.panel._leftBox.set_style(this._oldLeftBoxStyle);
+    },
+
+    _setClockLocation: function(loc) {
+        let centerBox = this.panel._centerBox;
+        let rightBox = this.panel._rightBox;
+        let dateMenu = this.panel.statusArea['dateMenu'];
+        let statusMenu = this.panel.statusArea['aggregateMenu'];
+
+        if(loc == "NATURAL") {
+            // only move the clock back if it's in the right box
+            if ( rightBox.get_children().indexOf(dateMenu.container) != -1 ) {
+                rightBox.remove_actor(dateMenu.container);
+                centerBox.add_actor(dateMenu.container);
+            }
+        } else {
+            // if clock is in left box, remove it and add to right
+            if ( centerBox.get_children().indexOf(dateMenu.container) != -1 ) {
+                centerBox.remove_actor(dateMenu.container);
+                rightBox.insert_child_at_index(dateMenu.container, 0);
+            }
+
+            // then, move to its new location
+            switch(loc) {
+                case "STATUSLEFT":
+                    if(statusMenu)
+                        rightBox.set_child_below_sibling(dateMenu.container, statusMenu.container);
+                    break;
+                case "STATUSRIGHT":
+                    if(statusMenu)
+                        rightBox.set_child_above_sibling(dateMenu.container, statusMenu.container);
+                    break;
+                default:
+                    break;
+            }
+
+        }
     }
 });

prefs.js

@@ -84,6 +84,11 @@ const Settings = new Lang.Class({
 
         }
 
+        this._builder.get_object('location_clock_combo').set_active_id(this._settings.get_string('location-clock'));
+        this._builder.get_object('location_clock_combo').connect('changed', Lang.bind (this, function(widget) {
+            this._settings.set_string('location-clock', widget.get_active_id());
+        }));
+
         // size options
         let panel_size_scale = this._builder.get_object('panel_size_scale');
         panel_size_scale.set_range(DEFAULT_PANEL_SIZES[DEFAULT_PANEL_SIZES.length-1], DEFAULT_PANEL_SIZES[0]);

schemas/org.gnome.shell.extensions.dash-to-panel.gschema.xml

@@ -25,6 +25,11 @@
       <summary>Panel size</summary>
       <description>Set the size of the panel.</description>
     </key>
+    <key type="s" name="location-clock">
+      <default>"STATUSRIGHT"</default>
+      <summary>Location of the clock</summary>
+      <description>Set the location of the clock on the taskbar</description>
+    </key>
     <key type="b" name="show-show-apps-button">
       <default>true</default>
       <summary>Show applications button</summary>