Allow SCSS, edit packaging scripts, update dependencies, add readme, remove 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.2.3",
-    "@angular/common": "^4.2.3",
-    "@angular/compiler": "^4.2.3",
-    "@angular/compiler-cli": "^4.2.3",
-    "@angular/core": "^4.2.3",
-    "@angular/forms": "^4.2.3",
-    "@angular/http": "^4.2.3",
-    "@angular/platform-browser": "^4.2.3",
-    "@angular/platform-browser-dynamic": "^4.2.3",
-    "@angular/platform-server": "^4.2.3",
-    "@angular/router": "^4.2.3",
+    "@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",
@@ -42,29 +57,30 @@
     "zone.js": "^0.8.12"
   },
   "devDependencies": {
-    "@angular/cli": "^1.1.2",
-    "@angular/compiler-cli": "^4.2.3",
-    "@types/electron": "^1.6.10",
-    "@types/jasmine": "2.5.52",
-    "@types/node": "~8.0.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.4.0",
-    "copy-webpack-plugin": "4.0.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.11",
-    "electron-packager": "^8.7.1",
+    "electron-packager": "^8.7.2",
+    "electron-reload": "1.2.1",
     "exports-loader": "^0.6.4",
-    "extract-text-webpack-plugin": "^2.1.2",
+    "extract-zip": "1.6.5",
     "file-loader": "^0.11.2",
-    "html-webpack-plugin": "^2.28.0",
+    "html-loader": "0.4.5",
     "istanbul-instrumenter-loader": "^2.0.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.3.0",
     "karma-electron": "^5.2.1",
@@ -72,6 +88,8 @@
     "karma-jasmine-html-reporter": "^0.2.2",
     "karma-sourcemap-loader": "^0.3.7",
     "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.2",
@@ -81,10 +99,11 @@
     "source-map-loader": "^0.2.1",
     "style-loader": "^0.18.2",
     "stylus-loader": "^3.0.1",
-    "ts-node": "~3.0.6",
+    "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/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,