diff --git a/src/background.js b/src/background.js index 3bbc5beecb..a1f8926568 100644 --- a/src/background.js +++ b/src/background.js @@ -3,7 +3,7 @@ import querystring from 'querystring'; import url from 'url'; import jetpack from 'fs-jetpack'; import idle from '@paulcbetts/system-idle-time'; -import { app, ipcMain, Menu } from 'electron'; +import { app, ipcMain, BrowserWindow, Menu } from 'electron'; import autoUpdate from './background/autoUpdate'; import certificate from './background/certificate'; @@ -108,3 +108,22 @@ app.on('window-all-closed', () => { ipcMain.on('getSystemIdleTime', (event) => { event.returnValue = idle.getIdleTime(); }); + +ipcMain.on('show-about-dialog', () => { + getMainWindow().then((mainWindow) => { + const win = new BrowserWindow({ + title: i18n.__('About', app.getName()), + parent: mainWindow, + width: 400, + height: 300, + resizable: false, + maximizable: false, + minimizable: false, + center: true, + show: false, + }); + win.setMenuBarVisibility(false); + win.once('ready-to-show', () => win.show()); + win.loadURL(`file://${ __dirname }/public/about.html`); + }); +}); diff --git a/src/i18n/index.js b/src/i18n/index.js index 853b653434..99d242b88e 100644 --- a/src/i18n/index.js +++ b/src/i18n/index.js @@ -33,17 +33,26 @@ class I18n { * @constructor */ constructor() { - let dir = path.join(__dirname, '../i18n/lang'); - if (!fs.existsSync(dir)) { - dir = path.join(__dirname, 'i18n/lang'); - } - const defaultLocale = path.join(dir, 'en.i18n.json'); - loadedLanguage = JSON.parse(fs.readFileSync(defaultLocale, 'utf8')); - const locale = path.join(dir, `${ eApp.getLocale() }.i18n.json`); - if (fs.existsSync(locale)) { - const lang = JSON.parse(fs.readFileSync(locale, 'utf8')); - loadedLanguage = Object.assign(loadedLanguage, lang); + const load = () => { + let dir = path.join(__dirname, '../i18n/lang'); + if (!fs.existsSync(dir)) { + dir = path.join(__dirname, 'i18n/lang'); + } + const defaultLocale = path.join(dir, 'en.i18n.json'); + loadedLanguage = JSON.parse(fs.readFileSync(defaultLocale, 'utf8')); + const locale = path.join(dir, `${ eApp.getLocale() }.i18n.json`); + if (fs.existsSync(locale)) { + const lang = JSON.parse(fs.readFileSync(locale, 'utf8')); + loadedLanguage = Object.assign(loadedLanguage, lang); + } + }; + + if (eApp.isReady()) { + load(); + return; } + + eApp.once('ready', load); } /** diff --git a/src/i18n/lang/en.i18n.json b/src/i18n/lang/en.i18n.json index d81b09d4af..389cd1f7ab 100644 --- a/src/i18n/lang/en.i18n.json +++ b/src/i18n/lang/en.i18n.json @@ -47,6 +47,7 @@ "New_Version": "New Version:", "No": "No", "No_suggestions": "No suggestions", + "No updates are available.": "No updates are available.", "No_valid_server_found": "No valid server found at the URL", "Open_DevTools": "Open DevTools", "Open_Language_Dictionary": "Open Language Dictionary", diff --git a/src/i18n/lang/pt-br.i18n.json b/src/i18n/lang/pt-br.i18n.json index 0d87d4384a..9ff4a9a39c 100644 --- a/src/i18n/lang/pt-br.i18n.json +++ b/src/i18n/lang/pt-br.i18n.json @@ -44,6 +44,7 @@ "New_Version": "Nova Versão:", "No": "Não", "No_suggestions": "Sem sugestões", + "No updates are available.": "Não há atualizações disponíveis.", "No_valid_server_found": "Nenhum servidor válido encontrado neste endereço", "Open_DevTools": "Abrir DevTools", "Open_Language_Dictionary": "Abrir Dicionário Idioma", diff --git a/src/public/about.html b/src/public/about.html index ccb91e57a5..4dec9f3eb7 100644 --- a/src/public/about.html +++ b/src/public/about.html @@ -1,85 +1,20 @@ - - - - - - -
-
- -
- - -

-
-

- - + }, false); + + + +
+ +
+ Version %s +
+
+ + + +
+ diff --git a/src/public/app.html b/src/public/app.html index 5aa413f5bf..db1e32d369 100644 --- a/src/public/app.html +++ b/src/public/app.html @@ -28,7 +28,7 @@
- +
diff --git a/src/public/images/logo-dark.svg b/src/public/images/logo-dark.svg new file mode 100644 index 0000000000..533ef3b9d7 --- /dev/null +++ b/src/public/images/logo-dark.svg @@ -0,0 +1,23 @@ + + + + diff --git a/src/public/images/logo.svg b/src/public/images/logo.svg index 03611142d7..baaf3f3ec9 100644 --- a/src/public/images/logo.svg +++ b/src/public/images/logo.svg @@ -1 +1,23 @@ - \ No newline at end of file + + + + diff --git a/src/scripts/menus/app.js b/src/scripts/menus/app.js index f48163914f..0f8fcefde5 100644 --- a/src/scripts/menus/app.js +++ b/src/scripts/menus/app.js @@ -1,38 +1,22 @@ -import { remote } from 'electron'; +import { remote, ipcRenderer } from 'electron'; import i18n from '../../i18n/index.js'; -const APP_NAME = remote.app.getName(); +const appName = remote.app.getName(); const isMac = process.platform === 'darwin'; const appTemplate = [ { - label: i18n.__('About', APP_NAME), - click() { - const win = new remote.BrowserWindow({ - width: 310, - height: 240, - resizable: false, - show: false, - center: true, - maximizable: false, - minimizable: false, - title: 'About Rocket.Chat', - }); - win.loadURL(`file://${ __dirname }/about.html`); - win.setMenuBarVisibility(false); - win.show(); - }, + label: i18n.__('About', appName), + click: () => ipcRenderer.send('show-about-dialog'), }, { type: 'separator', id: 'about-sep', }, { - label: i18n.__('Quit_App', APP_NAME), + label: i18n.__('Quit_App', appName), accelerator: 'CommandOrControl+Q', - click() { - remote.app.quit(); - }, + click: () => remote.app.quit(), }, ]; diff --git a/src/stylesheets/main.less b/src/stylesheets/main.less index 28e6c0d371..1ae2f77f96 100755 --- a/src/stylesheets/main.less +++ b/src/stylesheets/main.less @@ -4,6 +4,7 @@ @import "../branding/branding.less"; @import "fontello.less"; @import "utils/_loading.import.less"; +@import "pages/about.less"; *, *:before, @@ -305,7 +306,7 @@ input[type='password'] { .loading-error { height: 100%; - color: white; + color: white; text-align: center; background-color: @primary-background-color; background-position: center bottom; diff --git a/src/stylesheets/pages/about.less b/src/stylesheets/pages/about.less new file mode 100644 index 0000000000..ec6e8111e5 --- /dev/null +++ b/src/stylesheets/pages/about.less @@ -0,0 +1,97 @@ +.about-page { + display: flex; + flex-direction: column; + padding: 0.25rem 0.75rem; + min-height: 100vh; + background-color: @secondary-background-color; + cursor: default; + user-select: none; + + .hidden { + display: none !important; + } + + .app-info { + display: flex; + flex-direction: column; + justify-content: center; + flex: 1; + + .app-logo img { + width: 100%; + } + + .app-version { + margin: 0 auto; + font-size: 0.75rem; + + .version { + cursor: text; + user-select: text; + font-weight: bold; + } + } + } + + .updates { + display: flex; + flex-direction: column; + justify-content: center; + flex: 1; + + .check-for-updates { + height: 2.5rem; + } + + .checking-for-updates { + display: flex; + justify-content: center; + align-items: center; + height: 2.5rem; + margin: 4px; + color: @secondary-font-color; + + .dot { + width: 0.5rem; + height: 0.5rem; + border-radius: 100%; + margin: 0.1rem; + background-color: currentColor; + animation: loading-bouncedelay 1.4s infinite ease-in-out both; + + &:nth-of-type(1) { + animation-delay: -0.32s; + } + + &:nth-of-type(2) { + animation-delay: -0.16s; + } + } + + .message { + display: none; + font-size: 1rem; + } + + &.message-shown { + .dot { + display: none; + } + + .message { + display: inline-flex; + } + } + } + + .check-for-updates-on-start__label { + margin: 0.1rem auto; + font-size: 0.8rem; + } + } + + .copyright { + margin: 0 auto; + font-size: 0.65rem; + } +}