From 5c800ec99a30f0d01141b4328b97b6f53b85bbe6 Mon Sep 17 00:00:00 2001 From: Jon Kuperman Date: Mon, 7 Nov 2016 12:02:47 -0800 Subject: [PATCH 1/3] svg buttons alignment on tabsbar --- less/button.less | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/less/button.less b/less/button.less index 94bc8a4d34a..cac8064d989 100644 --- a/less/button.less +++ b/less/button.less @@ -20,12 +20,19 @@ span.buttonSeparator { } span.menuButton { - background: url('../img/toolbar/menu_btn.svg') center no-repeat; + background-color: @buttonColor; display: inline-block; width: 20px; height: 12px; - margin: 6px 4px 0 0; + margin: 8px 4px 0 0; cursor: default; + -webkit-mask-image: url('../img/toolbar/menu_btn.svg'); + -webkit-mask-repeat: no-repeat; + -webkit-mask-position: center; + + &:hover { + background-color: black; + } } a.browserButton, From 63f176f0bf393e909146f603e196b75520378256 Mon Sep 17 00:00:00 2001 From: Brian Clifton Date: Sun, 6 Nov 2016 02:28:06 -0700 Subject: [PATCH 2/3] Add basic styles and version information to about:about Removed app/aboutDialog.js, moved import methods over to `app/importer.js` Added os platform/release/arch and changed electron to muon :) Fixes https://github.com/brave/browser-laptop/issues/463 Auditors: @bbondy, @bradleyrichter, @darkdh (see changes to app/importer.js) Test Plan: 1. Launch Brave and visit about:about 2. Pull up version from Help > About Brave (or on Mac, Brave > About Brave) 3. Import bookmarks to ensure the message box shown there still works --- app/aboutDialog.js | 55 ---------------- app/common/commonMenu.js | 6 +- .../brave/locales/en-US/app.properties | 3 +- app/importer.js | 31 ++++++++- app/index.js | 4 -- app/sessionStore.js | 19 ++++++ js/about/about.js | 66 +++++++++++++++---- js/components/frame.js | 5 ++ js/constants/messages.js | 2 +- less/about/history.less | 14 ++++ 10 files changed, 124 insertions(+), 81 deletions(-) delete mode 100644 app/aboutDialog.js diff --git a/app/aboutDialog.js b/app/aboutDialog.js deleted file mode 100644 index 49899b683f5..00000000000 --- a/app/aboutDialog.js +++ /dev/null @@ -1,55 +0,0 @@ -const electron = require('electron') -const app = require('electron').app -const dialog = electron.dialog -const Channel = require('./channel') -const path = require('path') -const locale = require('./locale') - -module.exports.showAbout = function () { - // The timeout is in case there's a call just after the modal to hide the menu. - // showMessageBox is a modal and blocks everything otherwise, so menu would remain open - // while the dialog is displayed. - setTimeout(() => { - dialog.showMessageBox({ - title: 'Brave', - message: `Brave: ${app.getVersion()} -Electron: ${process.versions['atom-shell']} -libchromiumcontent: ${process.versions['chrome']} -V8: ${process.versions.v8} -Node.js: ${process.versions.node} -${locale.translation('updateChannel')}: ${Channel.channel()} - -${locale.translation('licenseText')}`, - icon: path.join(__dirname, '..', 'app', 'extensions', 'brave', 'img', 'braveAbout.png'), - buttons: [locale.translation('licenseTextOk')] - }) - }, 50) -} - -module.exports.showImportWarning = function () { - // The timeout is in case there's a call just after the modal to hide the menu. - // showMessageBox is a modal and blocks everything otherwise, so menu would remain open - // while the dialog is displayed. - setTimeout(() => { - dialog.showMessageBox({ - title: 'Brave', - message: `${locale.translation('closeFirefoxWarning')}`, - icon: path.join(__dirname, '..', 'app', 'extensions', 'brave', 'img', 'braveAbout.png'), - buttons: [locale.translation('closeFirefoxWarningOk')] - }) - }, 50) -} - -module.exports.showImportSuccess = function () { - // The timeout is in case there's a call just after the modal to hide the menu. - // showMessageBox is a modal and blocks everything otherwise, so menu would remain open - // while the dialog is displayed. - setTimeout(() => { - dialog.showMessageBox({ - title: 'Brave', - message: `${locale.translation('importSuccess')}`, - icon: path.join(__dirname, '..', 'app', 'extensions', 'brave', 'img', 'braveAbout.png'), - buttons: [locale.translation('importSuccessOk')] - }) - }, 50) -} diff --git a/app/common/commonMenu.js b/app/common/commonMenu.js index 2b745345d89..2145bf49250 100644 --- a/app/common/commonMenu.js +++ b/app/common/commonMenu.js @@ -301,11 +301,7 @@ module.exports.aboutBraveMenuItem = () => { return { label: locale.translation('aboutApp'), click: (item, focusedWindow) => { - if (process.type === 'browser') { - process.emit(messages.SHOW_ABOUT) - } else { - electron.ipcRenderer.send(messages.SHOW_ABOUT) - } + module.exports.sendToFocusedWindow(focusedWindow, [messages.SHORTCUT_NEW_FRAME, 'about:about', { singleFrame: true }]) } } } diff --git a/app/extensions/brave/locales/en-US/app.properties b/app/extensions/brave/locales/en-US/app.properties index abbd70bbaa9..aee8bcea2af 100644 --- a/app/extensions/brave/locales/en-US/app.properties +++ b/app/extensions/brave/locales/en-US/app.properties @@ -13,7 +13,8 @@ ok=OK cancel=Cancel submit=Submit settings=Settings -aboutPages=About pages +aboutPages=About Brave +versionInformation=Version Information listOfAboutPages=List of about pages history=History settingName=Setting name diff --git a/app/importer.js b/app/importer.js index 73cda669e53..ad937d1c90b 100644 --- a/app/importer.js +++ b/app/importer.js @@ -10,7 +10,6 @@ const dialog = electron.dialog const BrowserWindow = electron.BrowserWindow const session = electron.session const Immutable = require('immutable') -const {showImportWarning, showImportSuccess} = require('./aboutDialog') const siteUtil = require('../js/state/siteUtil') const AppStore = require('../js/stores/appStore') const siteTags = require('../js/constants/siteTags') @@ -18,6 +17,8 @@ const appActions = require('../js/actions/appActions') const messages = require('../js/constants/messages') const settings = require('../js/constants/settings') const getSetting = require('../js/settings').getSetting +const path = require('path') +const locale = require('./locale') var isMergeFavorites = false var isImportingBookmarks = false @@ -225,6 +226,34 @@ importer.on('add-cookies', (e, cookies) => { } }) +const showImportWarning = function () { + // The timeout is in case there's a call just after the modal to hide the menu. + // showMessageBox is a modal and blocks everything otherwise, so menu would remain open + // while the dialog is displayed. + setTimeout(() => { + dialog.showMessageBox({ + title: 'Brave', + message: `${locale.translation('closeFirefoxWarning')}`, + icon: path.join(__dirname, '..', 'app', 'extensions', 'brave', 'img', 'braveAbout.png'), + buttons: [locale.translation('closeFirefoxWarningOk')] + }) + }, 50) +} + +const showImportSuccess = function () { + // The timeout is in case there's a call just after the modal to hide the menu. + // showMessageBox is a modal and blocks everything otherwise, so menu would remain open + // while the dialog is displayed. + setTimeout(() => { + dialog.showMessageBox({ + title: 'Brave', + message: `${locale.translation('importSuccess')}`, + icon: path.join(__dirname, '..', 'app', 'extensions', 'brave', 'img', 'braveAbout.png'), + buttons: [locale.translation('importSuccessOk')] + }) + }, 50) +} + importer.on('show-warning-dialog', (e) => { showImportWarning() }) diff --git a/app/index.js b/app/index.js index 919b3a7c4fe..73b75fe5b7f 100644 --- a/app/index.js +++ b/app/index.js @@ -68,7 +68,6 @@ const HttpsEverywhere = require('./httpsEverywhere') const SiteHacks = require('./siteHacks') const CmdLine = require('./cmdLine') const UpdateStatus = require('../js/constants/updateStatus') -const showAbout = require('./aboutDialog').showAbout const urlParse = require('url').parse const CryptoUtil = require('../js/lib/cryptoUtil') const keytar = require('keytar') @@ -755,9 +754,6 @@ app.on('ready', () => { process.on(messages.CHECK_FOR_UPDATE, () => Updater.checkForUpdate(true)) ipcMain.on(messages.CHECK_FOR_UPDATE, () => Updater.checkForUpdate(true)) - process.on(messages.SHOW_ABOUT, showAbout) - ipcMain.on(messages.SHOW_ABOUT, showAbout) - // This is fired from a auto-update metadata call process.on(messages.UPDATE_META_DATA_RETRIEVED, (metadata) => { console.log(metadata) diff --git a/app/sessionStore.js b/app/sessionStore.js index d236a242ea8..ad0d6588225 100644 --- a/app/sessionStore.js +++ b/app/sessionStore.js @@ -27,6 +27,7 @@ const filtering = require('./filtering') const autofill = require('./autofill') const {navigatableTypes} = require('../js/lib/appUrlUtil') // const tabState = require('./common/state/tabState') +const Channel = require('./channel') const getSetting = require('../js/settings').getSetting const promisify = require('../js/lib/promisify') @@ -323,6 +324,8 @@ module.exports.cleanAppData = (data, isShutdown) => { delete data.extensions[extensionId].tabs }) } + + delete data.versionInformation } /** @@ -426,6 +429,22 @@ module.exports.loadAppState = () => { return } } + + // version information (shown on about:about) + const os = require('os') + const versionInformation = [ + {name: 'brave', version: app.getVersion()}, + {name: 'muon', version: process.versions['atom-shell']}, + {name: 'libchromiumcontent', version: process.versions['chrome']}, + {name: 'V8', version: process.versions.v8}, + {name: 'Node.js', version: process.versions.node}, + {name: 'channel', version: Channel.channel()}, + {name: 'os.platform', version: os.platform()}, + {name: 'os.release', version: os.release()}, + {name: 'os.arch', version: os.arch()} + // TODO(bsclifton): read the latest commit hash from a file, etc. + ] + data.versionInformation = versionInformation } catch (e) { // TODO: Session state is corrupted, maybe we should backup this // corrupted value for people to report into support. diff --git a/js/about/about.js b/js/about/about.js index acaef90fa3a..8d57e14142a 100644 --- a/js/about/about.js +++ b/js/about/about.js @@ -3,23 +3,61 @@ * You can obtain one at http://mozilla.org/MPL/2.0/. */ const React = require('react') -const ImmutableComponent = require('../components/immutableComponent') +const Immutable = require('immutable') +const messages = require('../constants/messages') const {aboutUrls, isNavigatableAboutPage} = require('../lib/appUrlUtil') +const SortableTable = require('../components/sortableTable') + +const ipc = window.chrome.ipc + +require('../../less/about/history.less') +require('../../node_modules/font-awesome/css/font-awesome.css') + +class AboutAbout extends React.Component { + constructor () { + super() + this.state = { versionInformation: Immutable.fromJS([]) } + ipc.on(messages.VERSION_INFORMATION_UPDATED, (e, versionInformation) => { + if (this.state.versionInformation.size === 0) { + this.setState({versionInformation: Immutable.fromJS(versionInformation)}) + } + }) + } -class AboutAbout extends ImmutableComponent { render () { - return
-

-
    - { - aboutUrls.keySeq().sort().filter((aboutSourceUrl) => isNavigatableAboutPage(aboutSourceUrl)).map((aboutSourceUrl) => -
  • - - {aboutSourceUrl} - -
    • ) - } -
+ return
+
+
+
+ +
+
+ [ + { + html: entry.get('name'), + value: entry.get('name') + }, + { + html: entry.get('version'), + value: entry.get('version') + } + ])} + /> + +
+
    + { + aboutUrls.keySeq().sort().filter((aboutSourceUrl) => isNavigatableAboutPage(aboutSourceUrl)).map((aboutSourceUrl) => +
  • + + {aboutSourceUrl} + +
    • ) + } +
+
} } diff --git a/js/components/frame.js b/js/components/frame.js index d5c9bbdad30..15afdfc667a 100644 --- a/js/components/frame.js +++ b/js/components/frame.js @@ -170,6 +170,11 @@ class Frame extends ImmutableComponent { }) this.webview.send(messages.AUTOFILL_CREDIT_CARDS_UPDATED, list) } + } else if (location === 'about:about') { + const versionInformation = appStoreRenderer.state.get('versionInformation') + if (versionInformation && versionInformation.toJS) { + this.webview.send(messages.VERSION_INFORMATION_UPDATED, versionInformation.toJS()) + } } // send state to about pages diff --git a/js/constants/messages.js b/js/constants/messages.js index 87dcb1af63e..ee9a6d70d75 100644 --- a/js/constants/messages.js +++ b/js/constants/messages.js @@ -57,7 +57,6 @@ const messages = { UPDATE_AVAILABLE: _, UPDATE_NOT_AVAILABLE: _, CHECK_FOR_UPDATE: _, - SHOW_ABOUT: _, UPDATE_META_DATA_RETRIEVED: _, // App state APP_INITIALIZED: _, @@ -113,6 +112,7 @@ const messages = { DOWNLOADS_UPDATED: _, FLASH_UPDATED: _, NEWTAB_DATA_UPDATED: _, + VERSION_INFORMATION_UPDATED: _, // About pages from contentScript OPEN_DOWNLOAD_PATH: _, RELOAD_URL: _, diff --git a/less/about/history.less b/less/about/history.less index cac2796c8e9..68b729151a7 100644 --- a/less/about/history.less +++ b/less/about/history.less @@ -4,6 +4,20 @@ min-width: 704px; .siteDetailsPageContent { + &.aboutAbout { + .sortableTable { + -webkit-user-select: text; + margin-left: @aboutPageSectionPadding; + width: 400px; + td { + cursor: auto; + padding-left: 8px; + } + } + ul { + margin-left: @aboutPageSectionPadding + @aboutPageSectionPadding; + } + } .sortableTable { -webkit-user-select: none; // Time visited From ce23b92df23f28d0158e81376ec456aca2172758 Mon Sep 17 00:00:00 2001 From: Brian Clifton Date: Mon, 7 Nov 2016 15:32:37 -0700 Subject: [PATCH 3/3] Broke version information into it's own page (about:brave) Auditors: @bbondy --- app/common/commonMenu.js | 2 +- app/extensions/brave/about-brave.html | 19 +++++++ .../brave/locales/en-US/app.properties | 3 +- app/sessionStore.js | 2 +- js/about/about.js | 45 +++------------- js/about/brave.js | 52 +++++++++++++++++++ js/about/entry.js | 46 ++++++++-------- js/components/frame.js | 2 +- js/lib/appUrlUtil.js | 17 +++--- 9 files changed, 118 insertions(+), 70 deletions(-) create mode 100644 app/extensions/brave/about-brave.html create mode 100644 js/about/brave.js diff --git a/app/common/commonMenu.js b/app/common/commonMenu.js index 2145bf49250..686216e2cf4 100644 --- a/app/common/commonMenu.js +++ b/app/common/commonMenu.js @@ -301,7 +301,7 @@ module.exports.aboutBraveMenuItem = () => { return { label: locale.translation('aboutApp'), click: (item, focusedWindow) => { - module.exports.sendToFocusedWindow(focusedWindow, [messages.SHORTCUT_NEW_FRAME, 'about:about', { singleFrame: true }]) + module.exports.sendToFocusedWindow(focusedWindow, [messages.SHORTCUT_NEW_FRAME, 'about:brave', { singleFrame: true }]) } } } diff --git a/app/extensions/brave/about-brave.html b/app/extensions/brave/about-brave.html new file mode 100644 index 00000000000..e119160607e --- /dev/null +++ b/app/extensions/brave/about-brave.html @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + +
+ + diff --git a/app/extensions/brave/locales/en-US/app.properties b/app/extensions/brave/locales/en-US/app.properties index aee8bcea2af..f86c4900f07 100644 --- a/app/extensions/brave/locales/en-US/app.properties +++ b/app/extensions/brave/locales/en-US/app.properties @@ -13,7 +13,8 @@ ok=OK cancel=Cancel submit=Submit settings=Settings -aboutPages=About Brave +aboutPages=About pages +aboutBrave=About Brave versionInformation=Version Information listOfAboutPages=List of about pages history=History diff --git a/app/sessionStore.js b/app/sessionStore.js index ad0d6588225..2e22a116b17 100644 --- a/app/sessionStore.js +++ b/app/sessionStore.js @@ -430,7 +430,7 @@ module.exports.loadAppState = () => { } } - // version information (shown on about:about) + // version information (shown on about:brave) const os = require('os') const versionInformation = [ {name: 'brave', version: app.getVersion()}, diff --git a/js/about/about.js b/js/about/about.js index 8d57e14142a..e69c23ec73c 100644 --- a/js/about/about.js +++ b/js/about/about.js @@ -3,27 +3,13 @@ * You can obtain one at http://mozilla.org/MPL/2.0/. */ const React = require('react') -const Immutable = require('immutable') -const messages = require('../constants/messages') +const ImmutableComponent = require('../components/immutableComponent') const {aboutUrls, isNavigatableAboutPage} = require('../lib/appUrlUtil') -const SortableTable = require('../components/sortableTable') - -const ipc = window.chrome.ipc require('../../less/about/history.less') require('../../node_modules/font-awesome/css/font-awesome.css') -class AboutAbout extends React.Component { - constructor () { - super() - this.state = { versionInformation: Immutable.fromJS([]) } - ipc.on(messages.VERSION_INFORMATION_UPDATED, (e, versionInformation) => { - if (this.state.versionInformation.size === 0) { - this.setState({versionInformation: Immutable.fromJS(versionInformation)}) - } - }) - } - +class AboutAbout extends ImmutableComponent { render () { return
@@ -31,30 +17,15 @@ class AboutAbout extends React.Component {
-
- [ - { - html: entry.get('name'), - value: entry.get('name') - }, - { - html: entry.get('version'), - value: entry.get('version') - } - ])} - /> -
    { - aboutUrls.keySeq().sort().filter((aboutSourceUrl) => isNavigatableAboutPage(aboutSourceUrl)).map((aboutSourceUrl) => -
  • - - {aboutSourceUrl} - -
    • ) + aboutUrls.keySeq().sort().filter((aboutSourceUrl) => isNavigatableAboutPage(aboutSourceUrl)).map((aboutSourceUrl) => +
  • + + {aboutSourceUrl} + +
    • ) }
diff --git a/js/about/brave.js b/js/about/brave.js new file mode 100644 index 00000000000..08965cfbd69 --- /dev/null +++ b/js/about/brave.js @@ -0,0 +1,52 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this file, + * You can obtain one at http://mozilla.org/MPL/2.0/. */ + +const React = require('react') +const Immutable = require('immutable') +const messages = require('../constants/messages') +const SortableTable = require('../components/sortableTable') + +const ipc = window.chrome.ipc + +require('../../less/about/history.less') +require('../../node_modules/font-awesome/css/font-awesome.css') + +class AboutBrave extends React.Component { + constructor () { + super() + this.state = { versionInformation: Immutable.fromJS([]) } + ipc.on(messages.VERSION_INFORMATION_UPDATED, (e, versionInformation) => { + if (this.state.versionInformation.size === 0) { + this.setState({versionInformation: Immutable.fromJS(versionInformation)}) + } + }) + } + + render () { + return
+
+
+
+ +
+
+ [ + { + html: entry.get('name'), + value: entry.get('name') + }, + { + html: entry.get('version'), + value: entry.get('version') + } + ])} + /> +
+
+ } +} + +module.exports = diff --git a/js/about/entry.js b/js/about/entry.js index 3d86d088b7b..a7eb2fe808c 100644 --- a/js/about/entry.js +++ b/js/about/entry.js @@ -6,50 +6,54 @@ const ipc = window.chrome.ipc let element switch (getBaseUrl(getSourceAboutUrl(window.location.href))) { - case 'about:newtab': - element = require('./newtab') - break case 'about:about': element = require('./about') break - case 'about:preferences': - element = require('./preferences') - break - case 'about:bookmarks': - element = require('./bookmarks') - break - case 'about:extensions': - element = require('./extensions') - break case 'about:adblock': element = require('./adblock') break - case 'about:downloads': - element = require('./downloads') + case 'about:autofill': + element = require('./autofill') + break + case 'about:brave': + element = require('./brave') + break + case 'about:bookmarks': + element = require('./bookmarks') break case 'about:certerror': element = require('./certerror') break - case 'about:passwords': - element = require('./passwords') - break - case 'about:safebrowsing': - element = require('./safebrowsing') + case 'about:downloads': + element = require('./downloads') break case 'about:error': element = require('./errorPage') break + case 'about:extensions': + element = require('./extensions') + break case 'about:flash': element = require('./flashPlaceholder') break case 'about:history': element = require('./history') break + case 'about:newtab': + element = require('./newtab') + break + case 'about:passwords': + element = require('./passwords') + break + case 'about:preferences': + element = require('./preferences') + break + case 'about:safebrowsing': + element = require('./safebrowsing') + break case 'about:styles': element = require('./styles') break - case 'about:autofill': - element = require('./autofill') } if (element) { diff --git a/js/components/frame.js b/js/components/frame.js index 15afdfc667a..a0289daeea0 100644 --- a/js/components/frame.js +++ b/js/components/frame.js @@ -170,7 +170,7 @@ class Frame extends ImmutableComponent { }) this.webview.send(messages.AUTOFILL_CREDIT_CARDS_UPDATED, list) } - } else if (location === 'about:about') { + } else if (location === 'about:brave') { const versionInformation = appStoreRenderer.state.get('versionInformation') if (versionInformation && versionInformation.toJS) { this.webview.send(messages.VERSION_INFORMATION_UPDATED, versionInformation.toJS()) diff --git a/js/lib/appUrlUtil.js b/js/lib/appUrlUtil.js index 69d3d33db89..23f6c98a32d 100644 --- a/js/lib/appUrlUtil.js +++ b/js/lib/appUrlUtil.js @@ -52,21 +52,22 @@ module.exports.getManifestUrl = function () { // Map of source about: URLs mapped to target URLs module.exports.aboutUrls = new Immutable.Map({ 'about:about': module.exports.getAppUrl('about-about.html'), + 'about:adblock': module.exports.getAppUrl('about-adblock.html'), + 'about:autofill': module.exports.getAppUrl('about-autofill.html'), 'about:blank': module.exports.getAppUrl('about-blank.html'), - 'about:history': module.exports.getAppUrl('about-history.html'), 'about:bookmarks': module.exports.getAppUrl('about-bookmarks.html'), + 'about:brave': module.exports.getAppUrl('about-brave.html'), + 'about:certerror': module.exports.getAppUrl('about-certerror.html'), + 'about:config': module.exports.getAppUrl('about-config.html'), 'about:downloads': module.exports.getAppUrl('about-downloads.html'), + 'about:error': module.exports.getAppUrl('about-error.html'), 'about:extensions': module.exports.getAppUrl('about-extensions.html'), - 'about:adblock': module.exports.getAppUrl('about-adblock.html'), + 'about:flash': module.exports.getAppUrl('about-flash.html'), + 'about:history': module.exports.getAppUrl('about-history.html'), 'about:newtab': module.exports.getAppUrl('about-newtab.html'), + 'about:passwords': module.exports.getAppUrl('about-passwords.html'), 'about:preferences': module.exports.getAppUrl('about-preferences.html'), - 'about:config': module.exports.getAppUrl('about-config.html'), - 'about:certerror': module.exports.getAppUrl('about-certerror.html'), 'about:safebrowsing': module.exports.getAppUrl('about-safebrowsing.html'), - 'about:passwords': module.exports.getAppUrl('about-passwords.html'), - 'about:flash': module.exports.getAppUrl('about-flash.html'), - 'about:error': module.exports.getAppUrl('about-error.html'), - 'about:autofill': module.exports.getAppUrl('about-autofill.html'), 'about:styles': module.exports.getAppUrl('about-styles.html') })