You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@nifi.apache.org by sc...@apache.org on 2018/04/30 19:13:23 UTC

[3/7] nifi-fds git commit: [NIFIREG-168] include webapp in src to facilitate local build and review process

[NIFIREG-168] include webapp in src to facilitate local build and review process


Project: http://git-wip-us.apache.org/repos/asf/nifi-fds/repo
Commit: http://git-wip-us.apache.org/repos/asf/nifi-fds/commit/43ea6622
Tree: http://git-wip-us.apache.org/repos/asf/nifi-fds/tree/43ea6622
Diff: http://git-wip-us.apache.org/repos/asf/nifi-fds/diff/43ea6622

Branch: refs/heads/gh-pages
Commit: 43ea6622b0697c426cf290eed7ace2eacd306633
Parents: 544c0e4
Author: Scott Aslan <sc...@gmail.com>
Authored: Mon Apr 30 15:07:17 2018 -0400
Committer: Scott Aslan <sc...@gmail.com>
Committed: Mon Apr 30 15:07:17 2018 -0400

----------------------------------------------------------------------
 .github/PULL_REQUEST_TEMPLATE.md                |   12 +-
 .gitignore                                      |    4 +-
 Gruntfile.js                                    |   14 +
 README.md                                       |   40 +-
 gh-pages.index.html                             |   36 +
 gh-pages.package.json                           |   59 +
 gh-pages.systemjs.config.js                     |  120 +
 index.html                                      |   36 +
 karma.conf.js                                   |    3 +-
 package.json                                    |   13 +-
 platform/core/theming/_all-theme.scss           |    4 +-
 platform/systemjs-angular-loader.js             |   66 -
 platform/systemjs.spec.config.js                |   11 -
 scripts/clean-install                           |   21 +
 scripts/clean-install-skipTests                 |   18 +
 scripts/deploy-gh-pages                         |   21 +
 scripts/dev-install                             |   19 +
 scripts/dev-install-skipTests                   |   16 +
 .../dialogs/demo/fds-demo-dialog.html           |   18 +
 .../dialogs/demo/fds-demo-dialog.js             |   59 +
 .../fluid-design-system/fds-demo.html           | 2995 ++++++++++++++++++
 .../components/fluid-design-system/fds-demo.js  | 1066 +++++++
 webapp/fds-bootstrap.js                         |   53 +
 webapp/fds.animations.js                        |  133 +
 webapp/fds.html                                 |   34 +
 webapp/fds.js                                   |   74 +
 webapp/fds.module.js                            |   55 +
 webapp/fds.routes.js                            |   26 +
 webapp/services/fds.service.js                  |   52 +
 webapp/systemjs-angular-loader.js               |   66 +
 webapp/systemjs.config.extras.js                |   27 +
 webapp/systemjs.config.js                       |  142 +
 webapp/theming/_helperClasses.scss              |   78 +
 webapp/theming/_structureElements.scss          |   84 +
 webapp/theming/fds-demo.scss                    |   49 +
 35 files changed, 5403 insertions(+), 121 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/.github/PULL_REQUEST_TEMPLATE.md
----------------------------------------------------------------------
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index cb9093a..25f2d97 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -14,10 +14,9 @@ to ensure the following steps have been taken:
 - [ ] Is your initial contribution a single, squashed commit?
 
 ### For code changes:
-- [ ] Have you ensured that a full build is executed via npm build at the root nifi-fds folder?
-- [ ] Have you ensured that the full suite of tests is executed via npm test at the root nifi-fds folder?
 - [ ] Have you written or updated unit tests to verify your changes?
-- [ ] Have you written or updated the Apache NiFi Fluid Design System Demo application to demonstrate, provide examples of usage, and to verify your changes?
+- [ ] Have you ensured that a full build and that the full suite of unit tests is executed via npm run clean:install at the root nifi-fds folder?
+- [ ] Have you written or updated the Apache NiFi Fluid Design System demo application to demonstrate any new functionality, provide examples of usage, and to verify your changes via npm start at the nifi-fds/target folder?
 - [ ] If adding new dependencies to the code, are these dependencies licensed in a way that is compatible for inclusion under [ASF 2.0](http://www.apache.org/legal/resolved.html#category-a)?
 - [ ] If applicable, have you updated the LICENSE file, including the main LICENSE file under nifi-fds?
 - [ ] If applicable, have you updated the NOTICE file, including the main NOTICE file found under nifi-fds?
@@ -27,10 +26,3 @@ to ensure the following steps have been taken:
 
 ### Note:
 Please ensure that once the PR is submitted, you check travis-ci for build issues and submit an update to your PR as soon as possible.
-
-### Reviewers, please perform the following in order to validate the changes:
-- [ ] Checkout the gh-pages branch.
-- [ ] Open the package.json file in the root nifi-fds folder and in the dependencies property edit the nifi-fds module to point to the pull request under review by replacing the user name, repository name, and branch name to the appropriate values for the PR.
-     Ex. To point to the Apache NiFi FDS master branch replace the user, repository, and branch name in the string git+https://github.com/USER_NAME/REPO_NAME.git#PR_BRANCH_NAME to:
-            "nifi-fds": "git+https://github.com/apache/nifi-fds.git#master"
-- [ ] ‘npm start’ in the root nifi-fds folder and verify the UI/UX in a browser.

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/.gitignore
----------------------------------------------------------------------
diff --git a/.gitignore b/.gitignore
index 297f275..a19bd7a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,8 +1,6 @@
 node_modules/
-coverage/
-platform/core/common/styles/css/
+target/
 npm-debug.log*
-webapp/
 
 # Intellij
 .idea/

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/Gruntfile.js
----------------------------------------------------------------------
diff --git a/Gruntfile.js b/Gruntfile.js
index f4f8ae7..45b43f4 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -29,6 +29,11 @@ module.exports = function (grunt) {
                 files: [{
                     './platform/core/common/styles/css/fluid-design-system.min.css': ['./platform/core/common/styles/fluid-design-system.scss']
                 }]
+            },
+            minifyFdsDemo: {
+                files: [{
+                    './webapp/css/fds-demo.min.css': ['./webapp/theming/fds-demo.scss']
+                }]
             }
         },
         compress: {
@@ -42,6 +47,14 @@ module.exports = function (grunt) {
                     dest: './',
                     ext: '.min.css.gz'
                 }]
+            },
+            fdsDemoStyles: {
+                files: [{
+                    expand: true,
+                    src: ['./webapp/css/fds-demo.min.css'],
+                    dest: './',
+                    ext: '.min.css.gz'
+                }]
             }
         },
         bump: {
@@ -65,4 +78,5 @@ module.exports = function (grunt) {
         }
     });
     grunt.registerTask('compile-fds-styles', ['sass:minifyFds', 'compress:fdsStyles']);
+    grunt.registerTask('compile-fds-demo-styles', ['sass:minifyFdsDemo', 'compress:fdsDemoStyles']);
 };

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/README.md
----------------------------------------------------------------------
diff --git a/README.md b/README.md
index 5ac1f90..cdbce26 100644
--- a/README.md
+++ b/README.md
@@ -77,48 +77,32 @@ npm install
 Next run:
 
 ```bash
-npm run build
+npm run clean:install
 ```
 
-## Testing
-
-Developers can easily test this project using **npm**.
-
-```bash
-npm test
-```
-
-Or, during development:
+or to run without unit tests run:
 
 ```bash
-npm run test:dev
+npm run clean:install:skipTests
 ```
 
-## Release Managment
-
-For developers with permissions releasing a new version of the NiFi Fluid Design System is simple with [grunt bump](https://github.com/vojtajina/grunt-bump)
-
-## Running the demo locally
+## Developing
 
-For developers that would like to contribute to the demo please checkout the `gh-pages` branch:
+Developers can easily skip the re-instalation of node_modules and run unit tests in development mode using **npm**.
 
 ```bash
-git checkout gh-pages
+npm run dev:install
 ```
 
-Next, you will need to update the base url. To do this simply edit the index.html file on line 21:
+or to run without unit tests run:
 
 ```bash
-<base href='/fluid-design-system/'>
+npm run dev:install:skipTests
 ```
 
-should be:
-
-```bash
-<base href='/'>
-```
+## Running locally
 
-Finally, start the application:
+Once built you can start the application from the target directory via:
 
 ```bash
 npm start
@@ -126,3 +110,7 @@ npm start
 
 The demo application should now be availalbe at: [http://127.0.0.1:8080/](http://127.0.0.1:8080/).
 
+## Release Managment
+
+For developers with permissions releasing a new version of the NiFi Fluid Design System is simple with [grunt bump](https://github.com/vojtajina/grunt-bump)
+

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/gh-pages.index.html
----------------------------------------------------------------------
diff --git a/gh-pages.index.html b/gh-pages.index.html
new file mode 100644
index 0000000..e55dbb9
--- /dev/null
+++ b/gh-pages.index.html
@@ -0,0 +1,36 @@
+<!--
+ Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the 'License'); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+      http://www.apache.org/licenses/LICENSE-2.0
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an 'AS IS' BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Apache NiFi Fluid Design System Demo</title>
+    <base href='/nifi-fds/'>
+    <meta charset='UTF-8'>
+    <meta name='viewport' content='width=device-width, initial-scale=1'>
+    <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/>
+    <link rel="stylesheet" href="node_modules/@covalent/core/common/platform.css">
+    <link rel="stylesheet" href='node_modules/nifi-fds/platform/core/common/styles/css/fluid-design-system.min.css'/>
+    <link rel="stylesheet" href='webapp/css/fds-demo.min.css'/>
+    <link rel='stylesheet' href='node_modules/font-awesome/css/font-awesome.css'/>
+</head>
+<body>
+<fds-app></fds-app>
+</body>
+<script src="node_modules/systemjs/dist/system.src.js"></script>
+<script src="webapp/systemjs.config.js?"></script>
+<script>
+  System.import('webapp/fds-bootstrap.js').catch(function(err) {console.error(err);});
+</script>
+</html>

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/gh-pages.package.json
----------------------------------------------------------------------
diff --git a/gh-pages.package.json b/gh-pages.package.json
new file mode 100644
index 0000000..58da069
--- /dev/null
+++ b/gh-pages.package.json
@@ -0,0 +1,59 @@
+{
+  "name": "nifi-fds-demo",
+  "version": "0.0.0",
+  "scripts": {
+    "start": "./node_modules/http-server/bin/http-server .",
+    "build:webapp": "./node_modules/grunt-cli/bin/grunt compile-fds-demo-styles",
+    "build:platform": "npm install && cd ./node_modules/nifi-fds && npm install && npm run build && rm -rf ./node_modules && rm -rf ./package-lock.json"
+  },
+  "description": "The Apache NiFi Fluid Design System demo provides users with an example web application that consumes the NgModule and allows users to interact with the UI/UX components.",
+  "keywords": [
+    "fluid design system",
+    "angular",
+    "material",
+    "material design",
+    "components",
+    "reusable",
+    "covalent"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/apache/nifi-fds.git"
+  },
+  "bugs": {
+    "url": "https://github.com/apache/nifi-fds/issues"
+  },
+  "license": "Apache License, Version 2.0",
+  "dependencies": {
+    "@angular/animations": "4.4.6",
+    "@angular/cdk": "2.0.0-beta.12",
+    "@angular/common": "4.4.6",
+    "@angular/compiler": "4.4.6",
+    "@angular/core": "4.4.6",
+    "@angular/flex-layout": "2.0.0-beta.9",
+    "@angular/forms": "4.4.6",
+    "@angular/http": "4.4.6",
+    "@angular/material": "2.0.0-beta.12",
+    "@angular/platform-browser": "4.4.6",
+    "@angular/platform-browser-dynamic": "4.4.6",
+    "@angular/router": "4.4.6",
+    "@covalent/core": "1.0.0-beta.8-1",
+    "detect-libc": "1.0.3",
+    "font-awesome": "4.7.0",
+    "hammerjs": "2.0.8",
+    "jquery": "3.2.1",
+    "node-gyp": "3.6.2",
+    "roboto-fontface": "0.7.0",
+    "rxjs": "5.4.3",
+    "systemjs": "0.20.17",
+    "systemjs-plugin-text": "0.0.11",
+    "zone.js": "0.8.7"
+  },
+  "devDependencies": {
+    "grunt": "0.4.5",
+    "grunt-cli": "1.2.0",
+    "grunt-contrib-compress": "1.4.3",
+    "grunt-sass": "2.0.0",
+    "load-grunt-tasks": "3.5.2"
+  }
+}

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/gh-pages.systemjs.config.js
----------------------------------------------------------------------
diff --git a/gh-pages.systemjs.config.js b/gh-pages.systemjs.config.js
new file mode 100644
index 0000000..d4587e1
--- /dev/null
+++ b/gh-pages.systemjs.config.js
@@ -0,0 +1,120 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+(function (global) {
+    System.config({
+        paths: {
+            // paths serve as alias
+            'npm:': 'node_modules/'
+        },
+        // map tells the System loader where to look for things
+        map: {
+            'text': 'npm:systemjs-plugin-text/text.js',
+            'app': './webapp',
+
+            // jquery
+            'jquery': 'npm:jquery/dist/jquery.min.js',
+
+            // Angular
+            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
+            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
+            '@angular/common/http': 'npm:@angular/common/bundles/common-http.umd.js',
+            '@angular/common/http/testing': 'npm:@angular/common/bundles/common-http-testing.umd.js',
+            '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
+            '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
+            '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
+            '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
+            '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
+            '@angular/flex-layout': 'npm:@angular/flex-layout/bundles/flex-layout.umd.js',
+            '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
+            '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
+            '@angular/cdk': 'npm:@angular/cdk/bundles/cdk.umd.js',
+            '@angular/cdk/a11y': 'npm:@angular/cdk/bundles/cdk-a11y.umd.js',
+            '@angular/cdk/accordion': 'npm:@angular/cdk/bundles/cdk-accordion.umd.js',
+            '@angular/cdk/layout': 'npm:@angular/cdk/bundles/cdk-layout.umd.js',
+            '@angular/cdk/collections': 'npm:@angular/cdk/bundles/cdk-collections.umd.js',
+            '@angular/cdk/observers': 'npm:@angular/cdk/bundles/cdk-observers.umd.js',
+            '@angular/cdk/overlay': 'npm:@angular/cdk/bundles/cdk-overlay.umd.js',
+            '@angular/cdk/platform': 'npm:@angular/cdk/bundles/cdk-platform.umd.js',
+            '@angular/cdk/portal': 'npm:@angular/cdk/bundles/cdk-portal.umd.js',
+            '@angular/cdk/keycodes': 'npm:@angular/cdk/bundles/cdk-keycodes.umd.js',
+            '@angular/cdk/bidi': 'npm:@angular/cdk/bundles/cdk-bidi.umd.js',
+            '@angular/cdk/coercion': 'npm:@angular/cdk/bundles/cdk-coercion.umd.js',
+            '@angular/cdk/table': 'npm:@angular/cdk/bundles/cdk-table.umd.js',
+            '@angular/cdk/rxjs': 'npm:@angular/cdk/bundles/cdk-rxjs.umd.js',
+            '@angular/cdk/scrolling': 'npm:@angular/cdk/bundles/cdk-scrolling.umd.js',
+            '@angular/cdk/stepper': 'npm:@angular/cdk/bundles/cdk-stepper.umd.js',
+            '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.js',
+            '@angular/animations/browser': 'npm:@angular/animations/bundles/animations-browser.umd.js',
+            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
+
+            // needed to support gestures for angular material
+            'hammerjs': 'npm:hammerjs/hammer.min.js',
+
+            // Covalent
+            '@covalent/core': 'npm:@covalent/core/bundles/core.umd.min.js',
+
+            // other libraries
+            'rxjs': 'npm:rxjs',
+            'zone.js': 'npm:zone.js/dist/zone.js',
+            'core-js': 'npm:core-js/client/shim.min.js',
+            'superagent': 'npm:superagent/superagent.js',
+            'querystring': 'npm:querystring',
+            'tslib': 'npm:tslib/tslib.js',
+
+            // Fluid Design System
+            '@fluid-design-system/core': 'npm:nifi-fds/platform/core/fluid-design-system.module.js',
+            '@fluid-design-system/dialogs': 'npm:nifi-fds/platform/core/dialogs/fds-dialogs.module.js',
+            '@fluid-design-system/dialog-component': 'npm:nifi-fds/platform/core/dialogs/fds-dialog.component.js',
+            '@fluid-design-system/dialog-service': 'npm:nifi-fds/platform/core/dialogs/services/dialog.service.js',
+            '@fluid-design-system/confirm-dialog-component': 'npm:nifi-fds/platform/core/dialogs/confirm-dialog/confirm-dialog.component.js',
+            '@fluid-design-system/snackbars': 'npm:nifi-fds/platform/core/snackbars/fds-snackbars.module.js',
+            '@fluid-design-system/snackbar-component': 'npm:nifi-fds/platform/core/snackbars/fds-snackbar.component.js',
+            '@fluid-design-system/snackbar-service': 'npm:nifi-fds/platform/core/snackbars/services/snackbar.service.js',
+            '@fluid-design-system/coaster-component': 'npm:nifi-fds/platform/core/snackbars/coaster/coaster.component.js'
+        },
+        // packages tells the System loader how to load when no filename and/or no extension
+        packages: {
+            app: {
+                defaultExtension: 'js',
+                meta: {
+                    './*.js': {
+                        loader: 'webapp/systemjs-angular-loader.js'
+                    }
+                }
+            },
+            'webapp/systemjs-angular-loader.js': {
+                loader: false
+            },
+            'rxjs': {
+                defaultExtension: 'js'
+            },
+            'querystring': {
+                main: './index.js',
+                defaultExtension: 'js'
+            },
+            'moment': {
+                main: './moment.js',
+                defaultExtension: 'js'
+            },
+            'angular2-moment': {
+                main: './index.js',
+                defaultExtension: 'js'
+            }
+        }
+    });
+})(this);

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/index.html
----------------------------------------------------------------------
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..fb66cad
--- /dev/null
+++ b/index.html
@@ -0,0 +1,36 @@
+<!--
+ Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the 'License'); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+      http://www.apache.org/licenses/LICENSE-2.0
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an 'AS IS' BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Apache NiFi Fluid Design System Demo</title>
+    <base href='/'>
+    <meta charset='UTF-8'>
+    <meta name='viewport' content='width=device-width, initial-scale=1'>
+    <meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/>
+    <link rel="stylesheet" href="node_modules/@covalent/core/common/platform.css">
+    <link rel="stylesheet" href='platform/core/common/styles/css/fluid-design-system.min.css'/>
+    <link rel="stylesheet" href='webapp/css/fds-demo.min.css'/>
+    <link rel='stylesheet' href='node_modules/font-awesome/css/font-awesome.css'/>
+</head>
+<body>
+<fds-app></fds-app>
+</body>
+<script src="node_modules/systemjs/dist/system.src.js"></script>
+<script src="webapp/systemjs.config.js?"></script>
+<script>
+  System.import('webapp/fds-bootstrap.js').catch(function(err) {console.error(err);});
+</script>
+</html>

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/karma.conf.js
----------------------------------------------------------------------
diff --git a/karma.conf.js b/karma.conf.js
index 606aa3e..19f0125 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -91,8 +91,7 @@ module.exports = function (config) {
         // Proxied base paths for loading assets
         proxies: {
             // required for modules fetched by SystemJS
-            '/base/fds/node_modules/': '/base/node_modules/',
-            '/base/systemjs-angular-loader.js': '/base/platform/systemjs-angular-loader.js'
+            '/base/fds/node_modules/': '/base/node_modules/'
         },
 
         exclude: [],

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/package.json
----------------------------------------------------------------------
diff --git a/package.json b/package.json
index 98f05ea..122d380 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,14 @@
   "name": "nifi-fds",
   "version": "0.0.0",
   "scripts": {
-    "build": "./node_modules/grunt-cli/bin/grunt compile-fds-styles",
+    "start": "./node_modules/http-server/bin/http-server .",
+    "build:webapp": "./node_modules/grunt-cli/bin/grunt compile-fds-demo-styles",
+    "build:platform": "./node_modules/grunt-cli/bin/grunt compile-fds-styles",
+    "clean:install": "bash ./scripts/clean-install",
+    "clean:install:skipTests": "bash ./scripts/clean-install-skipTests",
+    "dev:install": "bash ./scripts/dev-install",
+    "dev:install:skipTests": "bash ./scripts/dev-install-skipTests",
+    "deploy:ghpages": "bash ./scripts/deploy-gh-pages",
     "test": "./node_modules/protractor/bin/webdriver-manager update --gecko false && karma start karma.conf.js --single-run",
     "test:dev": "./node_modules/protractor/bin/webdriver-manager update --gecko false && karma start karma.conf.js"
   },
@@ -44,6 +51,9 @@
     "@angular/platform-browser-dynamic": "5.2.0",
     "@angular/router": "5.2.0",
     "@covalent/core": "1.0.0",
+    "detect-libc": "1.0.3",
+    "font-awesome": "4.7.0",
+    "hammerjs": "2.0.8",
     "roboto-fontface": "0.7.0"
   },
   "devDependencies": {
@@ -52,6 +62,7 @@
     "grunt-cli": "1.2.0",
     "grunt-contrib-compress": "1.4.3",
     "grunt-sass": "2.0.0",
+    "http-server": "0.11.1",
     "jasmine-core": "2.8.0",
     "karma": "1.7.1",
     "karma-chrome-launcher": "2.2.0",

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/platform/core/theming/_all-theme.scss
----------------------------------------------------------------------
diff --git a/platform/core/theming/_all-theme.scss b/platform/core/theming/_all-theme.scss
index 66bd9f9..747ab8b 100644
--- a/platform/core/theming/_all-theme.scss
+++ b/platform/core/theming/_all-theme.scss
@@ -15,8 +15,8 @@
 * limitations under the License.
 */
 
-@import '../../../../@angular/material/theming';
-@import '../../../../@covalent/core/theming/all-theme';
+@import '../../../node_modules/@angular/material/theming';
+@import '../../../node_modules/@covalent/core/theming/all-theme';
 @import '../common/styles/buttons';
 @import '../common/styles/expansionPanels';
 @import '../common/styles/menus';

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/platform/systemjs-angular-loader.js
----------------------------------------------------------------------
diff --git a/platform/systemjs-angular-loader.js b/platform/systemjs-angular-loader.js
deleted file mode 100644
index 8e33bb5..0000000
--- a/platform/systemjs-angular-loader.js
+++ /dev/null
@@ -1,66 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-var templateUrlRegex = /templateUrl\s*:(\s*['"`](.*?)['"`]\s*)/gm;
-var stylesRegex = /styleUrls *:(\s*\[[^\]]*?\])/g;
-var stringRegex = /(['`"])((?:[^\\]\\\1|.)*?)\1/g;
-
-module.exports.translate = function (load) {
-    if (load.source.indexOf('moduleId') != -1) return load;
-
-    var url = document.createElement('a');
-    url.href = load.address;
-
-    var basePathParts = url.pathname.split('/');
-
-    basePathParts.pop();
-    var basePath = basePathParts.join('/');
-
-    var baseHref = document.createElement('a');
-    baseHref.href = this.baseURL;
-    baseHref = baseHref.pathname;
-
-    if (!baseHref.startsWith('/base/')) { // it is not karma
-        basePath = basePath.replace(baseHref, '');
-    }
-
-    load.source = load.source
-        .replace(templateUrlRegex, function (match, quote, url) {
-            var resolvedUrl = url;
-
-            if (url.startsWith('.')) {
-                resolvedUrl = basePath + url.substr(1);
-            }
-
-            return 'templateUrl: "' + resolvedUrl + '"';
-        })
-        .replace(stylesRegex, function (match, relativeUrls) {
-            var urls = [];
-
-            while ((match = stringRegex.exec(relativeUrls)) !== null) {
-                if (match[2].startsWith('.')) {
-                    urls.push('"' + basePath + match[2].substr(1) + '"');
-                } else {
-                    urls.push('"' + match[2] + '"');
-                }
-            }
-
-            return "styleUrls: [" + urls.join(', ') + "]";
-        });
-
-    return load;
-};

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/platform/systemjs.spec.config.js
----------------------------------------------------------------------
diff --git a/platform/systemjs.spec.config.js b/platform/systemjs.spec.config.js
index 9a1281f..1f51a7a 100644
--- a/platform/systemjs.spec.config.js
+++ b/platform/systemjs.spec.config.js
@@ -107,17 +107,6 @@
         },
         // packages tells the System loader how to load when no filename and/or no extension
         packages: {
-            app: {
-                defaultExtension: 'js',
-                meta: {
-                    './*.js': {
-                        loader: 'fds/systemjs-angular-loader.js'
-                    }
-                }
-            },
-            'fds/systemjs-angular-loader.js': {
-                loader: false
-            },
             'rxjs': {
                 defaultExtension: 'js'
             }

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/scripts/clean-install
----------------------------------------------------------------------
diff --git a/scripts/clean-install b/scripts/clean-install
new file mode 100644
index 0000000..a453550
--- /dev/null
+++ b/scripts/clean-install
@@ -0,0 +1,21 @@
+#!/usr/bin/env bash
+set -e
+
+# build
+rm -rf ./target
+mkdir target
+cp -R ./webapp/ ./target/webapp
+cp -R ./platform/ ./target/platform
+cp package.json ./target/package.json
+cp index.html ./target/index.html
+cp karma.conf.js ./target/karma.conf.js
+cp karma-test-shim.js ./target/karma-test-shim.js
+cp Gruntfile.js ./target/Gruntfile.js
+cp gh-pages.* ./target/
+cd ./target
+npm install
+npm run build:webapp
+npm run build:platform
+
+# test
+npm test

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/scripts/clean-install-skipTests
----------------------------------------------------------------------
diff --git a/scripts/clean-install-skipTests b/scripts/clean-install-skipTests
new file mode 100644
index 0000000..c326d70
--- /dev/null
+++ b/scripts/clean-install-skipTests
@@ -0,0 +1,18 @@
+#!/usr/bin/env bash
+set -e
+
+# build
+rm -rf ./target
+mkdir target
+cp -R ./webapp/ ./target/webapp
+cp -R ./platform/ ./target/platform
+cp package.json ./target/package.json
+cp index.html ./target/index.html
+cp karma.conf.js ./target/karma.conf.js
+cp karma-test-shim.js ./target/karma-test-shim.js
+cp Gruntfile.js ./target/Gruntfile.js
+cp gh-pages.* ./target/
+cd ./target
+npm install
+npm run build:webapp
+npm run build:platform

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/scripts/deploy-gh-pages
----------------------------------------------------------------------
diff --git a/scripts/deploy-gh-pages b/scripts/deploy-gh-pages
new file mode 100644
index 0000000..13470d5
--- /dev/null
+++ b/scripts/deploy-gh-pages
@@ -0,0 +1,21 @@
+#!/bin/bash
+npm run clean:install
+echo 'Build Complete'
+git branch -f gh-pages
+git checkout gh-pages
+echo 'Created and Checked out gh-pages branch'
+
+rm -rf ./node_modules/
+cp ./target/gh-pages.package.json ./package.json
+npm install
+mkdir ./node_modules/nifi-fds
+cp -R ./target/platform/ ./node_modules/nifi-fds/platform
+cp -R ./target/webapp/ ./webapp
+cp ./target/gh-pages.index.html ./index.html
+cp ./target/gh-pages.systemjs.config.js ./webapp/systemjs.config.js
+echo 'Tracking files'
+git add -A .
+echo 'Commiting files'
+git commit -a -m 'gh-pages update'
+echo 'Pushing files into gh-pages branch'
+git push apache gh-pages --force

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/scripts/dev-install
----------------------------------------------------------------------
diff --git a/scripts/dev-install b/scripts/dev-install
new file mode 100644
index 0000000..27ae97e
--- /dev/null
+++ b/scripts/dev-install
@@ -0,0 +1,19 @@
+#!/usr/bin/env bash
+set -e
+
+# build
+cp -R ./webapp/ ./target/webapp
+cp -R ./platform/ ./target/platform
+cp package.json ./target/package.json
+cp index.html ./target/index.html
+cp karma.conf.js ./target/karma.conf.js
+cp karma-test-shim.js ./target/karma-test-shim.js
+cp Gruntfile.js ./target/Gruntfile.js
+cp gh-pages.* ./target/
+cd ./target
+npm install
+npm run build:webapp
+npm run build:platform
+
+# test
+npm run test:dev

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/scripts/dev-install-skipTests
----------------------------------------------------------------------
diff --git a/scripts/dev-install-skipTests b/scripts/dev-install-skipTests
new file mode 100644
index 0000000..774750f
--- /dev/null
+++ b/scripts/dev-install-skipTests
@@ -0,0 +1,16 @@
+#!/usr/bin/env bash
+set -e
+
+# build
+cp -R ./webapp/ ./target/webapp
+cp -R ./platform/ ./target/platform
+cp package.json ./target/package.json
+cp index.html ./target/index.html
+cp karma.conf.js ./target/karma.conf.js
+cp karma-test-shim.js ./target/karma-test-shim.js
+cp Gruntfile.js ./target/Gruntfile.js
+cp gh-pages.* ./target/
+cd ./target
+npm install
+npm run build:webapp
+npm run build:platform

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.html
----------------------------------------------------------------------
diff --git a/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.html b/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.html
new file mode 100644
index 0000000..c283684
--- /dev/null
+++ b/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.html
@@ -0,0 +1,18 @@
+<!--
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<div>Hello Dialog!</div>

http://git-wip-us.apache.org/repos/asf/nifi-fds/blob/43ea6622/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.js
----------------------------------------------------------------------
diff --git a/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.js b/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.js
new file mode 100644
index 0000000..d3ead2b
--- /dev/null
+++ b/webapp/components/fluid-design-system/dialogs/demo/fds-demo-dialog.js
@@ -0,0 +1,59 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+var ngMaterial = require('@angular/material');
+var ngCore = require('@angular/core');
+
+/**
+ * NfRegistryEditBucketPolicy constructor.
+ *
+ * @param nfRegistryApi         The api service.
+ * @param nfRegistryService     The nf-registry.service module.
+ * @param activatedRoute        The angular route module.
+ * @param matDialogRef          The angular material dialog ref.
+ * @param data                  The data passed into this component.
+ * @constructor
+ */
+function FdsDemoDialog(matDialogRef, data) {
+    // Services
+    this.dialogRef = matDialogRef;
+    this.data = data;
+};
+
+FdsDemoDialog.prototype = {
+    constructor: FdsDemoDialog,
+
+    /**
+     * Cancel creation of a new policy and close dialog.
+     */
+    cancel: function () {
+        this.dialogRef.close();
+    }
+};
+
+FdsDemoDialog.annotations = [
+    new ngCore.Component({
+        template: require('./fds-demo-dialog.html!text')
+    })
+];
+
+FdsDemoDialog.parameters = [
+    ngMaterial.MatDialogRef,
+    ngMaterial.MAT_DIALOG_DATA
+];
+
+module.exports = FdsDemoDialog;