Airplane mode in full effect

README.md

@@ -3,7 +3,8 @@
 <br/>
 
 This project packages Remix, the excellent Ethereum Solidity IDE, into
-a dedicated desktop application that runs from your local machine.
+a dedicated desktop application that runs from your local machine. Remix-app
+also caches solc compiler downloads so Remix is fully usable in airplane mode.
 
 <img align="center" alt="screenshot" src="https://raw.githubusercontent.com/horizon-games/remix-app/master/resources/screenshot.png" width="1024" />
 

package.json

@@ -18,23 +18,28 @@
       "buildResources": "resources"
     },
     "mac": {
-      "target": ["dmg"]
+      "target": [
+        "dmg"
+      ]
     },
     "linux": {
-      "target": ["tar.gz"]
+      "target": [
+        "tar.gz"
+      ]
     }
   },
   "scripts": {
     "postinstall": "node scripts/remix-dl.js",
     "dev": "node scripts/start.js",
     "build": "webpack --config=webpack.config.js --env=production",
     "pack": "yarn dist:all --dir",
-    "dist": "electron-builder",
+    "dist": "yarn build && electron-builder",
     "dist:all": "yarn dist -ml",
     "dist:mac": "yarn dist -m",
     "dist:linux": "yarn dist -l"
   },
   "dependencies": {
+    "electron-fetch": "^1.1.0",
     "fs-jetpack": "^1.3.0"
   },
   "devDependencies": {
@@ -43,7 +48,7 @@
     "babel-loader": "8.0.0-beta.0",
     "babel-plugin-transform-object-rest-spread": "7.0.0-beta.3",
     "electron": "1.8.2",
-    "electron-builder": "20.0.4",
+    "electron-builder": "20.0.5",
     "request": "^2.83.0",
     "rimraf": "^2.6.2",
     "source-map-support": "^0.5.3",

src/helpers/app_cache.js

@@ -0,0 +1,76 @@
+import { BrowserWindow, webContents } from 'electron'
+import fs from 'fs'
+import path from 'path'
+import jetpack from 'fs-jetpack'
+import fetch from 'electron-fetch'
+
+const registerAppCache = (browserWindow, userDataPath) => {
+
+  // Attempt to fetch the list.json to determine if we're online
+  // and the contents are available, in this case, we will always
+  // fetch the latest list of available compilers, but fallback
+  // to a local version if available.
+  let getList = false
+  const listURL = 'https://ethereum.github.io/solc-bin/bin/list.json'
+  const resp = fetch(listURL)
+  resp.then((resp) => {
+    if (resp.status === 200) {
+      getList = true
+    }
+  }).catch((err) => {
+    getList = false
+  })
+
+  const filter = {
+    urls: ['https://ethereum.github.io/solc-bin/bin/*']
+  }
+
+  const session = browserWindow.webContents.session
+
+  session.webRequest.onBeforeRequest(filter, (details, callback) => {
+    const resourceURL = details.url
+    const resourceFilename = getFilename(resourceURL)
+    const localFile = cachedFilePath(userDataPath, resourceURL)
+
+    // Always fetch the new list.json if we're online
+    if (getList && resourceFilename === 'list.json') {
+      callback({ cancel: false })
+      return
+    }
+
+    // Serve locally cached files if they are available
+    if (fs.existsSync(localFile)) {
+      callback({
+        cancel: false,
+        redirectURL: `file://${localFile}`
+      })
+    } else {
+      callback({ cancel: false })
+    }
+  })
+
+  session.webRequest.onCompleted(filter, (details) => {
+    const resourceURL = details.url
+
+    const resp = fetch(resourceURL)
+
+    resp.then((resp) => {
+      if (resp.status === 200) {
+        const filename = getFilename(resourceURL)
+        const dest = fs.createWriteStream(cachedFilePath(userDataPath, resourceURL))
+        resp.body.pipe(dest)
+      }
+    }).catch((err) => {})
+  })
+
+}
+
+const getFilename = (url) => {
+  return url.split('/').pop()
+}
+
+const cachedFilePath = (userDataPath, url) => {
+  return path.join(userDataPath, getFilename(url))
+}
+
+export { registerAppCache }

src/helpers/menu.js

@@ -1,36 +1,36 @@
-import { app, shell, BrowserWindow, BrowserView } from "electron"
+import { app, shell, BrowserWindow, BrowserView } from 'electron'
 
-const pkgJson = require("../../package.json")
+const pkgJson = require('../../package.json')
 
 function buildMenu(mainWindow) {
   let menu = [
     {
-      label: "Edit",
+      label: 'Edit',
       submenu: [
-        { role: "undo" },
-        { role: "redo" },
-        { type: "separator" },
-        { role: "cut" },
-        { role: "copy" },
-        { role: "paste" },
-        { role: "selectall" }
+        { role: 'undo' },
+        { role: 'redo' },
+        { type: 'separator' },
+        { role: 'cut' },
+        { role: 'copy' },
+        { role: 'paste' },
+        { role: 'selectall' }
       ]
     },
     {
-      role: "window",
+      role: 'window',
       submenu: [
-        { role: "minimize" },
+        { role: 'minimize' },
         {
-          label: "Close",
-          accelerator: "Cmd+W",
+          label: 'Close',
+          accelerator: 'Cmd+W',
           click: () => {
             const win = BrowserWindow.getFocusedWindow()
             if (win === null) {
               if (mainWindow.isDevToolsFocused()) {
                 mainWindow.closeDevTools()
               }
             } else {
-              if (process.platform === "darwin") {
+              if (process.platform === 'darwin') {
                 app.hide()
               } else {
                 win.close()
@@ -41,22 +41,22 @@ function buildMenu(mainWindow) {
       ]
     },
     {
-      label: "Inspector",
+      label: 'Inspector',
       submenu: [
         {
-          label: "Toggle DevTools",
-          accelerator: "Alt+CmdOrCtrl+I",
+          label: 'Toggle DevTools',
+          accelerator: 'Alt+CmdOrCtrl+I',
           click: () => {
             BrowserWindow.getFocusedWindow().toggleDevTools();
           }
         }
       ]
     },
     {
-      role: "help",
+      role: 'help',
       submenu: [
         {
-          label: "Learn More",
+          label: 'Learn More',
           click: () => {
             shell.openExternal(pkgJson.homepage)
           }
@@ -65,19 +65,19 @@ function buildMenu(mainWindow) {
     }
   ]
 
-  if (process.platform === "darwin") {
+  if (process.platform === 'darwin') {
     menu.unshift({
       label: app.getName(),
       submenu: [
-        { role: "about" },
-        { type: "separator" },
-        { role: "services", submenu: [] },
-        { type: "separator" },
-        { role: "hide" },
-        { role: "hideothers" },
-        { role: "unhide" },
-        { type: "separator" },
-        { role: "quit" }
+        { role: 'about' },
+        { type: 'separator' },
+        { role: 'services', submenu: [] },
+        { type: 'separator' },
+        { role: 'hide' },
+        { role: 'hideothers' },
+        { role: 'unhide' },
+        { type: 'separator' },
+        { role: 'quit' }
       ]
     })
   }

src/helpers/window.js

@@ -1,13 +1,8 @@
-// This helper remembers the size and position of your windows (and restores
-// them in that place after app relaunch).
-// Can be used for more than one window, just construct many
-// instances of it and give each different name.
-
-import { app, BrowserWindow, screen } from "electron"
-import jetpack from "fs-jetpack"
+import { app, BrowserWindow, screen } from 'electron'
+import jetpack from 'fs-jetpack'
 
 export default (name, options) => {
-  const userDataDir = jetpack.cwd(app.getPath("userData"))
+  const userDataDir = jetpack.cwd(app.getPath('userData'))
   const stateStoreFile = `window-state-${name}.json`
   const defaultSize = {
     width: options.width,
@@ -19,7 +14,7 @@ export default (name, options) => {
   const restore = () => {
     let restoredState = {}
     try {
-      restoredState = userDataDir.read(stateStoreFile, "json")
+      restoredState = userDataDir.read(stateStoreFile, 'json')
     } catch (err) {
       // For some reason json can't be read (might be corrupted).
       // No worries, we have defaults.
@@ -78,7 +73,7 @@ export default (name, options) => {
 
   win = new BrowserWindow(Object.assign({}, options, state))
 
-  win.on("close", saveState)
+  win.on('close', saveState)
 
   return win
 }