diff --git a/src/browser/components/SettingsPage.jsx b/src/browser/components/SettingsPage.jsx index 3b5aca33..993b719f 100644 --- a/src/browser/components/SettingsPage.jsx +++ b/src/browser/components/SettingsPage.jsx @@ -1,6 +1,6 @@ const React = require('react'); const ReactDOM = require('react-dom'); -const {Button, Checkbox, Col, FormGroup, FormControl, ControlLabel, Grid, Navbar, Row} = require('react-bootstrap'); +const {Button, Checkbox, Col, FormGroup, Grid, HelpBlock, Navbar, Radio, Row} = require('react-bootstrap'); const {ipcRenderer, remote} = require('electron'); const AutoLaunch = require('auto-launch'); @@ -67,13 +67,11 @@ const SettingsPage = React.createClass({ handleSave() { var config = { teams: this.state.teams, - hideMenuBar: this.state.hideMenuBar, showTrayIcon: this.state.showTrayIcon, trayIconTheme: this.state.trayIconTheme, disablewebsecurity: this.state.disablewebsecurity, version: settings.version, minimizeToTray: this.state.minimizeToTray, - toggleWindowOnTrayIconClick: this.state.toggleWindowOnTrayIconClick, notifications: { flashWindow: this.state.notifications.flashWindow }, @@ -81,10 +79,6 @@ const SettingsPage = React.createClass({ }; settings.writeFileSync(this.props.configFile, config); if (process.platform === 'win32' || process.platform === 'linux') { - var currentWindow = remote.getCurrentWindow(); - currentWindow.setAutoHideMenuBar(config.hideMenuBar); - currentWindow.setMenuBarVisibility(!config.hideMenuBar); - var autostart = this.state.autostart; appLauncher.isEnabled().then((enabled) => { if (enabled && !autostart) { @@ -105,12 +99,7 @@ const SettingsPage = React.createClass({ }, handleChangeDisableWebSecurity() { this.setState({ - disablewebsecurity: !this.refs.disablewebsecurity.props.checked - }); - }, - handleChangeHideMenuBar() { - this.setState({ - hideMenuBar: !this.refs.hideMenuBar.props.checked + disablewebsecurity: this.refs.disablewebsecurity.props.checked }); }, handleChangeShowTrayIcon() { @@ -142,11 +131,6 @@ const SettingsPage = React.createClass({ minimizeToTray: shouldMinimizeToTray }); }, - handleChangeToggleWindowOnTrayIconClick() { - this.setState({ - toggleWindowOnTrayIconClick: !this.refs.toggleWindowOnTrayIconClick.props.checked - }); - }, toggleShowTeamForm() { this.setState({ showAddTeamForm: !this.state.showAddTeamForm @@ -204,54 +188,8 @@ const SettingsPage = React.createClass({ ); var options = []; - if (process.platform === 'win32' || process.platform === 'linux') { - options.push( - {'Hide menu bar (Press Alt to show menu bar)'}); - } - if (process.platform === 'darwin' || process.platform === 'linux') { - options.push( - {process.platform === 'darwin' ? - 'Show icon on menu bar (need to restart the application)' : - 'Show icon in notification area (need to restart the application)'}); - } - if (process.platform === 'linux') { - options.push( - - {'Icon theme (Need to restart the application)'} - - - - - ); - } - options.push( - {'Allow mixed content (Enabling allows both secure and insecure content, images and scripts to render and execute. Disabling allows only secure content.)'}); - //OSX has an option in the Dock, to set the app to autostart, so we choose to not support this option for OSX + // MacOS has an option in the Dock, to set the app to autostart, so we choose to not support this option for OSX if (process.platform === 'win32' || process.platform === 'linux') { options.push( {'Start app on login.'}); + >{'Start app on login'} + + {'If enabled, the app starts automatically when you log in to your machine.'} + {' '} + {'The app will initially start minimized and appear on the taskbar.'} + + ); } - if (process.platform === 'darwin' || process.platform === 'linux') { - options.push( - {this.state.trayWasVisible || !this.state.showTrayIcon ? 'Leave app running in notification area when the window is closed' : 'Leave app running in notification area when the window is closed (available on next restart)'}); - } - - if (process.platform === 'win32') { - options.push( - {'Toggle window visibility when clicking on the tray icon.'}); - } + options.push( + {'Display secure content only'} + + {'If enabled, the app only displays secure (HTTPS/SSL) content.'} + {' '} + {'If disabled, the app displays secure and non-secure (HTTP) content such as images.'} + + ); if (process.platform === 'darwin' || process.platform === 'win32') { options.push( @@ -294,7 +230,11 @@ const SettingsPage = React.createClass({ ref='showUnreadBadge' checked={this.state.showUnreadBadge} onChange={this.handleShowUnreadBadge} - >{'Show red badge on taskbar icon to indicate unread messages. Regardless of this setting, mentions are always indicated with a red badge and item count on the taskbar icon.'}); + >{'Show red badge on taskbar icon to indicate unread messages'} + + {'Regardless of this setting, mentions are always indicated with a red badge and item count on the taskbar icon.'} + + ); } if (process.platform === 'win32' || process.platform === 'linux') { @@ -305,7 +245,75 @@ const SettingsPage = React.createClass({ ref='flashWindow' checked={this.state.notifications.flashWindow === 2} onChange={this.handleFlashWindow} - >{'Flash the taskbar icon when a new message is received.'}); + >{'Flash taskbar icon when a new message is received'} + + {'If enabled, taskbar icon flashes for a few seconds when a new message is received.'} + + ); + } + + if (process.platform === 'darwin' || process.platform === 'linux') { + options.push( + {process.platform === 'darwin' ? + 'Show Mattermost icon in the menu bar' : + 'Show icon in the notification area'} + + {'Setting takes effect after restarting the app.'} + + ); + } + if (process.platform === 'linux') { + options.push( + + {'Icon theme: '} + { + this.setState({trayIconTheme: 'light'}); + }} + >{'Light'} + {' '} + { + this.setState({trayIconTheme: 'dark'}); + }} + >{'Dark'} + + ); + } + + if (process.platform === 'linux') { + options.push( + + {'Leave app running in notification area when application window is closed'} + + {'If enabled, the app stays running in the notification area after app window is closed.'} + {this.state.trayWasVisible || !this.state.showTrayIcon ? '' : ' Setting takes effect after restarting the app.'} + + ); } const settingsPage = { @@ -345,7 +353,7 @@ const SettingsPage = React.createClass({ var optionsRow = (options.length > 0) ? ( -

{'App options'}

+

{'App Options'}

{ options.map((opt, i) => ( {opt} diff --git a/src/browser/css/settings.css b/src/browser/css/settings.css new file mode 100644 index 00000000..c3c824b0 --- /dev/null +++ b/src/browser/css/settings.css @@ -0,0 +1,4 @@ + +.checkbox > label { + width: 100%; +} diff --git a/src/browser/settings.html b/src/browser/settings.html index 20e2183f..e8aef706 100644 --- a/src/browser/settings.html +++ b/src/browser/settings.html @@ -6,6 +6,7 @@ Settings + diff --git a/src/common/settings.js b/src/common/settings.js index 2a921dbb..cde9cc8c 100644 --- a/src/common/settings.js +++ b/src/common/settings.js @@ -16,12 +16,10 @@ function loadDefault(version) { case 1: return { teams: [], - hideMenuBar: false, showTrayIcon: false, trayIconTheme: 'light', disablewebsecurity: true, minimizeToTray: false, - toggleWindowOnTrayIconClick: false, version: 1, notifications: { flashWindow: 0 // 0 = flash never, 1 = only when idle (after 10 seconds), 2 = always diff --git a/src/main.js b/src/main.js index 556f5c07..f74fa7e3 100644 --- a/src/main.js +++ b/src/main.js @@ -254,16 +254,6 @@ app.on('window-all-closed', () => { } }); -// For win32, auto-hide menu bar. -app.on('browser-window-created', (event, window) => { - if (process.platform === 'win32' || process.platform === 'linux') { - if (config.hideMenuBar) { - window.setAutoHideMenuBar(true); - window.setMenuBarVisibility(false); - } - } -}); - // For OSX, show hidden mainWindow when clicking dock icon. app.on('activate', () => { mainWindow.show(); @@ -366,8 +356,6 @@ app.on('ready', () => { if (process.platform === 'darwin') { app.dock.show(); } - } else if ((process.platform === 'win32') && config.toggleWindowOnTrayIconClick) { - mainWindow.minimize(); } else { mainWindow.focus(); } @@ -561,9 +549,6 @@ app.on('ready', () => { break; case 'darwin': hideWindow(mainWindow); - if (config.minimizeToTray) { - app.dock.hide(); - } break; default: } diff --git a/test/specs/browser/settings_test.js b/test/specs/browser/settings_test.js index 13b9acfc..00641cce 100644 --- a/test/specs/browser/settings_test.js +++ b/test/specs/browser/settings_test.js @@ -66,7 +66,7 @@ describe('browser/settings.html', function desc() { }); describe('Options', () => { - describe('Hide Menu Bar', () => { + describe.skip('Hide Menu Bar', () => { it('should appear on win32 or linux', () => { const expected = (process.platform === 'win32' || process.platform === 'linux'); env.addClientCommands(this.app.client); @@ -105,10 +105,10 @@ describe('browser/settings.html', function desc() { }); }); - describe('Allow mixed content', () => { + describe('Display secure content only', () => { [true, false].forEach((v) => { it(`should be saved and loaded: ${v}`, () => { - const webPreferences = v ? 'allowDisplayingInsecureContent' : ''; + const webPreferences = v ? '' : 'allowDisplayingInsecureContent'; env.addClientCommands(this.app.client); return this.app.client. @@ -123,7 +123,7 @@ describe('browser/settings.html', function desc() { click('#btnSave'). pause(1000).then(() => { const savedConfig = JSON.parse(fs.readFileSync(env.configFilePath, 'utf8')); - savedConfig.disablewebsecurity.should.equal(v); + savedConfig.disablewebsecurity.should.equal(!v); }). getAttribute('.mattermostView', 'webpreferences').then((disablewebsecurity) => { // confirm actual behavior // disablewebsecurity is an array of String @@ -157,7 +157,7 @@ describe('browser/settings.html', function desc() { }); }); - describe('Show tray icon', () => { + describe('Show icon in menu bar / notification area', () => { it('should appear on darwin or linux', () => { const expected = (process.platform === 'darwin' || process.platform === 'linux'); env.addClientCommands(this.app.client); @@ -167,9 +167,9 @@ describe('browser/settings.html', function desc() { }); }); - describe('Minimize to tray', () => { - it('should appear on darwin or linux', () => { - const expected = (process.platform === 'darwin' || process.platform === 'linux'); + describe('Leave app running in notification area when application window is closed', () => { + it('should appear on linux', () => { + const expected = (process.platform === 'linux'); env.addClientCommands(this.app.client); return this.app.client. loadSettingsPage(). @@ -177,7 +177,7 @@ describe('browser/settings.html', function desc() { }); }); - describe('Toggle window visibility when clicking on the tray icon', () => { + describe.skip('Toggle window visibility when clicking on the tray icon', () => { it('should appear on win32', () => { const expected = (process.platform === 'win32'); env.addClientCommands(this.app.client); @@ -187,7 +187,7 @@ describe('browser/settings.html', function desc() { }); }); - describe('Flash taskbar icon on new messages', () => { + describe('Flash taskbar icon when a new message is received', () => { it('should appear on win32 and linux', () => { const expected = (process.platform === 'win32' || process.platform === 'linux'); env.addClientCommands(this.app.client); @@ -197,7 +197,7 @@ describe('browser/settings.html', function desc() { }); }); - describe('Show red icon for unread', () => { + describe('Show red badge on taskbar icon to indicate unread messages', () => { it('should appear on darwin or win32', () => { const expected = (process.platform === 'darwin' || process.platform === 'win32'); env.addClientCommands(this.app.client);