From 8b4a7136a3e73f7fc45df2492956da2631098af1 Mon Sep 17 00:00:00 2001 From: Kevin Tran Date: Sat, 28 Apr 2018 17:31:46 -0700 Subject: [PATCH 1/7] Add the "Vertical service bar" preference. This controls whether the service bar shows up horizontally on the top or vertically on the left. --- app/view/preferences/Preferences.js | 6 ++++++ electron/main.js | 1 + 2 files changed, 7 insertions(+) diff --git a/app/view/preferences/Preferences.js b/app/view/preferences/Preferences.js index 436ebe77..1727e92a 100644 --- a/app/view/preferences/Preferences.js +++ b/app/view/preferences/Preferences.js @@ -146,6 +146,12 @@ Ext.define('Rambox.view.preferences.Preferences',{ ,value: config.hide_menu_bar ,hidden: process.platform === 'darwin' } + ,{ + xtype: 'checkbox' + ,name: 'left_tabbar' + ,boxLabel: 'Vertical service bar' + ,value: config.left_tabbar + } ,{ xtype: 'combo' ,name: 'default_service' diff --git a/electron/main.js b/electron/main.js index d1d1620c..76ae9147 100644 --- a/electron/main.js +++ b/electron/main.js @@ -20,6 +20,7 @@ const config = new Config({ defaults: { always_on_top: false ,hide_menu_bar: false + ,left_tabbar: false ,window_display_behavior: 'taskbar_tray' ,auto_launch: !isDev ,flash_frame: true From a51f1bb8e45bc691c86c6da7a23cf556bf3a3d7c Mon Sep 17 00:00:00 2001 From: Kevin Tran Date: Sat, 28 Apr 2018 17:32:58 -0700 Subject: [PATCH 2/7] Add orientation check for tab bar on initialize. --- app/view/main/Main.js | 1 + app/view/main/MainController.js | 10 ++++++++++ 2 files changed, 11 insertions(+) diff --git a/app/view/main/Main.js b/app/view/main/Main.js index 34d9d1c3..9a54ae84 100644 --- a/app/view/main/Main.js +++ b/app/view/main/Main.js @@ -385,5 +385,6 @@ Ext.define('Rambox.view.main.Main', { ,add: 'updatePositions' ,remove: 'updatePositions' ,childmove: 'updatePositions' + ,beforerender: 'initialize' } }); diff --git a/app/view/main/MainController.js b/app/view/main/MainController.js index 916d1489..4aedcdd9 100644 --- a/app/view/main/MainController.js +++ b/app/view/main/MainController.js @@ -3,6 +3,16 @@ Ext.define('Rambox.view.main.MainController', { ,alias: 'controller.main' + ,initialize: function( tabPanel ) { + const config = ipc.sendSync('getConfig'); + + if ( config.left_tabbar === true ) { + const mainView = Ext.cq1('app-main'); + mainView.setTabPosition('left'); + mainView.setTabRotation(0); + } + } + // Make focus on webview every time the user change tabs, to enable the autofocus in websites ,onTabChange: function( tabPanel, newTab, oldTab ) { var me = this; From 41783e493157910eaa40fc7af335df8919e9e214 Mon Sep 17 00:00:00 2001 From: Kevin Tran Date: Sat, 28 Apr 2018 18:15:52 -0700 Subject: [PATCH 3/7] Propagate config changes to view. Now, the controller's `initialize` function is called every time the user's preferences are changed. This was done so that it could re-orient the service bar every time the configuration is changed, but could be extended down the line for other configuration options. --- app/view/main/MainController.js | 7 ++++--- electron/main.js | 2 ++ 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/app/view/main/MainController.js b/app/view/main/MainController.js index 4aedcdd9..fc44c8cf 100644 --- a/app/view/main/MainController.js +++ b/app/view/main/MainController.js @@ -7,9 +7,10 @@ Ext.define('Rambox.view.main.MainController', { const config = ipc.sendSync('getConfig'); if ( config.left_tabbar === true ) { - const mainView = Ext.cq1('app-main'); - mainView.setTabPosition('left'); - mainView.setTabRotation(0); + tabPanel.setTabPosition('left'); + tabPanel.setTabRotation(0); + } else { + tabPanel.setTabPosition('top'); } } diff --git a/electron/main.js b/electron/main.js index 76ae9147..79e3b59e 100644 --- a/electron/main.js +++ b/electron/main.js @@ -318,6 +318,8 @@ ipcMain.on('setConfig', function(event, values) { // systemtray_indicator updateBadge(mainWindow.getTitle()); + mainWindow.webContents.executeJavaScript('(function(a){if(a)a.controller.initialize(a);})(Ext.cq1("app-main"))'); + switch ( values.window_display_behavior ) { case 'show_taskbar': mainWindow.setSkipTaskbar(false); From bae36e1ddf28c19c5bf9659fc838937a3f4ba18f Mon Sep 17 00:00:00 2001 From: Kevin Tran Date: Sat, 28 Apr 2018 18:19:45 -0700 Subject: [PATCH 4/7] Minor code-cosmetic changes. --- app/view/main/MainController.js | 3 ++- electron/main.js | 2 +- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/app/view/main/MainController.js b/app/view/main/MainController.js index fc44c8cf..38972557 100644 --- a/app/view/main/MainController.js +++ b/app/view/main/MainController.js @@ -8,10 +8,11 @@ Ext.define('Rambox.view.main.MainController', { if ( config.left_tabbar === true ) { tabPanel.setTabPosition('left'); - tabPanel.setTabRotation(0); } else { tabPanel.setTabPosition('top'); } + + tabPanel.setTabRotation(0); } // Make focus on webview every time the user change tabs, to enable the autofocus in websites diff --git a/electron/main.js b/electron/main.js index 79e3b59e..ecafc1d9 100644 --- a/electron/main.js +++ b/electron/main.js @@ -318,7 +318,7 @@ ipcMain.on('setConfig', function(event, values) { // systemtray_indicator updateBadge(mainWindow.getTitle()); - mainWindow.webContents.executeJavaScript('(function(a){if(a)a.controller.initialize(a);})(Ext.cq1("app-main"))'); + mainWindow.webContents.executeJavaScript('(function(a){if(a)a.controller.initialize(a)})(Ext.cq1("app-main"))'); switch ( values.window_display_behavior ) { case 'show_taskbar': From caf47c70512f0992ff5692cd9d2ba53aff755aa2 Mon Sep 17 00:00:00 2001 From: Kevin Tran Date: Sat, 28 Apr 2018 19:18:44 -0700 Subject: [PATCH 5/7] Allow service bar to be snapped to any side Top, left, bottom, right. --- app/view/main/MainController.js | 7 +------ app/view/preferences/Preferences.js | 23 +++++++++++++++++++---- electron/main.js | 2 +- 3 files changed, 21 insertions(+), 11 deletions(-) diff --git a/app/view/main/MainController.js b/app/view/main/MainController.js index 38972557..ddbe6869 100644 --- a/app/view/main/MainController.js +++ b/app/view/main/MainController.js @@ -6,12 +6,7 @@ Ext.define('Rambox.view.main.MainController', { ,initialize: function( tabPanel ) { const config = ipc.sendSync('getConfig'); - if ( config.left_tabbar === true ) { - tabPanel.setTabPosition('left'); - } else { - tabPanel.setTabPosition('top'); - } - + tabPanel.setTabPosition(config.tabbar_location); tabPanel.setTabRotation(0); } diff --git a/app/view/preferences/Preferences.js b/app/view/preferences/Preferences.js index 1727e92a..2f7704eb 100644 --- a/app/view/preferences/Preferences.js +++ b/app/view/preferences/Preferences.js @@ -147,10 +147,25 @@ Ext.define('Rambox.view.preferences.Preferences',{ ,hidden: process.platform === 'darwin' } ,{ - xtype: 'checkbox' - ,name: 'left_tabbar' - ,boxLabel: 'Vertical service bar' - ,value: config.left_tabbar + xtype: 'combo' + ,name: 'tabbar_location' + ,fieldLabel: 'Service bar location' + ,labelAlign: 'left' + ,width: 380 + ,labelWidth: 105 + ,value: config.tabbar_location + ,displayField: 'label' + ,valueField: 'value' + ,editable: false + ,store: Ext.create('Ext.data.Store', { + fields: ['value', 'label'] + ,data: [ + { 'value': 'top', 'label': 'Top' } + ,{ 'value': 'left', 'label': 'Left' } + ,{ 'value': 'bottom', 'label': 'Bottom' } + ,{ 'value': 'right', 'label': 'Right' } + ] + }) } ,{ xtype: 'combo' diff --git a/electron/main.js b/electron/main.js index ecafc1d9..3fc125b8 100644 --- a/electron/main.js +++ b/electron/main.js @@ -20,7 +20,7 @@ const config = new Config({ defaults: { always_on_top: false ,hide_menu_bar: false - ,left_tabbar: false + ,tabbar_location: 'top' ,window_display_behavior: 'taskbar_tray' ,auto_launch: !isDev ,flash_frame: true From 99f5855fb4de5ae0b4f353af12f456b09a09bd9c Mon Sep 17 00:00:00 2001 From: Kevin Tran Date: Sat, 28 Apr 2018 19:20:22 -0700 Subject: [PATCH 6/7] Change size of service bar preference combo box --- app/view/preferences/Preferences.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/view/preferences/Preferences.js b/app/view/preferences/Preferences.js index 2f7704eb..2cf19579 100644 --- a/app/view/preferences/Preferences.js +++ b/app/view/preferences/Preferences.js @@ -152,7 +152,7 @@ Ext.define('Rambox.view.preferences.Preferences',{ ,fieldLabel: 'Service bar location' ,labelAlign: 'left' ,width: 380 - ,labelWidth: 105 + ,labelWidth: 180 ,value: config.tabbar_location ,displayField: 'label' ,valueField: 'value' From 156e9acad429f5b9f95d5711f28e5f62b3a87e77 Mon Sep 17 00:00:00 2001 From: Kevin Tran Date: Sat, 28 Apr 2018 20:43:58 -0700 Subject: [PATCH 7/7] Properly reconfigure tab reorderer after redock When the user changes the tab dock to left or right, the reorderer gets into an inconsistent state. To solve this, the reorderer needs to be reconfigured to look at the proper dimensions. --- app/view/main/Main.js | 2 +- app/view/main/MainController.js | 9 +++++++++ 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/app/view/main/Main.js b/app/view/main/Main.js index 9a54ae84..cb6e10e4 100644 --- a/app/view/main/Main.js +++ b/app/view/main/Main.js @@ -385,6 +385,6 @@ Ext.define('Rambox.view.main.Main', { ,add: 'updatePositions' ,remove: 'updatePositions' ,childmove: 'updatePositions' - ,beforerender: 'initialize' + ,boxready: 'initialize' } }); diff --git a/app/view/main/MainController.js b/app/view/main/MainController.js index ddbe6869..25d2e7c7 100644 --- a/app/view/main/MainController.js +++ b/app/view/main/MainController.js @@ -8,6 +8,15 @@ Ext.define('Rambox.view.main.MainController', { tabPanel.setTabPosition(config.tabbar_location); tabPanel.setTabRotation(0); + + let reorderer = tabPanel.plugins.find((plugin) => plugin.ptype == "tabreorderer"); + + if ( reorderer !== undefined ) { + const names = reorderer.container.getLayout().names; + reorderer.dd.dim = names.width; + reorderer.dd.startAttr = names.beforeX; + reorderer.dd.endAttr = names.afterX; + } } // Make focus on webview every time the user change tabs, to enable the autofocus in websites