diff --git a/electron-template/package.json b/electron-template/package.json index 13191e20c..0230fffcc 100644 --- a/electron-template/package.json +++ b/electron-template/package.json @@ -10,7 +10,7 @@ "electron-is-dev": "^1.1.0" }, "devDependencies": { - "electron": "^4.0.0" + "electron": "^7.0.0" }, "keywords": [ "capacitor", diff --git a/electron/index.js b/electron/index.js index bf6574b66..b1c9821c7 100644 --- a/electron/index.js +++ b/electron/index.js @@ -1,26 +1,27 @@ const fs = require('fs'); const path = require('path'); +const url = require('url'); const { app, ipcMain, BrowserWindow } = require('electron'); function getURLFileContents(path) { console.trace(); return new Promise((resolve, reject) => { fs.readFile(path, (err, data) => { - if(err) + if (err) reject(err); resolve(data.toString()); }); }); } -const injectCapacitor = async function(url) { +const injectCapacitor = async function (url) { console.warn('\nWARNING: injectCapacitor method is deprecated and will be removed in next major release. Check release notes for migration instructions\n') try { let urlFileContents = await getURLFileContents(url.substr(url.indexOf('://') + 3)); let pathing = path.join(url.substr(url.indexOf('://') + 3), '../../node_modules/@capacitor/electron/dist/electron-bridge.js'); - urlFileContents = urlFileContents.replace('', ``); + urlFileContents = urlFileContents.replace('', ``); return 'data:text/html;charset=UTF-8,' + urlFileContents; - } catch(e) { + } catch (e) { console.error(e); return url; } @@ -45,7 +46,7 @@ class CapacitorSplashScreen { this.mainWindowRef = null; this.splashWindow = null; - if(!splashOptions) { + if (!splashOptions) { splashOptions = {}; } @@ -67,7 +68,7 @@ class CapacitorSplashScreen { let capConfigJson = JSON.parse(fs.readFileSync(`./capacitor.config.json`, 'utf-8')); this.splashOptions = Object.assign( this.splashOptions, - capConfigJson.plugins.SplashScreen + capConfigJson.plugins.SplashScreen || {} ); } catch (e) { console.error(e.message); @@ -75,8 +76,8 @@ class CapacitorSplashScreen { ipcMain.on('showCapacitorSplashScreen', (event, options) => { this.show(); - if(options) { - if(options.autoHide) { + if (options) { + if (options.autoHide) { let showTime = options.showDuration || 3000; setTimeout(() => { this.hide(); @@ -93,19 +94,31 @@ class CapacitorSplashScreen { init(inject = true) { let rootPath = app.getAppPath(); - this.splashWindow = new BrowserWindow({ width: this.splashOptions.windowWidth, height: this.splashOptions.windowHeight, frame: false, show: false, transparent: this.splashOptions.transparentWindow, + webPreferences: { + // Required to load file:// splash screen + webSecurity: false + } }); + let imagePath = path.join(rootPath, 'splash_assets', this.splashOptions.imageFileName); + let imageUrl = ''; + let useFallback = false; + try { + imageUrl = url.pathToFileURL(imagePath).href; + } catch (err) { + useFallback = true; + imageUrl = `./${this.splashOptions.imageFileName}`; + } + let splashHtml = this.splashOptions.customHtml || ` - -
+
${this.splashOptions.loadingText}
@@ -113,25 +126,29 @@ class CapacitorSplashScreen { `; this.mainWindowRef.on('closed', () => { - if (this.splashWindow && !this.splashWindow.isDestroyed()) { - this.splashWindow.close(); + if (this.splashWindow && !this.splashWindow.isDestroyed()) { + this.splashWindow.close(); } }); - this.splashWindow.loadURL(`data:text/html;charset=UTF-8,${splashHtml}`, {baseURLForDataURL: `file://${rootPath}/splash_assets/`}); + if (useFallback) { + this.splashWindow.loadURL(`data:text/html;charset=UTF-8,${splashHtml}`, {baseURLForDataURL: `file://${rootPath}/splash_assets/`}); + } else { + this.splashWindow.loadURL(`data:text/html;charset=UTF-8,${splashHtml}`); + } this.splashWindow.webContents.on('dom-ready', async () => { this.splashWindow.show(); setTimeout(async () => { if (inject) { - this.mainWindowRef.loadURL(await injectCapacitor(`file://${rootPath}/app/index.html`), {baseURLForDataURL: `file://${rootPath}/app/`}); + this.mainWindowRef.loadURL(await injectCapacitor(`file://${rootPath}/app/index.html`), { baseURLForDataURL: `file://${rootPath}/app/` }); } else { this.mainWindowRef.loadURL(`file://${rootPath}/app/index.html`); } }, 4500); }); - if(this.splashOptions.autoHideLaunchSplash) { + if (this.splashOptions.autoHideLaunchSplash) { this.mainWindowRef.webContents.on('dom-ready', () => { this.mainWindowRef.show(); this.splashWindow.hide();