Merge pull request #113 from stratisproject/ui

- Edit packaging scripts
- Allow SCSS
- Update dependencies
- Improved readme
- Removed old files

.gitignore

@@ -240,6 +240,7 @@ ModelManifest.xml
 
 # UI ignores
 # compiled output
+**/app-builds
 **/dist
 **/tmp
 **/build

Breeze.UI/angular-cli.json → Breeze.UI/.angular-cli.json

@@ -51,19 +51,8 @@
     }
   },
   "defaults": {
-    "styleExt": "css",
-    "prefixInterfaces": false,
-    "inline": {
-      "style": false,
-      "template": false
-    },
-    "spec": {
-      "class": false,
-      "component": true,
-      "directive": true,
-      "module": false,
-      "pipe": true,
-      "service": true
+    "styleExt": "scss",
+    "component": {
     }
   }
 }

Breeze.UI/README.md

 # Breeze-UI
 
 Graphical User Interface for Stratis Breeze Wallet.
+
+## Getting Started
+
+Clone this repository locally:
+
+``` bash
+git clone https://www.github.com/stratisproject/breeze.git
+```
+
+Navigate to the Breeze UI in a terminal:
+``` bash
+cd ./Breeze/Breeze.UI
+```
+
+Install dependencies with npm:
+
+``` bash
+npm install
+```
+
+There is an issue with `yarn` and `node_modules` that are only used in electron on the backend when the application is built by the packager. Please use `npm` as dependencies manager.
+
+If you want to generate Angular components with Angular-cli , you **MUST** install `@angular/cli` in npm global context.  
+Please follow [Angular-cli documentation](https://github.com/angular/angular-cli) if you had installed a previous version of `angular-cli`.
+
+``` bash
+npm install -g @angular/cli
+```
+
+## To build for development
+
+- **in a terminal window** -> npm start
+- **in another terminal window** -> npm run electron:serve
+
+## To build for production
+
+- Using development variables (environments/index.ts) :  `npm run electron:dev`
+- Using production variables (environments/index.prod.ts) :  `npm run electron:prod`
+
+Your built files are in the /dist folder.
+
+## Included Commands
+
+|Command|Description|
+|--|--|
+|`npm run start:web`| Execute the app in the brower |
+|`npm run package:linux`| Builds your application and creates an app consumable on linux system |
+|`npm run package:windows`| On a Windows OS, builds your application and creates an app consumable in windows 32/64 bit systems |
+|`npm run package:mac`|  On a MAC OS, builds your application and generates a `.app` file of your application that can be run on Mac |
+
+**The application is optimised. Only the files of /dist folder are included in the executable.**

Breeze.UI/db.json

-{
-    "files": {
-        "walletsPath": "/home/dev0tion/Desktop/Wallets",
-        "walletsFiles": [
-            "myFirstWallet.json",
-            "mySecondWallet.json"
-        ]
-    },
-    "status":
-    {
-        "connectedNodeCount": "7",
-        "maxConnextedNodeCount": "8",
-        "headerChainHeight": "1048",
-        "trackingHeight": "1047",
-        "trackedTransactionCount": "306",
-        "trackedScriptPubKeyCount": "100",
-        "walletState": "syncingBlocks",
-        "historyChangeBump": "231321"
-    },
-    "balance": 
-    {
-        "synced": "true",
-        "confirmed": "0.144",
-        "unconfirmed": "-6.23"
-    },
-    "history":
-    {
-        "history": 
-        [
-            {
-            "txid": "9a9949476b629b4075b31d8faad64dad352586a18df8f2810c5a7bb900478c60",
-            "amount": "0.1",
-            "confirmed": "true",
-            "timestamp": "2016.12.19. 23:15:05"
-            },
-            {
-            "txid": "9a9949476b629b4075b31d8faad64dad352586a18df8f2810c5a7bb900478c60",
-            "amount": "-0.1",
-            "confirmed": "false",
-            "timestamp": "2016.12.20. 1:15:36"
-            }
-        ]
-    },
-    "receive":
-    {
-        "addresses":
-        [
-            "mzz63n3n89KVeHQXRqJEVsQX8MZj5zeqCw",
-            "mhm1pFe2hH7yqkdQhwbBQ8qLnMZqfL6jXb",
-            "mmRzqMDBrfNxMfryQSYec3rfPHXURNapBA",
-            "my2ELDBqLGVz1ER7CMynDqG4BUpV2pwfR5",
-            "mmwccp4GefhPn4P6Mui6DGLGzHTVyQ12tD",
-            "miTedyDXJAz6GYMRasiJk9M3ibnGnb99M1",
-            "mrsb39MmPceSPfKAURTH23hYgLRH1M1Uhg"
-        ]
-    }
-}
\ No newline at end of file

Breeze.UI/karma.conf.js

@@ -7,13 +7,12 @@ module.exports = function (config) {
     frameworks: ['jasmine', '@angular/cli'],
     plugins: [
       require('karma-jasmine'),
-      require('karma-electron'),
+      require('karma-chrome-launcher'),
       require('karma-jasmine-html-reporter'),
       require('karma-coverage-istanbul-reporter'),
       require('@angular/cli/plugins/karma')
     ],
     client:{
-      useIframe: false,
       clearContext: false // leave Jasmine Spec Runner output visible in browser
     },
     files: [
@@ -30,7 +29,6 @@ module.exports = function (config) {
       fixWebpackSourcePaths: true
     },
     angularCli: {
-      config: './angular-cli.json',
       environment: 'dev'
     },
     reporters: config.angularCli && config.angularCli.codeCoverage
@@ -40,7 +38,7 @@ module.exports = function (config) {
     colors: true,
     logLevel: config.LOG_INFO,
     autoWatch: true,
-    browsers: ['Electron'],
+    browsers: ['Chrome'],
     singleRun: false
   });
 };

Breeze.UI/src/electron.js → Breeze.UI/main.ts

-const electron = require('electron')
+const electron = require('electron');
 
 // Module to control application life.
-const app = electron.app
+const app = electron.app;
 // Module to create native browser window.
-const BrowserWindow = electron.BrowserWindow
+const BrowserWindow = electron.BrowserWindow;
 
-const path = require('path')
-const url = require('url')
+const path = require('path');
+const url = require('url');
+const os = require('os');
+
+// import { app, BrowserWindow, screen } from 'electron';
+// import * as path from 'path';
+
+let serve;
+const args = process.argv.slice(1);
+serve = args.some(val => val === "--serve");
+
+if (serve) {
+  require('electron-reload')(__dirname, {});
+}
 
 // Keep a global reference of the window object, if you don't, the window will
 // be closed automatically when the JavaScript object is garbage collected.
 let mainWindow = null;
 
-function createWindow () {
+function createWindow() {
+
   // Create the browser window.
-  mainWindow = new BrowserWindow({width: 1200, height: 700, frame: true, minWidth: 1200, minHeight: 700, icon: "./assets/images/stratis-tray.png"})
+  mainWindow = new BrowserWindow({width: 1200, height: 700, frame: true, minWidth: 1200, minHeight: 700, icon: "./assets/images/stratis-tray.png"});
+
+
 
    // and load the index.html of the app.
   mainWindow.loadURL(url.format({
-    pathname: path.join(__dirname, 'index.html'),
+    pathname: path.join(__dirname, '/index.html'),
     protocol: 'file:',
     slashes: true
-  }))
+  }));
+  // and load the index.html of the app.
+  // win.loadURL('file://' + __dirname + '/index.html');
+
+  if (serve) {
+    mainWindow.webContents.openDevTools();
+  }
 
   // Emitted when the window is closed.
   mainWindow.on('closed', function () {
     // Dereference the window object, usually you would store windows
     // in an array if your app supports multi windows, this is the time
     // when you should delete the corresponding element.
-    mainWindow = null
-  })
+    mainWindow = null;
+  });
 }
-
 // This method will be called when Electron has finished
 // initialization and is ready to create browser windows.
 // Some APIs can only be used after this event occurs.
 app.on('ready', function () {
-  createTray()
-  createWindow()
+  //startApi();
+  createTray();
+  createWindow();
 })
 
 // Quit when all windows are closed.
@@ -45,38 +66,64 @@ app.on('window-all-closed', function () {
   // On OS X it is common for applications and their menu bar
   // to stay active until the user quits explicitly with Cmd + Q
   if (process.platform !== 'darwin') {
-    app.quit()
+    app.quit();
   }
-})
+});
 
 app.on('activate', function () {
   // On OS X it's common to re-create a window in the app when the
   // dock icon is clicked and there are no other windows open.
   if (mainWindow === null) {
-    createWindow()
+    createWindow();
   }
-})
+});
+
+function startApi() {
+  let apiProcess;
+  var spawn = require('child_process').spawn;
+
+  //Start Breeze Daemon
+  apipath = path.join(__dirname, '');
+  if (os.platform() === 'win32') {
+      var apipath = path.join(__dirname, '');
+  }
+
+  apiProcess = spawn(apipath, {
+      detached: true
+  });
+
+  apiProcess.stdout.on('data', (data) => {
+      writeLog(`stdout: ${data}`);
+      if (mainWindow == null) {
+          createWindow();
+      }
+  });
+}
 
 function createTray() {
   //Put the app in system tray
-  const Menu = electron.Menu
-  const Tray = electron.Tray
+  const Menu = electron.Menu;
+  const Tray = electron.Tray;
 
-  let appIcon = null
+  let appIcon = null;
 
-  const iconName = process.platform === 'win32' ? './assets/images/stratis-tray.png' : './assets/images/stratis-tray.png'
-  const iconPath = path.join(__dirname, iconName)
-  appIcon = new Tray(iconPath)
+  const iconName = process.platform === 'win32' ? './assets/images/stratis-tray.png' : './assets/images/stratis-tray.png';
+  const iconPath = path.join(__dirname, iconName);
+  appIcon = new Tray(iconPath);
   const contextMenu = Menu.buildFromTemplate([{
     label: 'Hide/Show',
     click: function () {
       mainWindow.isVisible() ? mainWindow.hide() : mainWindow.show();
     }
-  }])
-  appIcon.setToolTip('Breeze Wallet')
-  appIcon.setContextMenu(contextMenu)
+  }]);
+  appIcon.setToolTip('Breeze Wallet');
+  appIcon.setContextMenu(contextMenu);
 
   app.on('window-all-closed', function () {
-    if (appIcon) appIcon.destroy()
-  })
-}
+    if (appIcon) appIcon.destroy();
+  });
+};
+
+function writeLog(msg) {
+    console.log(msg);
+};

Breeze.UI/package.js

+"use strict";
+
+var packager = require('electron-packager');
+const pkg = require('./package.json');
+const argv = require('minimist')(process.argv.slice(1));
+
+const appName = argv.name || pkg.name;
+const buildVersion = pkg.version || '1.0';
+const shouldUseAsar = argv.asar || false;
+const shouldBuildAll = argv.all || false;
+const arch = argv.arch || 'all';
+const platform = argv.platform || 'darwin';
+
+const DEFAULT_OPTS = {
+    dir: './dist',
+    name: appName,
+    asar: shouldUseAsar,
+    buildVersion: buildVersion
+};
+
+
+pack(platform, arch, function done(err, appPath) {
+    if (err) {
+        console.log(err);
+    } else {
+        console.log('Application packaged successfuly!', appPath);
+    }
+
+});
+
+function pack(plat, arch, cb) {
+    // there is no darwin ia32 electron
+    if (plat === 'darwin' && arch === 'ia32') return;
+
+    let icon = 'src/favicon';
+
+    if (icon) {
+        DEFAULT_OPTS.icon = icon + (() => {
+            let extension = '.png';
+            if (plat === 'darwin') {
+                extension = '.icns';
+            } else if (plat === 'win32') {
+                extension = '.ico';
+            }
+            return extension;
+        })();
+    }
+
+    const opts = Object.assign({}, DEFAULT_OPTS, {
+        platform: plat,
+        arch,
+        prune: true,
+        overwrite: true,
+        all: shouldBuildAll,
+        out: `app-builds`
+    });
+
+    console.log(opts)
+    packager(opts, cb);
+}

Breeze.UI/package.json

 {
-  "name": "breeze",
-  "description": "Graphical User Interface for the Breeze Wallet.",
+  "name": "breeze-ui",
+  "description": "Graphical User Interface for Breeze Wallet.",
   "version": "0.1.0",
+  "author":{
+    "name": "Pieterjan Vanhoof",
+    "email": "pieterjan.vanhoof@stratisplatform.com"
+  },
   "license": "MIT",
-  "main": "dist/electron.js",
+  "homepage": "https://github.com/stratisproject/breeze",
+  "keywords": [
+    "breeze",
+    "ui",
+    "stratis",
+    "angular",
+    "electron"
+  ],
+  "main": "main.js",
   "angular-cli": {},
   "scripts": {
-    "run": "electron .",
-    "start": "concurrently \"webpack-dev-server --port=4200\" \"electron src/electron.live.js\"",
     "ng": "ng",
-    "build": "webpack",
-    "test": "karma start ./karma.conf.js",
     "lint": "ng lint",
-    "e2e": "protractor ./protractor.conf.js",
-    "prepree2e": "npm start",
-    "pree2e": "webdriver-manager update --standalone false --gecko false --quiet",
-    "package:linux": "electron-packager . $npm_package_name-$npm_package_version --ignore=src --ignore=node_modules --ignore=e2e --ignore=.*\\.conf\\.js --ignore=\"(angular-cli|tsconfig)\\.json\" --ignore=webpack.*\\.js --out=packages --platform=linux --arch=all --overwrite",
-    "package:mac": "electron-packager . $npm_package_name-$npm_package_version --ignore=src --ignore=node_modules --ignore=e2e --ignore=.*\\.conf\\.js --ignore=\"(angular-cli|tsconfig)\\.json\" --ignore=webpack.*\\.js --out=packages --platform=darwin --arch=all --overwrite ",
-    "package:win": "electron-packager . $npm_package_name-$npm_package_version --ignore=src --ignore=node_modules --ignore=e2e --ignore=.*\\.conf\\.js --ignore=\"(angular-cli|tsconfig)\\.json\" --ignore=webpack.*\\.js --out=packages --platform=win32 --arch=all --overwrite ",
-    "package:all": "electron-packager . $npm_package_name-$npm_package_version --ignore=src --ignore=node_modules --ignore=e2e --ignore=.*\\.conf\\.js --ignore=\"(angular-cli|tsconfig)\\.json\" --ignore=webpack.*\\.js --out=packages --all --overwrite"
+    "start": "webpack --watch",
+    "start:web": "webpack-dev-server --content-base . --port 4200 --inline",
+    "build:electron:main": "tsc main.ts --outDir dist && copyfiles package.json dist && cd dist && npm install --prod && cd ..",
+    "build": "webpack --display-error-details && npm run build:electron:main",
+    "build:prod": "npm run build",
+    "electron:serve": "npm run build:electron:main && electron ./dist --serve",
+    "electron:test": "electron ./dist",
+    "electron:dev": "npm run build && electron ./dist",
+    "electron:prod": "npm run build:prod && electron ./dist",
+    "package:linux": "npm run build:prod && node package.js --asar --platform=linux --arch=x64",
+    "package:windows": "npm run build:prod && node package.js --asar --platform=win32 --arch=ia32",
+    "package:mac": "npm run build:prod && node package.js --asar --platform=darwin --arch=x64",
+    "test": "karma start ./karma.conf.js",
+    "pree2e": "webdriver-manager update --standalone false --gecko false --quiet && npm run build",
+    "e2e": "protractor ./protractor.conf.js"
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^4.1.2",
-    "@angular/common": "^4.1.2",
-    "@angular/compiler": "^4.1.2",
-    "@angular/compiler-cli": "^4.1.2",
-    "@angular/core": "^4.1.2",
-    "@angular/forms": "^4.1.2",
-    "@angular/http": "^4.1.2",
-    "@angular/platform-browser": "^4.1.2",
-    "@angular/platform-browser-dynamic": "^4.1.2",
-    "@angular/platform-server": "^4.1.2",
-    "@angular/router": "^4.1.2",
-    "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.25",
+    "@angular/animations": "^4.2.4",
+    "@angular/common": "^4.2.4",
+    "@angular/compiler": "^4.2.4",
+    "@angular/core": "^4.2.4",
+    "@angular/forms": "^4.2.4",
+    "@angular/http": "^4.2.4",
+    "@angular/platform-browser": "^4.2.4",
+    "@angular/platform-browser-dynamic": "^4.2.4",
+    "@angular/platform-server": "^4.2.4",
+    "@angular/router": "^4.2.4",
+    "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.26",
     "angular2-material-datepicker": "^0.5.0",
     "bootstrap": "^4.0.0-alpha.6",
     "core-js": "^2.4.1",
     "ngx-clipboard": "^8.0.2",
-    "rxjs": "^5.4.0",
-    "zone.js": "^0.8.10"
+    "rxjs": "^5.4.1",
+    "zone.js": "^0.8.12"
   },
   "devDependencies": {
-    "@angular/cli": "^1.0.3",
-    "@angular/compiler-cli": "^4.1.2",
-    "@types/electron": "^1.4.37",
-    "@types/jasmine": "2.5.47",
-    "@types/node": "~7.0.18",
-    "autoprefixer": "^7.0.1",
-    "codelyzer": "3.0.1",
-    "concurrently": "^3.4.0",
-    "copy-webpack-plugin": "4.0.1",
-    "css-loader": "^0.28.1",
+    "@angular/cli": "^1.1.3",
+    "@angular/compiler-cli": "^4.2.4",
+    "@types/jasmine": "2.5.53",
+    "@types/node": "~8.0.3",
+    "autoprefixer": "^7.1.1",
+    "codelyzer": "3.1.1",
+    "concurrently": "^3.5.0",
+    "copyfiles": "1.2.0",
+    "cross-env": "4.0.0",
+    "css-loader": "^0.28.4",
     "cssnano": "^3.10.0",
-    "electron": "^1.6.7",
-    "electron-packager": "^8.7.0",
+    "electron": "^1.6.11",
+    "electron-packager": "^8.7.2",
+    "electron-reload": "1.2.1",
     "exports-loader": "^0.6.4",
-    "extract-text-webpack-plugin": "^2.1.0",
-    "file-loader": "^0.11.1",
-    "html-webpack-plugin": "^2.28.0",
+    "extract-zip": "1.6.5",
+    "file-loader": "^0.11.2",
+    "html-loader": "0.4.5",
     "istanbul-instrumenter-loader": "^2.0.0",
-    "jasmine-core": "~2.6.1",
-    "jasmine-spec-reporter": "~4.1.0",
+    "jasmine-core": "~2.6.4",
+    "jasmine-spec-reporter": "~4.1.1",
     "json-loader": "^0.5.4",
     "karma": "~1.7.0",
-    "karma-chrome-launcher": "~2.1.1",
+    "karma-chrome-launcher": "~2.2.0",
     "karma-cli": "~1.0.1",
-    "karma-coverage-istanbul-reporter": "^1.2.1",
+    "karma-coverage-istanbul-reporter": "^1.3.0",
     "karma-electron": "^5.2.1",
     "karma-jasmine": "~1.1.0",
     "karma-jasmine-html-reporter": "^0.2.2",
     "karma-sourcemap-loader": "^0.3.7",
-    "less-loader": "^4.0.3",
+    "less-loader": "^4.0.4",
+    "minimist": "1.2.0",
+    "mkdirp": "0.5.1",
     "postcss-loader": "^1.3.3",
     "postcss-url": "^6.0.4",
-    "protractor": "~5.1.1",
+    "protractor": "~5.1.2",
     "raw-loader": "^0.5.1",
-    "sass-loader": "^6.0.5",
+    "sass-loader": "^6.0.6",
     "script-loader": "^0.7.0",
     "source-map-loader": "^0.2.1",
-    "style-loader": "^0.17.0",
+    "style-loader": "^0.18.2",
     "stylus-loader": "^3.0.1",
-    "ts-node": "~3.0.4",
-    "tslint": "~5.2.0",
-    "typescript": "^2.3.2",
-    "url-loader": "^0.5.8",
-    "webpack": "^2.5.1",
-    "webpack-dev-server": "~2.4.5"
+    "ts-node": "~3.1.0",
+    "tslint": "~5.4.3",
+    "typescript": "^2.3.4",
+    "url-loader": "^0.5.9",
+    "webdriver-manager": "12.0.6",
+    "webpack": "^3.0.0",
+    "webpack-dev-server": "~2.5.0"
   }
 }

Breeze.UI/protractor.conf.js

 // Protractor configuration file, see link for more information
 // https://github.com/angular/protractor/blob/master/lib/config.ts
 
-/*global jasmine */
-// let SpecReporter = require('jasmine-spec-reporter').SpecReporter;
 const { SpecReporter } = require('jasmine-spec-reporter');
 
 exports.config = {
@@ -11,11 +9,11 @@ exports.config = {
     './e2e/**/*.e2e-spec.ts'
   ],
   capabilities: {
+    'browserName': 'chrome',
     chromeOptions: {
-      binary: './node_modules/electron/dist/electron',
-      args: ['--test-type=webdriver']
-    },
-    'browserName': 'chrome'
+        binary: './node_modules/electron/dist/electron.exe',
+        args: ['--test-type=webdriver', 'app=dist/main.js']
+    }
   },
   directConnect: true,
   baseUrl: 'http://localhost:4200/',
@@ -25,13 +23,12 @@ exports.config = {
     defaultTimeoutInterval: 30000,
     print: function() {}
   },
-  useAllAngular2AppRoots: true,
   beforeLaunch: function() {
     require('ts-node').register({
       project: 'e2e/tsconfig.e2e.json'
     });
   },
-  onPrepare: function() {
-    jasmine.getEnv().addReporter(new SpecReporter());
+  onPrepare() {
+    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
   }
 };

Breeze.UI/routes.json

-{
-  "/api/v1/wallet/": "/",
-  "/api/v1/setup/": "/"
-}
\ No newline at end of file

Breeze.UI/src/app/shared/services/api.service.ts

@@ -13,8 +13,7 @@ import { TransactionBuilding } from '../classes/transaction-building';
 import { TransactionSending } from '../classes/transaction-sending';
 
 /**
- * For information on the API specification have a look at our Github:
- * https://github.com/stratisproject/Breeze/blob/master/Breeze.Documentation/ApiSpecification.md
+ * For information on the API specification have a look at our swagger files located at http://localhost:5000/swagger/ when running the daemon
  */
 @Injectable()
 export class ApiService {

Breeze.UI/src/electron.live.js

-const electron = require('electron')
-
-// Module to control application life.
-const app = electron.app
-// Module to create native browser window.
-const BrowserWindow = electron.BrowserWindow
-
-const path = require('path')
-const url = require('url')
-
-// Keep a global reference of the window object, if you don't, the window will
-// be closed automatically when the JavaScript object is garbage collected.
-let mainWindow = null;
-
-function createWindow () {
-  setTimeout(() => {
-    // Create the browser window.
-    mainWindow = new BrowserWindow({width: 1200, height: 700, frame: true, minWidth: 1200, minHeight: 700, icon: "./src/assets/images/stratis-tray.png"})
-
-    mainWindow.loadURL(url.format({
-        pathname: 'localhost:4200',
-        protocol: 'http:',
-        slashes: true
-      }))
-
-    // Emitted when the window is closed.
-    mainWindow.on('closed', function () {
-      // Dereference the window object, usually you would store windows
-      // in an array if your app supports multi windows, this is the time
-      // when you should delete the corresponding element.
-      mainWindow = null
-    })
-  }, 50000)
-}
-
-// This method will be called when Electron has finished
-// initialization and is ready to create browser windows.
-// Some APIs can only be used after this event occurs.
-app.on('ready', function () {
-  createTray()
-  createWindow()
-})
-
-// Quit when all windows are closed.
-app.on('window-all-closed', function () {
-  // On OS X it is common for applications and their menu bar
-  // to stay active until the user quits explicitly with Cmd + Q
-  if (process.platform !== 'darwin') {
-    app.quit()
-  }
-})
-
-app.on('activate', function () {
-  // On OS X it's common to re-create a window in the app when the
-  // dock icon is clicked and there are no other windows open.
-  if (mainWindow === null) {
-    createWindow()
-  }
-})
-
-function createTray() {
-  //Put the app in system tray
-  const Menu = electron.Menu
-  const Tray = electron.Tray
-
-  let appIcon = null
-
-  const iconName = process.platform === 'win32' ? './assets/images/stratis-tray.png' : './assets/images/stratis-tray.png'
-  const iconPath = path.join(__dirname, iconName)
-  appIcon = new Tray(iconPath)
-  const contextMenu = Menu.buildFromTemplate([{
-    label: 'Hide/Show',
-    click: function () {
-      mainWindow.isVisible() ? mainWindow.hide() : mainWindow.show();
-    }
-  }])
-  appIcon.setToolTip('Breeze Wallet')
-  appIcon.setContextMenu(contextMenu)
-
-  app.on('window-all-closed', function () {
-    if (appIcon) appIcon.destroy()
-  })
-}

Breeze.UI/src/index.html

@@ -3,7 +3,7 @@
 <head>
   <meta charset="utf-8">
   <title>Breeze</title>
-  <base href="./">
+  <base href="">
   <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
   <meta name="viewport" content="width=device-width, initial-scale=1">
 </head>

Breeze.UI/src/main.ts

-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { enableProdMode } from '@angular/core';
-import { environment } from './environments/environment';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
 import { AppModule } from './app/app.module';
+import { environment } from 'environments';
 
 if (environment.production) {
   enableProdMode();

Breeze.UI/src/polyfills.ts

-// This file includes polyfills needed by Angular and is loaded before the app.
-// You can add your own extra polyfills to this file.
-import 'core-js/es6/symbol';
-import 'core-js/es6/object';
-import 'core-js/es6/function';
-import 'core-js/es6/parse-int';
-import 'core-js/es6/parse-float';
-import 'core-js/es6/number';
-import 'core-js/es6/math';
-import 'core-js/es6/string';
-import 'core-js/es6/date';
-import 'core-js/es6/array';
-import 'core-js/es6/regexp';
-import 'core-js/es6/map';
-import 'core-js/es6/set';
-import 'core-js/es6/reflect';
+/**
+ * This file includes polyfills needed by Angular and is loaded before the app.
+ * You can add your own extra polyfills to this file.
+ *
+ * This file is divided into 2 sections:
+ *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
+ *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
+ *      file.
+ *
+ * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
+ * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
+ * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
+ *
+ * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
+ */
+
+/***************************************************************************************************
+ * BROWSER POLYFILLS
+ */
+
+/** IE9, IE10 and IE11 requires all of the following polyfills. **/
+// import 'core-js/es6/symbol';
+// import 'core-js/es6/object';
+// import 'core-js/es6/function';
+// import 'core-js/es6/parse-int';
+// import 'core-js/es6/parse-float';
+// import 'core-js/es6/number';
+// import 'core-js/es6/math';
+// import 'core-js/es6/string';
+// import 'core-js/es6/date';
+// import 'core-js/es6/array';
+// import 'core-js/es6/regexp';
+// import 'core-js/es6/map';
+// import 'core-js/es6/set';
+
+/** IE10 and IE11 requires the following for NgClass support on SVG elements */
+// import 'classlist.js';  // Run `npm install --save classlist.js`.
+
+/** IE10 and IE11 requires the following to support `@angular/animation`. */
+// import 'web-animations-js';  // Run `npm install --save web-animations-js`.
+
 
+/** Evergreen browsers require these. **/
+import 'core-js/es6/reflect';
 import 'core-js/es7/reflect';
-import 'zone.js/dist/zone';
 
-// If you need to support the browsers/features below, uncomment the import
-// and run `npm install import-name-here';
-// Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
 
-// Needed for: IE9
-// import 'classlist.js';
+/** ALL Firefox browsers require the following to support `@angular/animation`. **/
+// import 'web-animations-js';  // Run `npm install --save web-animations-js`.
+
+
+
+/***************************************************************************************************
+ * Zone JS is required by Angular itself.
+ */
+import 'zone.js/dist/zone';  // Included with Angular CLI.
+
 
-// Animations
-// Needed for: All but Chrome and Firefox, Not supported in IE9
-// import 'web-animations-js';
 
-// Date, currency, decimal and percent pipes
-// Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
-// import 'intl';
+/***************************************************************************************************
+ * APPLICATION IMPORTS
+ */
 
-// NgClass on SVG elements
-// Needed for: IE10, IE11
-// import 'classlist.js';
+/**
+ * Date, currency, decimal and percent pipes.
+ * Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
+ */
+// import 'intl';  // Run `npm install --save intl`.

Breeze.UI/src/styles.scss

+/* You can add global styles to this file, and also import other style files */
+html, body {
+  margin: 0;
+  padding: 0;
+
+  height: 100%;
+}
+
+

Breeze.UI/src/test.ts

@@ -13,8 +13,8 @@ import {
 } from '@angular/platform-browser-dynamic/testing';
 
 // Unfortunately there's no typing for the `__karma__` variable. Just declare it as any.
-declare var __karma__: any;
-declare var require: any;
+declare const __karma__: any;
+declare const require: any;
 
 // Prevent Karma from running prematurely.
 __karma__.loaded = function () {};

Breeze.UI/src/tsconfig.app.json

@@ -4,12 +4,7 @@
     "outDir": "../out-tsc/app",
     "module": "es2015",
     "baseUrl": "",
-    "typeRoots": [
-        "../node_modules/@types"
-    ],
-    "types": [
-        "node"
-    ]
+    "types": []
   },
   "exclude": [
     "test.ts",

Breeze.UI/src/tsconfig.spec.json

@@ -5,9 +5,6 @@
     "module": "commonjs",
     "target": "es5",
     "baseUrl": "",
-    "typeRoots": [
-        "../node_modules/@types"
-    ],
     "types": [
       "jasmine",
       "node"
@@ -21,4 +18,3 @@
     "**/*.d.ts"
   ]
 }
-

Breeze.UI/tsconfig.json

 {
+  "compileOnSave": false,
   "compilerOptions": {
-    "target": "es5",
-    "module": "commonjs",
-    "moduleResolution": "node",
+    "outDir": "./dist/out-tsc",
+    "baseUrl": "src",
     "sourceMap": true,
+    "declaration": false,
+    "moduleResolution": "node",
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
+    "allowJs": true,
+    "target": "es5",
+    "paths": {
+      "environments": [
+        "./environments"
+      ]
+    },
+    "types": [
+      "node",
+      "jasmine"
+    ],
+    "typeRoots": [
+      "node_modules/@types"
+    ],
     "lib": [
-      "es2015",
+      "es2016",
       "dom"
-    ],
-    "noImplicitAny": true,
-    "suppressImplicitAnyIndexErrors": true
-  },
-  "exclude": [
-    "node_modules",
-    "dist"
     ]
+  }
 }

Breeze.UI/tslint.json

@@ -46,7 +46,7 @@
     "no-empty": false,
     "no-empty-interface": true,
     "no-eval": true,
-    "no-inferrable-types": true,
+    "no-inferrable-types": [true, "ignore-params"],
     "no-shadowed-variable": true,
     "no-string-literal": false,
     "no-string-throw": true,

Breeze.UI/webpack.config.js

-const CopyWebpackPlugin = require('copy-webpack-plugin');
 const path = require('path');
+const webpack = require('webpack');
 const ProgressPlugin = require('webpack/lib/ProgressPlugin');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const autoprefixer = require('autoprefixer');
 const postcssUrl = require('postcss-url');
 
-const { NoEmitOnErrorsPlugin, LoaderOptionsPlugin } = require('webpack');
+const { NoEmitOnErrorsPlugin, LoaderOptionsPlugin, DefinePlugin, HashedModuleIdsPlugin } = require('webpack');
 const { GlobCopyWebpackPlugin, BaseHrefWebpackPlugin } = require('@angular/cli/plugins/webpack');
-const { CommonsChunkPlugin } = require('webpack').optimize;
+const { CommonsChunkPlugin, UglifyJsPlugin } = require('webpack').optimize;
 const { AotPlugin } = require('@ngtools/webpack');
 
 const nodeModules = path.join(process.cwd(), 'node_modules');
-const entryPoints = ["inline","polyfills","sw-register","styles","vendor","main"];
+const entryPoints = ["inline", "polyfills", "sw-register", "styles", "vendor", "main"];
 const baseHref = "";
 const deployUrl = "";
 
+const isProd = (process.env.NODE_ENV === 'production');
+
+function getPlugins() {
+  var plugins = [];
+
+  // Always expose NODE_ENV to webpack, you can now use `process.env.NODE_ENV`
+  // inside your code for any environment checks; UglifyJS will automatically
+  // drop any unreachable code.
+  plugins.push(new DefinePlugin({
+    "process.env.NODE_ENV": "\"production\""
+  }));
+
+  plugins.push(new NoEmitOnErrorsPlugin());
+
+  plugins.push(new GlobCopyWebpackPlugin({
+    "patterns": [
+      "assets",
+      "favicon.ico"
+    ],
+    "globOptions": {
+      "cwd": process.cwd() + "/src",
+      "dot": true,
+      "ignore": "**/.gitkeep"
+    }
+  }));
+
+  plugins.push(new ProgressPlugin());
+
+  plugins.push(new HtmlWebpackPlugin({
+    "template": "./src/index.html",
+    "filename": "./index.html",
+    "hash": false,
+    "inject": true,
+    "compile": true,
+    "favicon": false,
+    "minify": false,
+    "cache": true,
+    "showErrors": true,
+    "chunks": "all",
+    "excludeChunks": [],
+    "title": "Webpack App",
+    "xhtml": true,
+    "chunksSortMode": function sort(left, right) {
+      let leftIndex = entryPoints.indexOf(left.names[0]);
+      let rightindex = entryPoints.indexOf(right.names[0]);
+      if (leftIndex > rightindex) {
+        return 1;
+      }
+      else if (leftIndex < rightindex) {
+        return -1;
+      }
+      else {
+        return 0;
+      }
+    }
+  }));
+
+  plugins.push(new BaseHrefWebpackPlugin({}));
+
+  plugins.push(new CommonsChunkPlugin({
+    "name": "inline",
+    "minChunks": null
+  }));
+
+  plugins.push(new CommonsChunkPlugin({
+    "name": "vendor",
+    "minChunks": (module) => module.resource && module.resource.startsWith(nodeModules),
+    "chunks": [
+      "main"
+    ]
+  }));
+
+  plugins.push(new ExtractTextPlugin({
+    "filename": "[name].bundle.css",
+    "disable": true
+  }));
+
+  plugins.push(new LoaderOptionsPlugin({
+    "sourceMap": false,
+    "options": {
+      "postcss": [
+        autoprefixer(),
+        postcssUrl({
+          "url": (obj) => {
+            // Only convert root relative URLs, which CSS-Loader won't process into require().
+            if (!obj.url.startsWith('/') || obj.url.startsWith('//')) {
+              return obj.url;
+            }
+            if (deployUrl.match(/:\/\//)) {
+              // If deployUrl contains a scheme, ignore baseHref use deployUrl as is.
+              return `${deployUrl.replace(/\/$/, '')}${obj.url}`;
+            }
+            else if (baseHref.match(/:\/\//)) {
+              // If baseHref contains a scheme, include it as is.
+              return baseHref.replace(/\/$/, '') +
+                `/${deployUrl}/${obj.url}`.replace(/\/\/+/g, '/');
+            }
+            else {
+              // Join together base-href, deploy-url and the original URL.
+              // Also dedupe multiple slashes into single ones.
+              return `/${baseHref}/${deployUrl}/${obj.url}`.replace(/\/\/+/g, '/');
+            }
+          }
+        })
+      ],
+      "sassLoader": {
+        "sourceMap": false,
+        "includePaths": []
+      },
+      "lessLoader": {
+        "sourceMap": false
+      },
+      "context": ""
+    }
+  }));
+
+  if (isProd) {
+    plugins.push(new HashedModuleIdsPlugin({
+      "hashFunction": "md5",
+      "hashDigest": "base64",
+      "hashDigestLength": 4
+    }));
+
+    plugins.push(new AotPlugin({
+      "mainPath": "main.ts",
+      "hostReplacementPaths": {
+        "environments/index.ts": "environments/environment.prod.ts"
+      },
+      "exclude": [],
+      "tsConfigPath": "src/tsconfig.app.json"
+    }));
+
+    plugins.push(new UglifyJsPlugin({
+      "mangle": {
+        "screw_ie8": true
+      },
+      "compress": {
+        "screw_ie8": true,
+        "warnings": false
+      },
+      "sourceMap": false
+    }));
+
+  } else {
+    plugins.push(new AotPlugin({
+      "mainPath": "main.ts",
+      "hostReplacementPaths": {
+        "environments/index.ts": "environments/environment.ts"
+      },
+      "exclude": [],
+      "tsConfigPath": "src/tsconfig.app.json",
+      "skipCodeGeneration": true
+    }));
+  }
+
+  return plugins;
+}
+
 module.exports = {
-  "target": "electron-renderer",
   "devtool": "source-map",
+  "externals": {
+    "electron": "require('electron')",
+    "child_process": "require('child_process')",
+    "crypto": "require('crypto')",
+    "events": "require('events')",
+    "fs": "require('fs')",
+    "http": "require('http')",
+    "https": "require('https')",
+    "assert": "require('assert')",
+    "dns": "require('dns')",
+    "net": "require('net')",
+    "os": "require('os')",
+    "path": "require('path')",
+    "querystring": "require('querystring')",
+    "readline": "require('readline')",
+    "repl": "require('repl')",
+    "stream": "require('stream')",
+    "string_decoder": "require('string_decoder')",
+    "url": "require('url')",
+    "util": "require('util')",
+    "zlib": "require('zlib')"
+  },
   "resolve": {
     "extensions": [
       ".ts",
-      ".js"
+      ".js",
+      ".scss",
+      ".json"
     ],
+    "aliasFields": [],
+    "alias": { // WORKAROUND See. angular-cli/issues/5433
+      "environments": isProd ? path.resolve(__dirname, 'src/environments/index.prod.ts') : path.resolve(__dirname, 'src/environments/index.ts')
+    },
     "modules": [
       "./node_modules"
     ]
@@ -42,7 +227,8 @@ module.exports = {
     ],
     "styles": [
       "./node_modules/bootstrap/dist/css/bootstrap.min.css",
-      "./src/styles.css"
+      "./src/styles.css",
+      "./src/styles.scss"
     ]
   },
   "output": {
@@ -54,19 +240,16 @@ module.exports = {
     "rules": [
       {
         "enforce": "pre",
-        "test": /\.js$/,
+        "test": /\.(js|ts)$/,
         "loader": "source-map-loader",
         "exclude": [
-          /\/node_modules\//
+          /\/node_modules\//,
+          path.join(__dirname, 'node_modules', '@angular/compiler')
         ]
       },
-      {
-        "test": /\.json$/,
-        "loader": "json-loader"
-      },
       {
         "test": /\.html$/,
-        "loader": "raw-loader"
+        "loader": "html-loader"
       },
       {
         "test": /\.(eot|svg)$/,
@@ -79,7 +262,8 @@ module.exports = {
       {
         "exclude": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.css$/,
         "loaders": [
@@ -91,7 +275,8 @@ module.exports = {
       {
         "exclude": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.scss$|\.sass$/,
         "loaders": [
@@ -104,7 +289,8 @@ module.exports = {
       {
         "exclude": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.less$/,
         "loaders": [
@@ -117,7 +303,8 @@ module.exports = {
       {
         "exclude": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.styl$/,
         "loaders": [
@@ -130,7 +317,8 @@ module.exports = {
       {
         "include": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.css$/,
         "loaders": ExtractTextPlugin.extract({
@@ -140,12 +328,13 @@ module.exports = {
           ],
           "fallback": "style-loader",
           "publicPath": ""
-})
+        })
       },
       {
         "include": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.scss$|\.sass$/,
         "loaders": ExtractTextPlugin.extract({
@@ -156,12 +345,13 @@ module.exports = {
           ],
           "fallback": "style-loader",
           "publicPath": ""
-})
+        })
       },
       {
         "include": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.less$/,
         "loaders": ExtractTextPlugin.extract({
@@ -172,12 +362,13 @@ module.exports = {
           ],
           "fallback": "style-loader",
           "publicPath": ""
-})
+        })
       },
       {
         "include": [
           path.join(process.cwd(), "node_modules/bootstrap/dist/css/bootstrap.min.css"),
-          path.join(process.cwd(), "src/styles.css")
+          path.join(process.cwd(), "src/styles.css"),
+          path.join(process.cwd(), "src/styles.scss")
         ],
         "test": /\.styl$/,
         "loaders": ExtractTextPlugin.extract({
@@ -188,7 +379,7 @@ module.exports = {
           ],
           "fallback": "style-loader",
           "publicPath": ""
-})
+        })
       },
       {
         "test": /\.ts$/,
@@ -196,125 +387,18 @@ module.exports = {
       }
     ]
   },
-  "plugins": [
-    new NoEmitOnErrorsPlugin(),
-    new GlobCopyWebpackPlugin({
-      "patterns": [
-        "assets"
-      ],
-      "globOptions": {
-        "cwd": "/home/dev0tion/Desktop/Breeze.UI/src",
-        "dot": true,
-        "ignore": "**/.gitkeep"
-      }
-    }),
-    new CopyWebpackPlugin([{
-      context: path.resolve(__dirname, "src"),
-      from: "electron.js"
-    }]),
-    new ProgressPlugin(),
-    new HtmlWebpackPlugin({
-      "template": "./src/index.html",
-      "filename": "./index.html",
-      "hash": false,
-      "inject": true,
-      "compile": true,
-      "favicon": false,
-      "minify": false,
-      "cache": true,
-      "showErrors": true,
-      "chunks": "all",
-      "excludeChunks": [],
-      "title": "Webpack App",
-      "xhtml": true,
-      "chunksSortMode": function sort(left, right) {
-        let leftIndex = entryPoints.indexOf(left.names[0]);
-        let rightindex = entryPoints.indexOf(right.names[0]);
-        if (leftIndex > rightindex) {
-            return 1;
-        }
-        else if (leftIndex < rightindex) {
-            return -1;
-        }
-        else {
-            return 0;
-        }
-    }
-    }),
-    new BaseHrefWebpackPlugin({}),
-    new CommonsChunkPlugin({
-      "name": "inline",
-      "minChunks": null
-    }),
-    new CommonsChunkPlugin({
-      "name": "vendor",
-      "minChunks": (module) => module.resource && module.resource.startsWith(nodeModules),
-      "chunks": [
-        "main"
-      ]
-    }),
-    new ExtractTextPlugin({
-      "filename": "[name].bundle.css",
-      "disable": true
-    }),
-    new LoaderOptionsPlugin({
-      "sourceMap": false,
-      "options": {
-        "postcss": [
-          autoprefixer(),
-          postcssUrl({"url": (URL) => {
-            // Only convert root relative URLs, which CSS-Loader won't process into require().
-            if (!URL.startsWith('/') || URL.startsWith('//')) {
-                return URL;
-            }
-            if (deployUrl.match(/:\/\//)) {
-                // If deployUrl contains a scheme, ignore baseHref use deployUrl as is.
-                return `${deployUrl.replace(/\/$/, '')}${URL}`;
-            }
-            else if (baseHref.match(/:\/\//)) {
-                // If baseHref contains a scheme, include it as is.
-                return baseHref.replace(/\/$/, '') +
-                    `/${deployUrl}/${URL}`.replace(/\/\/+/g, '/');
-            }
-            else {
-                // Join together base-href, deploy-url and the original URL.
-                // Also dedupe multiple slashes into single ones.
-                return `/${baseHref}/${deployUrl}/${URL}`.replace(/\/\/+/g, '/');
-            }
-        }})
-        ],
-        "sassLoader": {
-          "sourceMap": false,
-          "includePaths": []
-        },
-        "lessLoader": {
-          "sourceMap": false
-        },
-        "context": ""
-      }
-    }),
-    new AotPlugin({
-      "mainPath": "main.ts",
-      "hostReplacementPaths": {
-        "environments/environment.ts": "environments/environment.ts"
-      },
-      "exclude": [],
-      "tsConfigPath": "src/tsconfig.app.json",
-      "skipCodeGeneration": true
-    })
-  ],
+  "plugins": getPlugins(),
   "node": {
-    "fs": false,
-    "global": false,
-    "crypto": false,
-    "tls": false,
-    "net": false,
-    "process": false,
-    "module": false,
-    "clearImmediate": false,
-    "setImmediate": false,
-    "Buffer": false,
-    "__filename": false,
-    "__dirname": false
+    fs: "empty",
+    global: true,
+    crypto: "empty",
+    tls: "empty",
+    net: "empty",
+    process: true,
+    module: false,
+    clearImmediate: false,
+    setImmediate: false,
+    __dirname: false,
+    __filename: false
   }
 };