oracle · robertpatrick · Nov 5, 2021 · Nov 5, 2021 · Nov 5, 2021
diff --git a/electron/app/js/prompt/about.html b/electron/app/js/prompt/about.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<!--
+ Copyright (c) 2021, Oracle and/or its affiliates.
+ Licensed under The Universal Permissive License (UPL), Version 1.0 as shown at https://oss.oracle.com/licenses/upl/
+ -->
+<html lang="en-us">
+ <head>
+ <title id="title">...</title>
+ <link href="prompt.css" rel="stylesheet" />
+ </head>
+ <body>
+ <div id="container" class="centered">
+ <div>
+ <img alt="icon" src="appIcon.png" />
+ </div>
+ <form id="form">
+ <div id="appName" class="textLine main">...</div>
+ <div id="version" class="textLine">...</div>
+ <div id="copyright" class="textLine">...</div>
+ <div id="buttons">
+ <button type="submit" id="ok">...</button>
+ </div>
+ </form>
+ </div>
+ <script src="about.js"></script>
+ </body>
+</html>
diff --git a/electron/app/js/prompt/about.js b/electron/app/js/prompt/about.js
@@ -0,0 +1,72 @@
+/**
+ * @license
+ * Copyright (c) 2021, Oracle and/or its affiliates.
+ * Licensed under the Universal Permissive License v 1.0 as shown at https://oss.oracle.com/licenses/upl.
+ */
+let promptId = null;
+let promptOptions = null;
+
+function promptError(error) {
+ if (error instanceof Error) {
+ error = error.message;
+ }
+
+ window.api.ipc.sendSync('prompt-error:' + promptId, error);
+}
+
+function promptCancel() {
+ window.api.ipc.sendSync('prompt-post-data:' + promptId, null);
+}
+
+function promptSubmit() {
+ const data = {};
+ window.api.ipc.sendSync('prompt-post-data:' + promptId, data);
+}
+
+function promptRegister() {
+ promptId = document.location.hash.replace('#', '');
+
+ try {
+ promptOptions = JSON.parse(window.api.ipc.sendSync('prompt-get-options:' + promptId));
+ } catch (error) {
+ return promptError(error);
+ }
+
+ const okButton = document.querySelector('#ok');
+
+ okButton.addEventListener('keyup', event => {
+ if (event.key === 'Escape') {
+ promptCancel();
+ }
+ });
+
+ document.querySelector('#form').addEventListener('submit', promptSubmit);
+
+ okButton.focus();
+
+ window.api.i18n.ready.then(() => {
+ const versionText = window.api.i18n.t('dialog-about-version', {
+ version: promptOptions.applicationVersion,
+ buildVersion: promptOptions.version
+ });
+
+ document.querySelector('#title').textContent = promptOptions.applicationName;
+ document.querySelector('#appName').textContent = promptOptions.applicationName;
+ document.querySelector('#version').textContent = versionText;
+ document.querySelector('#copyright').textContent = promptOptions.copyright;
+
+ okButton.textContent = window.api.i18n.t('dialog-button-ok');
+
+ const height = document.querySelector('body').offsetHeight;
+ window.api.ipc.sendSync('prompt-size:' + promptId, height);
+ });
+}
+
+window.addEventListener('error', error => {
+ if (promptId) {
+ const text = error.message ? error.message : error;
+ promptError('An error has occurred on the about window: \n' + text);
+ }
+});
+
+document.addEventListener('DOMContentLoaded', promptRegister);
diff --git a/electron/app/js/prompt/appIcon.png b/electron/app/js/prompt/appIcon.png
diff --git a/electron/app/js/prompt/credential-passphrase.js b/electron/app/js/prompt/credential-passphrase.js
@@ -68,7 +68,8 @@ function promptRegister() {
 
 window.addEventListener('error', error => {
  if (promptId) {
- promptError('An error has occurred on the prompt window: \n' + error);
+ const text = error.message ? error.message : error;
+ promptError('An error has occurred on the prompt window: \n' + text);
  }
 });
 

diff --git a/electron/app/js/prompt/prompt.css b/electron/app/js/prompt/prompt.css
@@ -20,6 +20,29 @@ body {
  padding: 1em;
 }
 
+#container.centered {
+ flex-direction: column;
+ text-align: center;
+}
+
+#container.centered img {
+ display: block;
+}
+
+#container.centered .textLine {
+ margin: 0.25em 0;
+}
+
+#container.centered .textLine.main {
+ font-size: 1.25em;
+ font-weight: bold;
+}
+
+#container.centered #buttons {
+ margin: 0.75em 0;
+ text-align: center;
+}
+
 #form {
  width: 100%;
 }

diff --git a/electron/app/js/promptUtils.js b/electron/app/js/promptUtils.js
@@ -102,6 +102,110 @@ async function getCredentialPassphrase(parentWindow) {
  });
 }
 
+// a custom "About" dialog for Linux and Windows.
+// the current electron version doesn't support the built-in dialog for Linux,
+// and the windows version is lacks build version and other issues.
+async function showAboutDialog(wktApp, parentWindow) {
+ const pageFile = path.join(__dirname, 'prompt', 'about.html');
+ const preloadFile = path.join(__dirname, 'prompt', 'preload.js');
+
+ const WIDTH = 400;
+ const HEIGHT = 234; // renderer will send IPC to adjust this
+ const MIN_HEIGHT = 120; // needs to be smaller than content height
+
+ return new Promise((resolve, reject) => {
+
+ let promptWindow = new BrowserWindow({
+ width: WIDTH,
+ height: HEIGHT,
+ minWidth: WIDTH,
+ minHeight: MIN_HEIGHT,
+ resizable: true,
+ minimizable: false,
+ fullscreenable: false,
+ maximizable: false,
+ parent: parentWindow,
+ skipTaskbar: true,
+ alwaysOnTop: false,
+ useContentSize: true,
+ modal: Boolean(parentWindow),
+ menuBarVisible: false,
+ webPreferences: {
+ nodeIntegration: false,
+ contextIsolation: true,
+ enableRemoteModule: false,
+ webviewTag: false,
+ preload: preloadFile
+ },
+ });
+
+ promptWindow.setMenu(null);
+ promptWindow.setMenuBarVisibility(false);
+
+ const getOptionsListener = event => {
+ event.returnValue = JSON.stringify({
+ applicationName: wktApp.getApplicationName(),
+ applicationVersion: wktApp.getApplicationVersion(),
+ copyright: wktApp.getApplicationCopyright(),
+ version: wktApp.getApplicationBuildVersion(),
+ website: wktApp.getApplicationWebsite()
+ });
+ };
+
+ const sizeListener = (event, value) => {
+ event.returnValue = null;
+ promptWindow.setContentSize(WIDTH, value);
+ promptWindow.center();
+ };
+
+ const id = promptWindow.id.toString();
+
+ const cleanup = () => {
+ ipcMain.removeListener('prompt-get-options:' + id, getOptionsListener);
+ ipcMain.removeListener('prompt-post-data:' + id, postDataListener);
+ ipcMain.removeListener('prompt-error:' + id, errorListener);
+ ipcMain.removeListener('prompt-size:' + id, sizeListener);
+
+ if (promptWindow) {
+ promptWindow.close();
+ promptWindow = null;
+ }
+ };
+
+ const postDataListener = (event, value) => {
+ resolve(value);
+ event.returnValue = null;
+ cleanup();
+ };
+
+ const unresponsiveListener = () => {
+ reject(new Error('Window was unresponsive'));
+ cleanup();
+ };
+
+ const errorListener = (event, message) => {
+ reject(new Error(message));
+ event.returnValue = null;
+ cleanup();
+ };
+
+ ipcMain.on('prompt-get-options:' + id, getOptionsListener);
+ ipcMain.on('prompt-post-data:' + id, postDataListener);
+ ipcMain.on('prompt-error:' + id, errorListener);
+ ipcMain.on('prompt-size:' + id, sizeListener);
+ promptWindow.on('unresponsive', unresponsiveListener);
+
+ promptWindow.on('closed', () => {
+ promptWindow = null;
+ cleanup();
+ resolve(null);
+ });
+
+ promptWindow.loadFile(pageFile,{hash: id}).then();
+ });
+}
+
 module.exports = {
- getCredentialPassphrase
+ getCredentialPassphrase,
+ showAboutDialog
 };
diff --git a/electron/app/js/wktWindow.js b/electron/app/js/wktWindow.js
@@ -13,6 +13,7 @@ const wdtDiscovery = require('./wdtDiscovery');
 const wktTools = require('./wktTools');
 const osUtils = require('./osUtils');
 const { getLogger, getDefaultLogDirectory } = require('./wktLogging');
+const { showAboutDialog } = require('./promptUtils');
 const { checkForUpdates } = require('./appUpdater');
 
 const appDir = path.normalize(path.join(__dirname, '..'));
@@ -610,20 +611,23 @@ class WktAppMenu {
  );
  }
 
- // Electron has no built-in About menu for Linux...
- if (!osUtils.isLinux()) {
- const helpMenu = appMenuTemplate.find(item => item.id === 'help');
- if (helpMenu) {
- helpMenu.submenu.push(
- { type: 'separator' },
- {
- id: 'about',
- label: i18n.t('menu-help-about'),
- role: 'about',
- accelerator: 'Alt+A'
+ // Use custom About dialog for non-MacOS platforms.
+ // Built-in About menu not supported for Linux (in current version).
+ // Built-in About menu for Windows lacks build version, has title and modal issues.
+ const helpMenu = appMenuTemplate.find(item => item.id === 'help');
+ if (helpMenu) {
+ const wktApp = this._wktApp;
+ helpMenu.submenu.push(
+ { type: 'separator' },
+ {
+ id: 'about',
+ label: i18n.t('menu-help-about'),
+ accelerator: 'Alt+A',
+ click(item, focusedWindow) {
+ showAboutDialog(wktApp, focusedWindow);
  }
- );
- }
+ }
+ );
  }
  }
 

diff --git a/electron/app/locales/en/webui.json b/electron/app/locales/en/webui.json
@@ -147,6 +147,8 @@
  "dialog-passphrase-prompt-title": "Credential Encryption Passphrase",
  "dialog-passphrase-prompt-label": "Please enter the passphrase to use to encrypt the project credential.",
 
+ "dialog-about-version": "Version {{version}} ({{buildVersion}})",
+
  "model-design-coming-soon": "Coming Soon...",
 
  "image-page-hints-createImage": "Create Image",