Add settings for window preview dimensions

Settings.ui

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<!-- Generated with glade 3.20.4 -->
+<!-- Generated with glade 3.22.1 -->
 <interface>
   <requires lib="gtk+" version="3.12"/>
   <object class="GtkAdjustment" id="appicon_margin_adjustment">
@@ -1775,11 +1775,23 @@
     <property name="step_increment">10</property>
     <property name="page_increment">25</property>
   </object>
+  <object class="GtkAdjustment" id="preview_height_adjustment">
+    <property name="lower">50</property>
+    <property name="upper">500</property>
+    <property name="step_increment">10</property>
+    <property name="page_increment">50</property>
+  </object>
   <object class="GtkAdjustment" id="preview_timeout_adjustment">
     <property name="upper">9999</property>
     <property name="step_increment">25</property>
     <property name="page_increment">100</property>
   </object>
+  <object class="GtkAdjustment" id="preview_width_adjustment">
+    <property name="lower">50</property>
+    <property name="upper">500</property>
+    <property name="step_increment">10</property>
+    <property name="page_increment">50</property>
+  </object>
   <object class="GtkBox" id="box_window_preview_options">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
@@ -2096,6 +2108,98 @@
                 </child>
               </object>
             </child>
+            <child>
+              <object class="GtkListBoxRow" id="listbox_preview_width">
+                <property name="width_request">100</property>
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <child>
+                  <object class="GtkGrid" id="grid_preview_width">
+                    <property name="visible">True</property>
+                    <property name="can_focus">False</property>
+                    <property name="margin_left">12</property>
+                    <property name="margin_right">12</property>
+                    <property name="margin_top">12</property>
+                    <property name="margin_bottom">12</property>
+                    <property name="column_spacing">32</property>
+                    <child>
+                      <object class="GtkSpinButton" id="preview_width_spinbutton">
+                        <property name="visible">True</property>
+                        <property name="can_focus">True</property>
+                        <property name="width_chars">4</property>
+                        <property name="text">0</property>
+                        <property name="adjustment">preview_width_adjustment</property>
+                        <property name="numeric">True</property>
+                      </object>
+                      <packing>
+                        <property name="left_attach">1</property>
+                        <property name="top_attach">0</property>
+                      </packing>
+                    </child>
+                    <child>
+                      <object class="GtkLabel" id="preview_width_label">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                        <property name="hexpand">True</property>
+                        <property name="label" translatable="yes">Width of the window previews</property>
+                        <property name="use_markup">True</property>
+                        <property name="xalign">0</property>
+                      </object>
+                      <packing>
+                        <property name="left_attach">0</property>
+                        <property name="top_attach">0</property>
+                      </packing>
+                    </child>
+                  </object>
+                </child>
+              </object>
+            </child>
+            <child>
+              <object class="GtkListBoxRow" id="listbox_preview_height">
+                <property name="width_request">100</property>
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <child>
+                  <object class="GtkGrid" id="grid_preview_height">
+                    <property name="visible">True</property>
+                    <property name="can_focus">False</property>
+                    <property name="margin_left">12</property>
+                    <property name="margin_right">12</property>
+                    <property name="margin_top">12</property>
+                    <property name="margin_bottom">12</property>
+                    <property name="column_spacing">32</property>
+                    <child>
+                      <object class="GtkSpinButton" id="preview_height_spinbutton">
+                        <property name="visible">True</property>
+                        <property name="can_focus">True</property>
+                        <property name="width_chars">4</property>
+                        <property name="text">0</property>
+                        <property name="adjustment">preview_height_adjustment</property>
+                        <property name="numeric">True</property>
+                      </object>
+                      <packing>
+                        <property name="left_attach">1</property>
+                        <property name="top_attach">0</property>
+                      </packing>
+                    </child>
+                    <child>
+                      <object class="GtkLabel" id="preview_height_label">
+                        <property name="visible">True</property>
+                        <property name="can_focus">False</property>
+                        <property name="hexpand">True</property>
+                        <property name="label" translatable="yes">Height of the window previews</property>
+                        <property name="use_markup">True</property>
+                        <property name="xalign">0</property>
+                      </object>
+                      <packing>
+                        <property name="left_attach">0</property>
+                        <property name="top_attach">0</property>
+                      </packing>
+                    </child>
+                  </object>
+                </child>
+              </object>
+            </child>
           </object>
         </child>
       </object>

prefs.js

@@ -700,6 +700,16 @@ const Settings = new Lang.Class({
                 this._settings.set_int('peek-mode-opacity', widget.get_value());
             }));
 
+            this._builder.get_object('preview_width_spinbutton').set_value(this._settings.get_int('window-previews-width'));
+            this._builder.get_object('preview_width_spinbutton').connect('value-changed', Lang.bind (this, function(widget) {
+                this._settings.set_int('window-previews-width', widget.get_value());
+            }));
+
+            this._builder.get_object('preview_height_spinbutton').set_value(this._settings.get_int('window-previews-height'));
+            this._builder.get_object('preview_height_spinbutton').connect('value-changed', Lang.bind (this, function(widget) {
+                this._settings.set_int('window-previews-height', widget.get_value());
+            }));
+
             dialog.connect('response', Lang.bind(this, function(dialog, id) {
                 if (id == 1) {
                     // restore default settings
@@ -711,6 +721,13 @@ const Settings = new Lang.Class({
                     this._builder.get_object('enter_peek_mode_timeout_spinbutton').set_value(this._settings.get_int('enter-peek-mode-timeout'));
                     this._settings.set_value('peek-mode-opacity', this._settings.get_default_value('peek-mode-opacity'));
                     this._builder.get_object('peek_mode_opacity_spinbutton').set_value(this._settings.get_int('peek-mode-opacity'));
+
+                    this._settings.set_value('window-previews-width', this._settings.get_default_value('window-previews-width'));
+                    this._builder.get_object('preview_width_spinbutton').set_value(this._settings.get_int('window-previews-width'));
+                    
+                    this._settings.set_value('window-previews-height', this._settings.get_default_value('window-previews-height'));
+                    this._builder.get_object('preview_height_spinbutton').set_value(this._settings.get_int('window-previews-height'));
+
                     this._settings.set_value('preview-middle-click-close', this._settings.get_default_value('preview-middle-click-close'));
 
                 } else {

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

@@ -257,6 +257,16 @@
       <summary>Enable peek mode</summary>
       <description>Peek a window upon hover for some time</description>
     </key>
+    <key type="i" name="window-previews-width">
+      <default>350</default>
+      <summary>Window previews width</summary>
+      <description>The width of the window previews</description>
+    </key>
+    <key type="i" name="window-previews-height">
+      <default>200</default>
+      <summary>Window previews height</summary>
+      <description>The height of the window previews</description>
+    </key>
     <key type="b" name="isolate-workspaces">
       <default>false</default>
       <summary>Provide workspace isolation</summary>

windowPreview.js

@@ -44,9 +44,6 @@ const Taskbar = Me.imports.taskbar;
 const Convenience = Me.imports.convenience;
 const AppIcons = Me.imports.appIcons;
 
-let DEFAULT_THUMBNAIL_WIDTH = 350;
-let DEFAULT_THUMBNAIL_HEIGHT = 200;
-
 let HOVER_APP_BLACKLIST = [
                            "Oracle VM VirtualBox",
                            "Virtual Machine Manager",
@@ -507,15 +504,16 @@ var thumbnailPreview = new Lang.Class({
     Name: 'DashToPanel.ThumbnailPreview',
     Extends: PopupMenu.PopupBaseMenuItem,
 
-    _init: function(window) {
+    _init: function(window, settings) {
+        this._dtpSettings = settings;
         this.window = window;
 
         let scaleFactor = St.ThemeContext.get_for_stage(global.stage).scale_factor;
         if(!scaleFactor)
             scaleFactor = 1;
 
-        this._thumbnailWidth = DEFAULT_THUMBNAIL_WIDTH*scaleFactor;
-        this._thumbnailHeight = DEFAULT_THUMBNAIL_HEIGHT*scaleFactor;
+        this._thumbnailWidth = this._dtpSettings.get_int('window-previews-width')*scaleFactor;
+        this._thumbnailHeight = this._dtpSettings.get_int('window-previews-height')*scaleFactor;
 
         this.parent({reactive: true});
         this._workId = Main.initializeDeferredWork(this.actor, Lang.bind(this, this._onResize));
@@ -816,7 +814,7 @@ var thumbnailPreview = new Lang.Class({
                 break;
             case 2:
                 // Middle click
-                if (this._getTopMenu()._dtpSettings.get_boolean('preview-middle-click-close')) {
+                if (this._dtpSettings.get_boolean('preview-middle-click-close')) {
                     this._closeWindow();
                 }
                 break;
@@ -892,6 +890,9 @@ var thumbnailPreviewList = new Lang.Class({
         this._scrollbarId = Main.initializeDeferredWork(this.actor, Lang.bind(this, this._showHideScrollbar));
 
         this.actor.connect('destroy', Lang.bind(this, this._onDestroy));
+
+        this._dtpSettings.connect('changed::window-previews-width', () => this._resetPreviews());
+        this._dtpSettings.connect('changed::window-previews-height', () => this._resetPreviews());
         
         this._stateChangedId = this.window ? 0 : 
                                this.app.connect('windows-changed', Lang.bind(this, this._queueRedisplay));
@@ -989,8 +990,7 @@ var thumbnailPreviewList = new Lang.Class({
     },
 
     _createPreviewItem: function(window) {
-        let preview = new thumbnailPreview(window);
-
+        let preview = new thumbnailPreview(window, this._dtpSettings);
 
         preview.actor.connect('notify::hover', Lang.bind(this, function() {
             if (preview.actor.hover){
@@ -1016,14 +1016,31 @@ var thumbnailPreviewList = new Lang.Class({
         return preview;
     },
 
+    _resetPreviews: function() {
+        let previews = this._getPreviews();
+        let l = previews.length;
+        
+        if (l > 0) {
+            for (let i = 0; i < l; ++i) {
+                previews[i]._delegate.animateOutAndDestroy();
+            }
+
+            this._queueRedisplay();
+        }
+    },
+
+    _getPreviews: function() {
+        return this.box.get_children().filter(function(actor) {
+            return actor._delegate.window && 
+                   actor._delegate.preview && 
+                   !actor._delegate.animatingOut;
+        });
+    },
+
     _redisplay: function () {
         let windows = this.window ? [this.window] : 
                       AppIcons.getInterestingWindows(this.app, this._dtpSettings).sort(this.sortWindowsCompareFunction);
-        let children = this.box.get_children().filter(function(actor) {
-                return actor._delegate.window && 
-                       actor._delegate.preview && 
-                       !actor._delegate.animatingOut;
-            });
+        let children = this._getPreviews();
         // Apps currently in the taskbar
         let oldWin = children.map(function(actor) {
                 return actor._delegate.window;