From 18fbdb75d05dc58d3a5057bae776a15ab7de1eb0 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 16 Sep 2016 11:46:16 +0100
Subject: [PATCH 01/26] Start adding ecmUser component

---
 .../ng2-alfresco-userinfo/.editorconfig       |  23 ++++
 .../ng2-alfresco-userinfo/.gitignore          |  13 ++
 .../ng2-alfresco-userinfo/.travis.yml         |   8 ++
 ng2-components/ng2-alfresco-userinfo/LICENSE  |  13 ++
 .../ng2-alfresco-userinfo/README.md           |  43 ++++++
 .../ng2-alfresco-userinfo/angular-cli.json    |  27 ++++
 .../ng2-alfresco-userinfo/demo/.editorconfig  |  10 ++
 .../ng2-alfresco-userinfo/demo/.gitignore     |   5 +
 .../ng2-alfresco-userinfo/demo/README.md      |  19 +++
 .../ng2-alfresco-userinfo/demo/index.html     |  36 +++++
 .../ng2-alfresco-userinfo/demo/package.json   |  56 ++++++++
 .../ng2-alfresco-userinfo/demo/src/main.ts    |  57 ++++++++
 .../demo/systemjs.config.js                   |  56 ++++++++
 .../ng2-alfresco-userinfo/demo/tsconfig.json  |  19 +++
 .../ng2-alfresco-userinfo/demo/tslint.json    | 124 ++++++++++++++++++
 .../ng2-alfresco-userinfo/demo/typings.json   |   7 +
 ng2-components/ng2-alfresco-userinfo/index.ts |  10 ++
 .../ng2-alfresco-userinfo/karma-test-shim.js  | 110 ++++++++++++++++
 .../ng2-alfresco-userinfo/karma.conf.js       |  87 ++++++++++++
 .../ng2-alfresco-userinfo/package.json        |  83 ++++++++++++
 .../src/models/ecmCompany.model.ts            |  27 ++++
 .../src/models/ecmUser.model.ts               |  39 ++++++
 .../src/services/ecmUser.service.ts           |  63 +++++++++
 .../src/userinfo.component.html               |   1 +
 .../src/userinfo.component.spec.ts            |  16 +++
 .../src/userinfo.component.ts                 |  31 +++++
 .../ng2-alfresco-userinfo/tsconfig.json       |  27 ++++
 .../ng2-alfresco-userinfo/tslint.json         | 121 +++++++++++++++++
 .../ng2-alfresco-userinfo/typings.json        |   7 +
 29 files changed, 1138 insertions(+)
 create mode 100644 ng2-components/ng2-alfresco-userinfo/.editorconfig
 create mode 100644 ng2-components/ng2-alfresco-userinfo/.gitignore
 create mode 100644 ng2-components/ng2-alfresco-userinfo/.travis.yml
 create mode 100644 ng2-components/ng2-alfresco-userinfo/LICENSE
 create mode 100644 ng2-components/ng2-alfresco-userinfo/README.md
 create mode 100644 ng2-components/ng2-alfresco-userinfo/angular-cli.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/.editorconfig
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/.gitignore
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/README.md
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/index.html
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/package.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/tslint.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/typings.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/index.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
 create mode 100644 ng2-components/ng2-alfresco-userinfo/karma.conf.js
 create mode 100644 ng2-components/ng2-alfresco-userinfo/package.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/models/ecmCompany.model.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/models/ecmUser.model.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/tsconfig.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/tslint.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/typings.json

diff --git a/ng2-components/ng2-alfresco-userinfo/.editorconfig b/ng2-components/ng2-alfresco-userinfo/.editorconfig
new file mode 100644
index 0000000000..75a2477db7
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/.editorconfig
@@ -0,0 +1,23 @@
+# http://editorconfig.org
+
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[package.json]
+indent_style = space
+indent_size = 2
+
+[karma.conf.js]
+indent_style = space
+indent_size = 2
+
+[*.md]
+insert_final_newline = false
+trim_trailing_whitespace = false
diff --git a/ng2-components/ng2-alfresco-userinfo/.gitignore b/ng2-components/ng2-alfresco-userinfo/.gitignore
new file mode 100644
index 0000000000..3bea8a0c07
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/.gitignore
@@ -0,0 +1,13 @@
+npm-debug.log
+node_modules
+jspm_packages
+.idea
+typings
+coverage
+src/**/*.js
+src/**/*.js.map
+src/**/*.d.ts
+demo/**/*.js
+demo/**/*.js.map
+demo/**/*.d.ts
+!systemjs.config.js
diff --git a/ng2-components/ng2-alfresco-userinfo/.travis.yml b/ng2-components/ng2-alfresco-userinfo/.travis.yml
new file mode 100644
index 0000000000..781e6204e8
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/.travis.yml
@@ -0,0 +1,8 @@
+language: node_js
+node_js:
+  - v5
+  - v4
+install: npm install
+sudo: false
+after_success:
+  npm run coverage
diff --git a/ng2-components/ng2-alfresco-userinfo/LICENSE b/ng2-components/ng2-alfresco-userinfo/LICENSE
new file mode 100644
index 0000000000..bfd4a66b0c
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/LICENSE
@@ -0,0 +1,13 @@
+Copyright 2016 vito albano <vito.albano@alfresco.com>
+
+Licensed 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.
diff --git a/ng2-components/ng2-alfresco-userinfo/README.md b/ng2-components/ng2-alfresco-userinfo/README.md
new file mode 100644
index 0000000000..fe8a836e34
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/README.md
@@ -0,0 +1,43 @@
+# ng2-alfresco-userinfo
+This component will show the user information for ECM and BPM
+
+## Installation
+
+```bash
+npm install ng2-alfresco-userinfo --save
+```
+
+## Example
+
+```html
+<ng2-alfresco-userinfo></ng2-alfresco-userinfo>
+```
+
+## Reference
+
+Attribute     | Options     | Default      | Description
+---           | ---         | ---          | ---
+`foo`         | *string*    | `bar`        | Lorem ipsum dolor.
+
+
+Method        | Parameters   | Returns     | Description
+---           | ---          | ---         | ---
+`methodName()`   | None.        | void    | Lorem ipsum dolor.
+
+## NPM scripts
+
+| Command | Description |
+| --- | --- |
+| npm run build | Build component |
+| npm run build:w | Build component and keep watching the changes |
+| npm run test | Run unit tests in the console |
+| npm run test-browser | Run unit tests in the browser
+| npm run coverage | Run unit tests and display code coverage report |
+
+## History
+
+For detailed changelog, check [Releases](https://github.com/alfresco/ng2-alfresco-userinfo/releases).
+
+## Contributors
+
+[Contributors](https://github.com/alfresco/ng2-alfresco-userinfo/graphs/contributors)
diff --git a/ng2-components/ng2-alfresco-userinfo/angular-cli.json b/ng2-components/ng2-alfresco-userinfo/angular-cli.json
new file mode 100644
index 0000000000..ef1d3675f0
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/angular-cli.json
@@ -0,0 +1,27 @@
+{
+  "project": {
+    "version": "ng2-alfresco-userinfo",
+    "name": "0.1.0"
+  },
+  "apps": [
+    {
+      "main": "src/ng2-alfresco-userinfo.component.ts",
+      "tsconfig": "tsconfig.json",
+      "mobile": false
+    }
+  ],
+  "addons": [],
+  "packages": [],
+  "test": {
+    "karma": {
+      "config": "karma.conf.js"
+    }
+  },
+  "defaults": {
+    "prefix": "",
+    "sourceDir": "src",
+    "styleExt": "css",
+    "prefixInterfaces": false,
+    "lazyRoutePrefix": "+"
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/.editorconfig b/ng2-components/ng2-alfresco-userinfo/demo/.editorconfig
new file mode 100644
index 0000000000..8ed330c4a2
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/.editorconfig
@@ -0,0 +1,10 @@
+
+root = true
+
+[{src,scripts}/**.{ts,json,js}]
+end_of_line = crlf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 4
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/.gitignore b/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
new file mode 100644
index 0000000000..7c04460244
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
@@ -0,0 +1,5 @@
+typings/
+node_modules/
+.idea
+dist/
+!systemjs.config.js
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/README.md b/ng2-components/ng2-alfresco-userinfo/demo/README.md
new file mode 100644
index 0000000000..7b59778398
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/README.md
@@ -0,0 +1,19 @@
+# ng2-alfresco-userinfo - Demo
+
+* To install dependencies
+
+```sh
+$ npm install
+```
+
+* To provide a live demo
+
+```sh
+$ npm run start
+```
+
+* To clean npm_modules and typings folder
+
+```sh
+$ npm run clean
+```
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/index.html b/ng2-components/ng2-alfresco-userinfo/demo/index.html
new file mode 100644
index 0000000000..87aedd2904
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/index.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    
+    <title>ng2-alfresco-userinfo Angular 2</title>
+    <base href="/">
+
+    <!-- Google Material Design Lite -->
+    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
+    <script src="node_modules/material-design-lite/material.min.js"></script>
+    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
+
+    <!-- Polyfill(s) for older browsers -->
+    <script src="node_modules/core-js/client/shim.min.js"></script>
+    <script src="node_modules/zone.js/dist/zone.js"></script>
+    <script src="node_modules/reflect-metadata/Reflect.js"></script>
+    <script src="node_modules/systemjs/dist/system.src.js"></script>
+
+    <!-- Additional Alfresco libraries -->
+    <script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
+
+    <script src="systemjs.config.js"></script>
+    <script>
+      System.import('app').catch(function(err){ console.error(err); });
+    </script>
+  </head>
+
+  <body>
+    <my-app>
+      <div id="loader-spin" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div>
+    </my-app>
+  </body>
+
+</html>
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/package.json b/ng2-components/ng2-alfresco-userinfo/demo/package.json
new file mode 100644
index 0000000000..9566571b1f
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/package.json
@@ -0,0 +1,56 @@
+{
+  "name": "ng2-alfresco-userinfo-demo",
+  "description": "This component will show the user information for ECM and BPM - Demo",
+  "version": "0.1.0",
+  "author": "vito albano <vito.albano@alfresco.com>",
+  "main": "./dist/index.js",
+  "typings": "./dist/index.d.ts",
+  "scripts": {
+    "clean": "rimraf dist node_modules typings",
+    "typings": "typings install",
+    "postinstall": "npm run typings && npm run build",
+    "start": "npm run tslint && rimraf dist && tsc && concurrently \"tsc -w\" \"npm run server\" ",
+    "server": "wsrv -o -l -s",
+    "build": "npm run tslint && rimraf dist && tsc",
+    "build:w": "npm run tslint && rimraf dist && tsc -w",
+    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts"
+  },
+  "keywords": [
+    "ng2",
+    "angular",
+    "angular2",
+    "alfresco",
+    "demo"
+  ],
+  "dependencies": {
+    "@angular/common": "2.0.0-rc.3",
+    "@angular/compiler": "2.0.0-rc.3",
+    "@angular/core": "2.0.0-rc.3",
+    "@angular/http": "2.0.0-rc.3",
+    "@angular/platform-browser": "2.0.0-rc.3",
+    "@angular/platform-browser-dynamic": "2.0.0-rc.3",
+    "@angular/router": "3.0.0-alpha.7",
+    "@angular/router-deprecated": "2.0.0-rc.2",
+    "@angular/upgrade": "2.0.0-rc.3",
+    "systemjs": "0.19.27",
+    "core-js": "^2.4.0",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "5.0.0-beta.6",
+    "zone.js": "^0.6.12",
+    "material-design-icons": "^2.2.3",
+    "material-design-lite": "^1.1.3",
+    "ng2-translate": "2.2.2",
+
+    "ng2-alfresco-userinfo": "file:../",
+    "ng2-alfresco-core": "^0.3.0",
+    "alfresco-js-api": "^0.3.0"
+  },
+  "devDependencies": {
+    "concurrently": "^2.0.0",
+    "rimraf": "2.5.2",
+    "tslint": "^3.8.1",
+    "typescript": "^1.8.10",
+    "typings": "^1.0.4",
+    "wsrv": "^0.1.4"
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
new file mode 100644
index 0000000000..8801ffcb21
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
@@ -0,0 +1,57 @@
+
+import { Component, OnInit } from '@angular/core';
+import { bootstrap } from '@angular/platform-browser-dynamic';
+import { UserInfoComponent } from 'ng2-alfresco-userinfo';
+import { HTTP_PROVIDERS } from '@angular/http';
+import {
+    AlfrescoSettingsService,
+    AlfrescoAuthenticationService,
+    ALFRESCO_CORE_PROVIDERS
+} from 'ng2-alfresco-core';
+
+@Component({
+  selector: 'my-app',
+  template: `<h4>START</h4><ng2-alfresco-userinfo></ng2-alfresco-userinfo>`,
+  directives: [ UserInfoComponent ],
+  providers: [AlfrescoAuthenticationService, AlfrescoSettingsService]
+})
+
+
+class UserInfoDemo implements OnInit {
+
+      private authenticated: boolean;
+      private ticket: string;
+      // private ecmHost: string;
+
+      constructor(private authService: AlfrescoAuthenticationService,
+                  private settingsService: AlfrescoSettingsService) {
+            this.settingsService.setProviders('ECM');
+      }
+
+      public ngOnInit(): void {
+          this.login();
+      }
+
+      login() {
+          this.authService.login('test', 'test').subscribe(
+              ticket => {
+                  console.log(ticket);
+                  this.ticket = this.authService.getTicketEcm();
+                  this.authenticated = true;
+              },
+              error => {
+                  console.log(error);
+                  this.authenticated = false;
+              });
+      }
+}
+
+
+
+
+
+bootstrap(UserInfoDemo, [
+  UserInfoComponent,
+  HTTP_PROVIDERS,
+  ALFRESCO_CORE_PROVIDERS
+]);
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js b/ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js
new file mode 100644
index 0000000000..ead7634f8a
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js
@@ -0,0 +1,56 @@
+
+'use strict';
+(function(/*global*/) {
+
+  // map tells the System loader where to look for things
+  var map = {
+    app: 'dist/',
+    '@angular': 'node_modules/@angular',
+    rxjs: 'node_modules/rxjs',
+
+    'ng2-translate': 'node_modules/ng2-translate',
+    'ng2-alfresco-core': 'node_modules/ng2-alfresco-core/dist',
+
+    'ng2-alfresco-userinfo': 'node_modules/ng2-alfresco-userinfo/dist'
+  };
+
+  // packages tells the System loader how to load when no filename and/or no extension
+  var packages = {
+    app: { main: 'main.js', defaultExtension: 'js' },
+    rxjs: { defaultExtension: 'js' },
+
+    'ng2-translate': { defaultExtension: 'js' },
+    'ng2-alfresco-core': { main: 'index.js', defaultExtension: 'js' },
+
+    'ng2-alfresco-userinfo': { main: 'index.js', defaultExtension: 'js' }
+  };
+
+  var ngPackageNames = [
+    'common',
+    'compiler',
+    'core',
+    'http',
+    'platform-browser',
+    'platform-browser-dynamic',
+    'router',
+    'router-deprecated',
+    'upgrade'
+  ];
+  // Individual files (~300 requests):
+  function packIndex(pkgName) {
+    packages['@angular/' + pkgName] = { main: 'index.js', defaultExtension: 'js' };
+  }
+  // Bundled (~40 requests):
+  function packUmd(pkgName) {
+    packages['@angular/' + pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
+  }
+  // Most environments should use UMD; some (Karma) need the individual index files
+  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
+  // Add package entries for angular packages
+  ngPackageNames.forEach(setPackageConfig);
+  var config = {
+    map: map,
+    packages: packages
+  };
+  System.config(config);
+})(this);
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json b/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
new file mode 100644
index 0000000000..772c3a7e75
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "system",
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "sourceMap": true,
+    "removeComments": true,
+    "declaration": true,
+    "outDir": "dist"
+  },
+  "exclude": [
+    "dist",
+    "node_modules",
+    "typings/main",
+    "typings/main.d.ts"
+  ]
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/tslint.json b/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
new file mode 100644
index 0000000000..8c48e76469
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
@@ -0,0 +1,124 @@
+{
+  "rules": {
+    "align": [
+      true,
+      "parameters",
+      "arguments",
+      "statements"
+    ],
+    "ban": false,
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space",
+      "check-lowercase"
+    ],
+    "curly": true,
+    "eofline": true,
+    "forin": true,
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "interface-name": false,
+    "jsdoc-format": true,
+    "label-position": true,
+    "label-undefined": true,
+    "max-line-length": [
+      true,
+      140
+    ],
+    "member-ordering": [
+      true,
+      "public-before-private",
+      "static-before-instance",
+      "variables-before-functions"
+    ],
+    "no-any": false,
+    "no-arg": true,
+    "no-bitwise": true,
+    "no-conditional-assignment": true,
+    "no-consecutive-blank-lines": false,
+    "no-console": [
+      true,
+      "debug",
+      "info",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-construct": true,
+    "no-constructor-vars": false,
+    "no-debugger": true,
+    "no-duplicate-key": true,
+    "no-duplicate-variable": true,
+    "no-empty": true,
+    "no-eval": true,
+    "no-inferrable-types": false,
+    "no-internal-module": true,
+    "no-require-imports": true,
+    "no-shadowed-variable": true,
+    "no-switch-case-fall-through": true,
+    "no-trailing-whitespace": true,
+    "no-unreachable": true,
+    "no-unused-expression": true,
+    "no-unused-variable": true,
+    "no-use-before-declare": true,
+    "no-var-keyword": true,
+    "no-var-requires": true,
+    "object-literal-sort-keys": false,
+    "one-line": [
+      true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "quotemark": [
+      true,
+      "single",
+      "avoid-escape"
+    ],
+    "radix": true,
+    "semicolon": true,
+    "switch-default": true,
+    "trailing-comma": [
+      true,
+      {
+        "multiline": "never",
+        "singleline": "never"
+      }
+    ],
+    "triple-equals": [
+      true,
+      "allow-null-check"
+    ],
+    "typedef": false,
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "use-strict": false,
+    "variable-name": [
+      true,
+      "check-format",
+      "allow-leading-underscore",
+      "ban-keywords"
+    ],
+    "whitespace": [
+      true,
+      "check-branch",
+      "check-operator",
+      "check-separator",
+      "check-type",
+      "check-module",
+      "check-decl"
+    ]
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/typings.json b/ng2-components/ng2-alfresco-userinfo/demo/typings.json
new file mode 100644
index 0000000000..7e0e18568d
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/typings.json
@@ -0,0 +1,7 @@
+{
+  "globalDependencies": {
+    "core-js": "registry:dt/core-js#0.0.0+20160317120654",
+    "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
+    "node": "registry:dt/node#4.0.0+20160509154515"
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/index.ts b/ng2-components/ng2-alfresco-userinfo/index.ts
new file mode 100644
index 0000000000..3548a5fae7
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/index.ts
@@ -0,0 +1,10 @@
+import { ECMUserService } from './src/services/ecmUser.service';
+
+
+export * from './src/userinfo.component';
+export * from './src/services/ecmUser.service';
+
+
+export const USER_INFO_SERVICE: [any] = [
+    ECMUserService
+];
diff --git a/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js b/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
new file mode 100644
index 0000000000..445a2b98d0
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
@@ -0,0 +1,110 @@
+'use strict';
+// Tun on full stack traces in errors to help debugging
+Error.stackTraceLimit = Infinity;
+jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
+__karma__.loaded = function() {};
+
+var map = {
+  app: 'base/dist',
+  rxjs: 'base/node_modules/rxjs',
+  '@angular': 'base/node_modules/@angular',
+  'ng2-translate': '/base/node_modules/ng2-translate',
+  'ng2-alfresco-core': '/base/node_modules/ng2-alfresco-core/dist'
+};
+
+var packages = {
+  app: { main: 'main.js', defaultExtension: 'js' },
+  rxjs: { defaultExtension: 'js' },
+  'ng2-translate': { defaultExtension: 'js' },
+  'ng2-alfresco-core': { main: 'index.js', defaultExtension: 'js' }
+};
+
+var packageNames = [
+  '@angular/common',
+  '@angular/compiler',
+  '@angular/core',
+  '@angular/http',
+  '@angular/platform-browser',
+  '@angular/platform-browser-dynamic',
+  '@angular/router',
+  '@angular/router-deprecated',
+  '@angular/testing',
+  '@angular/upgrade'
+];
+
+packageNames.forEach(function(pkgName) {
+  packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
+});
+
+packages['base/dist'] = {
+  defaultExtension: 'js',
+  format: 'register',
+  map: Object.keys(window.__karma__.files).filter(onlyAppFiles).reduce(createPathRecords, {})
+};
+
+var config = {
+  map: map,
+  packages: packages
+};
+
+System.config(config);
+
+System.import('@angular/platform-browser/src/browser/browser_adapter')
+  .then(function(browserAdapter) {
+    browserAdapter.BrowserDomAdapter.makeCurrent();
+  })
+  .then(function() {
+    return Promise.all([
+      System.import('@angular/core/testing'),
+      System.import('@angular/platform-browser-dynamic/testing')
+    ]);
+  })
+  .then(function(providers) {
+    var testing = providers[0];
+    var testingBrowser = providers[1];
+
+    testing.setBaseTestProviders(
+        testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
+        testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
+  })
+  .then(function() {
+    return Promise.all(resolveTestFiles());
+  })
+  .then(
+      function() {
+        __karma__.start();
+      },
+      function(error) {
+        if (typeof __karma__.error === 'function') {
+          __karma__.error(error.stack || error);
+        } else {
+          console.error(error);
+        }
+      }
+  );
+
+function createPathRecords(pathsMapping, appPath) {
+  var pathParts = appPath.split('/');
+  var moduleName = './' + pathParts.slice(Math.max(pathParts.length - 2, 1)).join('/');
+  moduleName = moduleName.replace(/\.js$/, '');
+  pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath];
+  return pathsMapping;
+}
+
+function onlyAppFiles(filePath) {
+  return /\/base\/dist\/(?!.*\.spec\.js$).*\.js$/.test(filePath);
+}
+
+function onlySpecFiles(path) {
+  return /\.spec\.js$/.test(path);
+}
+
+function resolveTestFiles() {
+  return Object.keys(window.__karma__.files)  // All files served by Karma.
+    .filter(onlySpecFiles)
+    .map(function(moduleName) {
+      // loads all spec files via their global module names (e.g.
+      // 'base/dist/vg-player/vg-player.spec')
+      return System.import(moduleName);
+    });
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/karma.conf.js b/ng2-components/ng2-alfresco-userinfo/karma.conf.js
new file mode 100644
index 0000000000..c822c9fcd6
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/karma.conf.js
@@ -0,0 +1,87 @@
+'use strict';
+
+module.exports = function(config) {
+  config.set({
+
+    basePath: '.',
+
+    frameworks: ['jasmine'],
+
+    files: [
+      // paths loaded by Karma
+      {pattern: 'node_modules/reflect-metadata/Reflect.js', included: true, watched: false},
+      {pattern: 'node_modules/systemjs/dist/system.src.js', included: true, watched: false},
+      {pattern: 'node_modules/zone.js/dist/zone.js', included: true, watched: false},
+      {pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/rxjs/**/*.map', included: false, watched: false},
+      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/@angular/**/*.map', included: false, watched: false},
+      {pattern: 'node_modules/ng2-translate/**/*.js', included: false, served: true, watched: false},
+      {pattern: 'node_modules/ng2-alfresco-core/dist/**/*.js', included: false, served: true, watched: false},
+      {pattern: 'node_modules/alfresco-core-rest-api/bundle.js', included: true, watched: false},
+
+      {pattern: 'karma-test-shim.js', included: true, watched: true},
+
+      // paths loaded via module imports
+      {pattern: 'dist/**/*.js', included: false, watched: true},
+      {pattern: 'dist/**/*.html', included: true, served: true, watched: true},
+      {pattern: 'dist/**/*.css', included: true, served: true, watched: true},
+
+      // paths to support debugging with source maps in dev tools
+      {pattern: 'src/**/*.ts', included: false, watched: false},
+      {pattern: 'dist/**/*.js.map', included: false, watched: false}
+    ],
+
+    // proxied base paths
+    proxies: {
+      // required for component assets fetched by Angular's compiler
+      '/src/': '/base/src/'
+    },
+
+    // list of files to exclude
+    exclude: [
+      'node_modules/**/*spec.js'
+    ],
+
+    port: 9876,
+
+    // level of logging
+    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+    logLevel: config.LOG_INFO,
+
+    colors: true,
+
+    autoWatch: true,
+
+    browsers: ['Chrome'],
+
+    // Karma plugins loaded
+    plugins: [
+      'karma-jasmine',
+      'karma-coverage',
+      'karma-chrome-launcher',
+      'karma-mocha-reporter',
+      'karma-jasmine-html-reporter'
+    ],
+
+    // Coverage reporter generates the coverage
+    reporters: ['mocha', 'coverage', 'kjhtml'],
+
+    // Source files that you wanna generate coverage for.
+    // Do not include tests or libraries (these files will be instrumented by Istanbul)
+    preprocessors: {
+      'dist/**/!(*spec).js': ['coverage']
+    },
+
+    coverageReporter: {
+      dir: 'coverage/',
+      subdir: 'report',
+      reporters: [
+        {type: 'text'},
+        {type: 'text-summary'},
+        {type: 'json', file: 'coverage-final.json'},
+        {type: 'html'}
+      ]
+    }
+  });
+};
diff --git a/ng2-components/ng2-alfresco-userinfo/package.json b/ng2-components/ng2-alfresco-userinfo/package.json
new file mode 100644
index 0000000000..34b6de40e7
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/package.json
@@ -0,0 +1,83 @@
+{
+  "name": "ng2-alfresco-userinfo",
+  "description": "This component will show the user information for ECM and BPM",
+  "version": "0.1.0",
+  "author": "vito albano <vito.albano@alfresco.com>",
+  "scripts": {
+    "postinstall": "typings install",
+    "clean": "rimraf dist node_modules typings",
+    "typings": "typings install",
+    "license-check": "echo 'license check is disabled'",
+    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist && npm run license-check",
+    "build:w": "npm run tslint && rimraf dist && npm run watch-task",
+    "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\"  \"npm run license-check\"",
+    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts",
+    "copy-dist": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src",
+    "copy-dist:w": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src -w",
+    "tsc": "tsc",
+    "tsc:w": "tsc -w",
+    "pretest": "npm run build",
+    "test": "karma start karma.conf.js --reporters mocha,coverage --single-run",
+    "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\"",
+    "posttest": "remap-istanbul -i coverage/report/coverage-final.json -o coverage/report -t html && remap-istanbul -i coverage/report/coverage-final.json -o coverage/report/coverage-final.json",
+    "coverage": "npm run test && wsrv -o -p 9875 ./coverage/report",
+    "prepublish": "npm run build",
+    "travis": "echo 'placeholder'"
+  },
+  "main": "./dist/index.js",
+  "typings": "./dist/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/alfresco/ng2-alfresco-userinfo.git"
+  },
+  "bugs": {
+    "url": "https://github.com/alfresco/ng2-alfresco-userinfo/issues"
+  },
+  "dependencies": {
+    "@angular/common": "2.0.0-rc.3",
+    "@angular/compiler": "2.0.0-rc.3",
+    "@angular/core": "2.0.0-rc.3",
+    "@angular/http": "2.0.0-rc.3",
+    "@angular/platform-browser": "2.0.0-rc.3",
+    "@angular/platform-browser-dynamic": "2.0.0-rc.3",
+    "@angular/router": "3.0.0-alpha.7",
+    "@angular/router-deprecated": "2.0.0-rc.2",
+    "@angular/upgrade": "2.0.0-rc.3",
+    "systemjs": "0.19.27",
+    "core-js": "^2.4.0",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "5.0.0-beta.6",
+    "zone.js": "^0.6.12",
+    "ng2-translate": "2.2.2",
+    "alfresco-js-api": "^0.3.0",
+    "ng2-alfresco-core": "0.3.2"
+  },
+  "devDependencies": {
+    "angular-cli": "1.0.0-beta.9",
+    "concurrently": "^2.1.0",
+    "cpx": "^1.3.1",
+    "jasmine-ajax": "^3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "~0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.0.0",
+    "karma-jasmine": "~1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "^0.2.0",
+    "karma-mocha-reporter": "^2.0.3",
+    "remap-istanbul": "^0.6.3",
+    "rimraf": "2.5.2",
+    "traceur": "^0.0.91",
+    "tslint": "^3.8.1",
+    "typescript": "^1.8.10",
+    "typings": "^1.0.4",
+    "wsrv": "^0.1.3"
+  },
+  "keywords": [
+    "component",
+    "userinfo",
+    "alfresco",
+    "alfresco-component"
+  ],
+  "license": "Apache-2.0"
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/models/ecmCompany.model.ts b/ng2-components/ng2-alfresco-userinfo/src/models/ecmCompany.model.ts
new file mode 100644
index 0000000000..458b6b8ed5
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/models/ecmCompany.model.ts
@@ -0,0 +1,27 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+export class EcmCompanyModel {
+      organization: string;
+      address1: string;
+      address2: string;
+      address3: string;
+      postcode: string;
+      telephone: string;
+      fax: string;
+      email: string;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/models/ecmUser.model.ts b/ng2-components/ng2-alfresco-userinfo/src/models/ecmUser.model.ts
new file mode 100644
index 0000000000..436604989c
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/models/ecmUser.model.ts
@@ -0,0 +1,39 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { EcmCompanyModel } from './ecmCompany.model';
+
+export class EcmUserModel {
+        id: string;
+        firstName: string;
+        lastName: string;
+        description: string;
+        avatarId: string;
+        email: string;
+        skypeId: string;
+        googleId: string;
+        instantMessageId: string;
+        jobTitle: string;
+        location: string;
+        company: EcmCompanyModel;
+        mobile: string;
+        telephone: string;
+        statusUpdatedAt: string;
+        userStatus: string;
+        enabled: boolean;
+        emailNotificationsEnabled: boolean;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
new file mode 100644
index 0000000000..f6d237ecd6
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
@@ -0,0 +1,63 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { AlfrescoApiService } from 'ng2-alfresco-core';
+import { Injectable } from '@angular/core';
+import { Response } from '@angular/http';
+import { Observable } from 'rxjs/Observable';
+import { EcmUserModel } from '../models/ecmUser.model';
+/**
+ *
+ * ECMUserService retrieve all the information of an Ecm user.
+ *
+ * @returns {ECMUserService} .
+ */
+@Injectable()
+export class ECMUserService {
+
+    constructor(private apiService: AlfrescoApiService) {}
+
+    /**
+     * get User Information via ECM
+     * @param userName - the user name
+     */
+    getUserInfo(userName: string): Observable<EcmUserModel> {
+        return Observable.fromPromise(this.callApiGetPersonInfo(userName))
+            .map( data => <EcmUserModel> data )
+            .do(
+                 data => console.log('Node data', data)
+                ) // eyeball results in the console
+            .catch(this.handleError);
+    }
+
+    private callApiGetPersonInfo(userName: string, opts?: any) {
+        return this.apiService.getInstance().core.peopleApi.getPerson(userName, opts);
+    }
+
+    /**
+     * Throw the error
+     * @param error
+     * @returns {ErrorObservable}
+     */
+    private handleError(error: Response) {
+        // in a real world app, we may send the error to some remote logging infrastructure
+        // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error || 'Server error');
+    }
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
new file mode 100644
index 0000000000..116e372f29
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -0,0 +1 @@
+<div [innerHtml]="ecmUser">TEST</div>
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts
new file mode 100644
index 0000000000..e7917d1f0b
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts
@@ -0,0 +1,16 @@
+
+import {describe, expect, it, inject} from '@angular/core/testing';
+import { TestComponentBuilder } from '@angular/compiler/testing';
+import { UserInfoComponent } from '../src/userinfo.component';
+
+describe('Basic Example test ng2-alfresco-userinfo', () => {
+  it('Test hello world', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    return tcb
+      .createAsync(UserInfoComponent)
+      .then((fixture) => {
+        let element = fixture.nativeElement;
+        expect(element.querySelector('h1')).toBeDefined();
+        expect(element.getElementsByTagName('h1')[0].innerHTML).toEqual('Hello World Angular 2 ng2-alfresco-userinfo');
+      });
+  }));
+});
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
new file mode 100644
index 0000000000..ccf3384bac
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
@@ -0,0 +1,31 @@
+
+import { Component } from '@angular/core';
+import { ECMUserService } from './services/ecmUser.service';
+import { EcmUserModel } from './models/ecmUser.model';
+
+@Component({
+    selector: 'ng2-alfresco-userinfo',
+    styles: [`:host h1 { font-size:22px }`],
+    template: `<h1>Hello World Angular 2 ng2-alfresco-userinfo</h1> <button (click)='doQueryUser()'>Do Query</button>`,
+    providers: [ ECMUserService ]
+})
+
+
+export class UserInfoComponent {
+
+    private  ecmUser: EcmUserModel;
+
+    constructor(private ecmUserService: ECMUserService) {
+      console.log('User info component constr');
+    }
+
+    doQueryUser() {
+      this.ecmUserService.getUserInfo('admin')
+                           .subscribe(
+                                    res => this.ecmUser = <EcmUserModel> res.entry
+                           );
+    }
+
+
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/tsconfig.json b/ng2-components/ng2-alfresco-userinfo/tsconfig.json
new file mode 100644
index 0000000000..e4d2ae201a
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/tsconfig.json
@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "system",
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "sourceMap": true,
+    "removeComments": true,
+    "declaration": true,
+    "noLib": false,
+    "allowUnreachableCode": false,
+    "allowUnusedLabels": false,
+    "noImplicitAny": false,
+    "noImplicitReturns": false,
+    "noImplicitUseStrict": false,
+    "noFallthroughCasesInSwitch": true,
+    "outDir": "dist"
+  },
+  "exclude": [
+    "demo",
+    "node_modules",
+    "typings/main",
+    "typings/main.d.ts",
+    "dist"
+  ]
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/tslint.json b/ng2-components/ng2-alfresco-userinfo/tslint.json
new file mode 100644
index 0000000000..33220e5038
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/tslint.json
@@ -0,0 +1,121 @@
+{
+  "rules": {
+    "align": [
+      true,
+      "parameters",
+      "statements"
+    ],
+    "ban": false,
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space"
+    ],
+    "curly": true,
+    "eofline": true,
+    "forin": true,
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "interface-name": false,
+    "jsdoc-format": true,
+    "label-position": true,
+    "label-undefined": true,
+    "max-line-length": [
+      true,
+      140
+    ],
+    "member-ordering": [
+      true,
+      "static-before-instance",
+      "variables-before-functions"
+    ],
+    "no-any": false,
+    "no-arg": true,
+    "no-bitwise": false,
+    "no-conditional-assignment": true,
+    "no-consecutive-blank-lines": false,
+    "no-console": [
+      true,
+      "debug",
+      "info",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-construct": true,
+    "no-constructor-vars": false,
+    "no-debugger": true,
+    "no-duplicate-key": true,
+    "no-duplicate-variable": true,
+    "no-empty": false,
+    "no-eval": true,
+    "no-inferrable-types": false,
+    "no-internal-module": true,
+    "no-require-imports": true,
+    "no-shadowed-variable": true,
+    "no-switch-case-fall-through": true,
+    "no-trailing-whitespace": true,
+    "no-unreachable": true,
+    "no-unused-expression": true,
+    "no-unused-variable": true,
+    "no-use-before-declare": true,
+    "no-var-keyword": true,
+    "no-var-requires": true,
+    "object-literal-sort-keys": false,
+    "one-line": [
+      true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "quotemark": [
+      true,
+      "single",
+      "avoid-escape"
+    ],
+    "radix": true,
+    "semicolon": true,
+    "switch-default": true,
+    "trailing-comma": [
+      true,
+      {
+        "multiline": "never",
+        "singleline": "never"
+      }
+    ],
+    "triple-equals": [
+      true,
+      "allow-null-check"
+    ],
+    "typedef": false,
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "use-strict": false,
+    "variable-name": [
+      true,
+      "check-format",
+      "allow-leading-underscore",
+      "ban-keywords"
+    ],
+    "whitespace": [
+      true,
+      "check-branch",
+      "check-operator",
+      "check-separator",
+      "check-type",
+      "check-module",
+      "check-decl"
+    ]
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/typings.json b/ng2-components/ng2-alfresco-userinfo/typings.json
new file mode 100644
index 0000000000..7e0e18568d
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/typings.json
@@ -0,0 +1,7 @@
+{
+  "globalDependencies": {
+    "core-js": "registry:dt/core-js#0.0.0+20160317120654",
+    "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
+    "node": "registry:dt/node#4.0.0+20160509154515"
+  }
+}

From 86e5b3f1e5fca6129266b4c699e159b73b6c0af9 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 19 Sep 2016 11:53:55 +0100
Subject: [PATCH 02/26] Add BPM user logged in

---
 .../ng2-alfresco-userinfo/demo/src/main.ts    |  35 ++---
 .../src/models/bpmUser.model.ts               |  39 +++++
 .../src/services/bpmUser.service.ts           |  65 ++++++++
 .../src/services/ecmUser.service.ts           |   4 +-
 .../src/userinfo.component.html               | 140 +++++++++++++++++-
 .../src/userinfo.component.ts                 |  41 +++--
 6 files changed, 288 insertions(+), 36 deletions(-)
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/models/bpmUser.model.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts

diff --git a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
index 8801ffcb21..a7c5c03cb1 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
+++ b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
@@ -11,7 +11,7 @@ import {
 
 @Component({
   selector: 'my-app',
-  template: `<h4>START</h4><ng2-alfresco-userinfo></ng2-alfresco-userinfo>`,
+  template: `<h4>START</h4><ng2-alfresco-userinfo [userEmail]="'test'"></ng2-alfresco-userinfo>`,
   directives: [ UserInfoComponent ],
   providers: [AlfrescoAuthenticationService, AlfrescoSettingsService]
 })
@@ -20,36 +20,31 @@ import {
 class UserInfoDemo implements OnInit {
 
       private authenticated: boolean;
-      private ticket: string;
-      // private ecmHost: string;
+      private token: any;
 
       constructor(private authService: AlfrescoAuthenticationService,
                   private settingsService: AlfrescoSettingsService) {
-            this.settingsService.setProviders('ECM');
+            this.settingsService.setProviders('ALL');
       }
 
       public ngOnInit(): void {
           this.login();
       }
 
-      login() {
-          this.authService.login('test', 'test').subscribe(
-              ticket => {
-                  console.log(ticket);
-                  this.ticket = this.authService.getTicketEcm();
-                  this.authenticated = true;
-              },
-              error => {
-                  console.log(error);
-                  this.authenticated = false;
-              });
-      }
+    login() {
+        this.authService.login('test', 'test').subscribe(
+            token => {
+                console.log(token);
+                this.token = token;
+                this.authenticated = true;
+            },
+            error => {
+                console.log(error);
+                this.authenticated = false;
+            });
+    }
 }
 
-
-
-
-
 bootstrap(UserInfoDemo, [
   UserInfoComponent,
   HTTP_PROVIDERS,
diff --git a/ng2-components/ng2-alfresco-userinfo/src/models/bpmUser.model.ts b/ng2-components/ng2-alfresco-userinfo/src/models/bpmUser.model.ts
new file mode 100644
index 0000000000..3ee3fd7222
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/models/bpmUser.model.ts
@@ -0,0 +1,39 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+export class BpmUserModel {
+    apps: any;
+    capabilities: string;
+    company: string;
+    created: string;
+    email: string;
+    externalId: string;
+    firstName: string;
+    lastName: string;
+    fullname: string;
+    groups: any;
+    id: string;
+    lastUpdate: string;
+    latestSyncTimeStamp: string;
+    password: string;
+    pictureId: string;
+    status: string;
+    tenantId: string;
+    tenantName: string;
+    tenantPictureId: string;
+    type: string;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
new file mode 100644
index 0000000000..593079a8cf
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
@@ -0,0 +1,65 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
+import { Injectable } from '@angular/core';
+import { Response } from '@angular/http';
+import { Observable } from 'rxjs/Observable';
+import { BpmUserModel } from '../models/bpmUser.model';
+/**
+ *
+ * BPMUserService retrieve all the information of an Ecm user.
+ *
+ * @returns {BPMUserService} .
+ */
+@Injectable()
+export class BPMUserService {
+
+    constructor(public authService: AlfrescoAuthenticationService) {}
+
+    /**
+     * get User Information via ECM
+     * @param userName - the user name
+     */
+    getCurrentUserInfo(): Observable<BpmUserModel> {
+        return Observable.fromPromise(this.callApiGetProfile())
+            .map(
+                 data => <BpmUserModel> data
+                )
+            .do(
+                 data => console.log('Node data', data)
+                ) // eyeball results in the console
+            .catch(this.handleError);
+    }
+
+    private callApiGetProfile() {
+        return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
+    }
+
+    /**
+     * Throw the error
+     * @param error
+     * @returns {ErrorObservable}
+     */
+    private handleError(error: Response) {
+        // in a real world app, we may send the error to some remote logging infrastructure
+        // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error || 'Server error');
+    }
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
index f6d237ecd6..dbb005892a 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
@@ -37,9 +37,9 @@ export class ECMUserService {
      */
     getUserInfo(userName: string): Observable<EcmUserModel> {
         return Observable.fromPromise(this.callApiGetPersonInfo(userName))
-            .map( data => <EcmUserModel> data )
+            .map( data => <EcmUserModel> data['entry'])
             .do(
-                 data => console.log('Node data', data)
+                 data => console.log('Node data', data['entry'])
                 ) // eyeball results in the console
             .catch(this.handleError);
     }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
index 116e372f29..4a1c172487 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -1 +1,139 @@
-<div [innerHtml]="ecmUser">TEST</div>
+<main class="mdl-layout__content">
+<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
+    <!-- Tab Bars -->
+    <div class="mdl-tabs__tab-bar">
+        <a *ngIf="ecmUser" href="#ecm-panel" class="mdl-tabs__tab is-active">ECM</a>
+        <a *ngIf="bpmUser" href="#bpm-panel" class="mdl-tabs__tab">BPM</a>
+    </div>
+
+    <!-- MDL tab panels, is-active to denote currently active -->
+    <div *ngIf="ecmUser" class="mdl-tabs__panel" id="ecm-panel">
+        <ul class="demo-list-control mdl-list">
+            <li class="mdl-list__item">
+                    <span class="mdl-list__item-primary-content">
+                      <i class="material-icons  mdl-list__item-avatar">person</i>
+                      {{ecmUser.firstName}} {{ecmUser.lastName}}
+                    </span>
+            </li>
+            <li *ngIf="ecmUser.id" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Id: </span>
+                <label title="Id">
+                    {{ecmUser.id}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.description" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Description: </span>
+                <label title="description">
+                    {{ecmUser.description}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.email" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Email: </span>
+                <label title="email">
+                    {{ecmUser.email}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.skypeId" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Skype Id: </span>
+                <label title="skypeId">
+                    {{ecmUser.skypeId}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.googleId" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Google Id: </span>
+                <label title="googleId">
+                    {{ecmUser.googleId}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.instantMessageId" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Instant Message Id: </span>
+                <label title="instantMessageId">
+                    {{ecmUser.instantMessageId}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.jobTitle" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Job Title: </span>
+                <label title="jobTitle">
+                    {{ecmUser.jobTitle}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.location" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Location: </span>
+                <label title="location">
+                    {{ecmUser.location}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.mobile" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Mobile: </span>
+                <label title="mobile">
+                    {{ecmUser.mobile}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.telephone" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Telephone: </span>
+                <label title="telephone">
+                    {{ecmUser.telephone}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.userStatus" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">User Status: </span>
+                <label title="userStatus">
+                    {{ ecmUser.userStatus? 'Active':'Inactive' }}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.enabled" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Enabled: </span>
+                <label title="enabled">
+                    {{ecmUser.enabled}}
+                </label>
+            </li>
+            <li *ngIf="ecmUser.emailNotificationsEnabled" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Email Notifications: </span>
+                <label title="emailNotificationsEnabled">
+                    {{ecmUser.emailNotificationsEnabled? 'Enabled': 'Disabled'}}
+                </label>
+            </li>
+        </ul>
+    </div>
+    <div *ngIf="bpmUser" class="mdl-tabs__panel" id="bpm-panel">
+        <ul class="demo-list-control mdl-list">
+            <li class="mdl-list__item">
+                    <span class="mdl-list__item-primary-content">
+                      <i class="material-icons  mdl-list__item-avatar">person</i>
+                      {{bpmUser.fullname}}
+                    </span>
+            </li>
+            <li *ngIf="bpmUser.id" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Id: </span>
+                <label title="Id">
+                    {{bpmUser.id}}
+                </label>
+            </li>
+            <li *ngIf="bpmUser.email" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Email: </span>
+                <label title="email">
+                    {{bpmUser.email}}
+                </label>
+            </li>
+            <li *ngIf="bpmUser.status" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Status: </span>
+                <label title="jobTitle">
+                    {{bpmUser.status}}
+                </label>
+            </li>
+            <li *ngIf="bpmUser.tenantName" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Tenant Name: </span>
+                <label title="tenantName">
+                    {{bpmUser.tenantName}}
+                </label>
+            </li>
+            <li *ngIf="bpmUser.company" class="mdl-list__item">
+                <span class="mdl-list__item-primary-content">Company: </span>
+                <label title="company">
+                    {{bpmUser.company}}
+                </label>
+            </li>
+        </ul>
+    </div>
+</div>
+</main>
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
index ccf3384bac..f29d945b8e 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
@@ -1,31 +1,46 @@
 
-import { Component } from '@angular/core';
+import { Component, OnInit, Input } from '@angular/core';
 import { ECMUserService } from './services/ecmUser.service';
+import { BPMUserService } from './services/bpmUser.service';
 import { EcmUserModel } from './models/ecmUser.model';
+import { BpmUserModel } from './models/bpmUser.model';
+import { AlfrescoContentService } from 'ng2-alfresco-core';
+
+declare let __moduleName: string;
 
 @Component({
     selector: 'ng2-alfresco-userinfo',
+    moduleId: __moduleName,
     styles: [`:host h1 { font-size:22px }`],
-    template: `<h1>Hello World Angular 2 ng2-alfresco-userinfo</h1> <button (click)='doQueryUser()'>Do Query</button>`,
-    providers: [ ECMUserService ]
+    templateUrl: './userinfo.component.html',
+    providers: [ ECMUserService, BPMUserService, AlfrescoContentService ]
 })
 
+export class UserInfoComponent implements OnInit {
 
-export class UserInfoComponent {
+    @Input()
+    userEmail: string;
 
     private  ecmUser: EcmUserModel;
+    private  bpmUser: BpmUserModel;
 
-    constructor(private ecmUserService: ECMUserService) {
-      console.log('User info component constr');
+    constructor(private ecmUserService: ECMUserService,
+                private bpmUserService: BPMUserService,
+                private contentService: AlfrescoContentService) {
     }
 
-    doQueryUser() {
-      this.ecmUserService.getUserInfo('admin')
-                           .subscribe(
-                                    res => this.ecmUser = <EcmUserModel> res.entry
-                           );
+    ngOnInit() {
+        this.ecmUserService.getUserInfo(this.userEmail)
+                                .subscribe(
+                                      res => this.ecmUser = <EcmUserModel> res
+                                );
+        this.bpmUserService.getCurrentUserInfo()
+                                .subscribe(
+                                      res => this.bpmUser = <BpmUserModel> res
+                                );
     }
 
-
-
+    public getDocumentThumbnailUrl(avatarId: string): string {
+        return this.contentService.getDocumentThumbnailUrl(document);
+    }
 }

From a8c7486a26d57416b2c3df8c3dc8605d3214fed3 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Tue, 20 Sep 2016 17:03:13 +0100
Subject: [PATCH 03/26] Added the change for user image

---
 .../components/profile/AboutComponent.java    |  55 +++++++
 .../components/profile/profile.component.html |   0
 .../components/profile/profile.component.ts   |   0
 .../ng2-alfresco-userinfo/demo/src/main.ts    | 106 +++++++++++--
 .../src/img/anonymous.gif                     | Bin 0 -> 1765 bytes
 .../src/services/bpmUser.service.ts           |  19 ++-
 .../src/services/ecmUser.service.ts           |   2 +-
 .../src/userinfo.component.css                |  14 ++
 .../src/userinfo.component.html               | 144 +-----------------
 .../src/userinfo.component.ts                 |  60 +++++++-
 10 files changed, 239 insertions(+), 161 deletions(-)
 create mode 100644 demo-shell-ng2/app/components/profile/AboutComponent.java
 create mode 100644 demo-shell-ng2/app/components/profile/profile.component.html
 create mode 100644 demo-shell-ng2/app/components/profile/profile.component.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/img/anonymous.gif
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css

diff --git a/demo-shell-ng2/app/components/profile/AboutComponent.java b/demo-shell-ng2/app/components/profile/AboutComponent.java
new file mode 100644
index 0000000000..30b667a14a
--- /dev/null
+++ b/demo-shell-ng2/app/components/profile/AboutComponent.java
@@ -0,0 +1,55 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { Component, OnInit } from '@angular/core';
+import { Http } from '@angular/http';
+import {
+    ALFRESCO_DATATABLE_DIRECTIVES,
+    ObjectDataTableAdapter /*,
+    DataSorting,
+    ObjectDataRow,
+    ObjectDataColumn*/
+} from 'ng2-alfresco-datatable';
+
+declare let __moduleName: string;
+
+@Component({
+    moduleId: __moduleName,
+    selector: 'about-page',
+    templateUrl: './about.component.html',
+    directives: [ALFRESCO_DATATABLE_DIRECTIVES]
+})
+export class AboutComponent implements OnInit {
+
+    data: ObjectDataTableAdapter;
+
+    constructor(private http: Http) {}
+
+    ngOnInit() {
+        // this.data = new ObjectDataTableAdapter();
+        this.http.get('/versions').subscribe(response => {
+            let data = response.json() || {};
+            let packages = data.packages || [];
+
+            this.data = new ObjectDataTableAdapter(packages, [
+                { type: 'text', key: 'name', title: 'Name', sortable: true },
+                { type: 'text', key: 'version', title: 'Version', sortable: true }
+            ]);
+        });
+
+    }
+}
diff --git a/demo-shell-ng2/app/components/profile/profile.component.html b/demo-shell-ng2/app/components/profile/profile.component.html
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/demo-shell-ng2/app/components/profile/profile.component.ts b/demo-shell-ng2/app/components/profile/profile.component.ts
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
index a7c5c03cb1..5e5ff8772c 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
+++ b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
@@ -11,7 +11,43 @@ import {
 
 @Component({
   selector: 'my-app',
-  template: `<h4>START</h4><ng2-alfresco-userinfo [userEmail]="'test'"></ng2-alfresco-userinfo>`,
+  styles: [`:host h1 { font-size:22px }`],
+  template: `
+<h4> START DEMO USERINFO </h4>
+<div style="border-radius: 8px; position: absolute; background-color:papayawhip; color: cadetblue; left: 320px; top: 30px; z-index: 1;">
+  <p style="width:120px;margin: 20px;">
+  <label for="switch1" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
+      <input type="checkbox" id="switch1" class="mdl-switch__input"
+       (click)="toggleECM(ecm.checked)" #ecm>
+      <span class="mdl-switch__label">ECM</span>
+  </label>
+  </p>
+  <p style="width:120px;margin: 20px;">
+      <label for="switch2" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
+          <input type="checkbox" id="switch2" class="mdl-switch__input" checked
+           (click)="toggleBPM(bpm.checked)" #bpm>
+          <span class="mdl-switch__label">BPM</span>
+      </label>
+  </p>
+</div>
+<div *ngIf="isLoggedIn()">
+    <ng2-alfresco-userinfo [userEmail]=userToLogin></ng2-alfresco-userinfo>
+</div>
+<p></p>
+<div>
+    <p>
+        <span>Username</span>
+        <input id="user" type="text" [(ngModel)]="userToLogin" value="admin"/>
+    </p>
+    <p>
+        <span>Password</span>
+        <input id="passw" type="password" [(ngModel)]="password" value="admin"/>
+    </p>
+<button type="submit" (click)="attemptLogin()"> Login !</button>
+</div>
+<span>{{loginErrorMessage}}</span>
+
+<button (click)="logout()">Logout</button>`,
   directives: [ UserInfoComponent ],
   providers: [AlfrescoAuthenticationService, AlfrescoSettingsService]
 })
@@ -19,30 +55,68 @@ import {
 
 class UserInfoDemo implements OnInit {
 
+      public userToLogin: string = 'admin';
+      public password: string = 'admin';
+      public loginErrorMessage: string;
+      public providers: string = 'BPM';
       private authenticated: boolean;
       private token: any;
 
       constructor(private authService: AlfrescoAuthenticationService,
                   private settingsService: AlfrescoSettingsService) {
-            this.settingsService.setProviders('ALL');
       }
 
-      public ngOnInit(): void {
-          this.login();
+      ngOnInit() {
+        this.settingsService.setProviders(this.providers);
       }
 
-    login() {
-        this.authService.login('test', 'test').subscribe(
-            token => {
-                console.log(token);
-                this.token = token;
-                this.authenticated = true;
-            },
-            error => {
-                console.log(error);
-                this.authenticated = false;
-            });
-    }
+      attemptLogin() {
+          this.loginErrorMessage = '';
+          this.login(this.userToLogin, this.password);
+      }
+
+      logout() {
+          this.authService.logout();
+      }
+
+      login(user, password) {
+          this.settingsService.setProviders(this.providers);
+          this.authService.login(user, password).subscribe(
+              token => {
+                  console.log(token);
+                  this.token = token;
+                  this.authenticated = true;
+              },
+              error => {
+                  console.log(error);
+                  this.authenticated = false;
+                  this.loginErrorMessage = error;
+              });
+      }
+
+      isLoggedIn(): boolean {
+          return this.authService.isLoggedIn();
+      }
+
+      toggleECM(checked) {
+          if (checked && this.providers === 'BPM') {
+              this.providers = 'ALL';
+          } else if (checked) {
+              this.providers = 'ECM';
+          } else {
+              this.providers = undefined;
+          }
+      }
+
+      toggleBPM(checked) {
+          if (checked && this.providers === 'ECM') {
+              this.providers = 'ALL';
+          } else if (checked) {
+              this.providers = 'BPM';
+          } else {
+              this.providers = undefined;
+          }
+      }
 }
 
 bootstrap(UserInfoDemo, [
diff --git a/ng2-components/ng2-alfresco-userinfo/src/img/anonymous.gif b/ng2-components/ng2-alfresco-userinfo/src/img/anonymous.gif
new file mode 100644
index 0000000000000000000000000000000000000000..e1b58fa57dfcdfd452ec498c98b930aa905d21d6
GIT binary patch
literal 1765
zcmb8pizCyC0|4;vcMq|L=guW!Vi%c59pzQG$YVmt<yA6~M~lTU<bKSWjOE$#nn%cJ
z%r(ytLRfVqH?Fzpl1JWM9*4N!?@#!B{(_Gk(bm+A1b_g@kO!JOIwkKXH#Rq8lkesh
zl`bu>(9<&qUk|0_<~^#dpPrfJR`3LkEhFNwuD*UseB%E9NpnxZIwFun4Gh4>giwRA
zc0?x^01y1ne**w~537AIAf!0BrjESujDjDc-khY>t=wMO?<%F(;}2yFR74Dt%}a)P
zREJt`!8kwq<x*VdR6Whnpm1oeA?|fp+vIA?ZD)aGWvl&{p_QHe#3Xt$;|??BZYt|0
z90X7>m|RZoeK}|r3IHK##rg<YB$QM6s8R|kizul*f|il05;kz8WYBeY;i!tn&MrAA
z6#OY2%<dL-Bf%F5120EJu-}Ga;Dc`^UC6$%NMPb)Hx!tnAf%@kyQC-QLJvG!S{FiF
z*Md<S-x_DPMcS)&luPtPe;8kHpnmi$<7$IRk?Fi<uRc^aluvU_Yhhy#Q`<*?iopZo
zJzED|!ishu$aS~Pn#=wRlJ6orYMC!Ls|f1HxEW974BC}pLFLmBOf@m@e1=-o(=~#-
z))O9GJ1)weSo_1p=x<pHi?(Uk5@0403gMjwI9?F2&gpk=Rk9KPc~;4=r!YQ>zkWXR
z#*`{VI@~f{tInV0ukw<z+d>K$G*WXf9#@J?Z!6r<T}MHwb8+RwHlu`sE1|#RJ)6~o
zzS~F>2$!xjap@7u(QUCMI;#?2#}9bcnDw%MSwt8tuX$>-NEJGdr(T*AtL&uqN~#WT
z-g_QP^LsP+c=+}i&ztKwm?_}Wl%Vf);6;vy(fFPKq-Krf{zpQvQICg(?Ug@>Nx&U+
zjC*f3!1kFY4zS~t!;(qN5%NIU3H4v3)8o8SJ&}xYli-Iq9S6HVS;BT^QM6I<7xiew
zs43F&{rZ7&()90DAGOE2XC;|(F#99fIapv)+E_ML>o!h2H=U!U*6L3=``J^Qqoo7W
zf@~)ZW~T<w&5B|bA63u909!3wv+z1>7YOjSR6)Sl<vLeqs_F29#E00~5Q4J#724Hf
z2nU*_xd>9&+Nd*+aNRrksZvj^#`9rO9o8rC1d|21)u|F3inL-f#Wi}R<~|kmHN&5;
z3B)yYe%YIv8;IuZpFayGV;%0-^uB2NgFe{gg7ft_xj^TT_Y{uR${^)A3ysIpSs39&
z9ijG;m}vnKkiUg2%P?vsYQCJO@$_OV@CO0Hu)t)o;|R^??X%tO1-F=8j*)@eCsBO8
zi%eVFsxw-!Lvd0lwD|S>cPa5}M3u<4Tb}T$Ox;$^a_lM*m{i5Pu{oB{h2Ay`Po(Dx
zD#N-MNvdBGX_`Lud8}5idh^1LixlXK&^sCJ@PI-I<kZ5UstBq>Jn*VhrM|k_W5)x{
zzhbeqUP%h#MU{Oa-7EuT&#~1EiAPO=<DcPE#yPp#!)u-~HSA__SZ5^xa!byP0C8B3
zI$BBFx9SqRqJ3!}IcmkG&S@9J<RJfiz;ucB3Nj+M-nW@f#mueOFFn>nPq4Rbk@D@*
z6M~fh0C=qA2Fx`k=Mt6^izaq#br)QLk3CvAW9%+&^6yXaFr(JLRl%+P{?WF8(;BaX
zE{t!)7R`6~pLq*@-8wtlZL#g$h)*e9)U%B{XxYCXGPN_V;k|Z!l;3$33aB3vZ~j!f
z8jhOM^$Qdom4h>-B7!MgsLVCNNk__$82?`QspL*0zwl&CWb!J(Q;GX2gTXNKJLh7b
zN8^5=;xVjOqw+n`ziQf<^ritlK&M(Z8LjoT%+`GX4nZhrFaHSbxJOg`KARNhh?nMx
zGP`u#0?`@`N33T&?%+eSu$L?L=-+paXBat?0s^Lq(6>66KiD9fJaJdGPrldmp)ES9
zq5Q@w&+dWzairp+mQ9lhlYn@l$-pFQ%6Vm;W0F$S`6)^oDnz!UA}W)wZD#Nf-02yE
zSxiRiSbJrnHZpS2^QFqWDWYiJ2_&D4GxJTob6game4Rnp4-a8oK0|uY-oP;ACYJg=
zfzq$)JUSkdEEQ-FsXFl0O1;D@^(Svq!Dtb~<Z<F_a##)`|J97{F?%M3CB#gtC7TU-
zrBYd7>|zD{Xe%&8EA}t;;Z>bJpL9WgQD_~sHG5(h>mr{Irog}T$u=eqGe-Q&yn=bw
z7r-~(&JD^vmmxkz!hBa8Ik(`jlhvudkmrW!#)Y{1Gd3YvBL>qqDmh!%F}{e44g(m3
zaqT=bY?~3aCoJ(;oj;Ql3NL$?!}~e$!?~b?QkCYp)qa#vtFm`QZozZZrH&eTD*&+g
E7ZAQxl>h($

literal 0
HcmV?d00001

diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
index 593079a8cf..455e04bd70 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
@@ -18,7 +18,7 @@
 import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
 import { Injectable } from '@angular/core';
 import { Response } from '@angular/http';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs/Rx';
 import { BpmUserModel } from '../models/bpmUser.model';
 /**
  *
@@ -46,10 +46,25 @@ export class BPMUserService {
             .catch(this.handleError);
     }
 
+    /**
+     * get User Information via ECM
+     * @param userName - the user name
+     */
+    getCurrentUserProfileImage(): Observable<BpmUserModel> {
+        return Observable.fromPromise(this.callApiGetProfileImage())
+            .do(
+                 data => console.log('Node data', data)
+                ) // eyeball results in the console
+            .catch(this.handleError);
+    }
+
+    private callApiGetProfileImage() {
+        return this.authService.getAlfrescoApi().activiti.profileApi.getProfilePicture();
+    }
+
     private callApiGetProfile() {
         return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
     }
-
     /**
      * Throw the error
      * @param error
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
index dbb005892a..1f6dd6c7d5 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
@@ -18,7 +18,7 @@
 import { AlfrescoApiService } from 'ng2-alfresco-core';
 import { Injectable } from '@angular/core';
 import { Response } from '@angular/http';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs/Rx';
 import { EcmUserModel } from '../models/ecmUser.model';
 /**
  *
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
new file mode 100644
index 0000000000..9f59213ab7
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
@@ -0,0 +1,14 @@
+.profile-image {
+  text-align: center;
+  border-radius: 90%;
+  width: 40px;
+  margin-right: 0%;
+  cursor: pointer;
+  border: 2px solid #999999;
+}
+
+.button-profile {
+  display: inline-block;
+  margin-right: -10px;
+  border: 0px;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
index 4a1c172487..153b90b6bd 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -1,139 +1,9 @@
-<main class="mdl-layout__content">
-<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
-    <!-- Tab Bars -->
-    <div class="mdl-tabs__tab-bar">
-        <a *ngIf="ecmUser" href="#ecm-panel" class="mdl-tabs__tab is-active">ECM</a>
-        <a *ngIf="bpmUser" href="#bpm-panel" class="mdl-tabs__tab">BPM</a>
-    </div>
-
-    <!-- MDL tab panels, is-active to denote currently active -->
-    <div *ngIf="ecmUser" class="mdl-tabs__panel" id="ecm-panel">
-        <ul class="demo-list-control mdl-list">
-            <li class="mdl-list__item">
-                    <span class="mdl-list__item-primary-content">
-                      <i class="material-icons  mdl-list__item-avatar">person</i>
-                      {{ecmUser.firstName}} {{ecmUser.lastName}}
-                    </span>
-            </li>
-            <li *ngIf="ecmUser.id" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Id: </span>
-                <label title="Id">
-                    {{ecmUser.id}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.description" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Description: </span>
-                <label title="description">
-                    {{ecmUser.description}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.email" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Email: </span>
-                <label title="email">
-                    {{ecmUser.email}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.skypeId" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Skype Id: </span>
-                <label title="skypeId">
-                    {{ecmUser.skypeId}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.googleId" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Google Id: </span>
-                <label title="googleId">
-                    {{ecmUser.googleId}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.instantMessageId" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Instant Message Id: </span>
-                <label title="instantMessageId">
-                    {{ecmUser.instantMessageId}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.jobTitle" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Job Title: </span>
-                <label title="jobTitle">
-                    {{ecmUser.jobTitle}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.location" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Location: </span>
-                <label title="location">
-                    {{ecmUser.location}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.mobile" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Mobile: </span>
-                <label title="mobile">
-                    {{ecmUser.mobile}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.telephone" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Telephone: </span>
-                <label title="telephone">
-                    {{ecmUser.telephone}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.userStatus" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">User Status: </span>
-                <label title="userStatus">
-                    {{ ecmUser.userStatus? 'Active':'Inactive' }}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.enabled" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Enabled: </span>
-                <label title="enabled">
-                    {{ecmUser.enabled}}
-                </label>
-            </li>
-            <li *ngIf="ecmUser.emailNotificationsEnabled" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Email Notifications: </span>
-                <label title="emailNotificationsEnabled">
-                    {{ecmUser.emailNotificationsEnabled? 'Enabled': 'Disabled'}}
-                </label>
-            </li>
-        </ul>
-    </div>
-    <div *ngIf="bpmUser" class="mdl-tabs__panel" id="bpm-panel">
-        <ul class="demo-list-control mdl-list">
-            <li class="mdl-list__item">
-                    <span class="mdl-list__item-primary-content">
-                      <i class="material-icons  mdl-list__item-avatar">person</i>
-                      {{bpmUser.fullname}}
-                    </span>
-            </li>
-            <li *ngIf="bpmUser.id" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Id: </span>
-                <label title="Id">
-                    {{bpmUser.id}}
-                </label>
-            </li>
-            <li *ngIf="bpmUser.email" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Email: </span>
-                <label title="email">
-                    {{bpmUser.email}}
-                </label>
-            </li>
-            <li *ngIf="bpmUser.status" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Status: </span>
-                <label title="jobTitle">
-                    {{bpmUser.status}}
-                </label>
-            </li>
-            <li *ngIf="bpmUser.tenantName" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Tenant Name: </span>
-                <label title="tenantName">
-                    {{bpmUser.tenantName}}
-                </label>
-            </li>
-            <li *ngIf="bpmUser.company" class="mdl-list__item">
-                <span class="mdl-list__item-primary-content">Company: </span>
-                <label title="company">
-                    {{bpmUser.company}}
-                </label>
-            </li>
-        </ul>
+<div id="profile-container">
+    <div class="button-profile" id="demo-menu-lower-right" data-automation-id="right-action-menu">
+        <span *ngIf="ecmUser">{{ecmUser.firstName}} {{ecmUser.lastName}}</span>
+        <span *ngIf="bpmUser">{{bpmUser.fullname}}</span>
+        <img id="logged-user-img"
+             src="{{ getUserAvatar() }}"
+             class="profile-image"/>
     </div>
 </div>
-</main>
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
index f29d945b8e..49f38942f0 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
@@ -1,3 +1,19 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
 
 import { Component, OnInit, Input } from '@angular/core';
 import { ECMUserService } from './services/ecmUser.service';
@@ -11,7 +27,7 @@ declare let __moduleName: string;
 @Component({
     selector: 'ng2-alfresco-userinfo',
     moduleId: __moduleName,
-    styles: [`:host h1 { font-size:22px }`],
+    styleUrls: ['./userinfo.component.css'],
     templateUrl: './userinfo.component.html',
     providers: [ ECMUserService, BPMUserService, AlfrescoContentService ]
 })
@@ -23,6 +39,10 @@ export class UserInfoComponent implements OnInit {
 
     private  ecmUser: EcmUserModel;
     private  bpmUser: BpmUserModel;
+    public   bpmUserImage: any;
+    public   ecmUserImage: any;
+
+    private baseComponentPath = __moduleName.replace('userinfo.component.js', '');
 
     constructor(private ecmUserService: ECMUserService,
                 private bpmUserService: BPMUserService,
@@ -32,15 +52,45 @@ export class UserInfoComponent implements OnInit {
     ngOnInit() {
         this.ecmUserService.getUserInfo(this.userEmail)
                                 .subscribe(
-                                      res => this.ecmUser = <EcmUserModel> res
+                                      res => {
+                                        this.ecmUser = <EcmUserModel> res;
+                                        this.getUserProfileImage();
+                                        console.log(this.ecmUserImage);
+                                      }
                                 );
         this.bpmUserService.getCurrentUserInfo()
                                 .subscribe(
-                                      res => this.bpmUser = <BpmUserModel> res
+                                      res => {
+                                        this.bpmUser = <BpmUserModel> res;
+                                      }
                                 );
+
     }
 
-    public getDocumentThumbnailUrl(avatarId: string): string {
-        return this.contentService.getDocumentThumbnailUrl(document);
+    private getUserProfileImage() {
+      if (this.ecmUser && this.ecmUser.avatarId) {
+          let nodeObj = { entry: { id: this.ecmUser.avatarId } };
+          this.ecmUserImage = this.contentService.getContentUrl(nodeObj);
+      }
+      if (this.bpmUser) {
+          this.bpmUserService.getCurrentUserProfileImage()
+                                .subscribe(
+                                      res => this.bpmUserImage = res
+                                );
+      }
     }
+
+    public getUserAvatar() {
+      if (this.ecmUserImage) {
+         return this.ecmUserImage;
+      }
+      if (this.bpmUserImage) {
+         return this.bpmUserImage;
+      }
+      if (!this.ecmUserImage && !this.bpmUserImage) {
+         return  this.baseComponentPath + '/img/anonymous.gif';
+      }
+    }
+
+
 }

From 3b6b8ed59b3ae06428d937b4691e80f492b062e4 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Thu, 22 Sep 2016 01:14:15 +0100
Subject: [PATCH 04/26] Added some upgrades to demo and added the component to
 demo shell

---
 demo-shell-ng2/app/app.component.html         |  4 +
 .../components/profile/profile.component.ts   | 16 ++++
 .../ng2-alfresco-upload/demo/index.html       |  1 +
 .../ng2-alfresco-userinfo/demo/index.html     |  3 +-
 .../ng2-alfresco-userinfo/demo/package.json   | 47 +++++++----
 .../ng2-alfresco-userinfo/demo/src/main.ts    |  5 +-
 .../ng2-alfresco-userinfo/package.json        | 51 ++++++------
 .../src/services/bpmUser.service.ts           | 38 +++++----
 .../src/services/ecmUser.service.ts           | 16 +++-
 .../src/userinfo.component.html               | 25 +++---
 .../src/userinfo.component.ts                 | 80 +++++++++----------
 11 files changed, 167 insertions(+), 119 deletions(-)

diff --git a/demo-shell-ng2/app/app.component.html b/demo-shell-ng2/app/app.component.html
index e4b21d6861..d8131ce30b 100644
--- a/demo-shell-ng2/app/app.component.html
+++ b/demo-shell-ng2/app/app.component.html
@@ -21,6 +21,10 @@
                 <a class="mdl-navigation__link" data-automation-id="login" href="" routerLink="/login">Login</a>
             </nav>
 
+            <div *ngIf="isLoggedIn()">
+                <ng2-alfresco-userinfo></ng2-alfresco-userinfo>
+            </div>
+
             <!-- Right aligned menu below button -->
             <button id="demo-menu-lower-right" data-automation-id="right-action-menu"
                     class="mdl-button mdl-js-button mdl-button--icon">
diff --git a/demo-shell-ng2/app/components/profile/profile.component.ts b/demo-shell-ng2/app/components/profile/profile.component.ts
index e69de29bb2..58ad8b656b 100644
--- a/demo-shell-ng2/app/components/profile/profile.component.ts
+++ b/demo-shell-ng2/app/components/profile/profile.component.ts
@@ -0,0 +1,16 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
diff --git a/ng2-components/ng2-alfresco-upload/demo/index.html b/ng2-components/ng2-alfresco-upload/demo/index.html
index 3ac59a64c4..fec1e9dbeb 100644
--- a/ng2-components/ng2-alfresco-upload/demo/index.html
+++ b/ng2-components/ng2-alfresco-upload/demo/index.html
@@ -1,4 +1,5 @@
 <!DOCTYPE html>
+<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/index.html b/ng2-components/ng2-alfresco-userinfo/demo/index.html
index 87aedd2904..d6b7f0a7d8 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/index.html
+++ b/ng2-components/ng2-alfresco-userinfo/demo/index.html
@@ -8,10 +8,11 @@
     <base href="/">
 
     <!-- Google Material Design Lite -->
-    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
+    <link rel="stylesheet" href="assets/material.orange-blue.min.css">
     <script src="node_modules/material-design-lite/material.min.js"></script>
     <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
 
+
     <!-- Polyfill(s) for older browsers -->
     <script src="node_modules/core-js/client/shim.min.js"></script>
     <script src="node_modules/zone.js/dist/zone.js"></script>
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/package.json b/ng2-components/ng2-alfresco-userinfo/demo/package.json
index 9566571b1f..5349c4e2a1 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/package.json
+++ b/ng2-components/ng2-alfresco-userinfo/demo/package.json
@@ -7,8 +7,7 @@
   "typings": "./dist/index.d.ts",
   "scripts": {
     "clean": "rimraf dist node_modules typings",
-    "typings": "typings install",
-    "postinstall": "npm run typings && npm run build",
+    "postinstall": "npm run build",
     "start": "npm run tslint && rimraf dist && tsc && concurrently \"tsc -w\" \"npm run server\" ",
     "server": "wsrv -o -l -s",
     "build": "npm run tslint && rimraf dist && tsc",
@@ -23,9 +22,11 @@
     "demo"
   ],
   "dependencies": {
+    "alfresco-js-api": "^0.3.0",
     "@angular/common": "2.0.0-rc.3",
     "@angular/compiler": "2.0.0-rc.3",
     "@angular/core": "2.0.0-rc.3",
+    "@angular/forms": "0.1.1",
     "@angular/http": "2.0.0-rc.3",
     "@angular/platform-browser": "2.0.0-rc.3",
     "@angular/platform-browser-dynamic": "2.0.0-rc.3",
@@ -33,24 +34,38 @@
     "@angular/router-deprecated": "2.0.0-rc.2",
     "@angular/upgrade": "2.0.0-rc.3",
     "systemjs": "0.19.27",
-    "core-js": "^2.4.0",
-    "reflect-metadata": "^0.1.3",
+    "core-js": "2.4.0",
+    "reflect-metadata": "0.1.3",
     "rxjs": "5.0.0-beta.6",
-    "zone.js": "^0.6.12",
-    "material-design-icons": "^2.2.3",
-    "material-design-lite": "^1.1.3",
+    "zone.js": "0.6.12",
     "ng2-translate": "2.2.2",
-
-    "ng2-alfresco-userinfo": "file:../",
-    "ng2-alfresco-core": "^0.3.0",
-    "alfresco-js-api": "^0.3.0"
+    "ng2-alfresco-core": "0.3.2",
+    "ng2-alfresco-userinfo": "file:../"
+  },
+  "peerDependencies": {
+    "material-design-icons": "^2.2.3",
+    "material-design-lite": "^1.1.3"
   },
   "devDependencies": {
-    "concurrently": "^2.0.0",
+    "@types/core-js": "^0.9.32",
+    "@types/jasmine": "^2.2.33",
+    "cpx": "1.3.1",
+    "jasmine-ajax": "3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "0.13.22",
+    "karma-chrome-launcher": "1.0.1",
+    "karma-coverage": "1.0.0",
+    "karma-jasmine": "1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "2.0.3",
+    "license-check": "1.1.5",
+    "remap-istanbul": "0.6.3",
     "rimraf": "2.5.2",
-    "tslint": "^3.8.1",
-    "typescript": "^1.8.10",
-    "typings": "^1.0.4",
-    "wsrv": "^0.1.4"
+    "traceur": "0.0.91",
+    "tslint": "3.8.1",
+    "typescript": "^2.0.2",
+    "wsrv": "^0.1.5"
   }
+
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
index 5e5ff8772c..c21351590c 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
+++ b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
@@ -6,6 +6,7 @@ import { HTTP_PROVIDERS } from '@angular/http';
 import {
     AlfrescoSettingsService,
     AlfrescoAuthenticationService,
+    MDL,
     ALFRESCO_CORE_PROVIDERS
 } from 'ng2-alfresco-core';
 
@@ -31,7 +32,7 @@ import {
   </p>
 </div>
 <div *ngIf="isLoggedIn()">
-    <ng2-alfresco-userinfo [userEmail]=userToLogin></ng2-alfresco-userinfo>
+    <ng2-alfresco-userinfo></ng2-alfresco-userinfo>
 </div>
 <p></p>
 <div>
@@ -49,7 +50,7 @@ import {
 
 <button (click)="logout()">Logout</button>`,
   directives: [ UserInfoComponent ],
-  providers: [AlfrescoAuthenticationService, AlfrescoSettingsService]
+  providers: [AlfrescoAuthenticationService, AlfrescoSettingsService, MDL]
 })
 
 
diff --git a/ng2-components/ng2-alfresco-userinfo/package.json b/ng2-components/ng2-alfresco-userinfo/package.json
index 34b6de40e7..538102137b 100644
--- a/ng2-components/ng2-alfresco-userinfo/package.json
+++ b/ng2-components/ng2-alfresco-userinfo/package.json
@@ -4,9 +4,7 @@
   "version": "0.1.0",
   "author": "vito albano <vito.albano@alfresco.com>",
   "scripts": {
-    "postinstall": "typings install",
-    "clean": "rimraf dist node_modules typings",
-    "typings": "typings install",
+    "clean": "rimraf dist node_modules",
     "license-check": "echo 'license check is disabled'",
     "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist && npm run license-check",
     "build:w": "npm run tslint && rimraf dist && npm run watch-task",
@@ -21,7 +19,6 @@
     "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\"",
     "posttest": "remap-istanbul -i coverage/report/coverage-final.json -o coverage/report -t html && remap-istanbul -i coverage/report/coverage-final.json -o coverage/report/coverage-final.json",
     "coverage": "npm run test && wsrv -o -p 9875 ./coverage/report",
-    "prepublish": "npm run build",
     "travis": "echo 'placeholder'"
   },
   "main": "./dist/index.js",
@@ -33,10 +30,13 @@
   "bugs": {
     "url": "https://github.com/alfresco/ng2-alfresco-userinfo/issues"
   },
+
   "dependencies": {
+    "alfresco-js-api": "^0.3.0",
     "@angular/common": "2.0.0-rc.3",
     "@angular/compiler": "2.0.0-rc.3",
     "@angular/core": "2.0.0-rc.3",
+    "@angular/forms": "0.1.1",
     "@angular/http": "2.0.0-rc.3",
     "@angular/platform-browser": "2.0.0-rc.3",
     "@angular/platform-browser-dynamic": "2.0.0-rc.3",
@@ -44,34 +44,35 @@
     "@angular/router-deprecated": "2.0.0-rc.2",
     "@angular/upgrade": "2.0.0-rc.3",
     "systemjs": "0.19.27",
-    "core-js": "^2.4.0",
-    "reflect-metadata": "^0.1.3",
+    "core-js": "2.4.0",
+    "reflect-metadata": "0.1.3",
     "rxjs": "5.0.0-beta.6",
-    "zone.js": "^0.6.12",
+    "zone.js": "0.6.12",
     "ng2-translate": "2.2.2",
-    "alfresco-js-api": "^0.3.0",
-    "ng2-alfresco-core": "0.3.2"
+    "ng2-alfresco-core": "0.3.2",
+    "material-design-icons": "2.2.3",
+    "material-design-lite": "1.1.3"
   },
   "devDependencies": {
-    "angular-cli": "1.0.0-beta.9",
-    "concurrently": "^2.1.0",
-    "cpx": "^1.3.1",
-    "jasmine-ajax": "^3.2.0",
+    "@types/core-js": "^0.9.32",
+    "@types/jasmine": "^2.2.33",
+    "cpx": "1.3.1",
+    "jasmine-ajax": "3.2.0",
     "jasmine-core": "2.4.1",
-    "karma": "~0.13.22",
-    "karma-chrome-launcher": "~1.0.1",
-    "karma-coverage": "^1.0.0",
-    "karma-jasmine": "~1.0.2",
+    "karma": "0.13.22",
+    "karma-chrome-launcher": "1.0.1",
+    "karma-coverage": "1.0.0",
+    "karma-jasmine": "1.0.2",
     "karma-jasmine-ajax": "^0.1.13",
-    "karma-jasmine-html-reporter": "^0.2.0",
-    "karma-mocha-reporter": "^2.0.3",
-    "remap-istanbul": "^0.6.3",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "2.0.3",
+    "license-check": "1.1.5",
+    "remap-istanbul": "0.6.3",
     "rimraf": "2.5.2",
-    "traceur": "^0.0.91",
-    "tslint": "^3.8.1",
-    "typescript": "^1.8.10",
-    "typings": "^1.0.4",
-    "wsrv": "^0.1.3"
+    "traceur": "0.0.91",
+    "tslint": "3.8.1",
+    "typescript": "^2.0.2",
+    "wsrv": "^0.1.5"
   },
   "keywords": [
     "component",
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
index 455e04bd70..5d3f2bd163 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
+import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
 import { Injectable } from '@angular/core';
 import { Response } from '@angular/http';
 import { Observable } from 'rxjs/Rx';
@@ -29,37 +29,35 @@ import { BpmUserModel } from '../models/bpmUser.model';
 @Injectable()
 export class BPMUserService {
 
-    constructor(public authService: AlfrescoAuthenticationService) {}
+    constructor(private authService: AlfrescoAuthenticationService,
+                private settingService: AlfrescoSettingsService) {
+    }
 
     /**
      * get User Information via ECM
      * @param userName - the user name
      */
     getCurrentUserInfo(): Observable<BpmUserModel> {
-        return Observable.fromPromise(this.callApiGetProfile())
-            .map(
-                 data => <BpmUserModel> data
-                )
-            .do(
-                 data => console.log('Node data', data)
-                ) // eyeball results in the console
-            .catch(this.handleError);
+       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
+            return Observable.fromPromise(this.callApiGetProfile())
+                .map(
+                     data => <BpmUserModel> data
+                    )
+                .do(
+                     data => console.log('Node data', data)
+                    ) // eyeball results in the console
+                .catch(this.handleError);
+        }
     }
 
     /**
      * get User Information via ECM
      * @param userName - the user name
      */
-    getCurrentUserProfileImage(): Observable<BpmUserModel> {
-        return Observable.fromPromise(this.callApiGetProfileImage())
-            .do(
-                 data => console.log('Node data', data)
-                ) // eyeball results in the console
-            .catch(this.handleError);
-    }
-
-    private callApiGetProfileImage() {
-        return this.authService.getAlfrescoApi().activiti.profileApi.getProfilePicture();
+    getCurrentUserProfileImage(): string {
+       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
+            return this.settingService.getBPMApiBaseUrl() + '/api/enterprise/profile-picture';
+       }
     }
 
     private callApiGetProfile() {
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
index 1f6dd6c7d5..e85f34b116 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { AlfrescoApiService } from 'ng2-alfresco-core';
+import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfresco-core';
 import { Injectable } from '@angular/core';
 import { Response } from '@angular/http';
 import { Observable } from 'rxjs/Rx';
@@ -29,23 +29,33 @@ import { EcmUserModel } from '../models/ecmUser.model';
 @Injectable()
 export class ECMUserService {
 
-    constructor(private apiService: AlfrescoApiService) {}
+    constructor(private authService: AlfrescoAuthenticationService,
+                private contentService: AlfrescoContentService) {}
 
     /**
      * get User Information via ECM
      * @param userName - the user name
      */
     getUserInfo(userName: string): Observable<EcmUserModel> {
+      if ( this.authService.getAlfrescoApi().ecmAuth.isLoggedIn() ) {
         return Observable.fromPromise(this.callApiGetPersonInfo(userName))
             .map( data => <EcmUserModel> data['entry'])
             .do(
                  data => console.log('Node data', data['entry'])
                 ) // eyeball results in the console
             .catch(this.handleError);
+      }
     }
 
     private callApiGetPersonInfo(userName: string, opts?: any) {
-        return this.apiService.getInstance().core.peopleApi.getPerson(userName, opts);
+        return this.authService.getAlfrescoApi().core.peopleApi.getPerson(userName, opts);
+    }
+
+    getCurrentUserProfileImageUrl(avatarId: string) {
+       if ( avatarId ) {
+            let nodeObj = {entry: {id: avatarId}};
+            return this.contentService.getContentUrl(nodeObj);
+       }
     }
 
     /**
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
index 153b90b6bd..bf39e21403 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -1,9 +1,16 @@
-<div id="profile-container">
-    <div class="button-profile" id="demo-menu-lower-right" data-automation-id="right-action-menu">
-        <span *ngIf="ecmUser">{{ecmUser.firstName}} {{ecmUser.lastName}}</span>
-        <span *ngIf="bpmUser">{{bpmUser.fullname}}</span>
-        <img id="logged-user-img"
-             src="{{ getUserAvatar() }}"
-             class="profile-image"/>
-    </div>
-</div>
+<span *ngIf="ecmUser">{{ecmUser.firstName}} {{ecmUser.lastName}}</span>
+<span *ngIf="bpmUser">{{bpmUser.fullname}}</span>
+<button id="demo-menu-lower-right"
+        class="mdl-button mdl-js-button mdl-button--icon">
+            <img id="logged-user-img"
+                 src="{{ getUserAvatar() }}"
+                 class="profile-image"/>
+</button>
+
+<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
+    for="demo-menu-lower-right">
+    <li class="mdl-menu__item">Some Action</li>
+    <li class="mdl-menu__item">Another Action</li>
+    <li disabled class="mdl-menu__item">Disabled Action</li>
+    <li class="mdl-menu__item">Yet Another Action</li>
+</ul>
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
index 49f38942f0..20becdb6b3 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
@@ -15,12 +15,12 @@
  * limitations under the License.
  */
 
-import { Component, OnInit, Input } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ECMUserService } from './services/ecmUser.service';
 import { BPMUserService } from './services/bpmUser.service';
 import { EcmUserModel } from './models/ecmUser.model';
 import { BpmUserModel } from './models/bpmUser.model';
-import { AlfrescoContentService } from 'ng2-alfresco-core';
+import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
 
 declare let __moduleName: string;
 
@@ -29,14 +29,11 @@ declare let __moduleName: string;
     moduleId: __moduleName,
     styleUrls: ['./userinfo.component.css'],
     templateUrl: './userinfo.component.html',
-    providers: [ ECMUserService, BPMUserService, AlfrescoContentService ]
+    providers: [ECMUserService, BPMUserService, AlfrescoAuthenticationService]
 })
 
 export class UserInfoComponent implements OnInit {
 
-    @Input()
-    userEmail: string;
-
     private  ecmUser: EcmUserModel;
     private  bpmUser: BpmUserModel;
     public   bpmUserImage: any;
@@ -46,51 +43,48 @@ export class UserInfoComponent implements OnInit {
 
     constructor(private ecmUserService: ECMUserService,
                 private bpmUserService: BPMUserService,
-                private contentService: AlfrescoContentService) {
+                public authService: AlfrescoAuthenticationService) {
     }
 
     ngOnInit() {
-        this.ecmUserService.getUserInfo(this.userEmail)
-                                .subscribe(
-                                      res => {
-                                        this.ecmUser = <EcmUserModel> res;
-                                        this.getUserProfileImage();
-                                        console.log(this.ecmUserImage);
-                                      }
-                                );
-        this.bpmUserService.getCurrentUserInfo()
-                                .subscribe(
-                                      res => {
-                                        this.bpmUser = <BpmUserModel> res;
-                                      }
-                                );
-
+        if (this.authService.getAlfrescoApi().ecmAuth.isLoggedIn()) {
+            this.ecmUserService.getUserInfo('-me-')
+                .subscribe(
+                    (res) => {
+                    this.ecmUser = <EcmUserModel> res;
+                    this.getUserProfileImage();
+                }
+            );
+        }
+        if (this.authService.getAlfrescoApi().bpmAuth.isLoggedIn()) {
+            this.bpmUserService.getCurrentUserInfo()
+                .subscribe(
+                    (res) => {
+                    this.bpmUser = <BpmUserModel> res;
+                    this.getUserProfileImage();
+                }
+            );
+        }
     }
 
     private getUserProfileImage() {
-      if (this.ecmUser && this.ecmUser.avatarId) {
-          let nodeObj = { entry: { id: this.ecmUser.avatarId } };
-          this.ecmUserImage = this.contentService.getContentUrl(nodeObj);
-      }
-      if (this.bpmUser) {
-          this.bpmUserService.getCurrentUserProfileImage()
-                                .subscribe(
-                                      res => this.bpmUserImage = res
-                                );
-      }
+        if (this.ecmUser) {
+            this.ecmUserImage = this.ecmUserService.getCurrentUserProfileImageUrl(this.ecmUser.avatarId);
+        }
+        if (this.bpmUser) {
+            this.bpmUserImage = this.bpmUserService.getCurrentUserProfileImage();
+        }
     }
 
     public getUserAvatar() {
-      if (this.ecmUserImage) {
-         return this.ecmUserImage;
-      }
-      if (this.bpmUserImage) {
-         return this.bpmUserImage;
-      }
-      if (!this.ecmUserImage && !this.bpmUserImage) {
-         return  this.baseComponentPath + '/img/anonymous.gif';
-      }
+        if (this.ecmUserImage) {
+            return this.ecmUserImage;
+        }
+        if (this.bpmUserImage) {
+            return this.bpmUserImage;
+        }
+        if (!this.ecmUserImage && !this.bpmUserImage) {
+            return this.baseComponentPath + '/img/anonymous.gif';
+        }
     }
-
-
 }

From 9ed232df5b1ac869d8108aace23f06a6b1c1da6b Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 23 Sep 2016 00:04:03 +0100
Subject: [PATCH 05/26] Added fix for first component style

---
 demo-shell-ng2/app/app.component.css          |  3 +
 demo-shell-ng2/app/app.component.html         |  2 +-
 .../src/userinfo.component.css                | 12 ++-
 .../src/userinfo.component.html               | 74 +++++++++++++++----
 .../src/userinfo.component.ts                 | 31 +++-----
 5 files changed, 85 insertions(+), 37 deletions(-)

diff --git a/demo-shell-ng2/app/app.component.css b/demo-shell-ng2/app/app.component.css
index 700caa1af0..cdfe6eb2e7 100644
--- a/demo-shell-ng2/app/app.component.css
+++ b/demo-shell-ng2/app/app.component.css
@@ -7,3 +7,6 @@
 .mdl-layout-title{
     font-size: 17px;
 }
+.user-profile{
+    margin-right: 3px;
+}
\ No newline at end of file
diff --git a/demo-shell-ng2/app/app.component.html b/demo-shell-ng2/app/app.component.html
index d8131ce30b..463e250c35 100644
--- a/demo-shell-ng2/app/app.component.html
+++ b/demo-shell-ng2/app/app.component.html
@@ -21,7 +21,7 @@
                 <a class="mdl-navigation__link" data-automation-id="login" href="" routerLink="/login">Login</a>
             </nav>
 
-            <div *ngIf="isLoggedIn()">
+            <div class="user-profile" *ngIf="isLoggedIn()">
                 <ng2-alfresco-userinfo></ng2-alfresco-userinfo>
             </div>
 
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
index 9f59213ab7..bcd1bc0bca 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
@@ -4,11 +4,19 @@
   width: 40px;
   margin-right: 0%;
   cursor: pointer;
-  border: 2px solid #999999;
+  border: 1px solid #999999;
 }
 
 .button-profile {
   display: inline-block;
-  margin-right: -10px;
   border: 0px;
 }
+
+.detail-user-profile-list-mdl{
+    margin-right: 100px;
+}
+
+.user-profile-list-mdl{
+    max-height: 250px;
+    width: 400px;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
index bf39e21403..5437e89627 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -1,16 +1,60 @@
-<span *ngIf="ecmUser">{{ecmUser.firstName}} {{ecmUser.lastName}}</span>
-<span *ngIf="bpmUser">{{bpmUser.fullname}}</span>
-<button id="demo-menu-lower-right"
-        class="mdl-button mdl-js-button mdl-button--icon">
-            <img id="logged-user-img"
-                 src="{{ getUserAvatar() }}"
-                 class="profile-image"/>
-</button>
+<div id="img_container">
+    <span *ngIf="ecmUser">{{ecmUser.firstName || ecmUser.lastName}}</span>
+    <span *ngIf="bpmUser">{{bpmUser.firstName || bpmUser.lastName || bpmUser.fullName}}</span>
+    <div class="button-profile" id="user-profile" data-automation-id="user-profile">
+                <img id="logged-user-img"
+                     [src]="getUserAvatar()"
+                     class="profile-image"/>
+    </div>
+    <div class="user-profile-list-mdl
+                mdl-menu mdl-menu--bottom-right
+                mdl-js-menu mdl-js-ripple-effect"
+         for="user-profile">
+            <ul class='detail-user-profile-list-mdl mdl-list'>
+                <div *ngIf="ecmUser">
+                    <li class="mdl-list__item">
+                        <span class="mdl-list__item-primary-content"> ECM </span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">First Name : </span>
+                        <span  class="mdl-list__item-secondary-content"> {{ecmUser.firstName}}</span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">Last Name : </span>
+                        <span  class="mdl-list__item-secondary-content">{{ecmUser.lastName}}</span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">Email : </span>
+                        <span  class="mdl-list__item-secondary-content"> {{ecmUser.email}}</span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">Job Title : </span>
+                        <span  class="mdl-list__item-secondary-content"> {{ecmUser.jobTitle}}</span>
+                    </li>
+                </div>
+                    <div *ngIf="bpmUser">
+                    <li class="mdl-list__item">
+                        <span class="mdl-list__item-primary-content"> BPM </span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">First Name : </span>
+                        <span  class="mdl-list__item-secondary-content"> {{bpmUser.firstName}}</span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">Last Name : </span>
+                        <span  class="mdl-list__item-secondary-content">{{bpmUser.lastName}}</span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">Email : </span>
+                        <span  class="mdl-list__item-secondary-content"> {{bpmUser.email}}</span>
+                    </li>
+                    <li class="mdl-list__item mdl-list__item-two-line">
+                        <span class="mdl-list__item-secondary-content">Tenant Name : </span>
+                        <span  class="mdl-list__item-secondary-content"> {{bpmUser.tenantName}}</span>
+                    </li>
+                </div>
+            </ul>
+    </div>
+</div>
+
 
-<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
-    for="demo-menu-lower-right">
-    <li class="mdl-menu__item">Some Action</li>
-    <li class="mdl-menu__item">Another Action</li>
-    <li disabled class="mdl-menu__item">Disabled Action</li>
-    <li class="mdl-menu__item">Yet Another Action</li>
-</ul>
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
index 20becdb6b3..4ed268af9b 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
@@ -36,10 +36,11 @@ export class UserInfoComponent implements OnInit {
 
     private  ecmUser: EcmUserModel;
     private  bpmUser: BpmUserModel;
+    private baseComponentPath = __moduleName.replace('userinfo.component.js', '');
+    private  anonymouseImageUrl: string = this.baseComponentPath + 'img/anonymous.gif';
     public   bpmUserImage: any;
     public   ecmUserImage: any;
 
-    private baseComponentPath = __moduleName.replace('userinfo.component.js', '');
 
     constructor(private ecmUserService: ECMUserService,
                 private bpmUserService: BPMUserService,
@@ -52,7 +53,7 @@ export class UserInfoComponent implements OnInit {
                 .subscribe(
                     (res) => {
                     this.ecmUser = <EcmUserModel> res;
-                    this.getUserProfileImage();
+                    this.getEcmUserProfileImage();
                 }
             );
         }
@@ -61,30 +62,22 @@ export class UserInfoComponent implements OnInit {
                 .subscribe(
                     (res) => {
                     this.bpmUser = <BpmUserModel> res;
-                    this.getUserProfileImage();
+                    this.getBpmUserProfileImage();
                 }
             );
         }
     }
 
-    private getUserProfileImage() {
-        if (this.ecmUser) {
-            this.ecmUserImage = this.ecmUserService.getCurrentUserProfileImageUrl(this.ecmUser.avatarId);
-        }
-        if (this.bpmUser) {
-            this.bpmUserImage = this.bpmUserService.getCurrentUserProfileImage();
-        }
+    private getBpmUserProfileImage() {
+        this.bpmUserImage = this.bpmUserService.getCurrentUserProfileImage();
+    }
+
+    private getEcmUserProfileImage() {
+        this.ecmUserImage = this.ecmUserService.getCurrentUserProfileImageUrl(this.ecmUser.avatarId);
     }
 
     public getUserAvatar() {
-        if (this.ecmUserImage) {
-            return this.ecmUserImage;
-        }
-        if (this.bpmUserImage) {
-            return this.bpmUserImage;
-        }
-        if (!this.ecmUserImage && !this.bpmUserImage) {
-            return this.baseComponentPath + '/img/anonymous.gif';
-        }
+        return this.ecmUserImage || this.bpmUserImage ||  this.anonymouseImageUrl;
     }
+
 }

From b68e07286c00237a2e786f4f3fe464a9979c8086 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 23 Sep 2016 11:35:46 +0100
Subject: [PATCH 06/26] Added some syle improvements

---
 .../src/services/bpmUser.service.ts           |  5 +-
 .../src/services/ecmUser.service.ts           |  7 +-
 .../src/userinfo.component.css                |  3 +-
 .../src/userinfo.component.html               | 68 ++++++++++++++-----
 4 files changed, 56 insertions(+), 27 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
index 5d3f2bd163..6e8204a234 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
@@ -41,11 +41,8 @@ export class BPMUserService {
        if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
             return Observable.fromPromise(this.callApiGetProfile())
                 .map(
-                     data => <BpmUserModel> data
+                     (data) => <BpmUserModel> data
                     )
-                .do(
-                     data => console.log('Node data', data)
-                    ) // eyeball results in the console
                 .catch(this.handleError);
         }
     }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
index e85f34b116..56b0e62c0b 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
@@ -39,10 +39,9 @@ export class ECMUserService {
     getUserInfo(userName: string): Observable<EcmUserModel> {
       if ( this.authService.getAlfrescoApi().ecmAuth.isLoggedIn() ) {
         return Observable.fromPromise(this.callApiGetPersonInfo(userName))
-            .map( data => <EcmUserModel> data['entry'])
-            .do(
-                 data => console.log('Node data', data['entry'])
-                ) // eyeball results in the console
+            .map(
+                   (data) => <EcmUserModel> data['entry']
+                )
             .catch(this.handleError);
       }
     }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
index bcd1bc0bca..55b411d282 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
@@ -17,6 +17,7 @@
 }
 
 .user-profile-list-mdl{
-    max-height: 250px;
+    max-height: 450px;
     width: 400px;
+    overflow: auto;
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
index 5437e89627..8311349814 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -13,44 +13,76 @@
             <ul class='detail-user-profile-list-mdl mdl-list'>
                 <div *ngIf="ecmUser">
                     <li class="mdl-list__item">
-                        <span class="mdl-list__item-primary-content"> ECM </span>
+                        <span class="mdl-list__item-primary-content" style="color: rgb(255,152,0);"> ECM </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">First Name : </span>
-                        <span  class="mdl-list__item-secondary-content"> {{ecmUser.firstName}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong> First Name : </strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i>{{ecmUser.firstName}}</i>
+                        </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">Last Name : </span>
-                        <span  class="mdl-list__item-secondary-content">{{ecmUser.lastName}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong>Last Name :</strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i>{{ecmUser.lastName}}</i>
+                        </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">Email : </span>
-                        <span  class="mdl-list__item-secondary-content"> {{ecmUser.email}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong>Email : </strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i>{{ecmUser.email}}</i>
+                        </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">Job Title : </span>
-                        <span  class="mdl-list__item-secondary-content"> {{ecmUser.jobTitle}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong> Job Title : </strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i> {{ecmUser.jobTitle}}</i>
+                        </span>
                     </li>
                 </div>
                     <div *ngIf="bpmUser">
                     <li class="mdl-list__item">
-                        <span class="mdl-list__item-primary-content"> BPM </span>
+                        <span class="mdl-list__item-primary-content" style="color: rgb(255,152,0);"> BPM </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">First Name : </span>
-                        <span  class="mdl-list__item-secondary-content"> {{bpmUser.firstName}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong>First Name : </strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i>{{bpmUser.firstName}}</i>
+                        </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">Last Name : </span>
-                        <span  class="mdl-list__item-secondary-content">{{bpmUser.lastName}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong>Last Name : </strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i>{{bpmUser.lastName}}</i>
+                        </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">Email : </span>
-                        <span  class="mdl-list__item-secondary-content"> {{bpmUser.email}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong>Email : </strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i>{{bpmUser.email}}</i>
+                        </span>
                     </li>
                     <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">Tenant Name : </span>
-                        <span  class="mdl-list__item-secondary-content"> {{bpmUser.tenantName}}</span>
+                        <span class="mdl-list__item-secondary-content">
+                            <strong>Tenant Name : </strong>
+                        </span>
+                        <span  class="mdl-list__item-secondary-content">
+                            <i>{{bpmUser.tenantName}}</i>
+                        </span>
                     </li>
                 </div>
             </ul>

From 078e7659af8eeed098ee1daebacd2d595e5d923a Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 23 Sep 2016 11:46:40 +0100
Subject: [PATCH 07/26] Added min-width to component style

---
 .../ng2-alfresco-userinfo/src/userinfo.component.css           | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
index 55b411d282..dbf99bfc30 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
@@ -18,6 +18,7 @@
 
 .user-profile-list-mdl{
     max-height: 450px;
-    width: 400px;
+    max-width: 450px;
+    min-width: 410px;
     overflow: auto;
 }

From 6f375b0a5c8611378b110b4d010e9bef59dc1683 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 23 Sep 2016 15:49:41 +0100
Subject: [PATCH 08/26] Added more style improvements

---
 .../src/userinfo.component.css                |  35 +++++-
 .../src/userinfo.component.html               | 105 +++++++-----------
 .../src/userinfo.component.ts                 |  12 ++
 3 files changed, 82 insertions(+), 70 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
index dbf99bfc30..93254d00fa 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
@@ -5,20 +5,49 @@
   margin-right: 0%;
   cursor: pointer;
   border: 1px solid #999999;
+  vertical-align: middle;
 }
 
 .button-profile {
   display: inline-block;
   border: 0px;
+  vertical-align: middle;
 }
 
 .detail-user-profile-list-mdl{
-    margin-right: 100px;
+    margin-right: 10px;
 }
 
 .user-profile-list-mdl{
     max-height: 450px;
-    max-width: 450px;
-    min-width: 410px;
+    min-width: 450px;
     overflow: auto;
 }
+
+.header-profile{
+    color: rgb(255,152,0);
+    margin-left: 10px;
+}
+
+hr.title-start {
+    border: 0;
+    height: 1px;
+    background: #333;
+    background-image: linear-gradient(to right, #ccc, #333, #ccc);
+}
+
+span.role-label-user{
+    font-weight: 400;
+    line-height: 1;
+    letter-spacing: 0;
+    color: rgba(0,0,0,.87);
+}
+
+.custom-role-style{
+    font-size: 14px;
+    color: #9e9e9e;
+}
+
+.truncate-long-names{
+    text-overflow: ellipsis;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
index 8311349814..74e47e341f 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -1,6 +1,10 @@
 <div id="img_container">
     <span *ngIf="ecmUser">{{ecmUser.firstName || ecmUser.lastName}}</span>
-    <span *ngIf="bpmUser">{{bpmUser.firstName || bpmUser.lastName || bpmUser.fullName}}</span>
+    <span *ngIf="bpmUser">
+        {{ formatValue(bpmUser.firstName) ||
+           formatValue(bpmUser.lastName)  ||
+           formatValue(bpmUser.fullName) }}
+    </span>
     <div class="button-profile" id="user-profile" data-automation-id="user-profile">
                 <img id="logged-user-img"
                      [src]="getUserAvatar()"
@@ -9,79 +13,46 @@
     <div class="user-profile-list-mdl
                 mdl-menu mdl-menu--bottom-right
                 mdl-js-menu mdl-js-ripple-effect"
-         for="user-profile">
+                for="user-profile">
             <ul class='detail-user-profile-list-mdl mdl-list'>
                 <div *ngIf="ecmUser">
-                    <li class="mdl-list__item">
-                        <span class="mdl-list__item-primary-content" style="color: rgb(255,152,0);"> ECM </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong> First Name : </strong>
+                    <span class="header-profile"><b>ECM</b></span>
+                    <hr class="title-start">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                          <i class="mdl-list__item-avatar">
+                              <img id="logged-user-img"
+                                   [src]="getEcmUserDetailAvatarUrl()"
+                                   class="profile-image"/>
+                          </i>
+                          <span class="truncate-long-names">{{ecmUser.firstName}} {{ecmUser.lastName}}</span>
+                          <span class="mdl-list__item-sub-title">{{ecmUser.email}}</span>
                         </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i>{{ecmUser.firstName}}</i>
-                        </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong>Last Name :</strong>
-                        </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i>{{ecmUser.lastName}}</i>
-                        </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong>Email : </strong>
-                        </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i>{{ecmUser.email}}</i>
-                        </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong> Job Title : </strong>
-                        </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i> {{ecmUser.jobTitle}}</i>
+                        <span class="mdl-list__item-secondary-content custom-role-style">
+                            <span class="role-label-user">Job Role</span>
+                            {{ecmUser.jobTitle}}
                         </span>
                     </li>
                 </div>
-                    <div *ngIf="bpmUser">
-                    <li class="mdl-list__item">
-                        <span class="mdl-list__item-primary-content" style="color: rgb(255,152,0);"> BPM </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong>First Name : </strong>
+                <br>
+                <div *ngIf="bpmUser">
+                    <span class="header-profile"><b>BPM</b></span>
+                    <hr class="title-start">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                          <i class="mdl-list__item-avatar">
+                              <img id="logged-user-img"
+                                   [src]="getBpmUserDetailAvatarUrl()"
+                                   class="profile-image"/>
+                          </i>
+                          <span class="truncate-long-names">
+                              {{formatValue(bpmUser.firstName) }} {{ formatValue(bpmUser.lastName) }}
+                          </span>
+                          <span class="mdl-list__item-sub-title">{{bpmUser.email}}</span>
                         </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i>{{bpmUser.firstName}}</i>
-                        </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong>Last Name : </strong>
-                        </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i>{{bpmUser.lastName}}</i>
-                        </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong>Email : </strong>
-                        </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i>{{bpmUser.email}}</i>
-                        </span>
-                    </li>
-                    <li class="mdl-list__item mdl-list__item-two-line">
-                        <span class="mdl-list__item-secondary-content">
-                            <strong>Tenant Name : </strong>
-                        </span>
-                        <span  class="mdl-list__item-secondary-content">
-                            <i>{{bpmUser.tenantName}}</i>
+                        <span class="mdl-list__item-secondary-content custom-role-style">
+                            <span class="role-label-user">Tenant</span>
+                            {{bpmUser.tenantName}}
                         </span>
                     </li>
                 </div>
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
index 4ed268af9b..f991d8825f 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
@@ -80,4 +80,16 @@ export class UserInfoComponent implements OnInit {
         return this.ecmUserImage || this.bpmUserImage ||  this.anonymouseImageUrl;
     }
 
+    public getBpmUserDetailAvatarUrl() {
+        return this.bpmUserImage || this.anonymouseImageUrl;
+    }
+
+    public getEcmUserDetailAvatarUrl() {
+        return this.ecmUserImage || this.anonymouseImageUrl;
+    }
+
+    public formatValue(value: string) {
+        return value === 'null' ? null : value;
+    }
+
 }

From 7ffe21b3c084051fc6cacb8e64e938905db9aa41 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 26 Sep 2016 11:37:02 +0100
Subject: [PATCH 09/26] Remove unused folder

---
 .../components/profile/AboutComponent.java    | 55 -------------------
 .../components/profile/profile.component.html |  0
 .../components/profile/profile.component.ts   | 16 ------
 3 files changed, 71 deletions(-)
 delete mode 100644 demo-shell-ng2/app/components/profile/AboutComponent.java
 delete mode 100644 demo-shell-ng2/app/components/profile/profile.component.html
 delete mode 100644 demo-shell-ng2/app/components/profile/profile.component.ts

diff --git a/demo-shell-ng2/app/components/profile/AboutComponent.java b/demo-shell-ng2/app/components/profile/AboutComponent.java
deleted file mode 100644
index 30b667a14a..0000000000
--- a/demo-shell-ng2/app/components/profile/AboutComponent.java
+++ /dev/null
@@ -1,55 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-import { Component, OnInit } from '@angular/core';
-import { Http } from '@angular/http';
-import {
-    ALFRESCO_DATATABLE_DIRECTIVES,
-    ObjectDataTableAdapter /*,
-    DataSorting,
-    ObjectDataRow,
-    ObjectDataColumn*/
-} from 'ng2-alfresco-datatable';
-
-declare let __moduleName: string;
-
-@Component({
-    moduleId: __moduleName,
-    selector: 'about-page',
-    templateUrl: './about.component.html',
-    directives: [ALFRESCO_DATATABLE_DIRECTIVES]
-})
-export class AboutComponent implements OnInit {
-
-    data: ObjectDataTableAdapter;
-
-    constructor(private http: Http) {}
-
-    ngOnInit() {
-        // this.data = new ObjectDataTableAdapter();
-        this.http.get('/versions').subscribe(response => {
-            let data = response.json() || {};
-            let packages = data.packages || [];
-
-            this.data = new ObjectDataTableAdapter(packages, [
-                { type: 'text', key: 'name', title: 'Name', sortable: true },
-                { type: 'text', key: 'version', title: 'Version', sortable: true }
-            ]);
-        });
-
-    }
-}
diff --git a/demo-shell-ng2/app/components/profile/profile.component.html b/demo-shell-ng2/app/components/profile/profile.component.html
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/demo-shell-ng2/app/components/profile/profile.component.ts b/demo-shell-ng2/app/components/profile/profile.component.ts
deleted file mode 100644
index 58ad8b656b..0000000000
--- a/demo-shell-ng2/app/components/profile/profile.component.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */

From 9750a90b1a11d06bc4a6a526204fb6317e9881f6 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 26 Sep 2016 15:47:45 +0100
Subject: [PATCH 10/26] Added userinfo component to new version of demo shell

---
 demo-shell-ng2/app/app.module.ts                            | 4 +++-
 demo-shell-ng2/systemjs.config.js                           | 6 ++++--
 .../ng2-alfresco-userinfo/src/userinfo.component.html       | 2 +-
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/demo-shell-ng2/app/app.module.ts b/demo-shell-ng2/app/app.module.ts
index 11f68f4476..156ed434f4 100644
--- a/demo-shell-ng2/app/app.module.ts
+++ b/demo-shell-ng2/app/app.module.ts
@@ -30,6 +30,7 @@ import { ViewerModule } from 'ng2-alfresco-viewer';
 import { ActivitiFormModule } from 'ng2-activiti-form';
 import { ActivitiTaskListModule } from 'ng2-activiti-tasklist';
 import { ActivitiProcessListModule } from 'ng2-activiti-processlist';
+import { UserInfoComponent } from 'ng2-alfresco-userinfo';
 
 import { AppComponent } from './app.component';
 import { routing } from './app.routes';
@@ -78,7 +79,8 @@ import {
         TagComponent,
         AboutComponent,
         FilesComponent,
-        FormNodeViewer
+        FormNodeViewer,
+        UserInfoComponent
     ],
     providers: [],
     bootstrap: [ AppComponent ]
diff --git a/demo-shell-ng2/systemjs.config.js b/demo-shell-ng2/systemjs.config.js
index 2eaf5d818b..8726219617 100644
--- a/demo-shell-ng2/systemjs.config.js
+++ b/demo-shell-ng2/systemjs.config.js
@@ -36,7 +36,8 @@
             'ng2-alfresco-tag': 'npm:ng2-alfresco-tag/dist',
             'ng2-activiti-tasklist': 'npm:ng2-activiti-tasklist/dist',
             'alfresco-js-api': 'npm:alfresco-js-api/dist',
-            'ng2-activiti-processlist': 'npm:ng2-activiti-processlist/dist'
+            'ng2-activiti-processlist': 'npm:ng2-activiti-processlist/dist',
+            'ng2-alfresco-userinfo': 'npm:ng2-alfresco-userinfo/dist'
         },
         // packages tells the System loader how to load when no filename and/or no extension
         packages: {
@@ -61,7 +62,8 @@
             'ng2-activiti-tasklist': { main: './index.js', defaultExtension: 'js'},
             'ng2-alfresco-webscript': { main: './index.js', defaultExtension: 'js'},
             'ng2-alfresco-tag': { main: './index.js', defaultExtension: 'js'},
-            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'}
+            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
+            'ng2-alfresco-userinfo': { main: './index.js', defaultExtension: 'js'}
         }
     });
 })(this);
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
index 74e47e341f..8c01dc7120 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
@@ -34,7 +34,7 @@
                         </span>
                     </li>
                 </div>
-                <br>
+
                 <div *ngIf="bpmUser">
                     <span class="header-profile"><b>BPM</b></span>
                     <hr class="title-start">

From b3b381536e960c7d8b69b576a35f2a356873e56c Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Tue, 27 Sep 2016 12:26:13 +0100
Subject: [PATCH 11/26] Added ReadMe

---
 .../ng2-alfresco-userinfo/README.md           | 54 ++++++++++++++-----
 1 file changed, 42 insertions(+), 12 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/README.md b/ng2-components/ng2-alfresco-userinfo/README.md
index fe8a836e34..f100be7287 100644
--- a/ng2-components/ng2-alfresco-userinfo/README.md
+++ b/ng2-components/ng2-alfresco-userinfo/README.md
@@ -1,28 +1,58 @@
-# ng2-alfresco-userinfo
+# Alfresco User Info Component for Angular 2
 This component will show the user information for ECM and BPM
 
+
+## Prerequisites
+
+Before you start using this development framework, make sure you have installed all required software and done all the
+necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
+
 ## Installation
 
 ```bash
 npm install ng2-alfresco-userinfo --save
 ```
+## Dependencies
 
+Add the following dependency to your index.html:
+```html
+<script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
+```
+	
+You must separately install the following libraries for your application:
+	
+- [ng2-translate](https://github.com/ocombe/ng2-translate)
+- [ng2-alfresco-core](https://www.npmjs.com/package/ng2-alfresco-core)
+
+```sh
+npm install --save ng2-translate ng2-alfresco-core
+```
+	
+#### Material Design Lite
+
+The style of this component is based on [material design](https://getmdl.io/), so if you want to visualize it correctly you have to add the material
+design dependency to your project:
+
+```sh
+npm install --save material-design-icons material-design-lite
+```
+
+Also make sure you include these dependencies in your `index.html` file:
+
+```html
+<!-- Google Material Design Lite -->
+<link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
+<script src="node_modules/material-design-lite/material.min.js"></script>
+<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
+```
+	
 ## Example
 
 ```html
 <ng2-alfresco-userinfo></ng2-alfresco-userinfo>
 ```
-
-## Reference
-
-Attribute     | Options     | Default      | Description
----           | ---         | ---          | ---
-`foo`         | *string*    | `bar`        | Lorem ipsum dolor.
-
-
-Method        | Parameters   | Returns     | Description
----           | ---          | ---         | ---
-`methodName()`   | None.        | void    | Lorem ipsum dolor.
+This will show a round icon with user and on click some user information are showed.
+If user is logged in with ECM and BPM the ECM image will be showed.
 
 ## NPM scripts
 

From 0d7f32a6491e4d9dc924b58881ccbfbbb2ff0302 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Tue, 27 Sep 2016 18:12:53 +0100
Subject: [PATCH 12/26] Fixed structure and naming convention

---
 .../ng2-alfresco-userinfo/angular-cli.json    |  27 ---
 ng2-components/ng2-alfresco-userinfo/index.ts |  47 ++++-
 .../ng2-alfresco-userinfo/karma-test-shim.js  | 194 ++++++++++--------
 .../ng2-alfresco-userinfo/karma.conf.js       |  94 ++++++---
 .../ng2-alfresco-userinfo/package.json        |  79 ++++---
 .../user-info.component.css}                  |   0
 .../user-info.component.html}                 |   0
 .../components/user-info.component.spec.ts    |  25 +++
 .../user-info.component.ts}                   |  14 +-
 .../{bpmUser.model.ts => bpm-user.model.ts}   |   0
 ...mCompany.model.ts => ecm-company.model.ts} |   0
 .../{ecmUser.model.ts => ecm-user.model.ts}   |   2 +-
 ...bpmUser.service.ts => bpm-user.service.ts} |   4 +-
 ...ecmUser.service.ts => ecm-user.service.ts} |   4 +-
 .../src/userinfo.component.spec.ts            |  16 --
 .../ng2-alfresco-userinfo/tsconfig.json       |  49 +++--
 16 files changed, 323 insertions(+), 232 deletions(-)
 delete mode 100644 ng2-components/ng2-alfresco-userinfo/angular-cli.json
 rename ng2-components/ng2-alfresco-userinfo/src/{userinfo.component.css => components/user-info.component.css} (100%)
 rename ng2-components/ng2-alfresco-userinfo/src/{userinfo.component.html => components/user-info.component.html} (100%)
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
 rename ng2-components/ng2-alfresco-userinfo/src/{userinfo.component.ts => components/user-info.component.ts} (86%)
 rename ng2-components/ng2-alfresco-userinfo/src/models/{bpmUser.model.ts => bpm-user.model.ts} (100%)
 rename ng2-components/ng2-alfresco-userinfo/src/models/{ecmCompany.model.ts => ecm-company.model.ts} (100%)
 rename ng2-components/ng2-alfresco-userinfo/src/models/{ecmUser.model.ts => ecm-user.model.ts} (95%)
 rename ng2-components/ng2-alfresco-userinfo/src/services/{bpmUser.service.ts => bpm-user.service.ts} (96%)
 rename ng2-components/ng2-alfresco-userinfo/src/services/{ecmUser.service.ts => ecm-user.service.ts} (96%)
 delete mode 100644 ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts

diff --git a/ng2-components/ng2-alfresco-userinfo/angular-cli.json b/ng2-components/ng2-alfresco-userinfo/angular-cli.json
deleted file mode 100644
index ef1d3675f0..0000000000
--- a/ng2-components/ng2-alfresco-userinfo/angular-cli.json
+++ /dev/null
@@ -1,27 +0,0 @@
-{
-  "project": {
-    "version": "ng2-alfresco-userinfo",
-    "name": "0.1.0"
-  },
-  "apps": [
-    {
-      "main": "src/ng2-alfresco-userinfo.component.ts",
-      "tsconfig": "tsconfig.json",
-      "mobile": false
-    }
-  ],
-  "addons": [],
-  "packages": [],
-  "test": {
-    "karma": {
-      "config": "karma.conf.js"
-    }
-  },
-  "defaults": {
-    "prefix": "",
-    "sourceDir": "src",
-    "styleExt": "css",
-    "prefixInterfaces": false,
-    "lazyRoutePrefix": "+"
-  }
-}
diff --git a/ng2-components/ng2-alfresco-userinfo/index.ts b/ng2-components/ng2-alfresco-userinfo/index.ts
index 3548a5fae7..a75fe639fd 100644
--- a/ng2-components/ng2-alfresco-userinfo/index.ts
+++ b/ng2-components/ng2-alfresco-userinfo/index.ts
@@ -1,10 +1,47 @@
-import { ECMUserService } from './src/services/ecmUser.service';
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
 
+import { NgModule, ModuleWithProviders } from '@angular/core';
+import { CoreModule } from 'ng2-alfresco-core';
+import { EcmUserService } from './src/services/ecm-user.service';
+import { BpmUserService } from './src/services/bpm-user.service';
 
-export * from './src/userinfo.component';
-export * from './src/services/ecmUser.service';
-
+export * from './src/components/user-info.component';
 
 export const USER_INFO_SERVICE: [any] = [
-    ECMUserService
+    EcmUserService,
+    BpmUserService
 ];
+
+@NgModule({
+    imports: [
+        CoreModule
+    ],
+    declarations: [
+        ...USER_INFO_SERVICE
+    ],
+    exports: [
+        ...USER_INFO_SERVICE
+    ]
+})
+export class UserInfoModule {
+    static forRoot(): ModuleWithProviders {
+        return {
+            ngModule: UserInfoModule
+        };
+    }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js b/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
index 445a2b98d0..fb1c3905f3 100644
--- a/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
+++ b/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
@@ -1,110 +1,128 @@
-'use strict';
 // Tun on full stack traces in errors to help debugging
 Error.stackTraceLimit = Infinity;
+
 jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
+
 __karma__.loaded = function() {};
 
+var builtPath = '/base/dist/';
+
+function isJsFile(path) {
+    return path.slice(-3) == '.js';
+}
+
+function isSpecFile(path) {
+    return /\.spec\.(.*\.)?js$/.test(path);
+}
+
+function isBuiltFile(path) {
+    return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
+}
+
+var allSpecFiles = Object.keys(window.__karma__.files)
+    .filter(isSpecFile)
+    .filter(isBuiltFile);
+
+var paths = {
+    // paths serve as alias
+    'npm:': 'base/node_modules/'
+};
+
 var map = {
-  app: 'base/dist',
-  rxjs: 'base/node_modules/rxjs',
-  '@angular': 'base/node_modules/@angular',
-  'ng2-translate': '/base/node_modules/ng2-translate',
-  'ng2-alfresco-core': '/base/node_modules/ng2-alfresco-core/dist'
+    'app': 'base/dist',
+    // angular bundles
+    '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
+    '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
+    '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.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',
+    // testing
+    '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
+    '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
+    '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
+    '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
+    '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
+    '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
+    '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
+    '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',
+
+    // other libraries
+    'rxjs': 'npm:rxjs',
+    'ng2-translate': 'npm:ng2-translate',
+
+    'alfresco-js-api': 'npm:alfresco-js-api/dist',
+    'ng2-activiti-form': 'npm:ng2-activiti-form/dist',
+    'ng2-activiti-processlist': 'npm:ng2-activiti-processlist/dist',
+    'ng2-activiti-tasklist': 'npm:ng2-activiti-tasklist/dist',
+    'ng2-alfresco-core': 'npm:ng2-alfresco-core/dist',
+    'ng2-alfresco-datatable': 'npm:ng2-alfresco-datatable/dist',
+    'ng2-alfresco-documentlist': 'npm:ng2-alfresco-documentlist/dist',
+    'ng2-alfresco-login': 'npm:ng2-alfresco-login/dist',
+    'ng2-alfresco-search': 'npm:ng2-alfresco-search/dist',
+    'ng2-alfresco-tag': 'npm:ng2-alfresco-tag/dist',
+    'ng2-alfresco-upload': 'npm:ng2-alfresco-upload/dist',
+    'ng2-alfresco-viewer': 'npm:ng2-alfresco-viewer/dist',
+    'ng2-alfresco-webscript': 'npm:ng2-alfresco-webscript/dist',
+    'ng2-alfresco-userinfo': 'npm:ng2-alfresco-userinfo/dist'
 };
 
 var packages = {
-  app: { main: 'main.js', defaultExtension: 'js' },
-  rxjs: { defaultExtension: 'js' },
-  'ng2-translate': { defaultExtension: 'js' },
-  'ng2-alfresco-core': { main: 'index.js', defaultExtension: 'js' }
-};
+    'app': { main: 'index.js',  defaultExtension: 'js', format: 'register' },
+    'rxjs': {  defaultExtension: 'js' },
+    'ng2-translate': { defaultExtension: 'js' },
 
-var packageNames = [
-  '@angular/common',
-  '@angular/compiler',
-  '@angular/core',
-  '@angular/http',
-  '@angular/platform-browser',
-  '@angular/platform-browser-dynamic',
-  '@angular/router',
-  '@angular/router-deprecated',
-  '@angular/testing',
-  '@angular/upgrade'
-];
-
-packageNames.forEach(function(pkgName) {
-  packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
-});
-
-packages['base/dist'] = {
-  defaultExtension: 'js',
-  format: 'register',
-  map: Object.keys(window.__karma__.files).filter(onlyAppFiles).reduce(createPathRecords, {})
+    'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
+    'ng2-activiti-form': { main: './index.js', defaultExtension: 'js'},
+    'ng2-activiti-processlist': { main: './index.js', defaultExtension: 'js'},
+    'ng2-activiti-tasklist': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-core': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-datatable': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-documentlist': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-login': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-search': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-tag': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-upload': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-viewer': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-webscript': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-userinfo': { main: './index.js', defaultExtension: 'js'}
 };
 
 var config = {
-  map: map,
-  packages: packages
+    paths: paths,
+    map: map,
+    packages: packages
 };
 
 System.config(config);
 
-System.import('@angular/platform-browser/src/browser/browser_adapter')
-  .then(function(browserAdapter) {
-    browserAdapter.BrowserDomAdapter.makeCurrent();
-  })
-  .then(function() {
+System.import('app')
+    .then(initTestBed)
+    .then(initTesting);
+
+function initTestBed(){
     return Promise.all([
-      System.import('@angular/core/testing'),
-      System.import('@angular/platform-browser-dynamic/testing')
-    ]);
-  })
-  .then(function(providers) {
-    var testing = providers[0];
-    var testingBrowser = providers[1];
+        System.import('@angular/core/testing'),
+        System.import('@angular/platform-browser-dynamic/testing')
+    ])
+    .then(function (providers) {
+        var coreTesting    = providers[0];
+        var browserTesting = providers[1];
 
-    testing.setBaseTestProviders(
-        testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
-        testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
-  })
-  .then(function() {
-    return Promise.all(resolveTestFiles());
-  })
-  .then(
-      function() {
-        __karma__.start();
-      },
-      function(error) {
-        if (typeof __karma__.error === 'function') {
-          __karma__.error(error.stack || error);
-        } else {
-          console.error(error);
-        }
-      }
-  );
-
-function createPathRecords(pathsMapping, appPath) {
-  var pathParts = appPath.split('/');
-  var moduleName = './' + pathParts.slice(Math.max(pathParts.length - 2, 1)).join('/');
-  moduleName = moduleName.replace(/\.js$/, '');
-  pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath];
-  return pathsMapping;
+        coreTesting.TestBed.initTestEnvironment(
+            browserTesting.BrowserDynamicTestingModule,
+            browserTesting.platformBrowserDynamicTesting());
+    })
 }
 
-function onlyAppFiles(filePath) {
-  return /\/base\/dist\/(?!.*\.spec\.js$).*\.js$/.test(filePath);
-}
-
-function onlySpecFiles(path) {
-  return /\.spec\.js$/.test(path);
-}
-
-function resolveTestFiles() {
-  return Object.keys(window.__karma__.files)  // All files served by Karma.
-    .filter(onlySpecFiles)
-    .map(function(moduleName) {
-      // loads all spec files via their global module names (e.g.
-      // 'base/dist/vg-player/vg-player.spec')
-      return System.import(moduleName);
-    });
+// Import all spec files and start karma
+function initTesting () {
+    return Promise.all(
+        allSpecFiles.map(function (moduleName) {
+            return System.import(moduleName);
+        })
+    )
+    .then(__karma__.start, __karma__.error);
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/karma.conf.js b/ng2-components/ng2-alfresco-userinfo/karma.conf.js
index c822c9fcd6..c0374b25c3 100644
--- a/ng2-components/ng2-alfresco-userinfo/karma.conf.js
+++ b/ng2-components/ng2-alfresco-userinfo/karma.conf.js
@@ -1,48 +1,78 @@
 'use strict';
 
-module.exports = function(config) {
-  config.set({
-
+module.exports = function (config) {
+  var configuration = {
     basePath: '.',
 
-    frameworks: ['jasmine'],
+    frameworks: ['jasmine-ajax', 'jasmine'],
 
     files: [
-      // paths loaded by Karma
-      {pattern: 'node_modules/reflect-metadata/Reflect.js', included: true, watched: false},
-      {pattern: 'node_modules/systemjs/dist/system.src.js', included: true, watched: false},
-      {pattern: 'node_modules/zone.js/dist/zone.js', included: true, watched: false},
-      {pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/rxjs/**/*.map', included: false, watched: false},
-      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/@angular/**/*.map', included: false, watched: false},
-      {pattern: 'node_modules/ng2-translate/**/*.js', included: false, served: true, watched: false},
-      {pattern: 'node_modules/ng2-alfresco-core/dist/**/*.js', included: false, served: true, watched: false},
-      {pattern: 'node_modules/alfresco-core-rest-api/bundle.js', included: true, watched: false},
+      // System.js for module loading
+      'node_modules/systemjs/dist/system.src.js',
 
-      {pattern: 'karma-test-shim.js', included: true, watched: true},
+      // Polyfills
+      'node_modules/core-js/client/shim.js',
+      'node_modules/reflect-metadata/Reflect.js',
+
+      // zone.js
+      'node_modules/zone.js/dist/zone.js',
+      'node_modules/zone.js/dist/long-stack-trace-zone.js',
+      'node_modules/zone.js/dist/proxy.js',
+      'node_modules/zone.js/dist/sync-test.js',
+      'node_modules/zone.js/dist/jasmine-patch.js',
+      'node_modules/zone.js/dist/async-test.js',
+      'node_modules/zone.js/dist/fake-async-test.js',
+
+      // RxJs
+      { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
+      { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
+
+      // Paths loaded via module imports:
+      // Angular itself
+      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
+
+      'node_modules/alfresco-js-api/dist/alfresco-js-api.js',
+      {pattern: 'node_modules/ng2-translate/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/ng2-translate/**/*.js.map', included: false, watched: false},
+
+      'karma-test-shim.js',
 
       // paths loaded via module imports
       {pattern: 'dist/**/*.js', included: false, watched: true},
       {pattern: 'dist/**/*.html', included: true, served: true, watched: true},
       {pattern: 'dist/**/*.css', included: true, served: true, watched: true},
 
+      // ng2-components
+      { pattern: 'node_modules/ng2-activiti-form/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-activiti-processlist/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-activiti-tasklist/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-core/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-datatable/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-documentlist/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-login/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-search/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-tag/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-upload/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-viewer/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-webscript/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-userinfo/dist/**/*.js', included: false, served: true, watched: false },
+
       // paths to support debugging with source maps in dev tools
       {pattern: 'src/**/*.ts', included: false, watched: false},
       {pattern: 'dist/**/*.js.map', included: false, watched: false}
     ],
 
+    exclude: [
+      'node_modules/**/*spec.js'
+    ],
+
     // proxied base paths
     proxies: {
       // required for component assets fetched by Angular's compiler
       '/src/': '/base/src/'
     },
 
-    // list of files to exclude
-    exclude: [
-      'node_modules/**/*spec.js'
-    ],
-
     port: 9876,
 
     // level of logging
@@ -55,10 +85,18 @@ module.exports = function(config) {
 
     browsers: ['Chrome'],
 
+    customLaunchers: {
+      Chrome_travis_ci: {
+        base: 'Chrome',
+        flags: ['--no-sandbox']
+      }
+    },
+
     // Karma plugins loaded
     plugins: [
       'karma-jasmine',
       'karma-coverage',
+      'karma-jasmine-ajax',
       'karma-chrome-launcher',
       'karma-mocha-reporter',
       'karma-jasmine-html-reporter'
@@ -70,7 +108,7 @@ module.exports = function(config) {
     // Source files that you wanna generate coverage for.
     // Do not include tests or libraries (these files will be instrumented by Istanbul)
     preprocessors: {
-      'dist/**/!(*spec).js': ['coverage']
+    //  'dist/**/!(*spec).js': ['coverage']
     },
 
     coverageReporter: {
@@ -78,10 +116,16 @@ module.exports = function(config) {
       subdir: 'report',
       reporters: [
         {type: 'text'},
-        {type: 'text-summary'},
         {type: 'json', file: 'coverage-final.json'},
-        {type: 'html'}
+        {type: 'html'},
+        {type: 'lcov'}
       ]
     }
-  });
+  };
+
+  if (process.env.TRAVIS) {
+    configuration.browsers = ['Chrome_travis_ci'];
+  }
+
+  config.set(configuration)
 };
diff --git a/ng2-components/ng2-alfresco-userinfo/package.json b/ng2-components/ng2-alfresco-userinfo/package.json
index 538102137b..19e3865dde 100644
--- a/ng2-components/ng2-alfresco-userinfo/package.json
+++ b/ng2-components/ng2-alfresco-userinfo/package.json
@@ -5,11 +5,10 @@
   "author": "vito albano <vito.albano@alfresco.com>",
   "scripts": {
     "clean": "rimraf dist node_modules",
-    "license-check": "echo 'license check is disabled'",
-    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist && npm run license-check",
+    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist",
     "build:w": "npm run tslint && rimraf dist && npm run watch-task",
-    "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\"  \"npm run license-check\"",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts",
+    "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\"  \"license-check\"",
+    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json 'src/{,**/}**.ts'",
     "copy-dist": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src",
     "copy-dist:w": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src -w",
     "tsc": "tsc",
@@ -19,43 +18,53 @@
     "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\"",
     "posttest": "remap-istanbul -i coverage/report/coverage-final.json -o coverage/report -t html && remap-istanbul -i coverage/report/coverage-final.json -o coverage/report/coverage-final.json",
     "coverage": "npm run test && wsrv -o -p 9875 ./coverage/report",
-    "travis": "echo 'placeholder'"
+    "travis": "npm link ng2-alfresco-core"
   },
   "main": "./dist/index.js",
   "typings": "./dist/index.d.ts",
   "repository": {
     "type": "git",
-    "url": "https://github.com/alfresco/ng2-alfresco-userinfo.git"
+    "url": "https://github.com/Alfresco/alfresco-ng2-components.git"
   },
   "bugs": {
-    "url": "https://github.com/alfresco/ng2-alfresco-userinfo/issues"
+    "url": "https://github.com/Alfresco/alfresco-ng2-components/issues"
   },
-
+  "license": "Apache-2.0",
+  "contributors": [
+    {
+      "name": "Vito Albano",
+      "email": "vito.albano@alfresco.com"
+    }
+  ],
+  "keywords": [
+    "ng2",
+    "angular",
+    "angular2",
+    "alfresco"
+  ],
   "dependencies": {
-    "alfresco-js-api": "^0.3.0",
-    "@angular/common": "2.0.0-rc.3",
-    "@angular/compiler": "2.0.0-rc.3",
-    "@angular/core": "2.0.0-rc.3",
-    "@angular/forms": "0.1.1",
-    "@angular/http": "2.0.0-rc.3",
-    "@angular/platform-browser": "2.0.0-rc.3",
-    "@angular/platform-browser-dynamic": "2.0.0-rc.3",
-    "@angular/router": "3.0.0-alpha.7",
-    "@angular/router-deprecated": "2.0.0-rc.2",
-    "@angular/upgrade": "2.0.0-rc.3",
+    "@angular/common": "2.0.0",
+    "@angular/compiler": "2.0.0",
+    "@angular/core": "2.0.0",
+    "@angular/forms": "2.0.0",
+    "@angular/http": "2.0.0",
+    "@angular/platform-browser": "2.0.0",
+    "@angular/platform-browser-dynamic": "2.0.0",
+    "@angular/router": "3.0.0",
+    "@angular/upgrade": "2.0.0",
+    "core-js": "^2.4.1",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "5.0.0-beta.12",
     "systemjs": "0.19.27",
-    "core-js": "2.4.0",
-    "reflect-metadata": "0.1.3",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "0.6.12",
-    "ng2-translate": "2.2.2",
-    "ng2-alfresco-core": "0.3.2",
-    "material-design-icons": "2.2.3",
-    "material-design-lite": "1.1.3"
+    "zone.js": "^0.6.23",
+
+    "ng2-translate": "2.5.0",
+    "ng2-alfresco-core": "0.3.2"
   },
   "devDependencies": {
     "@types/core-js": "^0.9.32",
     "@types/jasmine": "^2.2.33",
+    "concurrently": "^2.2.0",
     "cpx": "1.3.1",
     "jasmine-ajax": "3.2.0",
     "jasmine-core": "2.4.1",
@@ -74,11 +83,13 @@
     "typescript": "^2.0.2",
     "wsrv": "^0.1.5"
   },
-  "keywords": [
-    "component",
-    "userinfo",
-    "alfresco",
-    "alfresco-component"
-  ],
-  "license": "Apache-2.0"
+  "license-check-config": {
+    "src": [
+      "./dist/**/*.js"
+    ],
+    "path": "assets/license_header.txt",
+    "blocking": true,
+    "logInfo": false,
+    "logError": true
+  }
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.css
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/src/userinfo.component.css
rename to ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.css
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/src/userinfo.component.html
rename to ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
new file mode 100644
index 0000000000..a91e2f2ac8
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
@@ -0,0 +1,25 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+// import { UserInfoComponent } from '../src/userinfo.component';
+
+describe('Basic Example test ng2-alfresco-userinfo', () => {
+
+  it('Test hello world', () => {
+       expect(true).toBe(true);
+  });
+
+});
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
similarity index 86%
rename from ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
rename to ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
index f991d8825f..d54b9669e3 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
@@ -16,10 +16,10 @@
  */
 
 import { Component, OnInit } from '@angular/core';
-import { ECMUserService } from './services/ecmUser.service';
-import { BPMUserService } from './services/bpmUser.service';
-import { EcmUserModel } from './models/ecmUser.model';
-import { BpmUserModel } from './models/bpmUser.model';
+import { EcmUserService } from './../services/ecm-user.service';
+import { BpmUserService } from './../services/bpm-user.service';
+import { EcmUserModel } from './../models/ecm-user.model';
+import { BpmUserModel } from './../models/bpm-user.model';
 import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
 
 declare let __moduleName: string;
@@ -29,7 +29,7 @@ declare let __moduleName: string;
     moduleId: __moduleName,
     styleUrls: ['./userinfo.component.css'],
     templateUrl: './userinfo.component.html',
-    providers: [ECMUserService, BPMUserService, AlfrescoAuthenticationService]
+    providers: [EcmUserService, BpmUserService, AlfrescoAuthenticationService]
 })
 
 export class UserInfoComponent implements OnInit {
@@ -42,8 +42,8 @@ export class UserInfoComponent implements OnInit {
     public   ecmUserImage: any;
 
 
-    constructor(private ecmUserService: ECMUserService,
-                private bpmUserService: BPMUserService,
+    constructor(private ecmUserService: EcmUserService,
+                private bpmUserService: BpmUserService,
                 public authService: AlfrescoAuthenticationService) {
     }
 
diff --git a/ng2-components/ng2-alfresco-userinfo/src/models/bpmUser.model.ts b/ng2-components/ng2-alfresco-userinfo/src/models/bpm-user.model.ts
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/src/models/bpmUser.model.ts
rename to ng2-components/ng2-alfresco-userinfo/src/models/bpm-user.model.ts
diff --git a/ng2-components/ng2-alfresco-userinfo/src/models/ecmCompany.model.ts b/ng2-components/ng2-alfresco-userinfo/src/models/ecm-company.model.ts
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/src/models/ecmCompany.model.ts
rename to ng2-components/ng2-alfresco-userinfo/src/models/ecm-company.model.ts
diff --git a/ng2-components/ng2-alfresco-userinfo/src/models/ecmUser.model.ts b/ng2-components/ng2-alfresco-userinfo/src/models/ecm-user.model.ts
similarity index 95%
rename from ng2-components/ng2-alfresco-userinfo/src/models/ecmUser.model.ts
rename to ng2-components/ng2-alfresco-userinfo/src/models/ecm-user.model.ts
index 436604989c..08f24fbcdb 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/models/ecmUser.model.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/models/ecm-user.model.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { EcmCompanyModel } from './ecmCompany.model';
+import { EcmCompanyModel } from './ecm-company.model';
 
 export class EcmUserModel {
         id: string;
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
similarity index 96%
rename from ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
rename to ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
index 6e8204a234..089320a264 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
@@ -19,7 +19,7 @@ import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfr
 import { Injectable } from '@angular/core';
 import { Response } from '@angular/http';
 import { Observable } from 'rxjs/Rx';
-import { BpmUserModel } from '../models/bpmUser.model';
+import { BpmUserModel } from '../models/bpm-user.model';
 /**
  *
  * BPMUserService retrieve all the information of an Ecm user.
@@ -27,7 +27,7 @@ import { BpmUserModel } from '../models/bpmUser.model';
  * @returns {BPMUserService} .
  */
 @Injectable()
-export class BPMUserService {
+export class BpmUserService {
 
     constructor(private authService: AlfrescoAuthenticationService,
                 private settingService: AlfrescoSettingsService) {
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
similarity index 96%
rename from ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
rename to ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
index 56b0e62c0b..6875ee7d48 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecmUser.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
@@ -19,7 +19,7 @@ import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfre
 import { Injectable } from '@angular/core';
 import { Response } from '@angular/http';
 import { Observable } from 'rxjs/Rx';
-import { EcmUserModel } from '../models/ecmUser.model';
+import { EcmUserModel } from '../models/ecm-user.model';
 /**
  *
  * ECMUserService retrieve all the information of an Ecm user.
@@ -27,7 +27,7 @@ import { EcmUserModel } from '../models/ecmUser.model';
  * @returns {ECMUserService} .
  */
 @Injectable()
-export class ECMUserService {
+export class EcmUserService {
 
     constructor(private authService: AlfrescoAuthenticationService,
                 private contentService: AlfrescoContentService) {}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts
deleted file mode 100644
index e7917d1f0b..0000000000
--- a/ng2-components/ng2-alfresco-userinfo/src/userinfo.component.spec.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-
-import {describe, expect, it, inject} from '@angular/core/testing';
-import { TestComponentBuilder } from '@angular/compiler/testing';
-import { UserInfoComponent } from '../src/userinfo.component';
-
-describe('Basic Example test ng2-alfresco-userinfo', () => {
-  it('Test hello world', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
-    return tcb
-      .createAsync(UserInfoComponent)
-      .then((fixture) => {
-        let element = fixture.nativeElement;
-        expect(element.querySelector('h1')).toBeDefined();
-        expect(element.getElementsByTagName('h1')[0].innerHTML).toEqual('Hello World Angular 2 ng2-alfresco-userinfo');
-      });
-  }));
-});
diff --git a/ng2-components/ng2-alfresco-userinfo/tsconfig.json b/ng2-components/ng2-alfresco-userinfo/tsconfig.json
index e4d2ae201a..b1effea355 100644
--- a/ng2-components/ng2-alfresco-userinfo/tsconfig.json
+++ b/ng2-components/ng2-alfresco-userinfo/tsconfig.json
@@ -1,27 +1,26 @@
 {
-  "compilerOptions": {
-    "target": "es5",
-    "module": "system",
-    "moduleResolution": "node",
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "sourceMap": true,
-    "removeComments": true,
-    "declaration": true,
-    "noLib": false,
-    "allowUnreachableCode": false,
-    "allowUnusedLabels": false,
-    "noImplicitAny": false,
-    "noImplicitReturns": false,
-    "noImplicitUseStrict": false,
-    "noFallthroughCasesInSwitch": true,
-    "outDir": "dist"
-  },
-  "exclude": [
-    "demo",
-    "node_modules",
-    "typings/main",
-    "typings/main.d.ts",
-    "dist"
-  ]
+    "compilerOptions": {
+        "target": "es5",
+        "module": "system",
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "sourceMap": true,
+        "removeComments": true,
+        "declaration": true,
+        "noLib": false,
+        "allowUnreachableCode": false,
+        "allowUnusedLabels": false,
+        "noImplicitAny": false,
+        "noImplicitReturns": false,
+        "noImplicitUseStrict": false,
+        "noFallthroughCasesInSwitch": true,
+        "outDir": "dist",
+        "types": ["core-js", "jasmine"]
+    },
+    "exclude": [
+        "demo",
+        "node_modules",
+        "dist"
+    ]
 }

From d946532f14239d8b0ced7f6e273892d01585fc4d Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Thu, 29 Sep 2016 02:55:39 +0100
Subject: [PATCH 13/26] Added new version for component

---
 .gitignore                                    |   6 +-
 demo-shell-ng2/app/app.module.ts              |   8 +-
 .../ng2-alfresco-userinfo-old/.editorconfig   |  23 ++
 .../ng2-alfresco-userinfo-old/.gitignore      |  13 +
 .../ng2-alfresco-userinfo-old/.travis.yml     |   8 +
 .../ng2-alfresco-userinfo-old/LICENSE         |  13 +
 .../ng2-alfresco-userinfo-old/README.md       |  73 ++++
 .../demo/.editorconfig                        |   0
 .../ng2-alfresco-userinfo-old/demo/.gitignore |   5 +
 .../ng2-alfresco-userinfo-old/demo/README.md  |  19 +
 .../ng2-alfresco-userinfo-old/demo/index.html |  71 ++++
 .../demo/package.json                         |  89 +++++
 .../demo/src/main.ts                          |  95 +++++
 .../demo/systemjs.config.js                   |   0
 .../demo/tsconfig.json                        |  18 +-
 .../demo/tslint.json                          | 124 ++++++
 .../demo/typings.json                         |   0
 .../ng2-alfresco-userinfo-old/index.ts        |  58 +++
 .../karma-test-shim.js                        | 128 ++++++
 .../ng2-alfresco-userinfo-old/karma.conf.js   | 131 ++++++
 .../ng2-alfresco-userinfo-old/package.json    |  94 +++++
 .../src/components/user-info.component.css    |  53 +++
 .../src/components/user-info.component.html   |  63 +++
 .../components/user-info.component.spec.ts    |  25 ++
 .../src/components/user-info.component.ts     |  93 +++++
 .../src/i18n/en.json                          |  24 ++
 .../src/i18n/it.json                          |  24 ++
 .../src/img/anonymous.gif                     | Bin 0 -> 1765 bytes
 .../src/models/bpm-user.model.ts              |  39 ++
 .../src/models/ecm-company.model.ts           |  27 ++
 .../src/models/ecm-user.model.ts              |  39 ++
 .../src/services/bpm-user.service.ts          |  75 ++++
 .../src/services/ecm-user.service.ts          |  72 ++++
 .../ng2-alfresco-userinfo-old/tsconfig.json   |  26 ++
 .../ng2-alfresco-userinfo-old/tslint.json     | 121 ++++++
 .../typings.json                              |   0
 .../ng2-alfresco-userinfo/.travis.yml         |   4 +
 ng2-components/ng2-alfresco-userinfo/LICENSE  |   2 +-
 .../ng2-alfresco-userinfo/README.md           | 376 ++++++++++++++++--
 .../assets/license_header.txt                 |  16 +
 .../ng2-alfresco-userinfo/demo/.gitignore     |   1 +
 .../ng2-alfresco-userinfo/demo/README.md      |   2 +-
 .../ng2-alfresco-userinfo/demo/index.html     |  28 +-
 .../ng2-alfresco-userinfo/demo/package.json   |  71 ----
 .../ng2-alfresco-userinfo/demo/src/main.ts    | 208 +++++-----
 .../ng2-alfresco-userinfo/demo/tslint.json    |   2 +-
 ng2-components/ng2-alfresco-userinfo/index.ts |  25 +-
 .../ng2-alfresco-userinfo/karma-test-shim.js  |   4 +-
 .../ng2-alfresco-userinfo/karma.conf.js       |   2 +-
 .../ng2-alfresco-userinfo/package.json        |  68 ++--
 .../components/user-info.component.spec.ts    |  35 +-
 .../src/components/user-info.component.ts     |  12 +-
 .../src/services/bpm-user.service.spec.ts     |  48 +++
 .../src/services/bpm-user.service.ts          |  31 +-
 .../src/services/ecm-user.service.spec.ts     |  69 ++++
 .../ng2-alfresco-userinfo/tsconfig.json       |  48 +--
 .../ng2-alfresco-userinfo/tslint.json         |   2 +-
 57 files changed, 2375 insertions(+), 336 deletions(-)
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/.editorconfig
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/.gitignore
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/.travis.yml
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/LICENSE
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/README.md
 rename ng2-components/{ng2-alfresco-userinfo => ng2-alfresco-userinfo-old}/demo/.editorconfig (100%)
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/README.md
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/index.html
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/package.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts
 rename ng2-components/{ng2-alfresco-userinfo => ng2-alfresco-userinfo-old}/demo/systemjs.config.js (100%)
 rename ng2-components/{ng2-alfresco-userinfo => ng2-alfresco-userinfo-old}/demo/tsconfig.json (54%)
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json
 rename ng2-components/{ng2-alfresco-userinfo => ng2-alfresco-userinfo-old}/demo/typings.json (100%)
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/index.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/karma.conf.js
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/package.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/img/anonymous.gif
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/tsconfig.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo-old/tslint.json
 rename ng2-components/{ng2-alfresco-userinfo => ng2-alfresco-userinfo-old}/typings.json (100%)
 create mode 100644 ng2-components/ng2-alfresco-userinfo/assets/license_header.txt
 delete mode 100644 ng2-components/ng2-alfresco-userinfo/demo/package.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts

diff --git a/.gitignore b/.gitignore
index fd050d0b70..62258c2884 100644
--- a/.gitignore
+++ b/.gitignore
@@ -3,4 +3,8 @@ node_modules
 workspace.xml
 .idea/
 dist/
-!systemjs.config.js
\ No newline at end of file
+!systemjs.config.js
+demo-shell-ng2/app/components/router/
+ng2-components/ng2-alfresco-userinfo-old/demo/src/app/
+ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.spec.ts
+ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.spec.ts
diff --git a/demo-shell-ng2/app/app.module.ts b/demo-shell-ng2/app/app.module.ts
index 156ed434f4..1726859603 100644
--- a/demo-shell-ng2/app/app.module.ts
+++ b/demo-shell-ng2/app/app.module.ts
@@ -30,7 +30,7 @@ import { ViewerModule } from 'ng2-alfresco-viewer';
 import { ActivitiFormModule } from 'ng2-activiti-form';
 import { ActivitiTaskListModule } from 'ng2-activiti-tasklist';
 import { ActivitiProcessListModule } from 'ng2-activiti-processlist';
-import { UserInfoComponent } from 'ng2-alfresco-userinfo';
+import { UserInfoComponentModule } from 'ng2-alfresco-userinfo';
 
 import { AppComponent } from './app.component';
 import { routing } from './app.routes';
@@ -64,7 +64,8 @@ import {
         ViewerModule.forRoot(),
         ActivitiFormModule.forRoot(),
         ActivitiTaskListModule.forRoot(),
-        ActivitiProcessListModule.forRoot()
+        ActivitiProcessListModule.forRoot(),
+        UserInfoComponentModule.forRoot()
     ],
     declarations: [
         AppComponent,
@@ -79,8 +80,7 @@ import {
         TagComponent,
         AboutComponent,
         FilesComponent,
-        FormNodeViewer,
-        UserInfoComponent
+        FormNodeViewer
     ],
     providers: [],
     bootstrap: [ AppComponent ]
diff --git a/ng2-components/ng2-alfresco-userinfo-old/.editorconfig b/ng2-components/ng2-alfresco-userinfo-old/.editorconfig
new file mode 100644
index 0000000000..75a2477db7
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/.editorconfig
@@ -0,0 +1,23 @@
+# http://editorconfig.org
+
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[package.json]
+indent_style = space
+indent_size = 2
+
+[karma.conf.js]
+indent_style = space
+indent_size = 2
+
+[*.md]
+insert_final_newline = false
+trim_trailing_whitespace = false
diff --git a/ng2-components/ng2-alfresco-userinfo-old/.gitignore b/ng2-components/ng2-alfresco-userinfo-old/.gitignore
new file mode 100644
index 0000000000..3bea8a0c07
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/.gitignore
@@ -0,0 +1,13 @@
+npm-debug.log
+node_modules
+jspm_packages
+.idea
+typings
+coverage
+src/**/*.js
+src/**/*.js.map
+src/**/*.d.ts
+demo/**/*.js
+demo/**/*.js.map
+demo/**/*.d.ts
+!systemjs.config.js
diff --git a/ng2-components/ng2-alfresco-userinfo-old/.travis.yml b/ng2-components/ng2-alfresco-userinfo-old/.travis.yml
new file mode 100644
index 0000000000..781e6204e8
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/.travis.yml
@@ -0,0 +1,8 @@
+language: node_js
+node_js:
+  - v5
+  - v4
+install: npm install
+sudo: false
+after_success:
+  npm run coverage
diff --git a/ng2-components/ng2-alfresco-userinfo-old/LICENSE b/ng2-components/ng2-alfresco-userinfo-old/LICENSE
new file mode 100644
index 0000000000..bfd4a66b0c
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/LICENSE
@@ -0,0 +1,13 @@
+Copyright 2016 vito albano <vito.albano@alfresco.com>
+
+Licensed 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.
diff --git a/ng2-components/ng2-alfresco-userinfo-old/README.md b/ng2-components/ng2-alfresco-userinfo-old/README.md
new file mode 100644
index 0000000000..f100be7287
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/README.md
@@ -0,0 +1,73 @@
+# Alfresco User Info Component for Angular 2
+This component will show the user information for ECM and BPM
+
+
+## Prerequisites
+
+Before you start using this development framework, make sure you have installed all required software and done all the
+necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
+
+## Installation
+
+```bash
+npm install ng2-alfresco-userinfo --save
+```
+## Dependencies
+
+Add the following dependency to your index.html:
+```html
+<script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
+```
+	
+You must separately install the following libraries for your application:
+	
+- [ng2-translate](https://github.com/ocombe/ng2-translate)
+- [ng2-alfresco-core](https://www.npmjs.com/package/ng2-alfresco-core)
+
+```sh
+npm install --save ng2-translate ng2-alfresco-core
+```
+	
+#### Material Design Lite
+
+The style of this component is based on [material design](https://getmdl.io/), so if you want to visualize it correctly you have to add the material
+design dependency to your project:
+
+```sh
+npm install --save material-design-icons material-design-lite
+```
+
+Also make sure you include these dependencies in your `index.html` file:
+
+```html
+<!-- Google Material Design Lite -->
+<link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
+<script src="node_modules/material-design-lite/material.min.js"></script>
+<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
+```
+	
+## Example
+
+```html
+<ng2-alfresco-userinfo></ng2-alfresco-userinfo>
+```
+This will show a round icon with user and on click some user information are showed.
+If user is logged in with ECM and BPM the ECM image will be showed.
+
+## NPM scripts
+
+| Command | Description |
+| --- | --- |
+| npm run build | Build component |
+| npm run build:w | Build component and keep watching the changes |
+| npm run test | Run unit tests in the console |
+| npm run test-browser | Run unit tests in the browser
+| npm run coverage | Run unit tests and display code coverage report |
+
+## History
+
+For detailed changelog, check [Releases](https://github.com/alfresco/ng2-alfresco-userinfo/releases).
+
+## Contributors
+
+[Contributors](https://github.com/alfresco/ng2-alfresco-userinfo/graphs/contributors)
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/.editorconfig b/ng2-components/ng2-alfresco-userinfo-old/demo/.editorconfig
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/demo/.editorconfig
rename to ng2-components/ng2-alfresco-userinfo-old/demo/.editorconfig
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore b/ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore
new file mode 100644
index 0000000000..7c04460244
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore
@@ -0,0 +1,5 @@
+typings/
+node_modules/
+.idea
+dist/
+!systemjs.config.js
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/README.md b/ng2-components/ng2-alfresco-userinfo-old/demo/README.md
new file mode 100644
index 0000000000..7b59778398
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/demo/README.md
@@ -0,0 +1,19 @@
+# ng2-alfresco-userinfo - Demo
+
+* To install dependencies
+
+```sh
+$ npm install
+```
+
+* To provide a live demo
+
+```sh
+$ npm run start
+```
+
+* To clean npm_modules and typings folder
+
+```sh
+$ npm run clean
+```
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/index.html b/ng2-components/ng2-alfresco-userinfo-old/demo/index.html
new file mode 100644
index 0000000000..ab1420147f
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/demo/index.html
@@ -0,0 +1,71 @@
+<!-- DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    
+    <title>ng2-alfresco-userinfo Angular 2</title>
+    <base href="/">
+
+    <!-- Google Material Design Lite --
+    <link rel="stylesheet" href="assets/material.orange-blue.min.css">
+    <script src="node_modules/material-design-lite/material.min.js"></script>
+    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
+
+
+    <!-- Polyfill(s) for older browsers --
+    <script src="node_modules/core-js/client/shim.min.js"></script>
+    <script src="node_modules/zone.js/dist/zone.js"></script>
+    <script src="node_modules/reflect-metadata/Reflect.js"></script>
+    <script src="node_modules/systemjs/dist/system.src.js"></script>
+
+    <!-- Additional Alfresco libraries --
+    <script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
+
+    <script src="systemjs.config.js"></script>
+    <script>
+      System.import('app').catch(function(err){ console.error(err); });
+    </script>
+  </head>
+
+  <body>
+    <my-app>
+      <div id="loader-spin" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div>
+    </my-app>
+  </body>
+
+</html -->
+
+<!DOCTYPE html>
+<html>
+<head>
+  <script>document.write('<base href="' + document.location + '" />');</script>
+  <title>NgModule Minimal</title>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="styles.css">
+
+  <!-- Polyfill(s) for older browsers -->
+  <script src="https://unpkg.com/core-js/client/shim.min.js"></script>
+
+  <script src="https://unpkg.com/zone.js@0.6.25?main=browser"></script>
+  <script src="https://unpkg.com/reflect-metadata@0.1.3"></script>
+  <script src="https://unpkg.com/systemjs@0.19.27/dist/system.src.js"></script>
+
+  <script src="systemjs.config.js"></script>
+  <script>
+      System.import('app/main.0').catch(function(err){ console.error(err); });
+    </script>
+</head>
+
+<body>
+<my-app>Loading...</my-app>
+</body>
+</html>
+
+
+<!--
+Copyright 2016 Google Inc. All Rights Reserved.
+Use of this source code is governed by an MIT-style license that
+can be found in the LICENSE file at http://angular.io/license
+-->
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/package.json b/ng2-components/ng2-alfresco-userinfo-old/demo/package.json
new file mode 100644
index 0000000000..3cc656550a
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/demo/package.json
@@ -0,0 +1,89 @@
+{
+  "name": "ng2-alfresco-userinfo-demo",
+  "description": "This component will show the user information for ECM and BPM - Demo",
+  "version": "0.1.0",
+  "author": "vito albano <vito.albano@alfresco.com>",
+  "scripts": {
+    "clean": "rimraf dist node_modules",
+    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist",
+    "build:w": "npm run tslint && rimraf dist && npm run watch-task",
+    "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\" ",
+    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "server": "wsrv -o -l -s",
+    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json 'src/{,**/}**.ts'",
+    "copy-dist": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src",
+    "copy-dist:w": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src -w",
+    "tsc": "tsc",
+    "tsc:w": "tsc -w",
+    "pretest": "npm run build",
+    "test": "karma start karma.conf.js --reporters mocha,coverage --single-run",
+    "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\""
+  },
+  "main": "index.js",
+  "typings": "./dist/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Alfresco/alfresco-ng2-components.git"
+  },
+  "bugs": {
+    "url": "https://github.com/Alfresco/alfresco-ng2-components/issues"
+  },
+  "license": "Apache-2.0",
+  "contributors": [
+    {
+      "name": "Vito Albano",
+      "email": "vito.albano@alfresco.com"
+    }
+  ],
+  "keywords": [
+    "ng2",
+    "angular",
+    "angular2",
+    "alfresco",
+    "demo"
+  ],
+  "dependencies": {
+    "@angular/common": "2.0.0",
+    "@angular/compiler": "2.0.0",
+    "@angular/core": "2.0.0",
+
+    "@angular/http": "2.0.0",
+    "@angular/platform-browser": "2.0.0",
+    "@angular/platform-browser-dynamic": "2.0.0",
+    "@angular/router": "3.0.0",
+    "@angular/upgrade": "2.0.0",
+    "core-js": "^2.4.1",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "5.0.0-beta.12",
+    "systemjs": "0.19.27",
+    "zone.js": "^0.6.23",
+    "ng2-translate": "2.5.0",
+    "ng2-alfresco-core": "0.3.2",
+    "material-design-icons": "2.2.3",
+    "material-design-lite": "1.2.1",
+    "ng2-alfresco-userinfo": "file:../"
+  },
+  "devDependencies": {
+    "@types/core-js": "^0.9.32",
+    "@types/jasmine": "^2.2.33",
+    "concurrently": "^2.2.0",
+    "cpx": "1.3.1",
+    "jasmine-ajax": "3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "0.13.22",
+    "karma-chrome-launcher": "1.0.1",
+    "karma-coverage": "1.0.0",
+    "karma-jasmine": "1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "2.0.3",
+    "license-check": "1.1.5",
+    "remap-istanbul": "0.6.3",
+    "rimraf": "2.5.2",
+    "traceur": "0.0.91",
+    "tslint": "3.8.1",
+    "typescript": "^2.0.3",
+    "wsrv": "^0.1.5"
+  }
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts
new file mode 100644
index 0000000000..0e50689d4d
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts
@@ -0,0 +1,95 @@
+/*
+import { NgModule, Component, OnInit } from '@angular/core';
+import { UserInfoComponent } from 'ng2-alfresco-userinfo';
+import { BrowserModule } from '@angular/platform-browser';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { CoreModule,
+         AlfrescoSettingsService,
+         AlfrescoAuthenticationService } from 'ng2-alfresco-core';
+
+@Component({
+  selector: 'my-app',
+  styles: [`:host h1 { font-size:22px }`],
+  template: `<h1>TEST</h1>`
+})
+
+
+class UserInfoDemo implements OnInit {
+
+      public userToLogin: string = 'admin';
+      public password: string = 'admin';
+      public loginErrorMessage: string;
+      public providers: string = 'BPM';
+      private authenticated: boolean;
+      private token: any;
+
+      constructor(private authService: AlfrescoAuthenticationService,
+                  private settingsService: AlfrescoSettingsService) {
+      }
+
+      ngOnInit() {
+        this.settingsService.setProviders(this.providers);
+      }
+
+      attemptLogin() {
+          this.loginErrorMessage = '';
+          this.login(this.userToLogin, this.password);
+      }
+
+      logout() {
+          this.authService.logout();
+      }
+
+      login(user, password) {
+          this.settingsService.setProviders(this.providers);
+          this.authService.login(user, password).subscribe(
+              token => {
+                  console.log(token);
+                  this.token = token;
+                  this.authenticated = true;
+              },
+              error => {
+                  console.log(error);
+                  this.authenticated = false;
+                  this.loginErrorMessage = error;
+              });
+      }
+
+      isLoggedIn(): boolean {
+          return this.authService.isLoggedIn();
+      }
+
+      toggleECM(checked) {
+          if (checked && this.providers === 'BPM') {
+              this.providers = 'ALL';
+          } else if (checked) {
+              this.providers = 'ECM';
+          } else {
+              this.providers = undefined;
+          }
+      }
+
+      toggleBPM(checked) {
+          if (checked && this.providers === 'ECM') {
+              this.providers = 'ALL';
+          } else if (checked) {
+              this.providers = 'BPM';
+          } else {
+              this.providers = undefined;
+          }
+      }
+}
+
+@NgModule({
+    imports: [
+        BrowserModule,
+        CoreModule.forRoot(),
+        UserInfoComponent
+    ],
+    declarations: [ UserInfoComponent ],
+    bootstrap:    [ UserInfoComponent ]
+})
+export class AppModule { }
+
+platformBrowserDynamic().bootstrapModule(AppModule);
+*/
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js b/ng2-components/ng2-alfresco-userinfo-old/demo/systemjs.config.js
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js
rename to ng2-components/ng2-alfresco-userinfo-old/demo/systemjs.config.js
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json b/ng2-components/ng2-alfresco-userinfo-old/demo/tsconfig.json
similarity index 54%
rename from ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
rename to ng2-components/ng2-alfresco-userinfo-old/demo/tsconfig.json
index 772c3a7e75..2712940af4 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
+++ b/ng2-components/ng2-alfresco-userinfo-old/demo/tsconfig.json
@@ -1,4 +1,4 @@
-{
+/*{
   "compilerOptions": {
     "target": "es5",
     "module": "system",
@@ -16,4 +16,18 @@
     "typings/main",
     "typings/main.d.ts"
   ]
-}
+} */
+
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "removeComments": false,
+    "noImplicitAny": true,
+    "suppressImplicitAnyIndexErrors": true
+  }
+}
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json b/ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json
new file mode 100644
index 0000000000..8c48e76469
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json
@@ -0,0 +1,124 @@
+{
+  "rules": {
+    "align": [
+      true,
+      "parameters",
+      "arguments",
+      "statements"
+    ],
+    "ban": false,
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space",
+      "check-lowercase"
+    ],
+    "curly": true,
+    "eofline": true,
+    "forin": true,
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "interface-name": false,
+    "jsdoc-format": true,
+    "label-position": true,
+    "label-undefined": true,
+    "max-line-length": [
+      true,
+      140
+    ],
+    "member-ordering": [
+      true,
+      "public-before-private",
+      "static-before-instance",
+      "variables-before-functions"
+    ],
+    "no-any": false,
+    "no-arg": true,
+    "no-bitwise": true,
+    "no-conditional-assignment": true,
+    "no-consecutive-blank-lines": false,
+    "no-console": [
+      true,
+      "debug",
+      "info",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-construct": true,
+    "no-constructor-vars": false,
+    "no-debugger": true,
+    "no-duplicate-key": true,
+    "no-duplicate-variable": true,
+    "no-empty": true,
+    "no-eval": true,
+    "no-inferrable-types": false,
+    "no-internal-module": true,
+    "no-require-imports": true,
+    "no-shadowed-variable": true,
+    "no-switch-case-fall-through": true,
+    "no-trailing-whitespace": true,
+    "no-unreachable": true,
+    "no-unused-expression": true,
+    "no-unused-variable": true,
+    "no-use-before-declare": true,
+    "no-var-keyword": true,
+    "no-var-requires": true,
+    "object-literal-sort-keys": false,
+    "one-line": [
+      true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "quotemark": [
+      true,
+      "single",
+      "avoid-escape"
+    ],
+    "radix": true,
+    "semicolon": true,
+    "switch-default": true,
+    "trailing-comma": [
+      true,
+      {
+        "multiline": "never",
+        "singleline": "never"
+      }
+    ],
+    "triple-equals": [
+      true,
+      "allow-null-check"
+    ],
+    "typedef": false,
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "use-strict": false,
+    "variable-name": [
+      true,
+      "check-format",
+      "allow-leading-underscore",
+      "ban-keywords"
+    ],
+    "whitespace": [
+      true,
+      "check-branch",
+      "check-operator",
+      "check-separator",
+      "check-type",
+      "check-module",
+      "check-decl"
+    ]
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/typings.json b/ng2-components/ng2-alfresco-userinfo-old/demo/typings.json
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/demo/typings.json
rename to ng2-components/ng2-alfresco-userinfo-old/demo/typings.json
diff --git a/ng2-components/ng2-alfresco-userinfo-old/index.ts b/ng2-components/ng2-alfresco-userinfo-old/index.ts
new file mode 100644
index 0000000000..6f5555dbda
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/index.ts
@@ -0,0 +1,58 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { NgModule, ModuleWithProviders } from '@angular/core';
+import { CoreModule } from 'ng2-alfresco-core';
+import { EcmUserService } from './src/services/ecm-user.service';
+import { BpmUserService } from './src/services/bpm-user.service';
+import { UserInfoComponent } from './src/components/user-info.component';
+import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
+
+export * from './src/components/user-info.component';
+export * from './src/services/bpm-user.service';
+export * from './src/services/ecm-user.service';
+
+export const USER_INFO_SERVICE: any[] = [
+    EcmUserService,
+    BpmUserService,
+    AlfrescoAuthenticationService
+];
+
+@NgModule({
+    imports: [
+        CoreModule
+    ],
+    declarations: [
+        UserInfoComponent
+    ],
+    providers: [
+        ...USER_INFO_SERVICE
+    ],
+    exports: [
+        UserInfoComponent
+    ]
+})
+export class UserInfoComponentModule {
+    static forRoot(): ModuleWithProviders {
+        return {
+            ngModule: UserInfoComponentModule,
+            providers: [
+                ...USER_INFO_SERVICE
+            ]
+        };
+    }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js b/ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js
new file mode 100644
index 0000000000..fb1c3905f3
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js
@@ -0,0 +1,128 @@
+// Tun on full stack traces in errors to help debugging
+Error.stackTraceLimit = Infinity;
+
+jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
+
+__karma__.loaded = function() {};
+
+var builtPath = '/base/dist/';
+
+function isJsFile(path) {
+    return path.slice(-3) == '.js';
+}
+
+function isSpecFile(path) {
+    return /\.spec\.(.*\.)?js$/.test(path);
+}
+
+function isBuiltFile(path) {
+    return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
+}
+
+var allSpecFiles = Object.keys(window.__karma__.files)
+    .filter(isSpecFile)
+    .filter(isBuiltFile);
+
+var paths = {
+    // paths serve as alias
+    'npm:': 'base/node_modules/'
+};
+
+var map = {
+    'app': 'base/dist',
+    // angular bundles
+    '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
+    '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
+    '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.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',
+    // testing
+    '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
+    '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
+    '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
+    '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
+    '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
+    '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
+    '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
+    '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',
+
+    // other libraries
+    'rxjs': 'npm:rxjs',
+    'ng2-translate': 'npm:ng2-translate',
+
+    'alfresco-js-api': 'npm:alfresco-js-api/dist',
+    'ng2-activiti-form': 'npm:ng2-activiti-form/dist',
+    'ng2-activiti-processlist': 'npm:ng2-activiti-processlist/dist',
+    'ng2-activiti-tasklist': 'npm:ng2-activiti-tasklist/dist',
+    'ng2-alfresco-core': 'npm:ng2-alfresco-core/dist',
+    'ng2-alfresco-datatable': 'npm:ng2-alfresco-datatable/dist',
+    'ng2-alfresco-documentlist': 'npm:ng2-alfresco-documentlist/dist',
+    'ng2-alfresco-login': 'npm:ng2-alfresco-login/dist',
+    'ng2-alfresco-search': 'npm:ng2-alfresco-search/dist',
+    'ng2-alfresco-tag': 'npm:ng2-alfresco-tag/dist',
+    'ng2-alfresco-upload': 'npm:ng2-alfresco-upload/dist',
+    'ng2-alfresco-viewer': 'npm:ng2-alfresco-viewer/dist',
+    'ng2-alfresco-webscript': 'npm:ng2-alfresco-webscript/dist',
+    'ng2-alfresco-userinfo': 'npm:ng2-alfresco-userinfo/dist'
+};
+
+var packages = {
+    'app': { main: 'index.js',  defaultExtension: 'js', format: 'register' },
+    'rxjs': {  defaultExtension: 'js' },
+    'ng2-translate': { defaultExtension: 'js' },
+
+    'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
+    'ng2-activiti-form': { main: './index.js', defaultExtension: 'js'},
+    'ng2-activiti-processlist': { main: './index.js', defaultExtension: 'js'},
+    'ng2-activiti-tasklist': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-core': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-datatable': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-documentlist': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-login': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-search': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-tag': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-upload': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-viewer': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-webscript': { main: './index.js', defaultExtension: 'js'},
+    'ng2-alfresco-userinfo': { main: './index.js', defaultExtension: 'js'}
+};
+
+var config = {
+    paths: paths,
+    map: map,
+    packages: packages
+};
+
+System.config(config);
+
+System.import('app')
+    .then(initTestBed)
+    .then(initTesting);
+
+function initTestBed(){
+    return Promise.all([
+        System.import('@angular/core/testing'),
+        System.import('@angular/platform-browser-dynamic/testing')
+    ])
+    .then(function (providers) {
+        var coreTesting    = providers[0];
+        var browserTesting = providers[1];
+
+        coreTesting.TestBed.initTestEnvironment(
+            browserTesting.BrowserDynamicTestingModule,
+            browserTesting.platformBrowserDynamicTesting());
+    })
+}
+
+// Import all spec files and start karma
+function initTesting () {
+    return Promise.all(
+        allSpecFiles.map(function (moduleName) {
+            return System.import(moduleName);
+        })
+    )
+    .then(__karma__.start, __karma__.error);
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/karma.conf.js b/ng2-components/ng2-alfresco-userinfo-old/karma.conf.js
new file mode 100644
index 0000000000..c0374b25c3
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/karma.conf.js
@@ -0,0 +1,131 @@
+'use strict';
+
+module.exports = function (config) {
+  var configuration = {
+    basePath: '.',
+
+    frameworks: ['jasmine-ajax', 'jasmine'],
+
+    files: [
+      // System.js for module loading
+      'node_modules/systemjs/dist/system.src.js',
+
+      // Polyfills
+      'node_modules/core-js/client/shim.js',
+      'node_modules/reflect-metadata/Reflect.js',
+
+      // zone.js
+      'node_modules/zone.js/dist/zone.js',
+      'node_modules/zone.js/dist/long-stack-trace-zone.js',
+      'node_modules/zone.js/dist/proxy.js',
+      'node_modules/zone.js/dist/sync-test.js',
+      'node_modules/zone.js/dist/jasmine-patch.js',
+      'node_modules/zone.js/dist/async-test.js',
+      'node_modules/zone.js/dist/fake-async-test.js',
+
+      // RxJs
+      { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
+      { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
+
+      // Paths loaded via module imports:
+      // Angular itself
+      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
+
+      'node_modules/alfresco-js-api/dist/alfresco-js-api.js',
+      {pattern: 'node_modules/ng2-translate/**/*.js', included: false, watched: false},
+      {pattern: 'node_modules/ng2-translate/**/*.js.map', included: false, watched: false},
+
+      'karma-test-shim.js',
+
+      // paths loaded via module imports
+      {pattern: 'dist/**/*.js', included: false, watched: true},
+      {pattern: 'dist/**/*.html', included: true, served: true, watched: true},
+      {pattern: 'dist/**/*.css', included: true, served: true, watched: true},
+
+      // ng2-components
+      { pattern: 'node_modules/ng2-activiti-form/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-activiti-processlist/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-activiti-tasklist/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-core/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-datatable/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-documentlist/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-login/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-search/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-tag/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-upload/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-viewer/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-webscript/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-userinfo/dist/**/*.js', included: false, served: true, watched: false },
+
+      // paths to support debugging with source maps in dev tools
+      {pattern: 'src/**/*.ts', included: false, watched: false},
+      {pattern: 'dist/**/*.js.map', included: false, watched: false}
+    ],
+
+    exclude: [
+      'node_modules/**/*spec.js'
+    ],
+
+    // proxied base paths
+    proxies: {
+      // required for component assets fetched by Angular's compiler
+      '/src/': '/base/src/'
+    },
+
+    port: 9876,
+
+    // level of logging
+    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+    logLevel: config.LOG_INFO,
+
+    colors: true,
+
+    autoWatch: true,
+
+    browsers: ['Chrome'],
+
+    customLaunchers: {
+      Chrome_travis_ci: {
+        base: 'Chrome',
+        flags: ['--no-sandbox']
+      }
+    },
+
+    // Karma plugins loaded
+    plugins: [
+      'karma-jasmine',
+      'karma-coverage',
+      'karma-jasmine-ajax',
+      'karma-chrome-launcher',
+      'karma-mocha-reporter',
+      'karma-jasmine-html-reporter'
+    ],
+
+    // Coverage reporter generates the coverage
+    reporters: ['mocha', 'coverage', 'kjhtml'],
+
+    // Source files that you wanna generate coverage for.
+    // Do not include tests or libraries (these files will be instrumented by Istanbul)
+    preprocessors: {
+    //  'dist/**/!(*spec).js': ['coverage']
+    },
+
+    coverageReporter: {
+      dir: 'coverage/',
+      subdir: 'report',
+      reporters: [
+        {type: 'text'},
+        {type: 'json', file: 'coverage-final.json'},
+        {type: 'html'},
+        {type: 'lcov'}
+      ]
+    }
+  };
+
+  if (process.env.TRAVIS) {
+    configuration.browsers = ['Chrome_travis_ci'];
+  }
+
+  config.set(configuration)
+};
diff --git a/ng2-components/ng2-alfresco-userinfo-old/package.json b/ng2-components/ng2-alfresco-userinfo-old/package.json
new file mode 100644
index 0000000000..e7981fb168
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/package.json
@@ -0,0 +1,94 @@
+{
+  "name": "ng2-alfresco-userinfo",
+  "description": "This component will show the user information for ECM and BPM",
+  "version": "0.1.0",
+  "author": "vito albano <vito.albano@alfresco.com>",
+  "scripts": {
+    "clean": "rimraf dist node_modules",
+    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist",
+    "build:w": "npm run tslint && rimraf dist && npm run watch-task",
+    "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\"  \"license-check\"",
+    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json 'src/{,**/}**.ts'",
+    "copy-dist": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src",
+    "copy-dist:w": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src -w",
+    "tsc": "tsc",
+    "tsc:w": "tsc -w",
+    "pretest": "npm run build",
+    "test": "karma start karma.conf.js --reporters mocha,coverage --single-run",
+    "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\"",
+    "posttest": "remap-istanbul -i coverage/report/coverage-final.json -o coverage/report -t html && remap-istanbul -i coverage/report/coverage-final.json -o coverage/report/coverage-final.json",
+    "coverage": "npm run test && wsrv -o -p 9875 ./coverage/report",
+    "travis": "npm link ng2-alfresco-core"
+  },
+  "main": "./dist/index.js",
+  "typings": "./dist/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Alfresco/alfresco-ng2-components.git"
+  },
+  "bugs": {
+    "url": "https://github.com/Alfresco/alfresco-ng2-components/issues"
+  },
+  "license": "Apache-2.0",
+  "contributors": [
+    {
+      "name": "Vito Albano",
+      "email": "vito.albano@alfresco.com"
+    }
+  ],
+  "keywords": [
+    "ng2",
+    "angular",
+    "angular2",
+    "alfresco"
+  ],
+  "dependencies": {
+    "@angular/common": "2.0.0",
+    "@angular/compiler": "2.0.0",
+    "@angular/core": "2.0.0",
+    "@angular/forms": "2.0.0",
+    "@angular/http": "2.0.0",
+    "@angular/platform-browser": "2.0.0",
+    "@angular/platform-browser-dynamic": "2.0.0",
+    "@angular/router": "3.0.0",
+    "@angular/upgrade": "2.0.0",
+    "core-js": "^2.4.1",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "5.0.0-beta.12",
+    "systemjs": "0.19.27",
+    "zone.js": "^0.6.23",
+    "ng2-translate": "2.5.0",
+    "ng2-alfresco-core": "0.3.2"
+  },
+  "devDependencies": {
+    "@types/core-js": "^0.9.32",
+    "@types/jasmine": "^2.2.33",
+    "concurrently": "^2.2.0",
+    "cpx": "1.3.1",
+    "jasmine-ajax": "3.2.0",
+    "jasmine-core": "2.4.1",
+    "karma": "0.13.22",
+    "karma-chrome-launcher": "1.0.1",
+    "karma-coverage": "1.0.0",
+    "karma-jasmine": "1.0.2",
+    "karma-jasmine-ajax": "^0.1.13",
+    "karma-jasmine-html-reporter": "0.2.0",
+    "karma-mocha-reporter": "2.0.3",
+    "license-check": "1.1.5",
+    "remap-istanbul": "0.6.3",
+    "rimraf": "2.5.2",
+    "traceur": "0.0.91",
+    "tslint": "3.8.1",
+    "typescript": "^2.0.2",
+    "wsrv": "^0.1.5"
+  },
+  "license-check-config": {
+    "src": [
+      "./dist/**/*.js"
+    ],
+    "path": "assets/license_header.txt",
+    "blocking": true,
+    "logInfo": false,
+    "logError": true
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css
new file mode 100644
index 0000000000..93254d00fa
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css
@@ -0,0 +1,53 @@
+.profile-image {
+  text-align: center;
+  border-radius: 90%;
+  width: 40px;
+  margin-right: 0%;
+  cursor: pointer;
+  border: 1px solid #999999;
+  vertical-align: middle;
+}
+
+.button-profile {
+  display: inline-block;
+  border: 0px;
+  vertical-align: middle;
+}
+
+.detail-user-profile-list-mdl{
+    margin-right: 10px;
+}
+
+.user-profile-list-mdl{
+    max-height: 450px;
+    min-width: 450px;
+    overflow: auto;
+}
+
+.header-profile{
+    color: rgb(255,152,0);
+    margin-left: 10px;
+}
+
+hr.title-start {
+    border: 0;
+    height: 1px;
+    background: #333;
+    background-image: linear-gradient(to right, #ccc, #333, #ccc);
+}
+
+span.role-label-user{
+    font-weight: 400;
+    line-height: 1;
+    letter-spacing: 0;
+    color: rgba(0,0,0,.87);
+}
+
+.custom-role-style{
+    font-size: 14px;
+    color: #9e9e9e;
+}
+
+.truncate-long-names{
+    text-overflow: ellipsis;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html
new file mode 100644
index 0000000000..8c01dc7120
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html
@@ -0,0 +1,63 @@
+<div id="img_container">
+    <span *ngIf="ecmUser">{{ecmUser.firstName || ecmUser.lastName}}</span>
+    <span *ngIf="bpmUser">
+        {{ formatValue(bpmUser.firstName) ||
+           formatValue(bpmUser.lastName)  ||
+           formatValue(bpmUser.fullName) }}
+    </span>
+    <div class="button-profile" id="user-profile" data-automation-id="user-profile">
+                <img id="logged-user-img"
+                     [src]="getUserAvatar()"
+                     class="profile-image"/>
+    </div>
+    <div class="user-profile-list-mdl
+                mdl-menu mdl-menu--bottom-right
+                mdl-js-menu mdl-js-ripple-effect"
+                for="user-profile">
+            <ul class='detail-user-profile-list-mdl mdl-list'>
+                <div *ngIf="ecmUser">
+                    <span class="header-profile"><b>ECM</b></span>
+                    <hr class="title-start">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                          <i class="mdl-list__item-avatar">
+                              <img id="logged-user-img"
+                                   [src]="getEcmUserDetailAvatarUrl()"
+                                   class="profile-image"/>
+                          </i>
+                          <span class="truncate-long-names">{{ecmUser.firstName}} {{ecmUser.lastName}}</span>
+                          <span class="mdl-list__item-sub-title">{{ecmUser.email}}</span>
+                        </span>
+                        <span class="mdl-list__item-secondary-content custom-role-style">
+                            <span class="role-label-user">Job Role</span>
+                            {{ecmUser.jobTitle}}
+                        </span>
+                    </li>
+                </div>
+
+                <div *ngIf="bpmUser">
+                    <span class="header-profile"><b>BPM</b></span>
+                    <hr class="title-start">
+                    <li class="mdl-list__item mdl-list__item--two-line">
+                        <span class="mdl-list__item-primary-content">
+                          <i class="mdl-list__item-avatar">
+                              <img id="logged-user-img"
+                                   [src]="getBpmUserDetailAvatarUrl()"
+                                   class="profile-image"/>
+                          </i>
+                          <span class="truncate-long-names">
+                              {{formatValue(bpmUser.firstName) }} {{ formatValue(bpmUser.lastName) }}
+                          </span>
+                          <span class="mdl-list__item-sub-title">{{bpmUser.email}}</span>
+                        </span>
+                        <span class="mdl-list__item-secondary-content custom-role-style">
+                            <span class="role-label-user">Tenant</span>
+                            {{bpmUser.tenantName}}
+                        </span>
+                    </li>
+                </div>
+            </ul>
+    </div>
+</div>
+
+
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts
new file mode 100644
index 0000000000..a91e2f2ac8
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts
@@ -0,0 +1,25 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+// import { UserInfoComponent } from '../src/userinfo.component';
+
+describe('Basic Example test ng2-alfresco-userinfo', () => {
+
+  it('Test hello world', () => {
+       expect(true).toBe(true);
+  });
+
+});
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts
new file mode 100644
index 0000000000..5154ab5dcf
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts
@@ -0,0 +1,93 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { Component, OnInit } from '@angular/core';
+import { EcmUserModel } from './../models/ecm-user.model';
+import { BpmUserModel } from './../models/bpm-user.model';
+import { EcmUserService } from './../services/ecm-user.service';
+import { BpmUserService } from './../services/bpm-user.service';
+import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
+
+declare let __moduleName: string;
+
+@Component({
+    selector: 'ng2-alfresco-userinfo',
+    moduleId: __moduleName,
+    styleUrls: ['./userinfo.component.css'],
+    template: `<h1>HELLO</h1>`
+})
+
+export class UserInfoComponent implements OnInit {
+
+    private  ecmUser: EcmUserModel;
+    private  bpmUser: BpmUserModel;
+    private baseComponentPath = __moduleName.replace('userinfo.component.js', '');
+    private  anonymouseImageUrl: string = this.baseComponentPath + 'img/anonymous.gif';
+    public   bpmUserImage: any;
+    public   ecmUserImage: any;
+
+    constructor(private ecmUserService: EcmUserService,
+                private bpmUserService: BpmUserService,
+                public authService: AlfrescoAuthenticationService) {
+    }
+
+    ngOnInit() {
+        if (this.authService.getAlfrescoApi().ecmAuth.isLoggedIn()) {
+            this.ecmUserService.getUserInfo('-me-')
+                .subscribe(
+                    (res) => {
+                    this.ecmUser = <EcmUserModel> res;
+                    this.getEcmUserProfileImage();
+                }
+            );
+        }
+        if (this.authService.getAlfrescoApi().bpmAuth.isLoggedIn()) {
+            this.bpmUserService.getCurrentUserInfo()
+                .subscribe(
+                    (res) => {
+                    this.bpmUser = <BpmUserModel> res;
+                    this.getBpmUserProfileImage();
+                }
+            );
+        }
+    }
+
+    private getBpmUserProfileImage() {
+        this.bpmUserImage = this.bpmUserService.getCurrentUserProfileImage();
+    }
+
+    private getEcmUserProfileImage() {
+        this.ecmUserImage = this.ecmUserService.getCurrentUserProfileImageUrl(this.ecmUser.avatarId);
+    }
+
+    public getUserAvatar() {
+        return this.ecmUserImage || this.bpmUserImage ||  this.anonymouseImageUrl;
+    }
+
+    public getBpmUserDetailAvatarUrl() {
+        return this.bpmUserImage || this.anonymouseImageUrl;
+    }
+
+    public getEcmUserDetailAvatarUrl() {
+        return this.ecmUserImage || this.anonymouseImageUrl;
+    }
+
+    public formatValue(value: string) {
+        return value === 'null' ? null : value;
+    }
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json b/ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json
new file mode 100644
index 0000000000..9400e18911
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json
@@ -0,0 +1,24 @@
+{
+  "FILE_UPLOAD": {
+    "BUTTON": {
+      "UPLOAD_FILE": "Upload file",
+      "UPLOAD_FOLDER": "Upload folder",
+      "CANCEL": "CANCEL"
+    },
+    "MESSAGES": {
+      "COMPLETED": "uploads complete",
+      "PROGRESS": "Upload in progress...",
+      "FOLDER_ALREADY_EXIST": "The folder {0} already exist",
+      "FOLDER_NOT_SUPPORTED": "Folder upload isn't supported by your browser"
+    },
+    "FILE_INFO": {
+      "NAME": "File name",
+      "PROGRESS": "File progress",
+      "SIZE": "File size",
+      "ACTION": "Actions"
+    },
+    "ACTION": {
+      "UNDO": "Undo"
+    }
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json b/ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json
new file mode 100644
index 0000000000..0208da3079
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json
@@ -0,0 +1,24 @@
+{
+  "FILE_UPLOAD": {
+    "BUTTON": {
+      "UPLOAD_FILE": "Carica un file",
+      "UPLOAD_FOLDER": "Carica una cartella",
+      "CANCEL": "CANCELLA"
+    },
+    "MESSAGES": {
+      "COMPLETED": "caricamenti completati",
+      "PROGRESS": "caricamento in corso...",
+      "FOLDER_ALREADY_EXIST": "Cartella {0} già presente",
+      "FOLDER_NOT_SUPPORTED": "L' upload di cartelle non é supportato dal tuo browser"
+    },
+    "FILE_INFO": {
+      "NAME": "Nome file",
+      "PROGRESS": "Percentuale caricamento",
+      "SIZE": "Dimensione file",
+      "ACTION": "Azioni"
+    },
+    "ACTION": {
+      "UNDO": "Annulla"
+    }
+  }
+}
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/img/anonymous.gif b/ng2-components/ng2-alfresco-userinfo-old/src/img/anonymous.gif
new file mode 100644
index 0000000000000000000000000000000000000000..e1b58fa57dfcdfd452ec498c98b930aa905d21d6
GIT binary patch
literal 1765
zcmb8pizCyC0|4;vcMq|L=guW!Vi%c59pzQG$YVmt<yA6~M~lTU<bKSWjOE$#nn%cJ
z%r(ytLRfVqH?Fzpl1JWM9*4N!?@#!B{(_Gk(bm+A1b_g@kO!JOIwkKXH#Rq8lkesh
zl`bu>(9<&qUk|0_<~^#dpPrfJR`3LkEhFNwuD*UseB%E9NpnxZIwFun4Gh4>giwRA
zc0?x^01y1ne**w~537AIAf!0BrjESujDjDc-khY>t=wMO?<%F(;}2yFR74Dt%}a)P
zREJt`!8kwq<x*VdR6Whnpm1oeA?|fp+vIA?ZD)aGWvl&{p_QHe#3Xt$;|??BZYt|0
z90X7>m|RZoeK}|r3IHK##rg<YB$QM6s8R|kizul*f|il05;kz8WYBeY;i!tn&MrAA
z6#OY2%<dL-Bf%F5120EJu-}Ga;Dc`^UC6$%NMPb)Hx!tnAf%@kyQC-QLJvG!S{FiF
z*Md<S-x_DPMcS)&luPtPe;8kHpnmi$<7$IRk?Fi<uRc^aluvU_Yhhy#Q`<*?iopZo
zJzED|!ishu$aS~Pn#=wRlJ6orYMC!Ls|f1HxEW974BC}pLFLmBOf@m@e1=-o(=~#-
z))O9GJ1)weSo_1p=x<pHi?(Uk5@0403gMjwI9?F2&gpk=Rk9KPc~;4=r!YQ>zkWXR
z#*`{VI@~f{tInV0ukw<z+d>K$G*WXf9#@J?Z!6r<T}MHwb8+RwHlu`sE1|#RJ)6~o
zzS~F>2$!xjap@7u(QUCMI;#?2#}9bcnDw%MSwt8tuX$>-NEJGdr(T*AtL&uqN~#WT
z-g_QP^LsP+c=+}i&ztKwm?_}Wl%Vf);6;vy(fFPKq-Krf{zpQvQICg(?Ug@>Nx&U+
zjC*f3!1kFY4zS~t!;(qN5%NIU3H4v3)8o8SJ&}xYli-Iq9S6HVS;BT^QM6I<7xiew
zs43F&{rZ7&()90DAGOE2XC;|(F#99fIapv)+E_ML>o!h2H=U!U*6L3=``J^Qqoo7W
zf@~)ZW~T<w&5B|bA63u909!3wv+z1>7YOjSR6)Sl<vLeqs_F29#E00~5Q4J#724Hf
z2nU*_xd>9&+Nd*+aNRrksZvj^#`9rO9o8rC1d|21)u|F3inL-f#Wi}R<~|kmHN&5;
z3B)yYe%YIv8;IuZpFayGV;%0-^uB2NgFe{gg7ft_xj^TT_Y{uR${^)A3ysIpSs39&
z9ijG;m}vnKkiUg2%P?vsYQCJO@$_OV@CO0Hu)t)o;|R^??X%tO1-F=8j*)@eCsBO8
zi%eVFsxw-!Lvd0lwD|S>cPa5}M3u<4Tb}T$Ox;$^a_lM*m{i5Pu{oB{h2Ay`Po(Dx
zD#N-MNvdBGX_`Lud8}5idh^1LixlXK&^sCJ@PI-I<kZ5UstBq>Jn*VhrM|k_W5)x{
zzhbeqUP%h#MU{Oa-7EuT&#~1EiAPO=<DcPE#yPp#!)u-~HSA__SZ5^xa!byP0C8B3
zI$BBFx9SqRqJ3!}IcmkG&S@9J<RJfiz;ucB3Nj+M-nW@f#mueOFFn>nPq4Rbk@D@*
z6M~fh0C=qA2Fx`k=Mt6^izaq#br)QLk3CvAW9%+&^6yXaFr(JLRl%+P{?WF8(;BaX
zE{t!)7R`6~pLq*@-8wtlZL#g$h)*e9)U%B{XxYCXGPN_V;k|Z!l;3$33aB3vZ~j!f
z8jhOM^$Qdom4h>-B7!MgsLVCNNk__$82?`QspL*0zwl&CWb!J(Q;GX2gTXNKJLh7b
zN8^5=;xVjOqw+n`ziQf<^ritlK&M(Z8LjoT%+`GX4nZhrFaHSbxJOg`KARNhh?nMx
zGP`u#0?`@`N33T&?%+eSu$L?L=-+paXBat?0s^Lq(6>66KiD9fJaJdGPrldmp)ES9
zq5Q@w&+dWzairp+mQ9lhlYn@l$-pFQ%6Vm;W0F$S`6)^oDnz!UA}W)wZD#Nf-02yE
zSxiRiSbJrnHZpS2^QFqWDWYiJ2_&D4GxJTob6game4Rnp4-a8oK0|uY-oP;ACYJg=
zfzq$)JUSkdEEQ-FsXFl0O1;D@^(Svq!Dtb~<Z<F_a##)`|J97{F?%M3CB#gtC7TU-
zrBYd7>|zD{Xe%&8EA}t;;Z>bJpL9WgQD_~sHG5(h>mr{Irog}T$u=eqGe-Q&yn=bw
z7r-~(&JD^vmmxkz!hBa8Ik(`jlhvudkmrW!#)Y{1Gd3YvBL>qqDmh!%F}{e44g(m3
zaqT=bY?~3aCoJ(;oj;Ql3NL$?!}~e$!?~b?QkCYp)qa#vtFm`QZozZZrH&eTD*&+g
E7ZAQxl>h($

literal 0
HcmV?d00001

diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts b/ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts
new file mode 100644
index 0000000000..3ee3fd7222
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts
@@ -0,0 +1,39 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+export class BpmUserModel {
+    apps: any;
+    capabilities: string;
+    company: string;
+    created: string;
+    email: string;
+    externalId: string;
+    firstName: string;
+    lastName: string;
+    fullname: string;
+    groups: any;
+    id: string;
+    lastUpdate: string;
+    latestSyncTimeStamp: string;
+    password: string;
+    pictureId: string;
+    status: string;
+    tenantId: string;
+    tenantName: string;
+    tenantPictureId: string;
+    type: string;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts b/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts
new file mode 100644
index 0000000000..458b6b8ed5
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts
@@ -0,0 +1,27 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+export class EcmCompanyModel {
+      organization: string;
+      address1: string;
+      address2: string;
+      address3: string;
+      postcode: string;
+      telephone: string;
+      fax: string;
+      email: string;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts b/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts
new file mode 100644
index 0000000000..08f24fbcdb
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts
@@ -0,0 +1,39 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { EcmCompanyModel } from './ecm-company.model';
+
+export class EcmUserModel {
+        id: string;
+        firstName: string;
+        lastName: string;
+        description: string;
+        avatarId: string;
+        email: string;
+        skypeId: string;
+        googleId: string;
+        instantMessageId: string;
+        jobTitle: string;
+        location: string;
+        company: EcmCompanyModel;
+        mobile: string;
+        telephone: string;
+        statusUpdatedAt: string;
+        userStatus: string;
+        enabled: boolean;
+        emailNotificationsEnabled: boolean;
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts
new file mode 100644
index 0000000000..089320a264
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts
@@ -0,0 +1,75 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
+import { Injectable } from '@angular/core';
+import { Response } from '@angular/http';
+import { Observable } from 'rxjs/Rx';
+import { BpmUserModel } from '../models/bpm-user.model';
+/**
+ *
+ * BPMUserService retrieve all the information of an Ecm user.
+ *
+ * @returns {BPMUserService} .
+ */
+@Injectable()
+export class BpmUserService {
+
+    constructor(private authService: AlfrescoAuthenticationService,
+                private settingService: AlfrescoSettingsService) {
+    }
+
+    /**
+     * get User Information via ECM
+     * @param userName - the user name
+     */
+    getCurrentUserInfo(): Observable<BpmUserModel> {
+       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
+            return Observable.fromPromise(this.callApiGetProfile())
+                .map(
+                     (data) => <BpmUserModel> data
+                    )
+                .catch(this.handleError);
+        }
+    }
+
+    /**
+     * get User Information via ECM
+     * @param userName - the user name
+     */
+    getCurrentUserProfileImage(): string {
+       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
+            return this.settingService.getBPMApiBaseUrl() + '/api/enterprise/profile-picture';
+       }
+    }
+
+    private callApiGetProfile() {
+        return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
+    }
+    /**
+     * Throw the error
+     * @param error
+     * @returns {ErrorObservable}
+     */
+    private handleError(error: Response) {
+        // in a real world app, we may send the error to some remote logging infrastructure
+        // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error || 'Server error');
+    }
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts b/ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts
new file mode 100644
index 0000000000..6875ee7d48
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts
@@ -0,0 +1,72 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfresco-core';
+import { Injectable } from '@angular/core';
+import { Response } from '@angular/http';
+import { Observable } from 'rxjs/Rx';
+import { EcmUserModel } from '../models/ecm-user.model';
+/**
+ *
+ * ECMUserService retrieve all the information of an Ecm user.
+ *
+ * @returns {ECMUserService} .
+ */
+@Injectable()
+export class EcmUserService {
+
+    constructor(private authService: AlfrescoAuthenticationService,
+                private contentService: AlfrescoContentService) {}
+
+    /**
+     * get User Information via ECM
+     * @param userName - the user name
+     */
+    getUserInfo(userName: string): Observable<EcmUserModel> {
+      if ( this.authService.getAlfrescoApi().ecmAuth.isLoggedIn() ) {
+        return Observable.fromPromise(this.callApiGetPersonInfo(userName))
+            .map(
+                   (data) => <EcmUserModel> data['entry']
+                )
+            .catch(this.handleError);
+      }
+    }
+
+    private callApiGetPersonInfo(userName: string, opts?: any) {
+        return this.authService.getAlfrescoApi().core.peopleApi.getPerson(userName, opts);
+    }
+
+    getCurrentUserProfileImageUrl(avatarId: string) {
+       if ( avatarId ) {
+            let nodeObj = {entry: {id: avatarId}};
+            return this.contentService.getContentUrl(nodeObj);
+       }
+    }
+
+    /**
+     * Throw the error
+     * @param error
+     * @returns {ErrorObservable}
+     */
+    private handleError(error: Response) {
+        // in a real world app, we may send the error to some remote logging infrastructure
+        // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error || 'Server error');
+    }
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/tsconfig.json b/ng2-components/ng2-alfresco-userinfo-old/tsconfig.json
new file mode 100644
index 0000000000..b1effea355
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/tsconfig.json
@@ -0,0 +1,26 @@
+{
+    "compilerOptions": {
+        "target": "es5",
+        "module": "system",
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "sourceMap": true,
+        "removeComments": true,
+        "declaration": true,
+        "noLib": false,
+        "allowUnreachableCode": false,
+        "allowUnusedLabels": false,
+        "noImplicitAny": false,
+        "noImplicitReturns": false,
+        "noImplicitUseStrict": false,
+        "noFallthroughCasesInSwitch": true,
+        "outDir": "dist",
+        "types": ["core-js", "jasmine"]
+    },
+    "exclude": [
+        "demo",
+        "node_modules",
+        "dist"
+    ]
+}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/tslint.json b/ng2-components/ng2-alfresco-userinfo-old/tslint.json
new file mode 100644
index 0000000000..33220e5038
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo-old/tslint.json
@@ -0,0 +1,121 @@
+{
+  "rules": {
+    "align": [
+      true,
+      "parameters",
+      "statements"
+    ],
+    "ban": false,
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space"
+    ],
+    "curly": true,
+    "eofline": true,
+    "forin": true,
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "interface-name": false,
+    "jsdoc-format": true,
+    "label-position": true,
+    "label-undefined": true,
+    "max-line-length": [
+      true,
+      140
+    ],
+    "member-ordering": [
+      true,
+      "static-before-instance",
+      "variables-before-functions"
+    ],
+    "no-any": false,
+    "no-arg": true,
+    "no-bitwise": false,
+    "no-conditional-assignment": true,
+    "no-consecutive-blank-lines": false,
+    "no-console": [
+      true,
+      "debug",
+      "info",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-construct": true,
+    "no-constructor-vars": false,
+    "no-debugger": true,
+    "no-duplicate-key": true,
+    "no-duplicate-variable": true,
+    "no-empty": false,
+    "no-eval": true,
+    "no-inferrable-types": false,
+    "no-internal-module": true,
+    "no-require-imports": true,
+    "no-shadowed-variable": true,
+    "no-switch-case-fall-through": true,
+    "no-trailing-whitespace": true,
+    "no-unreachable": true,
+    "no-unused-expression": true,
+    "no-unused-variable": true,
+    "no-use-before-declare": true,
+    "no-var-keyword": true,
+    "no-var-requires": true,
+    "object-literal-sort-keys": false,
+    "one-line": [
+      true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "quotemark": [
+      true,
+      "single",
+      "avoid-escape"
+    ],
+    "radix": true,
+    "semicolon": true,
+    "switch-default": true,
+    "trailing-comma": [
+      true,
+      {
+        "multiline": "never",
+        "singleline": "never"
+      }
+    ],
+    "triple-equals": [
+      true,
+      "allow-null-check"
+    ],
+    "typedef": false,
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "use-strict": false,
+    "variable-name": [
+      true,
+      "check-format",
+      "allow-leading-underscore",
+      "ban-keywords"
+    ],
+    "whitespace": [
+      true,
+      "check-branch",
+      "check-operator",
+      "check-separator",
+      "check-type",
+      "check-module",
+      "check-decl"
+    ]
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/typings.json b/ng2-components/ng2-alfresco-userinfo-old/typings.json
similarity index 100%
rename from ng2-components/ng2-alfresco-userinfo/typings.json
rename to ng2-components/ng2-alfresco-userinfo-old/typings.json
diff --git a/ng2-components/ng2-alfresco-userinfo/.travis.yml b/ng2-components/ng2-alfresco-userinfo/.travis.yml
index 781e6204e8..ab817d7644 100644
--- a/ng2-components/ng2-alfresco-userinfo/.travis.yml
+++ b/ng2-components/ng2-alfresco-userinfo/.travis.yml
@@ -2,7 +2,11 @@ language: node_js
 node_js:
   - v5
   - v4
+  - '0.12'
+  - '0.10'
 install: npm install
 sudo: false
 after_success:
   npm run coverage
+# Send coverage data to Coveralls
+after_script: "cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js"
diff --git a/ng2-components/ng2-alfresco-userinfo/LICENSE b/ng2-components/ng2-alfresco-userinfo/LICENSE
index bfd4a66b0c..de3d8c60b8 100644
--- a/ng2-components/ng2-alfresco-userinfo/LICENSE
+++ b/ng2-components/ng2-alfresco-userinfo/LICENSE
@@ -1,4 +1,4 @@
-Copyright 2016 vito albano <vito.albano@alfresco.com>
+Copyright 2016 Alfresco <alfresco@alfresco.com>
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
diff --git a/ng2-components/ng2-alfresco-userinfo/README.md b/ng2-components/ng2-alfresco-userinfo/README.md
index f100be7287..a7519e00ea 100644
--- a/ng2-components/ng2-alfresco-userinfo/README.md
+++ b/ng2-components/ng2-alfresco-userinfo/README.md
@@ -1,43 +1,75 @@
-# Alfresco User Info Component for Angular 2
-This component will show the user information for ECM and BPM
+# Alfresco Tag Component for Angular 2
+<p>
+  <a title='Build Status Travis' href="https://travis-ci.org/Alfresco/alfresco-ng2-components">
+    <img src='https://travis-ci.org/Alfresco/alfresco-ng2-components.svg?branch=master'  alt='travis
+    Status' />
+  </a>
+  <a title='Build Status AppVeyor' href="https://ci.appveyor.com/project/alfresco/alfresco-ng2-components">
+    <img src='https://ci.appveyor.com/api/projects/status/github/Alfresco/alfresco-ng2-components'  alt='travis
+    Status' />
+  </a>
+  <a href='https://codecov.io/gh/Alfresco/alfresco-ng2-components'>
+    <img src='https://img.shields.io/codecov/c/github/Alfresco/alfresco-ng2-components/master.svg?maxAge=2592000' alt='Coverage Status' />
+  </a>
+  <a href='https://www.npmjs.com/package/ng2-alfresco-tag'>
+    <img src='https://img.shields.io/npm/dt/ng2-alfresco-tag.svg' alt='npm downloads' />
+  </a>
+  <a href='https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE'>
+     <img src='https://img.shields.io/hexpm/l/plug.svg' alt='license' />
+  </a>
+  <a href='https://www.alfresco.com/'>
+     <img src='https://img.shields.io/badge/style-component-green.svg?label=alfresco' alt='alfresco component' />
+  </a>
+  <a href='https://angular.io/'>
+     <img src='https://img.shields.io/badge/style-2-red.svg?label=angular' alt='angular 2' />
+  </a>
+  <a href='https://www.typescriptlang.org/docs/tutorial.html'>
+     <img src='https://img.shields.io/badge/style-lang-blue.svg?label=typescript' alt='typescript' />
+  </a>
+  <a href='https://www.alfresco.com/'>
+     <img src='https://img.shields.io/badge/style-%3E5.0.0-blue.svg?label=node%20version' alt='node version' />
+  </a>
+</p>
 
+### Node
+To correctly use this component check that on your machine is running Node version 5.0.0 or higher.
 
-## Prerequisites
+## Install
 
-Before you start using this development framework, make sure you have installed all required software and done all the
-necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
-
-## Installation
-
-```bash
-npm install ng2-alfresco-userinfo --save
+```sh
+npm install --save ng2-alfresco-tag
 ```
-## Dependencies
+
+Components included:
+
+* Alfresco Tag Component
+
+#### Dependencies
 
 Add the following dependency to your index.html:
+
 ```html
 <script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
 ```
-	
-You must separately install the following libraries for your application:
-	
-- [ng2-translate](https://github.com/ocombe/ng2-translate)
-- [ng2-alfresco-core](https://www.npmjs.com/package/ng2-alfresco-core)
 
-```sh
-npm install --save ng2-translate ng2-alfresco-core
-```
-	
-#### Material Design Lite
+The following component needs to be added to your systemjs.config: 
 
-The style of this component is based on [material design](https://getmdl.io/), so if you want to visualize it correctly you have to add the material
+- ng2-translate
+- ng2-alfresco-core
+
+Please refer to the following example to have an idea of how your systemjs.config should look like :
+
+https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-alfresco-tag/demo/systemjs.config.js
+
+#### Style
+The style of this component is based on material design, so if you want to visualize it correctly you have to add the material
 design dependency to your project:
 
 ```sh
 npm install --save material-design-icons material-design-lite
 ```
 
-Also make sure you include these dependencies in your `index.html` file:
+Also make sure you include these dependencies in your .html page:
 
 ```html
 <!-- Google Material Design Lite -->
@@ -45,29 +77,293 @@ Also make sure you include these dependencies in your `index.html` file:
 <script src="node_modules/material-design-lite/material.min.js"></script>
 <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
 ```
-	
-## Example
+
+#### Basic usage
+
+In this component are present three different tags :
+
+* alfresco-tag-node-actions-list
+* alfresco-tag-list
+* alfresco-tag-node-list
+
+## alfresco-tag-node-actions-list
 
 ```html
-<ng2-alfresco-userinfo></ng2-alfresco-userinfo>
+<alfresco-tag-node-actions-list [nodeId]="nodeId"></alfresco-tag-node-actions-list>
+```  
+
+```ts
+import { Component, OnInit, Input } from '@angular/core';
+import { bootstrap } from '@angular/platform-browser-dynamic';
+import { HTTP_PROVIDERS } from '@angular/http';
+import {
+    ALFRESCO_CORE_PROVIDERS,
+    AlfrescoSettingsService,
+    AlfrescoAuthenticationService
+} from 'ng2-alfresco-core';
+import { TAGCOMPONENT, TAGSERVICES } from 'ng2-alfresco-tag';
+
+@Component({
+    selector: 'alfresco-tag-demo',
+    template: `
+           <div class="container" *ngIf="authenticated">
+             <alfresco-tag-node-actions-list [nodeId]="nodeId"></alfresco-tag-node-actions-list>
+           </div>
+    `,
+    directives: [TAGCOMPONENT],
+    providers: [TAGSERVICES]
+})
+class TagDemo implements OnInit {
+
+    @Input()
+    nodeId: string = '74cd8a96-8a21-47e5-9b3b-a1b3e296787d';
+
+    authenticated: boolean;
+
+    ecmHost: string = 'http://127.0.0.1:8080';
+
+    ticket: string;
+
+    constructor(private authService: AlfrescoAuthenticationService,
+                private settingsService: AlfrescoSettingsService) {
+        settingsService.ecmHost = this.ecmHost;
+        settingsService.setProviders('ECM');
+    }
+
+    ngOnInit() {
+        this.login();
+    }
+
+    login() {
+        this.authService.login('admin', 'admin').subscribe(
+            ticket => {
+                this.authenticated = true;
+            },
+            error => {
+                this.authenticated = false;
+            });
+    }
+
+    public updateHost(): void {
+        this.settingsService.ecmHost = this.ecmHost;
+        this.login();
+    }
+
+    logData(data) {
+        console.log(data);
+    }
+}
+bootstrap(TagDemo, [
+    HTTP_PROVIDERS,
+    ALFRESCO_CORE_PROVIDERS
+]);
+```  
+ 
+### Options
+
+Attribute     | Options     | Default      | Description | Mandatory
+---           | ---         | ---          | ---         | ---
+`nodeId`         | *string*    |        | The identifier of a node.| 
+
+![Custom columns](docs/assets/tag3.png)                         
+
+## alfresco-tag-node-list
+
+```html
+<alfresco-tag-node-list [nodeId]="nodeId"></alfresco-tag-node-list>
+``` 
+
+```ts
+import { Component, OnInit, Input } from '@angular/core';
+import { bootstrap } from '@angular/platform-browser-dynamic';
+import { HTTP_PROVIDERS } from '@angular/http';
+import {
+    ALFRESCO_CORE_PROVIDERS,
+    AlfrescoSettingsService,
+    AlfrescoAuthenticationService
+} from 'ng2-alfresco-core';
+
+import { TAGCOMPONENT, TAGSERVICES } from 'ng2-alfresco-tag';
+
+@Component({
+    selector: 'alfresco-tag-demo',
+    template: `
+           <div class="container" *ngIf="authenticated">
+             <alfresco-tag-node-list [nodeId]="nodeId"></alfresco-tag-node-list>
+           </div>
+    `,
+    directives: [TAGCOMPONENT],
+    providers: [TAGSERVICES]
+})
+class TagDemo implements OnInit {
+
+    @Input()
+    nodeId: string = '74cd8a96-8a21-47e5-9b3b-a1b3e296787d';
+
+    authenticated: boolean;
+
+    ecmHost: string = 'http://127.0.0.1:8080';
+
+    ticket: string;
+
+    constructor(private authService: AlfrescoAuthenticationService,
+                private settingsService: AlfrescoSettingsService) {
+        settingsService.ecmHost = this.ecmHost;
+        settingsService.setProviders('ECM');
+    }
+
+    ngOnInit() {
+        this.login();
+    }
+
+    login() {
+        this.authService.login('admin', 'admin').subscribe(
+            ticket => {
+                this.authenticated = true;
+            },
+            error => {
+                this.authenticated = false;
+            });
+    }
+
+    public updateHost(): void {
+        this.settingsService.ecmHost = this.ecmHost;
+        this.login();
+    }
+
+    logData(data) {
+        console.log(data);
+    }
+}
+bootstrap(TagDemo, [
+    HTTP_PROVIDERS,
+    ALFRESCO_CORE_PROVIDERS
+]);
+```  
+
+### Options
+
+Attribute     | Options     | Default      | Description | Mandatory
+---           | ---         | ---          | ---         | ---
+`nodeId`         | *string*    |        | The identifier of a node.| 
+
+![Custom columns](docs/assets/tag1.png)                         
+
+## alfresco-tag-list
+
+```html
+<alfresco-tag-list></alfresco-tag-list>
+``` 
+
+```ts
+import { Component, OnInit, Input } from '@angular/core';
+import { bootstrap } from '@angular/platform-browser-dynamic';
+import { HTTP_PROVIDERS } from '@angular/http';
+import {
+    ALFRESCO_CORE_PROVIDERS,
+    AlfrescoSettingsService,
+    AlfrescoAuthenticationService
+} from 'ng2-alfresco-core';
+
+import { TAGCOMPONENT, TAGSERVICES } from 'ng2-alfresco-tag';
+
+@Component({
+    selector: 'alfresco-tag-demo',
+    template: `
+           <div class="container" *ngIf="authenticated">
+             <alfresco-tag-list></alfresco-tag-list>
+           </div>
+    `,
+    directives: [TAGCOMPONENT],
+    providers: [TAGSERVICES]
+})
+class TagDemo implements OnInit {
+
+    authenticated: boolean;
+
+    ecmHost: string = 'http://127.0.0.1:8080';
+
+    constructor(private authService: AlfrescoAuthenticationService,
+                private settingsService: AlfrescoSettingsService) {
+        settingsService.ecmHost = this.ecmHost;
+        settingsService.setProviders('ECM');
+    }
+
+    ngOnInit() {
+        this.login();
+    }
+
+    login() {
+        this.authService.login('admin', 'admin').subscribe(
+            ticket => {
+                this.authenticated = true;
+            },
+            error => {
+                this.authenticated = false;
+            });
+    }
+
+    public updateHost(): void {
+        this.settingsService.ecmHost = this.ecmHost;
+        this.login();
+    }
+
+    logData(data) {
+        console.log(data);
+    }
+}
+bootstrap(TagDemo, [
+    HTTP_PROVIDERS,
+    ALFRESCO_CORE_PROVIDERS
+]);
+```  
+
+![Custom columns](docs/assets/tag2.png)                         
+
+        
+## Build from sources
+Alternatively you can build component from sources with the following commands:
+     
+     
+```sh
+npm install
+npm run build
 ```
-This will show a round icon with user and on click some user information are showed.
-If user is logged in with ECM and BPM the ECM image will be showed.
 
-## NPM scripts
+##Build the files and keep watching for changes
 
-| Command | Description |
-| --- | --- |
-| npm run build | Build component |
-| npm run build:w | Build component and keep watching the changes |
-| npm run test | Run unit tests in the console |
-| npm run test-browser | Run unit tests in the browser
-| npm run coverage | Run unit tests and display code coverage report |
+```sh
+npm run build:w
+```
+    
+## Running unit tests
 
-## History
+```sh
+npm test
+```
 
-For detailed changelog, check [Releases](https://github.com/alfresco/ng2-alfresco-userinfo/releases).
+## Running unit tests in browser
 
-## Contributors
+```sh
+npm test-browser
+```
+
+This task rebuilds all the code, runs tslint, license checks and other quality check tools 
+before performing unit testing. 
+
+## Code coverage
+
+```sh
+npm run coverage
+```
+
+## Demo
+
+If you want have a demo of how the component works, please check the demo folder :
+
+```sh
+cd demo
+npm install
+npm start
+```
 
-[Contributors](https://github.com/alfresco/ng2-alfresco-userinfo/graphs/contributors)
diff --git a/ng2-components/ng2-alfresco-userinfo/assets/license_header.txt b/ng2-components/ng2-alfresco-userinfo/assets/license_header.txt
new file mode 100644
index 0000000000..83fd1531a3
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/assets/license_header.txt
@@ -0,0 +1,16 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/.gitignore b/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
index 7c04460244..6afdbb8367 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
+++ b/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
@@ -3,3 +3,4 @@ node_modules/
 .idea
 dist/
 !systemjs.config.js
+!browser-sync-config.js
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/README.md b/ng2-components/ng2-alfresco-userinfo/demo/README.md
index 7b59778398..8d399e6fef 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/README.md
+++ b/ng2-components/ng2-alfresco-userinfo/demo/README.md
@@ -1,4 +1,4 @@
-# ng2-alfresco-userinfo - Demo
+# ng2-alfresco-tag - Demo
 
 * To install dependencies
 
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/index.html b/ng2-components/ng2-alfresco-userinfo/demo/index.html
index d6b7f0a7d8..ee97252ec1 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/index.html
+++ b/ng2-components/ng2-alfresco-userinfo/demo/index.html
@@ -1,20 +1,20 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
+<head>
     <meta charset="UTF-8">
+    <title>Alfresco Angular 2 Tag - Demo</title>
+    <base href="./">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    
-    <title>ng2-alfresco-userinfo Angular 2</title>
-    <base href="/">
 
     <!-- Google Material Design Lite -->
-    <link rel="stylesheet" href="assets/material.orange-blue.min.css">
+    <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
     <script src="node_modules/material-design-lite/material.min.js"></script>
     <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
 
-
+    <!-- 1. Load libraries -->
     <!-- Polyfill(s) for older browsers -->
     <script src="node_modules/core-js/client/shim.min.js"></script>
+
     <script src="node_modules/zone.js/dist/zone.js"></script>
     <script src="node_modules/reflect-metadata/Reflect.js"></script>
     <script src="node_modules/systemjs/dist/system.src.js"></script>
@@ -24,14 +24,16 @@
 
     <script src="systemjs.config.js"></script>
     <script>
-      System.import('app').catch(function(err){ console.error(err); });
+        System.import('app').catch(
+                function (err) {
+                    console.error(err);
+                });
     </script>
-  </head>
 
-  <body>
-    <my-app>
-      <div id="loader-spin" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div>
-    </my-app>
-  </body>
+</head>
+<body>
 
+<alfresco-tag-demo></alfresco-tag-demo>
+
+</body>
 </html>
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/package.json b/ng2-components/ng2-alfresco-userinfo/demo/package.json
deleted file mode 100644
index 5349c4e2a1..0000000000
--- a/ng2-components/ng2-alfresco-userinfo/demo/package.json
+++ /dev/null
@@ -1,71 +0,0 @@
-{
-  "name": "ng2-alfresco-userinfo-demo",
-  "description": "This component will show the user information for ECM and BPM - Demo",
-  "version": "0.1.0",
-  "author": "vito albano <vito.albano@alfresco.com>",
-  "main": "./dist/index.js",
-  "typings": "./dist/index.d.ts",
-  "scripts": {
-    "clean": "rimraf dist node_modules typings",
-    "postinstall": "npm run build",
-    "start": "npm run tslint && rimraf dist && tsc && concurrently \"tsc -w\" \"npm run server\" ",
-    "server": "wsrv -o -l -s",
-    "build": "npm run tslint && rimraf dist && tsc",
-    "build:w": "npm run tslint && rimraf dist && tsc -w",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts"
-  },
-  "keywords": [
-    "ng2",
-    "angular",
-    "angular2",
-    "alfresco",
-    "demo"
-  ],
-  "dependencies": {
-    "alfresco-js-api": "^0.3.0",
-    "@angular/common": "2.0.0-rc.3",
-    "@angular/compiler": "2.0.0-rc.3",
-    "@angular/core": "2.0.0-rc.3",
-    "@angular/forms": "0.1.1",
-    "@angular/http": "2.0.0-rc.3",
-    "@angular/platform-browser": "2.0.0-rc.3",
-    "@angular/platform-browser-dynamic": "2.0.0-rc.3",
-    "@angular/router": "3.0.0-alpha.7",
-    "@angular/router-deprecated": "2.0.0-rc.2",
-    "@angular/upgrade": "2.0.0-rc.3",
-    "systemjs": "0.19.27",
-    "core-js": "2.4.0",
-    "reflect-metadata": "0.1.3",
-    "rxjs": "5.0.0-beta.6",
-    "zone.js": "0.6.12",
-    "ng2-translate": "2.2.2",
-    "ng2-alfresco-core": "0.3.2",
-    "ng2-alfresco-userinfo": "file:../"
-  },
-  "peerDependencies": {
-    "material-design-icons": "^2.2.3",
-    "material-design-lite": "^1.1.3"
-  },
-  "devDependencies": {
-    "@types/core-js": "^0.9.32",
-    "@types/jasmine": "^2.2.33",
-    "cpx": "1.3.1",
-    "jasmine-ajax": "3.2.0",
-    "jasmine-core": "2.4.1",
-    "karma": "0.13.22",
-    "karma-chrome-launcher": "1.0.1",
-    "karma-coverage": "1.0.0",
-    "karma-jasmine": "1.0.2",
-    "karma-jasmine-ajax": "^0.1.13",
-    "karma-jasmine-html-reporter": "0.2.0",
-    "karma-mocha-reporter": "2.0.3",
-    "license-check": "1.1.5",
-    "remap-istanbul": "0.6.3",
-    "rimraf": "2.5.2",
-    "traceur": "0.0.91",
-    "tslint": "3.8.1",
-    "typescript": "^2.0.2",
-    "wsrv": "^0.1.5"
-  }
-
-}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
index c21351590c..8af97cc33a 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
+++ b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
@@ -1,127 +1,115 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
 
-import { Component, OnInit } from '@angular/core';
-import { bootstrap } from '@angular/platform-browser-dynamic';
-import { UserInfoComponent } from 'ng2-alfresco-userinfo';
-import { HTTP_PROVIDERS } from '@angular/http';
-import {
-    AlfrescoSettingsService,
-    AlfrescoAuthenticationService,
-    MDL,
-    ALFRESCO_CORE_PROVIDERS
-} from 'ng2-alfresco-core';
+import { NgModule, Component, Input, OnInit } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } from 'ng2-alfresco-core';
+import { TagModule } from 'ng2-alfresco-tag';
 
 @Component({
-  selector: 'my-app',
-  styles: [`:host h1 { font-size:22px }`],
-  template: `
-<h4> START DEMO USERINFO </h4>
-<div style="border-radius: 8px; position: absolute; background-color:papayawhip; color: cadetblue; left: 320px; top: 30px; z-index: 1;">
-  <p style="width:120px;margin: 20px;">
-  <label for="switch1" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
-      <input type="checkbox" id="switch1" class="mdl-switch__input"
-       (click)="toggleECM(ecm.checked)" #ecm>
-      <span class="mdl-switch__label">ECM</span>
-  </label>
-  </p>
-  <p style="width:120px;margin: 20px;">
-      <label for="switch2" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
-          <input type="checkbox" id="switch2" class="mdl-switch__input" checked
-           (click)="toggleBPM(bpm.checked)" #bpm>
-          <span class="mdl-switch__label">BPM</span>
-      </label>
-  </p>
-</div>
-<div *ngIf="isLoggedIn()">
-    <ng2-alfresco-userinfo></ng2-alfresco-userinfo>
-</div>
-<p></p>
-<div>
-    <p>
-        <span>Username</span>
-        <input id="user" type="text" [(ngModel)]="userToLogin" value="admin"/>
-    </p>
-    <p>
-        <span>Password</span>
-        <input id="passw" type="password" [(ngModel)]="password" value="admin"/>
-    </p>
-<button type="submit" (click)="attemptLogin()"> Login !</button>
-</div>
-<span>{{loginErrorMessage}}</span>
-
-<button (click)="logout()">Logout</button>`,
-  directives: [ UserInfoComponent ],
-  providers: [AlfrescoAuthenticationService, AlfrescoSettingsService, MDL]
+    selector: 'alfresco-tag-demo',
+    template: `
+               <label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
+               <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>
+               <label for="host"><b>Insert the ip of your Alfresco instance:</b></label><br>
+               <input id="host" type="text" size="48" (change)="updateHost()" [(ngModel)]="ecmHost"><br><br>
+               <div *ngIf="!authenticated" style="color:#FF2323">
+                    Authentication failed to ip {{ ecmHost }} with user: admin, admin, you can still try to add a valid ticket to perform
+                    operations.
+               </div>
+               <hr>
+                <label for="nodeId"><b>Insert Node Id</b></label><br>
+                <input id="nodeId" type="text" size="48"  [(ngModel)]="nodeId"><br>
+        <div class="container" *ngIf="authenticated">
+            <div class="mdl-grid">
+              <div class="mdl-cell mdl-cell--4-col"><alfresco-tag-node-actions-list [nodeId]="nodeId"></alfresco-tag-node-actions-list></div>
+              <div class="mdl-cell mdl-cell--4-col">List Tags ECM <alfresco-tag-list></alfresco-tag-list></div>
+              <div class="mdl-cell mdl-cell--4-col">
+                    Tag list By Node ID 
+                    <alfresco-tag-node-list [nodeId]="nodeId"></alfresco-tag-node-list>
+              </div>
+            </div>
+        </div>
+    `
 })
+class TagDemo implements OnInit {
 
+    @Input()
+    nodeId: string = '74cd8a96-8a21-47e5-9b3b-a1b3e296787d';
 
-class UserInfoDemo implements OnInit {
+    authenticated: boolean;
 
-      public userToLogin: string = 'admin';
-      public password: string = 'admin';
-      public loginErrorMessage: string;
-      public providers: string = 'BPM';
-      private authenticated: boolean;
-      private token: any;
+    ecmHost: string = 'http://127.0.0.1:8080';
 
-      constructor(private authService: AlfrescoAuthenticationService,
-                  private settingsService: AlfrescoSettingsService) {
-      }
+    ticket: string;
 
-      ngOnInit() {
-        this.settingsService.setProviders(this.providers);
-      }
+    constructor(private authService: AlfrescoAuthenticationService,
+                private settingsService: AlfrescoSettingsService) {
 
-      attemptLogin() {
-          this.loginErrorMessage = '';
-          this.login(this.userToLogin, this.password);
-      }
+        settingsService.ecmHost = this.ecmHost;
+        settingsService.setProviders('ECM');
 
-      logout() {
-          this.authService.logout();
-      }
+        if (this.authService.getTicketEcm()) {
+            this.ticket = this.authService.getTicketEcm();
+        }
+    }
 
-      login(user, password) {
-          this.settingsService.setProviders(this.providers);
-          this.authService.login(user, password).subscribe(
-              token => {
-                  console.log(token);
-                  this.token = token;
-                  this.authenticated = true;
-              },
-              error => {
-                  console.log(error);
-                  this.authenticated = false;
-                  this.loginErrorMessage = error;
-              });
-      }
+    ngOnInit() {
+        this.login();
+    }
 
-      isLoggedIn(): boolean {
-          return this.authService.isLoggedIn();
-      }
+    login() {
+        this.authService.login('admin', 'admin').subscribe(
+            ticket => {
+                console.log(ticket);
+                this.ticket = this.authService.getTicketEcm();
+                this.authenticated = true;
+            },
+            error => {
+                console.log(error);
+                this.authenticated = false;
+            });
+    }
 
-      toggleECM(checked) {
-          if (checked && this.providers === 'BPM') {
-              this.providers = 'ALL';
-          } else if (checked) {
-              this.providers = 'ECM';
-          } else {
-              this.providers = undefined;
-          }
-      }
+    public updateTicket(): void {
+        localStorage.setItem('ticket-ECM', this.ticket);
+    }
 
-      toggleBPM(checked) {
-          if (checked && this.providers === 'ECM') {
-              this.providers = 'ALL';
-          } else if (checked) {
-              this.providers = 'BPM';
-          } else {
-              this.providers = undefined;
-          }
-      }
+    public updateHost(): void {
+        this.settingsService.ecmHost = this.ecmHost;
+        this.login();
+    }
+
+    logData(data) {
+        console.log(data);
+    }
 }
 
-bootstrap(UserInfoDemo, [
-  UserInfoComponent,
-  HTTP_PROVIDERS,
-  ALFRESCO_CORE_PROVIDERS
-]);
+@NgModule({
+    imports: [
+        BrowserModule,
+        CoreModule.forRoot(),
+        TagModule
+    ],
+    declarations: [ TagDemo ],
+    bootstrap:    [ TagDemo ]
+})
+export class AppModule { }
+
+platformBrowserDynamic().bootstrapModule(AppModule);
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/tslint.json b/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
index 8c48e76469..e550ac11d4 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
+++ b/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
@@ -26,7 +26,7 @@
     "label-undefined": true,
     "max-line-length": [
       true,
-      140
+      180
     ],
     "member-ordering": [
       true,
diff --git a/ng2-components/ng2-alfresco-userinfo/index.ts b/ng2-components/ng2-alfresco-userinfo/index.ts
index a75fe639fd..41ab68dfa4 100644
--- a/ng2-components/ng2-alfresco-userinfo/index.ts
+++ b/ng2-components/ng2-alfresco-userinfo/index.ts
@@ -17,12 +17,20 @@
 
 import { NgModule, ModuleWithProviders } from '@angular/core';
 import { CoreModule } from 'ng2-alfresco-core';
+
+import { UserInfoComponent } from './src/components/user-info.component';
 import { EcmUserService } from './src/services/ecm-user.service';
 import { BpmUserService } from './src/services/bpm-user.service';
 
 export * from './src/components/user-info.component';
+export * from './src/services/bpm-user.service';
+export * from './src/services/ecm-user.service';
 
-export const USER_INFO_SERVICE: [any] = [
+export const USER_INFO_DIRECTIVES: any[] = [
+    UserInfoComponent
+];
+
+export const USER_INFO_PROVIDERS: any[] = [
     EcmUserService,
     BpmUserService
 ];
@@ -32,16 +40,23 @@ export const USER_INFO_SERVICE: [any] = [
         CoreModule
     ],
     declarations: [
-        ...USER_INFO_SERVICE
+        ...USER_INFO_DIRECTIVES
+    ],
+    providers: [
+        ...USER_INFO_PROVIDERS
     ],
     exports: [
-        ...USER_INFO_SERVICE
+        ...USER_INFO_DIRECTIVES
     ]
 })
-export class UserInfoModule {
+export class UserInfoComponentModule {
     static forRoot(): ModuleWithProviders {
         return {
-            ngModule: UserInfoModule
+            ngModule: UserInfoComponentModule,
+            providers: [
+                ...USER_INFO_PROVIDERS
+            ]
         };
     }
 }
+
diff --git a/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js b/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
index fb1c3905f3..d7f5a90d43 100644
--- a/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
+++ b/ng2-components/ng2-alfresco-userinfo/karma-test-shim.js
@@ -70,7 +70,7 @@ var map = {
 };
 
 var packages = {
-    'app': { main: 'index.js',  defaultExtension: 'js', format: 'register' },
+    'app': { main: 'main.js',  defaultExtension: 'js' },
     'rxjs': {  defaultExtension: 'js' },
     'ng2-translate': { defaultExtension: 'js' },
 
@@ -98,7 +98,7 @@ var config = {
 
 System.config(config);
 
-System.import('app')
+System.import('@angular/core/testing')
     .then(initTestBed)
     .then(initTesting);
 
diff --git a/ng2-components/ng2-alfresco-userinfo/karma.conf.js b/ng2-components/ng2-alfresco-userinfo/karma.conf.js
index c0374b25c3..5495861358 100644
--- a/ng2-components/ng2-alfresco-userinfo/karma.conf.js
+++ b/ng2-components/ng2-alfresco-userinfo/karma.conf.js
@@ -108,7 +108,7 @@ module.exports = function (config) {
     // Source files that you wanna generate coverage for.
     // Do not include tests or libraries (these files will be instrumented by Istanbul)
     preprocessors: {
-    //  'dist/**/!(*spec).js': ['coverage']
+      // 'dist/**/!(*spec).js': ['coverage']
     },
 
     coverageReporter: {
diff --git a/ng2-components/ng2-alfresco-userinfo/package.json b/ng2-components/ng2-alfresco-userinfo/package.json
index 19e3865dde..49787abe9d 100644
--- a/ng2-components/ng2-alfresco-userinfo/package.json
+++ b/ng2-components/ng2-alfresco-userinfo/package.json
@@ -1,11 +1,13 @@
 {
-  "name": "ng2-alfresco-userinfo",
-  "description": "This component will show the user information for ECM and BPM",
-  "version": "0.1.0",
-  "author": "vito albano <vito.albano@alfresco.com>",
+  "name": "ng2-alfresco-tag",
+  "description": "Alfresco tag component",
+  "version": "0.3.2",
+  "author": "Alfresco Software, Ltd.",
+  "main": "./dist/index.js",
+  "typings": "./dist/index.d.ts",
   "scripts": {
     "clean": "rimraf dist node_modules",
-    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist",
+    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist && license-check",
     "build:w": "npm run tslint && rimraf dist && npm run watch-task",
     "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\"  \"license-check\"",
     "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json 'src/{,**/}**.ts'",
@@ -18,10 +20,9 @@
     "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\"",
     "posttest": "remap-istanbul -i coverage/report/coverage-final.json -o coverage/report -t html && remap-istanbul -i coverage/report/coverage-final.json -o coverage/report/coverage-final.json",
     "coverage": "npm run test && wsrv -o -p 9875 ./coverage/report",
-    "travis": "npm link ng2-alfresco-core"
+    "prepublish": "npm run build",
+    "travis": "echo 'placeholder'"
   },
-  "main": "./dist/index.js",
-  "typings": "./dist/index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/Alfresco/alfresco-ng2-components.git"
@@ -29,19 +30,6 @@
   "bugs": {
     "url": "https://github.com/Alfresco/alfresco-ng2-components/issues"
   },
-  "license": "Apache-2.0",
-  "contributors": [
-    {
-      "name": "Vito Albano",
-      "email": "vito.albano@alfresco.com"
-    }
-  ],
-  "keywords": [
-    "ng2",
-    "angular",
-    "angular2",
-    "alfresco"
-  ],
   "dependencies": {
     "@angular/common": "2.0.0",
     "@angular/compiler": "2.0.0",
@@ -58,6 +46,7 @@
     "systemjs": "0.19.27",
     "zone.js": "^0.6.23",
 
+    "alfresco-js-api": "^0.3.0",
     "ng2-translate": "2.5.0",
     "ng2-alfresco-core": "0.3.2"
   },
@@ -65,31 +54,36 @@
     "@types/core-js": "^0.9.32",
     "@types/jasmine": "^2.2.33",
     "concurrently": "^2.2.0",
-    "cpx": "1.3.1",
-    "jasmine-ajax": "3.2.0",
+    "cpx": "^1.3.1",
+    "jasmine-ajax": "^3.2.0",
     "jasmine-core": "2.4.1",
-    "karma": "0.13.22",
-    "karma-chrome-launcher": "1.0.1",
-    "karma-coverage": "1.0.0",
-    "karma-jasmine": "1.0.2",
+    "karma": "~0.13.22",
+    "karma-chrome-launcher": "~1.0.1",
+    "karma-coverage": "^1.0.0",
+    "karma-jasmine": "~1.0.2",
     "karma-jasmine-ajax": "^0.1.13",
-    "karma-jasmine-html-reporter": "0.2.0",
-    "karma-mocha-reporter": "2.0.3",
-    "license-check": "1.1.5",
-    "remap-istanbul": "0.6.3",
+    "karma-jasmine-html-reporter": "^0.2.0",
+    "karma-mocha-reporter": "^2.0.3",
+    "license-check": "^1.0.4",
+    "remap-istanbul": "^0.6.3",
     "rimraf": "2.5.2",
-    "traceur": "0.0.91",
-    "tslint": "3.8.1",
-    "typescript": "^2.0.2",
+    "traceur": "^0.0.91",
+    "tslint": "^3.8.1",
+    "typescript": "^2.0.3",
     "wsrv": "^0.1.5"
   },
+  "keywords": [
+    "userinfo",
+    "alfresco-component"
+  ],
   "license-check-config": {
     "src": [
-      "./dist/**/*.js"
+     "./dist/**/*.js"
     ],
     "path": "assets/license_header.txt",
-    "blocking": true,
+    "blocking": false,
     "logInfo": false,
     "logError": true
-  }
+  },
+  "license": "Apache-2.0"
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
index a91e2f2ac8..7fe9af0ca4 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
@@ -14,12 +14,37 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-// import { UserInfoComponent } from '../src/userinfo.component';
 
-describe('Basic Example test ng2-alfresco-userinfo', () => {
+import { UserInfoComponent } from './user-info.component';
+import { EcmUserService } from '../services/ecm-user.service';
+import { BpmUserService } from '../services/bpm-user.service';
+import { AlfrescoAuthenticationService,
+         AlfrescoApiService,
+         AlfrescoSettingsService } from 'ng2-alfresco-core';
 
-  it('Test hello world', () => {
-       expect(true).toBe(true);
-  });
+describe('User info component', () => {
+
+    let userInfoComp: UserInfoComponent;
+    let ecmUserService = new EcmUserService(null, null);
+    let bpmUserService = new BpmUserService(null);
+    let authService = new AlfrescoAuthenticationService(new AlfrescoSettingsService() ,
+                                                        new AlfrescoApiService());
+
+    beforeEach(() => {
+        userInfoComp = new UserInfoComponent(ecmUserService, bpmUserService, authService);
+    });
+
+    it('should get the ecm user informations when is logged in', () => {
+       spyOn(ecmUserService, 'getUserInfo');
+       spyOn(bpmUserService, 'getCurrentUserInfo');
+       spyOn(authService, 'getAlfrescoApi').and.callThrough();
+       // spyOn(authService.getAlfrescoApi(), 'ecmAuth').and.callThrough();
+       spyOn(authService, 'getAlfrescoApi().ecmAuth.isLoggedIn').and.returnValue(true);
+       userInfoComp.ngOnInit();
+
+       expect(ecmUserService.getUserInfo).toHaveBeenCalledWith('-me-');
+       expect(bpmUserService.getCurrentUserInfo).not.toHaveBeenCalled();
+
+    });
 
 });
diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
index d54b9669e3..9ca5f1aa18 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
@@ -16,10 +16,10 @@
  */
 
 import { Component, OnInit } from '@angular/core';
-import { EcmUserService } from './../services/ecm-user.service';
-import { BpmUserService } from './../services/bpm-user.service';
 import { EcmUserModel } from './../models/ecm-user.model';
 import { BpmUserModel } from './../models/bpm-user.model';
+import { EcmUserService } from './../services/ecm-user.service';
+import { BpmUserService } from './../services/bpm-user.service';
 import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
 
 declare let __moduleName: string;
@@ -27,21 +27,19 @@ declare let __moduleName: string;
 @Component({
     selector: 'ng2-alfresco-userinfo',
     moduleId: __moduleName,
-    styleUrls: ['./userinfo.component.css'],
-    templateUrl: './userinfo.component.html',
-    providers: [EcmUserService, BpmUserService, AlfrescoAuthenticationService]
+    styleUrls: ['./user-info.component.css'],
+    templateUrl: './user-info.component.html'
 })
 
 export class UserInfoComponent implements OnInit {
 
     private  ecmUser: EcmUserModel;
     private  bpmUser: BpmUserModel;
-    private baseComponentPath = __moduleName.replace('userinfo.component.js', '');
+    private baseComponentPath = __moduleName.replace('components/user-info.component.js', '');
     private  anonymouseImageUrl: string = this.baseComponentPath + 'img/anonymous.gif';
     public   bpmUserImage: any;
     public   ecmUserImage: any;
 
-
     constructor(private ecmUserService: EcmUserService,
                 private bpmUserService: BpmUserService,
                 public authService: AlfrescoAuthenticationService) {
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
new file mode 100644
index 0000000000..ab002e9957
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
@@ -0,0 +1,48 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+// import { UserInfoComponent } from '../src/userinfo.component';
+
+/*
+describe('Bpm User Service', () => {
+
+  beforeEachProviders(() => {
+      return [
+          HTTP_PROVIDERS,
+          AlfrescoSettingsService,
+          AlfrescoAuthenticationService,
+          WidgetVisibilityService
+      ];
+  });
+
+  beforeEach(
+      inject([WidgetVisibilityService], (activitiService: WidgetVisibilityService) => {
+              jasmine.Ajax.install();
+              service = activitiService;
+              })
+  );
+
+  afterEach(() => {
+      jasmine.Ajax.uninstall();
+  });
+
+
+  it('should be able to get current user information', () => {
+
+  });
+
+});
+*/
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
index 089320a264..98d637a6ed 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
+import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
 import { Injectable } from '@angular/core';
 import { Response } from '@angular/http';
 import { Observable } from 'rxjs/Rx';
@@ -29,12 +29,11 @@ import { BpmUserModel } from '../models/bpm-user.model';
 @Injectable()
 export class BpmUserService {
 
-    constructor(private authService: AlfrescoAuthenticationService,
-                private settingService: AlfrescoSettingsService) {
+    constructor(private authService: AlfrescoAuthenticationService) {
     }
 
     /**
-     * get User Information via ECM
+     * get Current User information for BPM
      * @param userName - the user name
      */
     getCurrentUserInfo(): Observable<BpmUserModel> {
@@ -47,19 +46,31 @@ export class BpmUserService {
         }
     }
 
-    /**
-     * get User Information via ECM
-     * @param userName - the user name
-     */
-    getCurrentUserProfileImage(): string {
+    getCurrentUserProfileImage(): any {
        if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
-            return this.settingService.getBPMApiBaseUrl() + '/api/enterprise/profile-picture';
+           return Observable.fromPromise(this.callApiGetProfilePicture())
+               .map(
+                    (data) => data
+                   )
+               .catch(this.handleError);
        }
     }
 
+    /**
+     * Call js api to get current user profile picture
+     */
+    private callApiGetProfilePicture() {
+        return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
+    }
+
+    /**
+     * Call js api to get current user information
+     */
     private callApiGetProfile() {
         return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
     }
+
+
     /**
      * Throw the error
      * @param error
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
new file mode 100644
index 0000000000..5bc6a53e0f
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
@@ -0,0 +1,69 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+/*
+// import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfresco-core';
+import { EcmUserService } from './ecm-user.service';
+import { ReflectiveInjector } from '@angular/core';
+import { EcmUserModel } from '../models/ecm-user.model';
+
+declare var AlfrescoApi: any;
+declare let jasmine: any;
+
+describe('Ecm User service', () => {
+
+    let injector;
+    let ecmUserService: EcmUserService;
+    // let contentService: AlfrescoContentService;
+    // let authService: AlfrescoAuthenticationService;
+
+    beforeEach(() => {
+
+        injector = ReflectiveInjector.resolveAndCreate([
+            EcmUserService
+        ]);
+
+        // contentService = injector.get(AlfrescoContentService);
+        // authService = injector.get(AlfrescoAuthenticationService);
+        ecmUserService = injector.get(EcmUserService);
+
+        jasmine.Ajax.install();
+    });
+
+    afterEach(() => {
+        jasmine.Ajax.uninstall();
+    });
+
+    it('should be able', (done) => {
+        let authService = new AlfrescoAuthenticationService();
+        spyOn(authService, )
+        ecmUserService.getUserInfo('fake-user').subscribe((res) => {
+            expect(res).not.toBeUndefined();
+            expect(res).toEqual(jasmine.any(EcmUserModel));
+            expect(res.firstName).toEqual('fake-user-response');
+            expect(res.email).toEqual('fake@email.com');
+            done();
+        });
+
+        jasmine.Ajax.requests.mostRecent().respondWith({
+            'status': 201,
+            contentType: 'application/json',
+            responseText: JSON.stringify({'entry': {'firstName': 'fake-user-response', 'id': 'fake@email.com'}})
+        });
+    });
+
+});
+*/
diff --git a/ng2-components/ng2-alfresco-userinfo/tsconfig.json b/ng2-components/ng2-alfresco-userinfo/tsconfig.json
index b1effea355..ae39a67a17 100644
--- a/ng2-components/ng2-alfresco-userinfo/tsconfig.json
+++ b/ng2-components/ng2-alfresco-userinfo/tsconfig.json
@@ -1,26 +1,26 @@
 {
-    "compilerOptions": {
-        "target": "es5",
-        "module": "system",
-        "moduleResolution": "node",
-        "emitDecoratorMetadata": true,
-        "experimentalDecorators": true,
-        "sourceMap": true,
-        "removeComments": true,
-        "declaration": true,
-        "noLib": false,
-        "allowUnreachableCode": false,
-        "allowUnusedLabels": false,
-        "noImplicitAny": false,
-        "noImplicitReturns": false,
-        "noImplicitUseStrict": false,
-        "noFallthroughCasesInSwitch": true,
-        "outDir": "dist",
-        "types": ["core-js", "jasmine"]
-    },
-    "exclude": [
-        "demo",
-        "node_modules",
-        "dist"
-    ]
+  "compilerOptions": {
+    "target": "es5",
+    "module": "system",
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "sourceMap": true,
+    "removeComments": true,
+    "declaration": true,
+    "noLib": false,
+    "allowUnreachableCode": false,
+    "allowUnusedLabels": false,
+    "noImplicitAny": false,
+    "noImplicitReturns": false,
+    "noImplicitUseStrict": false,
+    "noFallthroughCasesInSwitch": true,
+    "outDir": "dist",
+    "types": ["core-js", "jasmine"]
+  },
+  "exclude": [
+    "demo",
+    "node_modules",
+    "dist"
+  ]
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/tslint.json b/ng2-components/ng2-alfresco-userinfo/tslint.json
index 33220e5038..ba706079f4 100644
--- a/ng2-components/ng2-alfresco-userinfo/tslint.json
+++ b/ng2-components/ng2-alfresco-userinfo/tslint.json
@@ -24,7 +24,7 @@
     "label-undefined": true,
     "max-line-length": [
       true,
-      140
+      180
     ],
     "member-ordering": [
       true,

From 336ffe75d8ccbd6cc5d74597eea76793cc690784 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 30 Sep 2016 00:54:23 +0100
Subject: [PATCH 14/26] Added tests for user-info component

---
 .../AlfrescoAuthentication.service.spec.ts    |  13 +
 .../AlfrescoAuthentication.service.ts         |  15 ++
 .../components/user-info.component.spec.ts    | 240 ++++++++++++++++--
 .../src/components/user-info.component.ts     |  17 +-
 .../src/services/bpm-user.service.ts          |   4 +-
 .../src/services/ecm-user.service.ts          |   6 +-
 .../src/testing/fake-bpm-user.service.ts      |  89 +++++++
 .../src/testing/fake-ecm-user.service.ts      |  99 ++++++++
 8 files changed, 452 insertions(+), 31 deletions(-)
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts
 create mode 100644 ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts

diff --git a/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.spec.ts b/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.spec.ts
index c43a10b753..1071d838ad 100644
--- a/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.spec.ts
+++ b/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.spec.ts
@@ -74,6 +74,7 @@ describe('AlfrescoAuthentication', () => {
             authService.login('fake-username', 'fake-password').subscribe(() => {
                 expect(authService.isLoggedIn()).toBe(true);
                 expect(authService.getTicketEcm()).toEqual('fake-post-ticket');
+                expect(authService.isEcmLoggedIn()).toBe(true);
                 done();
             });
 
@@ -106,6 +107,7 @@ describe('AlfrescoAuthentication', () => {
                 (err: any) => {
                     expect(authService.isLoggedIn()).toBe(false);
                     expect(authService.getTicketEcm()).toBe(null);
+                    expect(authService.isEcmLoggedIn()).toBe(false);
                     done();
                 });
 
@@ -141,6 +143,7 @@ describe('AlfrescoAuthentication', () => {
                 authService.logout().subscribe(() => {
                     expect(authService.isLoggedIn()).toBe(false);
                     expect(authService.getTicketEcm()).toBe(null);
+                    expect(authService.isEcmLoggedIn()).toBe(false);
                     done();
                 });
 
@@ -158,6 +161,7 @@ describe('AlfrescoAuthentication', () => {
 
         it('should return false if the user is not logged in', () => {
             expect(authService.isLoggedIn()).toBe(false);
+            expect(authService.isEcmLoggedIn()).toBe(false);
         });
     });
 
@@ -171,6 +175,7 @@ describe('AlfrescoAuthentication', () => {
             authService.login('fake-username', 'fake-password').subscribe(() => {
                 expect(authService.isLoggedIn()).toBe(true);
                 expect(authService.getTicketBpm()).toEqual('Basic ZmFrZS11c2VybmFtZTpmYWtlLXBhc3N3b3Jk');
+                expect(authService.isBpmLoggedIn()).toBe(true);
                 done();
             });
 
@@ -201,6 +206,7 @@ describe('AlfrescoAuthentication', () => {
                 (err: any) => {
                     expect(authService.isLoggedIn()).toBe(false);
                     expect(authService.getTicketBpm()).toBe(null);
+                    expect(authService.isBpmLoggedIn()).toBe(false);
                     done();
                 });
 
@@ -214,6 +220,7 @@ describe('AlfrescoAuthentication', () => {
                 authService.logout().subscribe(() => {
                     expect(authService.isLoggedIn()).toBe(false);
                     expect(authService.getTicketBpm()).toBe(null);
+                    expect(authService.isBpmLoggedIn()).toBe(false);
                     done();
                 });
 
@@ -280,6 +287,8 @@ describe('AlfrescoAuthentication', () => {
                 expect(authService.isLoggedIn()).toBe(true);
                 expect(authService.getTicketEcm()).toEqual('fake-post-ticket');
                 expect(authService.getTicketBpm()).toEqual('Basic ZmFrZS11c2VybmFtZTpmYWtlLXBhc3N3b3Jk');
+                expect(authService.isBpmLoggedIn()).toBe(true);
+                expect(authService.isEcmLoggedIn()).toBe(true);
                 done();
             });
 
@@ -302,6 +311,7 @@ describe('AlfrescoAuthentication', () => {
                     expect(authService.isLoggedIn()).toBe(false);
                     expect(authService.getTicketEcm()).toBe(null);
                     expect(authService.getTicketBpm()).toBe(null);
+                    expect(authService.isEcmLoggedIn()).toBe(false);
                     done();
                 });
 
@@ -322,6 +332,7 @@ describe('AlfrescoAuthentication', () => {
                     expect(authService.isLoggedIn()).toBe(false);
                     expect(authService.getTicketEcm()).toBe(null);
                     expect(authService.getTicketBpm()).toBe(null);
+                    expect(authService.isBpmLoggedIn()).toBe(false);
                     done();
                 });
 
@@ -344,6 +355,8 @@ describe('AlfrescoAuthentication', () => {
                     expect(authService.isLoggedIn()).toBe(false);
                     expect(authService.getTicketEcm()).toBe(null);
                     expect(authService.getTicketBpm()).toBe(null);
+                    expect(authService.isBpmLoggedIn()).toBe(false);
+                    expect(authService.isEcmLoggedIn()).toBe(false);
                     done();
                 });
 
diff --git a/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.ts b/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.ts
index fed60c3356..26a031c2e9 100644
--- a/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.ts
+++ b/ng2-components/ng2-alfresco-core/src/services/AlfrescoAuthentication.service.ts
@@ -82,6 +82,7 @@ export class AlfrescoAuthenticationService {
      * @returns {Observable<R>|Observable<T>}
      */
     login(username: string, password: string): Observable<{ type: string, ticket: any }> {
+        this.removeTicket();
         return Observable.fromPromise(this.callApiLogin(username, password))
             .map((response: any) => {
                 this.saveTickets();
@@ -191,6 +192,20 @@ export class AlfrescoAuthenticationService {
         }
     }
 
+    /**
+     * The method return true if user is logged in on ecm provider
+     */
+    public isEcmLoggedIn() {
+        return this.alfrescoApi.ecmAuth && !!this.alfrescoApi.ecmAuth.isLoggedIn();
+    }
+
+    /**
+     * The method return true if user is logged in on bpm provider
+     */
+    public isBpmLoggedIn() {
+        return this.alfrescoApi.bpmAuth && !!this.alfrescoApi.bpmAuth.isLoggedIn();
+    }
+
     /**
      * The method write the error in the console browser
      * @param error
diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
index 7fe9af0ca4..b78cc8cb41 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
@@ -18,33 +18,233 @@
 import { UserInfoComponent } from './user-info.component';
 import { EcmUserService } from '../services/ecm-user.service';
 import { BpmUserService } from '../services/bpm-user.service';
-import { AlfrescoAuthenticationService,
-         AlfrescoApiService,
-         AlfrescoSettingsService } from 'ng2-alfresco-core';
+import { FakeEcmUserService } from '../testing/fake-ecm-user.service';
+import { FakeBpmUserService } from '../testing/fake-bpm-user.service';
+import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfresco-core';
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+
+
+class StubAuthentication {
+  isEcmConnected: boolean;
+  isBpmConnected: boolean;
+  setIsEcmLoggedIn(logged: boolean) { this.isEcmConnected = logged; };
+  setIsBpmLoggedIn(logged: boolean) { this.isBpmConnected = logged; };
+  isEcmLoggedIn() { return this.isEcmConnected; };
+  isBpmLoggedIn() { return this.isBpmConnected; };
+}
+
+class StubAlfrescoContentService {
+    getContentUrl() { return 'fake/url/image/for/ecm/user'; } ;
+}
+
 
 describe('User info component', () => {
 
     let userInfoComp: UserInfoComponent;
-    let ecmUserService = new EcmUserService(null, null);
-    let bpmUserService = new BpmUserService(null);
-    let authService = new AlfrescoAuthenticationService(new AlfrescoSettingsService() ,
-                                                        new AlfrescoApiService());
+    let fixture: ComponentFixture<UserInfoComponent>;
+    let authStub: StubAuthentication;
+    let fakeEcmService: FakeEcmUserService;
+    let fakeBpmService: FakeBpmUserService;
 
-    beforeEach(() => {
-        userInfoComp = new UserInfoComponent(ecmUserService, bpmUserService, authService);
+    beforeEach(async(() => {
+       TestBed.configureTestingModule({
+          declarations: [ UserInfoComponent ],
+          providers: [{ provide: EcmUserService, useClass: FakeEcmUserService},
+                      { provide: BpmUserService, useClass: FakeBpmUserService},
+                      { provide: AlfrescoAuthenticationService, useClass: StubAuthentication },
+                      { provide: AlfrescoContentService, useClass: StubAlfrescoContentService }
+                     ]
+       }).compileComponents().then(() => {
+           fixture = TestBed.createComponent(UserInfoComponent);
+           userInfoComp = fixture.componentInstance;
+         });
+    }));
+
+    it('should NOT have users before ngOnInit only anonymous image', () => {
+        expect(userInfoComp.ecmUser).toBeUndefined();
+        expect(userInfoComp.ecmUserImage).toBeUndefined();
+        expect(userInfoComp.bpmUser).toBeUndefined();
+        expect(userInfoComp.bpmUserImage).toBeUndefined();
+        expect(userInfoComp.anonymouseImageUrl).not.toBeUndefined();
     });
 
-    it('should get the ecm user informations when is logged in', () => {
-       spyOn(ecmUserService, 'getUserInfo');
-       spyOn(bpmUserService, 'getCurrentUserInfo');
-       spyOn(authService, 'getAlfrescoApi').and.callThrough();
-       // spyOn(authService.getAlfrescoApi(), 'ecmAuth').and.callThrough();
-       spyOn(authService, 'getAlfrescoApi().ecmAuth.isLoggedIn').and.returnValue(true);
-       userInfoComp.ngOnInit();
-
-       expect(ecmUserService.getUserInfo).toHaveBeenCalledWith('-me-');
-       expect(bpmUserService.getCurrentUserInfo).not.toHaveBeenCalled();
-
+    it('should NOT have users immediately after ngOnInit', () => {
+        fixture.detectChanges();
+        expect(userInfoComp.ecmUser).toBeUndefined();
+        expect(userInfoComp.ecmUserImage).toBeUndefined();
+        expect(userInfoComp.bpmUser).toBeUndefined();
+        expect(userInfoComp.bpmUserImage).toBeUndefined();
+        expect(userInfoComp.anonymouseImageUrl).not.toBeUndefined();
     });
 
+    describe('when user is logged on ecm', () => {
+
+        beforeEach( async(() => {
+            authStub = fixture.debugElement.injector.get(AlfrescoAuthenticationService);
+            fakeEcmService = fixture.debugElement.injector.get(EcmUserService);
+
+            authStub.setIsEcmLoggedIn(true);
+            fixture.detectChanges(); // runs ngOnInit -> getUsers
+            fixture.whenStable()
+              .then( () => {
+                               fixture.detectChanges();
+                            } );
+        }));
+
+        it('should get the ecm current user image from the service', () => {
+            expect(userInfoComp.ecmUser).not.toBeUndefined();
+            expect(userInfoComp.ecmUserImage).not.toBeUndefined();
+            expect(userInfoComp.ecmUserImage).toEqual('fake/url/image/for/ecm/user');
+        });
+
+        it('should get the ecm user informations from the service', () => {
+            expect(userInfoComp.ecmUser).not.toBeUndefined();
+            expect(userInfoComp.ecmUser.firstName).toEqual('fake-first-name');
+            expect(userInfoComp.ecmUser.lastName).toEqual('fake-last-name');
+        });
+
+        it('should return the anonynous user avatar image url when user does not have avatarId', async(() => {
+            fakeEcmService.userNeeded = 1;
+            userInfoComp.ngOnInit();
+            fixture.whenStable()
+                      .then( () => {
+                                     fixture.detectChanges();
+                                     let res = userInfoComp.getEcmUserDetailAvatarUrl();
+                                     expect(userInfoComp.ecmUserImage).toBeUndefined();
+                                     expect(res).toEqual(userInfoComp.anonymouseImageUrl);
+                                   });
+        }));
+    });
+
+    describe('when user is logged on bpm', () => {
+
+        beforeEach( async(() => {
+            authStub = fixture.debugElement.injector.get(AlfrescoAuthenticationService);
+            fakeBpmService = fixture.debugElement.injector.get(BpmUserService);
+
+            authStub.setIsBpmLoggedIn(true);
+            fixture.detectChanges(); // runs ngOnInit -> getUsers
+            fixture.whenStable()
+              .then( () => {
+                             fixture.detectChanges();
+                           } );
+        }));
+
+        it('should get the bpm current user image from the service', () => {
+            expect(userInfoComp.bpmUser).not.toBeUndefined();
+            expect(userInfoComp.bpmUserImage).not.toBeUndefined();
+            expect(userInfoComp.bpmUserImage).toEqual('fake-picture-id');
+        });
+
+        it('should get the bpm user informations from the service', () => {
+            expect(userInfoComp.bpmUser).not.toBeUndefined();
+            expect(userInfoComp.bpmUser.firstName).toEqual('fake-first-name');
+            expect(userInfoComp.bpmUser.lastName).toEqual('fake-last-name');
+        });
+
+        it('should return the anonynous user avatar image url when user does not have avatarId', async(() => {
+            fakeBpmService.userNeeded = 1;
+            userInfoComp.ngOnInit();
+            fixture.whenStable()
+                      .then( () => {
+                                     fixture.detectChanges();
+                                     let res = userInfoComp.getBpmUserDetailAvatarUrl();
+                                     expect(userInfoComp.bpmUserImage).toBeUndefined();
+                                     expect(res).toEqual(userInfoComp.anonymouseImageUrl);
+                                   });
+        }));
+    });
+
+    describe('when user is logged on bpm and ecm', () => {
+
+        beforeEach( async(() => {
+            authStub = fixture.debugElement.injector.get(AlfrescoAuthenticationService);
+            fakeBpmService = fixture.debugElement.injector.get(BpmUserService);
+            fakeEcmService = fixture.debugElement.injector.get(EcmUserService);
+
+            authStub.setIsBpmLoggedIn(true);
+            authStub.setIsEcmLoggedIn(true);
+            fixture.detectChanges(); // runs ngOnInit -> getUsers
+            fixture.whenStable()
+              .then( () => {
+                             fixture.detectChanges();
+                           } );
+        }));
+
+        it('should get the bpm current user image from the service', () => {
+            expect(userInfoComp.bpmUser).not.toBeUndefined();
+            expect(userInfoComp.bpmUserImage).not.toBeUndefined();
+            expect(userInfoComp.bpmUserImage).toEqual('fake-picture-id');
+            expect(userInfoComp.ecmUser).not.toBeUndefined();
+            expect(userInfoComp.ecmUserImage).not.toBeUndefined();
+            expect(userInfoComp.ecmUserImage).toEqual('fake/url/image/for/ecm/user');
+        });
+
+        it('should get the bpm user informations from the service', () => {
+            expect(userInfoComp.bpmUser).not.toBeUndefined();
+            expect(userInfoComp.bpmUser.firstName).toEqual('fake-first-name');
+            expect(userInfoComp.bpmUser.lastName).toEqual('fake-last-name');
+            expect(userInfoComp.ecmUser).not.toBeUndefined();
+            expect(userInfoComp.ecmUser.firstName).toEqual('fake-first-name');
+            expect(userInfoComp.ecmUser.lastName).toEqual('fake-last-name');
+        });
+
+        it('should return the anonynous user avatar image url when user does not have avatarId', async(() => {
+            fakeBpmService.userNeeded = 1;
+            fakeEcmService.userNeeded = 1;
+            userInfoComp.ngOnInit();
+            fixture.whenStable()
+                      .then( () => {
+                                     fixture.detectChanges();
+                                     let resBpm = userInfoComp.getBpmUserDetailAvatarUrl();
+                                     expect(userInfoComp.bpmUserImage).toBeUndefined();
+                                     expect(resBpm).toEqual(userInfoComp.anonymouseImageUrl);
+                                     let resEcm = userInfoComp.getEcmUserDetailAvatarUrl();
+                                     expect(userInfoComp.ecmUserImage).toBeUndefined();
+                                     expect(resEcm).toEqual(userInfoComp.anonymouseImageUrl);
+                                   });
+        }));
+
+        it('should return the ecm image if exists', async(() => {
+            fakeBpmService.userNeeded = 0;
+            fakeEcmService.userNeeded = 0;
+            userInfoComp.ngOnInit();
+            fixture.whenStable()
+                      .then( () => {
+                                     fixture.detectChanges();
+                                     let res = userInfoComp.getUserAvatar();
+                                     expect(userInfoComp.bpmUserImage).not.toBeUndefined();
+                                     expect(userInfoComp.ecmUserImage).not.toBeUndefined();
+                                     expect(res).toEqual(userInfoComp.ecmUserImage);
+                                   });
+        }));
+
+        it('should return the bpm image if ecm does not have it', async(() => {
+            fakeBpmService.userNeeded = 0;
+            fakeEcmService.userNeeded = 1;
+            userInfoComp.ngOnInit();
+            fixture.whenStable()
+                      .then( () => {
+                                     fixture.detectChanges();
+                                     let res = userInfoComp.getUserAvatar();
+                                     expect(userInfoComp.bpmUserImage).not.toBeUndefined();
+                                     expect(userInfoComp.ecmUserImage).toBeUndefined();
+                                     expect(res).toEqual(userInfoComp.bpmUserImage);
+                                   });
+        }));
+
+        it('should return the anonynous avatar if no user has it', async(() => {
+            fakeBpmService.userNeeded = 1;
+            fakeEcmService.userNeeded = 1;
+            userInfoComp.ngOnInit();
+            fixture.whenStable()
+                      .then( () => {
+                                     fixture.detectChanges();
+                                     let res = userInfoComp.getUserAvatar();
+                                     expect(userInfoComp.bpmUserImage).toBeUndefined();
+                                     expect(userInfoComp.ecmUserImage).toBeUndefined();
+                                     expect(res).toEqual(userInfoComp.anonymouseImageUrl);
+                                   });
+        }));
+    });
 });
diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
index 9ca5f1aa18..339ddfcc06 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.ts
@@ -33,12 +33,13 @@ declare let __moduleName: string;
 
 export class UserInfoComponent implements OnInit {
 
-    private  ecmUser: EcmUserModel;
-    private  bpmUser: BpmUserModel;
     private baseComponentPath = __moduleName.replace('components/user-info.component.js', '');
-    private  anonymouseImageUrl: string = this.baseComponentPath + 'img/anonymous.gif';
-    public   bpmUserImage: any;
-    public   ecmUserImage: any;
+
+    ecmUser: EcmUserModel;
+    bpmUser: BpmUserModel;
+    anonymouseImageUrl: string = this.baseComponentPath + 'img/anonymous.gif';
+    bpmUserImage: any;
+    ecmUserImage: any;
 
     constructor(private ecmUserService: EcmUserService,
                 private bpmUserService: BpmUserService,
@@ -46,8 +47,8 @@ export class UserInfoComponent implements OnInit {
     }
 
     ngOnInit() {
-        if (this.authService.getAlfrescoApi().ecmAuth.isLoggedIn()) {
-            this.ecmUserService.getUserInfo('-me-')
+        if ( this.authService.isEcmLoggedIn() ) {
+            this.ecmUserService.getCurrentUserInfo()
                 .subscribe(
                     (res) => {
                     this.ecmUser = <EcmUserModel> res;
@@ -55,7 +56,7 @@ export class UserInfoComponent implements OnInit {
                 }
             );
         }
-        if (this.authService.getAlfrescoApi().bpmAuth.isLoggedIn()) {
+        if ( this.authService.isBpmLoggedIn() ) {
             this.bpmUserService.getCurrentUserInfo()
                 .subscribe(
                     (res) => {
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
index 98d637a6ed..208206066b 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
@@ -37,7 +37,7 @@ export class BpmUserService {
      * @param userName - the user name
      */
     getCurrentUserInfo(): Observable<BpmUserModel> {
-       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
+       if ( this.authService.isBpmLoggedIn() ) {
             return Observable.fromPromise(this.callApiGetProfile())
                 .map(
                      (data) => <BpmUserModel> data
@@ -47,7 +47,7 @@ export class BpmUserService {
     }
 
     getCurrentUserProfileImage(): any {
-       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
+       if ( this.authService.isBpmLoggedIn() ) {
            return Observable.fromPromise(this.callApiGetProfilePicture())
                .map(
                     (data) => data
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
index 6875ee7d48..83fbd67bde 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
@@ -37,7 +37,7 @@ export class EcmUserService {
      * @param userName - the user name
      */
     getUserInfo(userName: string): Observable<EcmUserModel> {
-      if ( this.authService.getAlfrescoApi().ecmAuth.isLoggedIn() ) {
+      if ( this.authService.isEcmLoggedIn() ) {
         return Observable.fromPromise(this.callApiGetPersonInfo(userName))
             .map(
                    (data) => <EcmUserModel> data['entry']
@@ -46,6 +46,10 @@ export class EcmUserService {
       }
     }
 
+    getCurrentUserInfo() {
+        return this.getUserInfo('-me-');
+    }
+
     private callApiGetPersonInfo(userName: string, opts?: any) {
         return this.authService.getAlfrescoApi().core.peopleApi.getPerson(userName, opts);
     }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts
new file mode 100644
index 0000000000..51a6602cc6
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts
@@ -0,0 +1,89 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+// re-export for tester convenience
+export { BpmUserModel } from '../models/bpm-user.model';
+export { BpmUserService } from '../services/bpm-user.service';
+
+import { BpmUserModel } from '../models/bpm-user.model';
+import { Observable } from 'rxjs/Rx';
+
+export var fakeBpmUserNoImage: BpmUserModel = {
+    apps: {},
+    capabilities: 'fake-capability',
+    company: 'fake-company',
+    created: 'fake-create-date',
+    email: 'fakeBpm@fake.com',
+    externalId: 'fake-external-id',
+    firstName: 'fake-first-name',
+    lastName: 'fake-last-name',
+    fullname: 'fake-full-name',
+    groups: {},
+    id: 'fake-id',
+    lastUpdate: 'fake-update-date',
+    latestSyncTimeStamp: 'fake-timestamp',
+    password: 'fake-password',
+    pictureId: undefined,
+    status: 'fake-status',
+    tenantId: 'fake-tenant-id',
+    tenantName: 'fake-tenant-name',
+    tenantPictureId: 'fake-tenant-picture-id',
+    type: 'fake-type'
+};
+
+export var fakeBpmUser: BpmUserModel = {
+    apps: {},
+    capabilities: 'fake-capability',
+    company: 'fake-company',
+    created: 'fake-create-date',
+    email: 'fakeBpm@fake.com',
+    externalId: 'fake-external-id',
+    firstName: 'fake-first-name',
+    lastName: 'fake-last-name',
+    fullname: 'fake-full-name',
+    groups: {},
+    id: 'fake-id',
+    lastUpdate: 'fake-update-date',
+    latestSyncTimeStamp: 'fake-timestamp',
+    password: 'fake-password',
+    pictureId: 'fake-picture-id',
+    status: 'fake-status',
+    tenantId: 'fake-tenant-id',
+    tenantName: 'fake-tenant-name',
+    tenantPictureId: 'fake-tenant-picture-id',
+    type: 'fake-type'
+};
+
+export class FakeBpmUserService {
+
+  lastPromise: Observable<BpmUserModel>;
+  public userNeeded = 0;
+  usersList = [fakeBpmUser, fakeBpmUserNoImage];
+
+  getUserInfo(userName: string) {
+    return this.lastPromise = Observable.of(this.usersList[this.userNeeded]);
+  };
+
+  getCurrentUserInfo() {
+    return this.getUserInfo('fake-id');
+  };
+
+  getCurrentUserProfileImage() {
+      return this.usersList[this.userNeeded].pictureId;
+  };
+
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts
new file mode 100644
index 0000000000..0ee8694ede
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts
@@ -0,0 +1,99 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
+
+// re-export for tester convenience
+export { EcmUserModel } from '../models/ecm-user.model';
+export { EcmUserService } from '../services/ecm-user.service';
+
+import { EcmUserModel } from '../models/ecm-user.model';
+import { EcmCompanyModel } from '../models/ecm-company.model';
+import { Observable } from 'rxjs/Rx';
+
+export var fakeEcmCompany: EcmCompanyModel = {
+  organization: 'company-fake-name',
+  address1: 'fake-address-1',
+  address2: 'fake-address-2',
+  address3: 'fake-address-3',
+  postcode: 'fAk1',
+  telephone: '00000000',
+  fax: '11111111',
+  email: 'fakeCompany@fake.com'
+};
+
+export var fakeEcmUserNoImage: EcmUserModel = {
+    id:  'fake-id',
+    firstName:  'fake-first-name',
+    lastName:  'fake-last-name',
+    description:  'i am a fake user for test',
+    avatarId: undefined,
+    email:  'fakeEcm@ecmUser.com',
+    skypeId:  'fake-skype-id',
+    googleId:  'fake-googleId-id',
+    instantMessageId:  'fake-instantMessageId-id',
+    company: fakeEcmCompany,
+    jobTitle:  'test job',
+    location:  'fake location',
+    mobile:  '000000000',
+    telephone:  '11111111',
+    statusUpdatedAt:  'fake-date',
+    userStatus:  'active',
+    enabled: true,
+    emailNotificationsEnabled: true
+};
+
+export var fakeEcmUser: EcmUserModel = {
+    id:  'fake-id',
+    firstName:  'fake-first-name',
+    lastName:  'fake-last-name',
+    description:  'i am a fake user for test',
+    avatarId:  'fake-avatar-id',
+    email:  'fakeEcm@ecmUser.com',
+    skypeId:  'fake-skype-id',
+    googleId:  'fake-googleId-id',
+    instantMessageId:  'fake-instantMessageId-id',
+    company: fakeEcmCompany,
+    jobTitle:  'test job',
+    location:  'fake location',
+    mobile:  '000000000',
+    telephone:  '11111111',
+    statusUpdatedAt:  'fake-date',
+    userStatus:  'active',
+    enabled: true,
+    emailNotificationsEnabled: true
+};
+
+export class FakeEcmUserService {
+
+  lastPromise: Observable<EcmUserModel>;
+  public userNeeded = 0;
+  usersList = [fakeEcmUser, fakeEcmUserNoImage];
+
+  getUserInfo(userName: string) {
+    return this.lastPromise = Observable.of(this.usersList[this.userNeeded]);
+  };
+
+  getCurrentUserInfo() {
+    return this.getUserInfo('fake-id');
+  };
+
+  getCurrentUserProfileImageUrl(avatarId: string) {
+    if ( avatarId ) {
+      return 'fake/url/image/for/ecm/user';
+    }
+  };
+
+}

From 0b7f3cc9a6495b427e7932465cf11f490ea645cb Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 30 Sep 2016 03:47:49 +0100
Subject: [PATCH 15/26] Added unit tests for services

---
 .../src/services/bpm-user.service.spec.ts     | 144 +++++++++++---
 .../src/services/bpm-user.service.ts          |   4 +-
 .../src/services/ecm-user.service.spec.ts     | 184 ++++++++++++++----
 .../src/services/ecm-user.service.ts          |   2 +-
 4 files changed, 271 insertions(+), 63 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
index ab002e9957..a9586bad3d 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
@@ -14,35 +14,133 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-// import { UserInfoComponent } from '../src/userinfo.component';
 
-/*
-describe('Bpm User Service', () => {
+import { BpmUserService } from '../services/bpm-user.service';
+import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
+import { TestBed, async, inject } from '@angular/core/testing';
+import { BpmUserModel } from '../models/bpm-user.model';
 
-  beforeEachProviders(() => {
-      return [
-          HTTP_PROVIDERS,
-          AlfrescoSettingsService,
-          AlfrescoAuthenticationService,
-          WidgetVisibilityService
-      ];
-  });
+export var fakeBpmUser: BpmUserModel = {
+    apps: {},
+    capabilities: 'fake-capability',
+    company: 'fake-company',
+    created: 'fake-create-date',
+    email: 'fakeBpm@fake.com',
+    externalId: 'fake-external-id',
+    firstName: 'fake-first-name',
+    lastName: 'fake-last-name',
+    fullname: 'fake-full-name',
+    groups: {},
+    id: 'fake-id',
+    lastUpdate: 'fake-update-date',
+    latestSyncTimeStamp: 'fake-timestamp',
+    password: 'fake-password',
+    pictureId: 'fake-picture-id',
+    status: 'fake-status',
+    tenantId: 'fake-tenant-id',
+    tenantName: 'fake-tenant-name',
+    tenantPictureId: 'fake-tenant-picture-id',
+    type: 'fake-type'
+};
 
-  beforeEach(
-      inject([WidgetVisibilityService], (activitiService: WidgetVisibilityService) => {
-              jasmine.Ajax.install();
-              service = activitiService;
-              })
-  );
+class StubAuthentication {
+  isEcmConnected: boolean;
+  isBpmConnected: boolean;
+  setIsEcmLoggedIn(logged: boolean) { this.isEcmConnected = logged; };
+  setIsBpmLoggedIn(logged: boolean) { this.isBpmConnected = logged; };
+  isEcmLoggedIn() { return this.isEcmConnected; };
+  isBpmLoggedIn() { return this.isBpmConnected; };
+  callApiGetPersonInfo() { return Promise.resolve(fakeEcmUser); };
+};
 
-  afterEach(() => {
-      jasmine.Ajax.uninstall();
-  });
+describe('Bpm User service', () => {
 
+    beforeEach( async(() => {
+      TestBed.configureTestingModule({
+        providers: [ BpmUserService,
+          { provide: AlfrescoAuthenticationService, useClass: StubAuthentication }
+        ]
+      })
+      .compileComponents();
+    }));
 
-  it('should be able to get current user information', () => {
+    it('can instantiate service when inject service',
+        inject([BpmUserService], (service: BpmUserService) => {
+          expect(service instanceof BpmUserService).toBe(true);
+    }));
 
-  });
+    it('can instantiate service with authorization', inject([AlfrescoAuthenticationService],
+                                                        (auth: AlfrescoAuthenticationService) => {
+      expect(auth).not.toBeNull('authorization should be provided');
+      let service = new BpmUserService(auth, null);
+      expect(service instanceof BpmUserService).toBe(true, 'new service should be ok');
+    }));
 
+    describe('when user is logged in', () => {
+        let service: BpmUserService;
+        let authServiceForTest: AlfrescoAuthenticationService;
+
+        beforeEach(
+            inject(
+                [AlfrescoAuthenticationService ],
+                ( authService: AlfrescoAuthenticationService ) => {
+          authServiceForTest = authService;
+          service = new BpmUserService(authService);
+          spyOn(authServiceForTest, 'isBpmLoggedIn').and.returnValue(true);
+        }));
+
+        it('should be able to retrieve current user info', (done) => {
+          spyOn(service, 'callApiGetProfile').and.returnValue(Promise.resolve(fakeBpmUser));
+          service.getCurrentUserInfo().subscribe(
+                                        (user) => {
+                                                   expect(user).not.toBeUndefined();
+                                                   expect(user.firstName).toEqual('fake-first-name');
+                                                   expect(user.lastName).toEqual('fake-last-name');
+                                                   expect(user.email).toEqual('fakeBpm@fake.com');
+                                                   done();
+                                                 });
+        });
+
+        it('should retrieve current logged user information via js api', () => {
+          spyOn(service, 'callApiGetProfile');
+          service.getCurrentUserInfo();
+          expect(service.callApiGetProfile).toHaveBeenCalled();
+        });
+
+        it('should retrieve avatar url for current user', (done) => {
+          spyOn(service, 'callApiGetProfilePicture').and.returnValue(Promise.resolve('fake/img/path'));
+          service.getCurrentUserProfileImage().subscribe(
+                                        (path) => {
+                                                   expect(path).not.toBeUndefined();
+                                                   expect(path).toEqual('fake/img/path');
+                                                   done();
+                                                 });
+        });
+    });
+
+    describe('when user is not logged in', () => {
+        let service: BpmUserService;
+        let authServiceForTest: AlfrescoAuthenticationService;
+
+        beforeEach(
+            inject(
+                [AlfrescoAuthenticationService],
+                (authService: AlfrescoAuthenticationService) => {
+          authServiceForTest = authService;
+          service = new BpmUserService(authService);
+          spyOn(authServiceForTest, 'isBpmLoggedIn').and.returnValue(false);
+        }));
+
+        it('should not retrieve the user information', () => {
+          spyOn(service, 'callApiGetProfile');
+          service.getCurrentUserInfo();
+          expect(service.callApiGetProfile).not.toHaveBeenCalled();
+        });
+
+        it('should not retrieve the user avatar', () => {
+          spyOn(service, 'callApiGetProfilePicture');
+          service.getCurrentUserInfo();
+          expect(service.callApiGetProfilePicture).not.toHaveBeenCalled();
+        });
+    });
 });
-*/
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
index 208206066b..9f2c5626dd 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
@@ -59,14 +59,14 @@ export class BpmUserService {
     /**
      * Call js api to get current user profile picture
      */
-    private callApiGetProfilePicture() {
+    callApiGetProfilePicture() {
         return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
     }
 
     /**
      * Call js api to get current user information
      */
-    private callApiGetProfile() {
+    callApiGetProfile() {
         return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
     }
 
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
index 5bc6a53e0f..871f26b86a 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
@@ -14,56 +14,166 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-/*
-// import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfresco-core';
-import { EcmUserService } from './ecm-user.service';
-import { ReflectiveInjector } from '@angular/core';
-import { EcmUserModel } from '../models/ecm-user.model';
 
-declare var AlfrescoApi: any;
-declare let jasmine: any;
+import { EcmUserService } from '../services/ecm-user.service';
+import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfresco-core';
+import { TestBed, async, inject } from '@angular/core/testing';
+import { EcmUserModel } from '../models/ecm-user.model';
+import { EcmCompanyModel } from '../models/ecm-company.model';
+
+export var fakeEcmCompany: EcmCompanyModel = {
+  organization: 'company-fake-name',
+  address1: 'fake-address-1',
+  address2: 'fake-address-2',
+  address3: 'fake-address-3',
+  postcode: 'fAk1',
+  telephone: '00000000',
+  fax: '11111111',
+  email: 'fakeCompany@fake.com'
+};
+
+export var fakeEcmUser: EcmUserModel = {
+    id:  'fake-id',
+    firstName:  'fake-first-name',
+    lastName:  'fake-last-name',
+    description:  'i am a fake user for test',
+    avatarId:  'fake-avatar-id',
+    email:  'fakeEcm@ecmUser.com',
+    skypeId:  'fake-skype-id',
+    googleId:  'fake-googleId-id',
+    instantMessageId:  'fake-instantMessageId-id',
+    company: fakeEcmCompany,
+    jobTitle:  'test job',
+    location:  'fake location',
+    mobile:  '000000000',
+    telephone:  '11111111',
+    statusUpdatedAt:  'fake-date',
+    userStatus:  'active',
+    enabled: true,
+    emailNotificationsEnabled: true
+};
+
+class StubAuthentication {
+  isEcmConnected: boolean;
+  isBpmConnected: boolean;
+  setIsEcmLoggedIn(logged: boolean) { this.isEcmConnected = logged; };
+  setIsBpmLoggedIn(logged: boolean) { this.isBpmConnected = logged; };
+  isEcmLoggedIn() { return this.isEcmConnected; };
+  isBpmLoggedIn() { return this.isBpmConnected; };
+  callApiGetPersonInfo() { return Promise.resolve(fakeEcmUser); };
+};
+
+class StubAlfrescoContentService {
+    getContentUrl() { return 'fake/url/image/for/ecm/user'; } ;
+}
 
 describe('Ecm User service', () => {
 
-    let injector;
-    let ecmUserService: EcmUserService;
-    // let contentService: AlfrescoContentService;
-    // let authService: AlfrescoAuthenticationService;
+    beforeEach( async(() => {
+      TestBed.configureTestingModule({
+        providers: [ EcmUserService,
+          { provide: AlfrescoAuthenticationService, useClass: StubAuthentication },
+          { provide: AlfrescoContentService, useClass: StubAlfrescoContentService }
+        ]
+      })
+      .compileComponents();
+    }));
 
-    beforeEach(() => {
+    it('can instantiate service when inject service',
+        inject([EcmUserService], (service: EcmUserService) => {
+          expect(service instanceof EcmUserService).toBe(true);
+    }));
 
-        injector = ReflectiveInjector.resolveAndCreate([
-            EcmUserService
-        ]);
+    it('can instantiate service with authorization', inject([AlfrescoAuthenticationService],
+                                                        (auth: AlfrescoAuthenticationService) => {
+      expect(auth).not.toBeNull('authorization should be provided');
+      let service = new EcmUserService(auth, null);
+      expect(service instanceof EcmUserService).toBe(true, 'new service should be ok');
+    }));
 
-        // contentService = injector.get(AlfrescoContentService);
-        // authService = injector.get(AlfrescoAuthenticationService);
-        ecmUserService = injector.get(EcmUserService);
+    it('can instantiate service with content service', inject([AlfrescoContentService],
+                                                        (content: AlfrescoContentService) => {
+      expect(content).not.toBeNull('contentService should be provided');
+      let service = new EcmUserService(null, content);
+      expect(service instanceof EcmUserService).toBe(true, 'new service should be ok');
+    }));
 
-        jasmine.Ajax.install();
-    });
+    describe('when user is logged in', () => {
+        let service: EcmUserService;
+        let authServiceForTest: AlfrescoAuthenticationService;
+        let contentServiceForTest: AlfrescoContentService;
 
-    afterEach(() => {
-        jasmine.Ajax.uninstall();
-    });
+        beforeEach(
+            inject(
+                [AlfrescoAuthenticationService, AlfrescoContentService],
+                (authService: AlfrescoAuthenticationService, content: AlfrescoContentService) => {
+          authServiceForTest = authService;
+          contentServiceForTest = content;
+          service = new EcmUserService(authService, content);
+          spyOn(authServiceForTest, 'isEcmLoggedIn').and.returnValue(true);
+        }));
 
-    it('should be able', (done) => {
-        let authService = new AlfrescoAuthenticationService();
-        spyOn(authService, )
-        ecmUserService.getUserInfo('fake-user').subscribe((res) => {
-            expect(res).not.toBeUndefined();
-            expect(res).toEqual(jasmine.any(EcmUserModel));
-            expect(res.firstName).toEqual('fake-user-response');
-            expect(res.email).toEqual('fake@email.com');
-            done();
+        it('should be able to retrieve current user info', (done) => {
+          let userJsApiResponse = {entry: fakeEcmUser};
+          spyOn(service, 'callApiGetPersonInfo').and.returnValue(Promise.resolve(userJsApiResponse));
+          service.getCurrentUserInfo().subscribe(
+                                        (user) => {
+                                                   expect(user).not.toBeUndefined();
+                                                   expect(user.firstName).toEqual('fake-first-name');
+                                                   expect(user.lastName).toEqual('fake-last-name');
+                                                   expect(user.email).toEqual('fakeEcm@ecmUser.com');
+                                                   done();
+                                                 });
         });
 
-        jasmine.Ajax.requests.mostRecent().respondWith({
-            'status': 201,
-            contentType: 'application/json',
-            responseText: JSON.stringify({'entry': {'firstName': 'fake-user-response', 'id': 'fake@email.com'}})
+        it('should retrieve current logged user information', () => {
+          spyOn(service, 'getUserInfo');
+          spyOn(service, 'callApiGetPersonInfo').and.callThrough();
+          service.getCurrentUserInfo();
+          expect(service.getUserInfo).toHaveBeenCalledWith('-me-');
+        });
+
+        it('should retrieve avatar url for current user', () => {
+          spyOn(contentServiceForTest, 'getContentUrl').and.returnValue('fake/url/image/for/ecm/user');
+          let urlRs = service.getCurrentUserProfileImageUrl('fake-avatar-id');
+
+          expect(urlRs).toEqual('fake/url/image/for/ecm/user');
+        });
+
+        it('should not call content service without avatar id', () => {
+          spyOn(contentServiceForTest, 'getContentUrl').and.callThrough();
+          let urlRs = service.getCurrentUserProfileImageUrl();
+          expect(urlRs).toBeUndefined();
+          expect(contentServiceForTest.getContentUrl).not.toHaveBeenCalled();
+        });
+
+        it('should build the body for the content service', () => {
+          spyOn(contentServiceForTest, 'getContentUrl').and.callThrough();
+          let urlRs = service.getCurrentUserProfileImageUrl('fake-avatar-id');
+          expect(urlRs).not.toBeUndefined();
+          expect(contentServiceForTest.getContentUrl).toHaveBeenCalledWith( {entry: {id: 'fake-avatar-id'} });
         });
     });
 
+    describe('when user is not logged in', () => {
+        let service: EcmUserService;
+        let authServiceForTest: AlfrescoAuthenticationService;
+        let contentServiceForTest: AlfrescoContentService;
+
+        beforeEach(
+            inject(
+                [AlfrescoAuthenticationService, AlfrescoContentService],
+                (authService: AlfrescoAuthenticationService, content: AlfrescoContentService) => {
+          authServiceForTest = authService;
+          contentServiceForTest = content;
+          service = new EcmUserService(authService, content);
+          spyOn(authServiceForTest, 'isEcmLoggedIn').and.returnValue(false);
+        }));
+
+        it('should not retrieve the user information', () => {
+          spyOn(service, 'callApiGetPersonInfo');
+          service.getCurrentUserInfo();
+          expect(service.callApiGetPersonInfo).not.toHaveBeenCalled();
+        });
+    });
 });
-*/
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
index 83fbd67bde..1175af0f1a 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.ts
@@ -50,7 +50,7 @@ export class EcmUserService {
         return this.getUserInfo('-me-');
     }
 
-    private callApiGetPersonInfo(userName: string, opts?: any) {
+    callApiGetPersonInfo(userName: string, opts?: any) {
         return this.authService.getAlfrescoApi().core.peopleApi.getPerson(userName, opts);
     }
 

From 0635b652d205a89745b7ed0c87957f7aa3e2f138 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Fri, 30 Sep 2016 10:29:23 +0100
Subject: [PATCH 16/26] fixed build errors

---
 .../src/services/bpm-user.service.spec.ts                     | 4 ++--
 .../src/services/ecm-user.service.spec.ts                     | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
index a9586bad3d..b9655e6951 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
@@ -50,7 +50,7 @@ class StubAuthentication {
   setIsBpmLoggedIn(logged: boolean) { this.isBpmConnected = logged; };
   isEcmLoggedIn() { return this.isEcmConnected; };
   isBpmLoggedIn() { return this.isBpmConnected; };
-  callApiGetPersonInfo() { return Promise.resolve(fakeEcmUser); };
+  callApiGetPersonInfo() { return Promise.resolve(fakeBpmUser); };
 };
 
 describe('Bpm User service', () => {
@@ -72,7 +72,7 @@ describe('Bpm User service', () => {
     it('can instantiate service with authorization', inject([AlfrescoAuthenticationService],
                                                         (auth: AlfrescoAuthenticationService) => {
       expect(auth).not.toBeNull('authorization should be provided');
-      let service = new BpmUserService(auth, null);
+      let service = new BpmUserService(auth);
       expect(service instanceof BpmUserService).toBe(true, 'new service should be ok');
     }));
 
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
index 871f26b86a..0677818dfa 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
@@ -142,7 +142,7 @@ describe('Ecm User service', () => {
 
         it('should not call content service without avatar id', () => {
           spyOn(contentServiceForTest, 'getContentUrl').and.callThrough();
-          let urlRs = service.getCurrentUserProfileImageUrl();
+          let urlRs = service.getCurrentUserProfileImageUrl(undefined);
           expect(urlRs).toBeUndefined();
           expect(contentServiceForTest.getContentUrl).not.toHaveBeenCalled();
         });

From b5a944219eb4c5ced2e396c54cf569236cad3736 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 3 Oct 2016 10:21:17 +0100
Subject: [PATCH 17/26] remove wrong pushed folder

---
 .../ng2-alfresco-userinfo-old/.editorconfig   |  23 ---
 .../ng2-alfresco-userinfo-old/.gitignore      |  13 --
 .../ng2-alfresco-userinfo-old/.travis.yml     |   8 --
 .../ng2-alfresco-userinfo-old/LICENSE         |  13 --
 .../ng2-alfresco-userinfo-old/README.md       |  73 ----------
 .../demo/.editorconfig                        |  10 --
 .../ng2-alfresco-userinfo-old/demo/.gitignore |   5 -
 .../ng2-alfresco-userinfo-old/demo/README.md  |  19 ---
 .../ng2-alfresco-userinfo-old/demo/index.html |  71 ----------
 .../demo/package.json                         |  89 ------------
 .../demo/src/main.ts                          |  95 -------------
 .../demo/systemjs.config.js                   |  56 --------
 .../demo/tsconfig.json                        |  33 -----
 .../demo/tslint.json                          | 124 -----------------
 .../demo/typings.json                         |   7 -
 .../ng2-alfresco-userinfo-old/index.ts        |  58 --------
 .../karma-test-shim.js                        | 128 -----------------
 .../ng2-alfresco-userinfo-old/karma.conf.js   | 131 ------------------
 .../ng2-alfresco-userinfo-old/package.json    |  94 -------------
 .../src/components/user-info.component.css    |  53 -------
 .../src/components/user-info.component.html   |  63 ---------
 .../components/user-info.component.spec.ts    |  25 ----
 .../src/components/user-info.component.ts     |  93 -------------
 .../src/i18n/en.json                          |  24 ----
 .../src/i18n/it.json                          |  24 ----
 .../src/img/anonymous.gif                     | Bin 1765 -> 0 bytes
 .../src/models/bpm-user.model.ts              |  39 ------
 .../src/models/ecm-company.model.ts           |  27 ----
 .../src/models/ecm-user.model.ts              |  39 ------
 .../src/services/bpm-user.service.ts          |  75 ----------
 .../src/services/ecm-user.service.ts          |  72 ----------
 .../ng2-alfresco-userinfo-old/tsconfig.json   |  26 ----
 .../ng2-alfresco-userinfo-old/tslint.json     | 121 ----------------
 .../ng2-alfresco-userinfo-old/typings.json    |   7 -
 34 files changed, 1738 deletions(-)
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/.editorconfig
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/.gitignore
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/.travis.yml
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/LICENSE
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/README.md
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/.editorconfig
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/README.md
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/index.html
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/package.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/systemjs.config.js
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/tsconfig.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/demo/typings.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/index.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/karma.conf.js
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/package.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/img/anonymous.gif
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/tsconfig.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/tslint.json
 delete mode 100644 ng2-components/ng2-alfresco-userinfo-old/typings.json

diff --git a/ng2-components/ng2-alfresco-userinfo-old/.editorconfig b/ng2-components/ng2-alfresco-userinfo-old/.editorconfig
deleted file mode 100644
index 75a2477db7..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/.editorconfig
+++ /dev/null
@@ -1,23 +0,0 @@
-# http://editorconfig.org
-
-root = true
-
-[*]
-charset = utf-8
-indent_style = space
-indent_size = 4
-end_of_line = lf
-insert_final_newline = true
-trim_trailing_whitespace = true
-
-[package.json]
-indent_style = space
-indent_size = 2
-
-[karma.conf.js]
-indent_style = space
-indent_size = 2
-
-[*.md]
-insert_final_newline = false
-trim_trailing_whitespace = false
diff --git a/ng2-components/ng2-alfresco-userinfo-old/.gitignore b/ng2-components/ng2-alfresco-userinfo-old/.gitignore
deleted file mode 100644
index 3bea8a0c07..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/.gitignore
+++ /dev/null
@@ -1,13 +0,0 @@
-npm-debug.log
-node_modules
-jspm_packages
-.idea
-typings
-coverage
-src/**/*.js
-src/**/*.js.map
-src/**/*.d.ts
-demo/**/*.js
-demo/**/*.js.map
-demo/**/*.d.ts
-!systemjs.config.js
diff --git a/ng2-components/ng2-alfresco-userinfo-old/.travis.yml b/ng2-components/ng2-alfresco-userinfo-old/.travis.yml
deleted file mode 100644
index 781e6204e8..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/.travis.yml
+++ /dev/null
@@ -1,8 +0,0 @@
-language: node_js
-node_js:
-  - v5
-  - v4
-install: npm install
-sudo: false
-after_success:
-  npm run coverage
diff --git a/ng2-components/ng2-alfresco-userinfo-old/LICENSE b/ng2-components/ng2-alfresco-userinfo-old/LICENSE
deleted file mode 100644
index bfd4a66b0c..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/LICENSE
+++ /dev/null
@@ -1,13 +0,0 @@
-Copyright 2016 vito albano <vito.albano@alfresco.com>
-
-Licensed 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.
diff --git a/ng2-components/ng2-alfresco-userinfo-old/README.md b/ng2-components/ng2-alfresco-userinfo-old/README.md
deleted file mode 100644
index f100be7287..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/README.md
+++ /dev/null
@@ -1,73 +0,0 @@
-# Alfresco User Info Component for Angular 2
-This component will show the user information for ECM and BPM
-
-
-## Prerequisites
-
-Before you start using this development framework, make sure you have installed all required software and done all the
-necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
-
-## Installation
-
-```bash
-npm install ng2-alfresco-userinfo --save
-```
-## Dependencies
-
-Add the following dependency to your index.html:
-```html
-<script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
-```
-	
-You must separately install the following libraries for your application:
-	
-- [ng2-translate](https://github.com/ocombe/ng2-translate)
-- [ng2-alfresco-core](https://www.npmjs.com/package/ng2-alfresco-core)
-
-```sh
-npm install --save ng2-translate ng2-alfresco-core
-```
-	
-#### Material Design Lite
-
-The style of this component is based on [material design](https://getmdl.io/), so if you want to visualize it correctly you have to add the material
-design dependency to your project:
-
-```sh
-npm install --save material-design-icons material-design-lite
-```
-
-Also make sure you include these dependencies in your `index.html` file:
-
-```html
-<!-- Google Material Design Lite -->
-<link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
-<script src="node_modules/material-design-lite/material.min.js"></script>
-<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-```
-	
-## Example
-
-```html
-<ng2-alfresco-userinfo></ng2-alfresco-userinfo>
-```
-This will show a round icon with user and on click some user information are showed.
-If user is logged in with ECM and BPM the ECM image will be showed.
-
-## NPM scripts
-
-| Command | Description |
-| --- | --- |
-| npm run build | Build component |
-| npm run build:w | Build component and keep watching the changes |
-| npm run test | Run unit tests in the console |
-| npm run test-browser | Run unit tests in the browser
-| npm run coverage | Run unit tests and display code coverage report |
-
-## History
-
-For detailed changelog, check [Releases](https://github.com/alfresco/ng2-alfresco-userinfo/releases).
-
-## Contributors
-
-[Contributors](https://github.com/alfresco/ng2-alfresco-userinfo/graphs/contributors)
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/.editorconfig b/ng2-components/ng2-alfresco-userinfo-old/demo/.editorconfig
deleted file mode 100644
index 8ed330c4a2..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/.editorconfig
+++ /dev/null
@@ -1,10 +0,0 @@
-
-root = true
-
-[{src,scripts}/**.{ts,json,js}]
-end_of_line = crlf
-charset = utf-8
-trim_trailing_whitespace = true
-insert_final_newline = true
-indent_style = space
-indent_size = 4
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore b/ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore
deleted file mode 100644
index 7c04460244..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/.gitignore
+++ /dev/null
@@ -1,5 +0,0 @@
-typings/
-node_modules/
-.idea
-dist/
-!systemjs.config.js
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/README.md b/ng2-components/ng2-alfresco-userinfo-old/demo/README.md
deleted file mode 100644
index 7b59778398..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/README.md
+++ /dev/null
@@ -1,19 +0,0 @@
-# ng2-alfresco-userinfo - Demo
-
-* To install dependencies
-
-```sh
-$ npm install
-```
-
-* To provide a live demo
-
-```sh
-$ npm run start
-```
-
-* To clean npm_modules and typings folder
-
-```sh
-$ npm run clean
-```
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/index.html b/ng2-components/ng2-alfresco-userinfo-old/demo/index.html
deleted file mode 100644
index ab1420147f..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/index.html
+++ /dev/null
@@ -1,71 +0,0 @@
-<!-- DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    
-    <title>ng2-alfresco-userinfo Angular 2</title>
-    <base href="/">
-
-    <!-- Google Material Design Lite --
-    <link rel="stylesheet" href="assets/material.orange-blue.min.css">
-    <script src="node_modules/material-design-lite/material.min.js"></script>
-    <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
-
-
-    <!-- Polyfill(s) for older browsers --
-    <script src="node_modules/core-js/client/shim.min.js"></script>
-    <script src="node_modules/zone.js/dist/zone.js"></script>
-    <script src="node_modules/reflect-metadata/Reflect.js"></script>
-    <script src="node_modules/systemjs/dist/system.src.js"></script>
-
-    <!-- Additional Alfresco libraries --
-    <script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
-
-    <script src="systemjs.config.js"></script>
-    <script>
-      System.import('app').catch(function(err){ console.error(err); });
-    </script>
-  </head>
-
-  <body>
-    <my-app>
-      <div id="loader-spin" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div>
-    </my-app>
-  </body>
-
-</html -->
-
-<!DOCTYPE html>
-<html>
-<head>
-  <script>document.write('<base href="' + document.location + '" />');</script>
-  <title>NgModule Minimal</title>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="stylesheet" href="styles.css">
-
-  <!-- Polyfill(s) for older browsers -->
-  <script src="https://unpkg.com/core-js/client/shim.min.js"></script>
-
-  <script src="https://unpkg.com/zone.js@0.6.25?main=browser"></script>
-  <script src="https://unpkg.com/reflect-metadata@0.1.3"></script>
-  <script src="https://unpkg.com/systemjs@0.19.27/dist/system.src.js"></script>
-
-  <script src="systemjs.config.js"></script>
-  <script>
-      System.import('app/main.0').catch(function(err){ console.error(err); });
-    </script>
-</head>
-
-<body>
-<my-app>Loading...</my-app>
-</body>
-</html>
-
-
-<!--
-Copyright 2016 Google Inc. All Rights Reserved.
-Use of this source code is governed by an MIT-style license that
-can be found in the LICENSE file at http://angular.io/license
--->
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/package.json b/ng2-components/ng2-alfresco-userinfo-old/demo/package.json
deleted file mode 100644
index 3cc656550a..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/package.json
+++ /dev/null
@@ -1,89 +0,0 @@
-{
-  "name": "ng2-alfresco-userinfo-demo",
-  "description": "This component will show the user information for ECM and BPM - Demo",
-  "version": "0.1.0",
-  "author": "vito albano <vito.albano@alfresco.com>",
-  "scripts": {
-    "clean": "rimraf dist node_modules",
-    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist",
-    "build:w": "npm run tslint && rimraf dist && npm run watch-task",
-    "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\" ",
-    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
-    "server": "wsrv -o -l -s",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json 'src/{,**/}**.ts'",
-    "copy-dist": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src",
-    "copy-dist:w": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src -w",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "pretest": "npm run build",
-    "test": "karma start karma.conf.js --reporters mocha,coverage --single-run",
-    "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\""
-  },
-  "main": "index.js",
-  "typings": "./dist/index.d.ts",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/Alfresco/alfresco-ng2-components.git"
-  },
-  "bugs": {
-    "url": "https://github.com/Alfresco/alfresco-ng2-components/issues"
-  },
-  "license": "Apache-2.0",
-  "contributors": [
-    {
-      "name": "Vito Albano",
-      "email": "vito.albano@alfresco.com"
-    }
-  ],
-  "keywords": [
-    "ng2",
-    "angular",
-    "angular2",
-    "alfresco",
-    "demo"
-  ],
-  "dependencies": {
-    "@angular/common": "2.0.0",
-    "@angular/compiler": "2.0.0",
-    "@angular/core": "2.0.0",
-
-    "@angular/http": "2.0.0",
-    "@angular/platform-browser": "2.0.0",
-    "@angular/platform-browser-dynamic": "2.0.0",
-    "@angular/router": "3.0.0",
-    "@angular/upgrade": "2.0.0",
-    "core-js": "^2.4.1",
-    "reflect-metadata": "^0.1.3",
-    "rxjs": "5.0.0-beta.12",
-    "systemjs": "0.19.27",
-    "zone.js": "^0.6.23",
-    "ng2-translate": "2.5.0",
-    "ng2-alfresco-core": "0.3.2",
-    "material-design-icons": "2.2.3",
-    "material-design-lite": "1.2.1",
-    "ng2-alfresco-userinfo": "file:../"
-  },
-  "devDependencies": {
-    "@types/core-js": "^0.9.32",
-    "@types/jasmine": "^2.2.33",
-    "concurrently": "^2.2.0",
-    "cpx": "1.3.1",
-    "jasmine-ajax": "3.2.0",
-    "jasmine-core": "2.4.1",
-    "karma": "0.13.22",
-    "karma-chrome-launcher": "1.0.1",
-    "karma-coverage": "1.0.0",
-    "karma-jasmine": "1.0.2",
-    "karma-jasmine-ajax": "^0.1.13",
-    "karma-jasmine-html-reporter": "0.2.0",
-    "karma-mocha-reporter": "2.0.3",
-    "license-check": "1.1.5",
-    "remap-istanbul": "0.6.3",
-    "rimraf": "2.5.2",
-    "traceur": "0.0.91",
-    "tslint": "3.8.1",
-    "typescript": "^2.0.3",
-    "wsrv": "^0.1.5"
-  }
-
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts
deleted file mode 100644
index 0e50689d4d..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/src/main.ts
+++ /dev/null
@@ -1,95 +0,0 @@
-/*
-import { NgModule, Component, OnInit } from '@angular/core';
-import { UserInfoComponent } from 'ng2-alfresco-userinfo';
-import { BrowserModule } from '@angular/platform-browser';
-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-import { CoreModule,
-         AlfrescoSettingsService,
-         AlfrescoAuthenticationService } from 'ng2-alfresco-core';
-
-@Component({
-  selector: 'my-app',
-  styles: [`:host h1 { font-size:22px }`],
-  template: `<h1>TEST</h1>`
-})
-
-
-class UserInfoDemo implements OnInit {
-
-      public userToLogin: string = 'admin';
-      public password: string = 'admin';
-      public loginErrorMessage: string;
-      public providers: string = 'BPM';
-      private authenticated: boolean;
-      private token: any;
-
-      constructor(private authService: AlfrescoAuthenticationService,
-                  private settingsService: AlfrescoSettingsService) {
-      }
-
-      ngOnInit() {
-        this.settingsService.setProviders(this.providers);
-      }
-
-      attemptLogin() {
-          this.loginErrorMessage = '';
-          this.login(this.userToLogin, this.password);
-      }
-
-      logout() {
-          this.authService.logout();
-      }
-
-      login(user, password) {
-          this.settingsService.setProviders(this.providers);
-          this.authService.login(user, password).subscribe(
-              token => {
-                  console.log(token);
-                  this.token = token;
-                  this.authenticated = true;
-              },
-              error => {
-                  console.log(error);
-                  this.authenticated = false;
-                  this.loginErrorMessage = error;
-              });
-      }
-
-      isLoggedIn(): boolean {
-          return this.authService.isLoggedIn();
-      }
-
-      toggleECM(checked) {
-          if (checked && this.providers === 'BPM') {
-              this.providers = 'ALL';
-          } else if (checked) {
-              this.providers = 'ECM';
-          } else {
-              this.providers = undefined;
-          }
-      }
-
-      toggleBPM(checked) {
-          if (checked && this.providers === 'ECM') {
-              this.providers = 'ALL';
-          } else if (checked) {
-              this.providers = 'BPM';
-          } else {
-              this.providers = undefined;
-          }
-      }
-}
-
-@NgModule({
-    imports: [
-        BrowserModule,
-        CoreModule.forRoot(),
-        UserInfoComponent
-    ],
-    declarations: [ UserInfoComponent ],
-    bootstrap:    [ UserInfoComponent ]
-})
-export class AppModule { }
-
-platformBrowserDynamic().bootstrapModule(AppModule);
-*/
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/systemjs.config.js b/ng2-components/ng2-alfresco-userinfo-old/demo/systemjs.config.js
deleted file mode 100644
index ead7634f8a..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/systemjs.config.js
+++ /dev/null
@@ -1,56 +0,0 @@
-
-'use strict';
-(function(/*global*/) {
-
-  // map tells the System loader where to look for things
-  var map = {
-    app: 'dist/',
-    '@angular': 'node_modules/@angular',
-    rxjs: 'node_modules/rxjs',
-
-    'ng2-translate': 'node_modules/ng2-translate',
-    'ng2-alfresco-core': 'node_modules/ng2-alfresco-core/dist',
-
-    'ng2-alfresco-userinfo': 'node_modules/ng2-alfresco-userinfo/dist'
-  };
-
-  // packages tells the System loader how to load when no filename and/or no extension
-  var packages = {
-    app: { main: 'main.js', defaultExtension: 'js' },
-    rxjs: { defaultExtension: 'js' },
-
-    'ng2-translate': { defaultExtension: 'js' },
-    'ng2-alfresco-core': { main: 'index.js', defaultExtension: 'js' },
-
-    'ng2-alfresco-userinfo': { main: 'index.js', defaultExtension: 'js' }
-  };
-
-  var ngPackageNames = [
-    'common',
-    'compiler',
-    'core',
-    'http',
-    'platform-browser',
-    'platform-browser-dynamic',
-    'router',
-    'router-deprecated',
-    'upgrade'
-  ];
-  // Individual files (~300 requests):
-  function packIndex(pkgName) {
-    packages['@angular/' + pkgName] = { main: 'index.js', defaultExtension: 'js' };
-  }
-  // Bundled (~40 requests):
-  function packUmd(pkgName) {
-    packages['@angular/' + pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
-  }
-  // Most environments should use UMD; some (Karma) need the individual index files
-  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
-  // Add package entries for angular packages
-  ngPackageNames.forEach(setPackageConfig);
-  var config = {
-    map: map,
-    packages: packages
-  };
-  System.config(config);
-})(this);
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/tsconfig.json b/ng2-components/ng2-alfresco-userinfo-old/demo/tsconfig.json
deleted file mode 100644
index 2712940af4..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/tsconfig.json
+++ /dev/null
@@ -1,33 +0,0 @@
-/*{
-  "compilerOptions": {
-    "target": "es5",
-    "module": "system",
-    "moduleResolution": "node",
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "sourceMap": true,
-    "removeComments": true,
-    "declaration": true,
-    "outDir": "dist"
-  },
-  "exclude": [
-    "dist",
-    "node_modules",
-    "typings/main",
-    "typings/main.d.ts"
-  ]
-} */
-
-{
-  "compilerOptions": {
-    "target": "es5",
-    "module": "commonjs",
-    "moduleResolution": "node",
-    "sourceMap": true,
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "removeComments": false,
-    "noImplicitAny": true,
-    "suppressImplicitAnyIndexErrors": true
-  }
-}
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json b/ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json
deleted file mode 100644
index 8c48e76469..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/tslint.json
+++ /dev/null
@@ -1,124 +0,0 @@
-{
-  "rules": {
-    "align": [
-      true,
-      "parameters",
-      "arguments",
-      "statements"
-    ],
-    "ban": false,
-    "class-name": true,
-    "comment-format": [
-      true,
-      "check-space",
-      "check-lowercase"
-    ],
-    "curly": true,
-    "eofline": true,
-    "forin": true,
-    "indent": [
-      true,
-      "spaces"
-    ],
-    "interface-name": false,
-    "jsdoc-format": true,
-    "label-position": true,
-    "label-undefined": true,
-    "max-line-length": [
-      true,
-      140
-    ],
-    "member-ordering": [
-      true,
-      "public-before-private",
-      "static-before-instance",
-      "variables-before-functions"
-    ],
-    "no-any": false,
-    "no-arg": true,
-    "no-bitwise": true,
-    "no-conditional-assignment": true,
-    "no-consecutive-blank-lines": false,
-    "no-console": [
-      true,
-      "debug",
-      "info",
-      "time",
-      "timeEnd",
-      "trace"
-    ],
-    "no-construct": true,
-    "no-constructor-vars": false,
-    "no-debugger": true,
-    "no-duplicate-key": true,
-    "no-duplicate-variable": true,
-    "no-empty": true,
-    "no-eval": true,
-    "no-inferrable-types": false,
-    "no-internal-module": true,
-    "no-require-imports": true,
-    "no-shadowed-variable": true,
-    "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
-    "no-unreachable": true,
-    "no-unused-expression": true,
-    "no-unused-variable": true,
-    "no-use-before-declare": true,
-    "no-var-keyword": true,
-    "no-var-requires": true,
-    "object-literal-sort-keys": false,
-    "one-line": [
-      true,
-      "check-open-brace",
-      "check-catch",
-      "check-else",
-      "check-whitespace"
-    ],
-    "quotemark": [
-      true,
-      "single",
-      "avoid-escape"
-    ],
-    "radix": true,
-    "semicolon": true,
-    "switch-default": true,
-    "trailing-comma": [
-      true,
-      {
-        "multiline": "never",
-        "singleline": "never"
-      }
-    ],
-    "triple-equals": [
-      true,
-      "allow-null-check"
-    ],
-    "typedef": false,
-    "typedef-whitespace": [
-      true,
-      {
-        "call-signature": "nospace",
-        "index-signature": "nospace",
-        "parameter": "nospace",
-        "property-declaration": "nospace",
-        "variable-declaration": "nospace"
-      }
-    ],
-    "use-strict": false,
-    "variable-name": [
-      true,
-      "check-format",
-      "allow-leading-underscore",
-      "ban-keywords"
-    ],
-    "whitespace": [
-      true,
-      "check-branch",
-      "check-operator",
-      "check-separator",
-      "check-type",
-      "check-module",
-      "check-decl"
-    ]
-  }
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/demo/typings.json b/ng2-components/ng2-alfresco-userinfo-old/demo/typings.json
deleted file mode 100644
index 7e0e18568d..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/demo/typings.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-  "globalDependencies": {
-    "core-js": "registry:dt/core-js#0.0.0+20160317120654",
-    "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
-    "node": "registry:dt/node#4.0.0+20160509154515"
-  }
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/index.ts b/ng2-components/ng2-alfresco-userinfo-old/index.ts
deleted file mode 100644
index 6f5555dbda..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/index.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-import { NgModule, ModuleWithProviders } from '@angular/core';
-import { CoreModule } from 'ng2-alfresco-core';
-import { EcmUserService } from './src/services/ecm-user.service';
-import { BpmUserService } from './src/services/bpm-user.service';
-import { UserInfoComponent } from './src/components/user-info.component';
-import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
-
-export * from './src/components/user-info.component';
-export * from './src/services/bpm-user.service';
-export * from './src/services/ecm-user.service';
-
-export const USER_INFO_SERVICE: any[] = [
-    EcmUserService,
-    BpmUserService,
-    AlfrescoAuthenticationService
-];
-
-@NgModule({
-    imports: [
-        CoreModule
-    ],
-    declarations: [
-        UserInfoComponent
-    ],
-    providers: [
-        ...USER_INFO_SERVICE
-    ],
-    exports: [
-        UserInfoComponent
-    ]
-})
-export class UserInfoComponentModule {
-    static forRoot(): ModuleWithProviders {
-        return {
-            ngModule: UserInfoComponentModule,
-            providers: [
-                ...USER_INFO_SERVICE
-            ]
-        };
-    }
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js b/ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js
deleted file mode 100644
index fb1c3905f3..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/karma-test-shim.js
+++ /dev/null
@@ -1,128 +0,0 @@
-// Tun on full stack traces in errors to help debugging
-Error.stackTraceLimit = Infinity;
-
-jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
-
-__karma__.loaded = function() {};
-
-var builtPath = '/base/dist/';
-
-function isJsFile(path) {
-    return path.slice(-3) == '.js';
-}
-
-function isSpecFile(path) {
-    return /\.spec\.(.*\.)?js$/.test(path);
-}
-
-function isBuiltFile(path) {
-    return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
-}
-
-var allSpecFiles = Object.keys(window.__karma__.files)
-    .filter(isSpecFile)
-    .filter(isBuiltFile);
-
-var paths = {
-    // paths serve as alias
-    'npm:': 'base/node_modules/'
-};
-
-var map = {
-    'app': 'base/dist',
-    // angular bundles
-    '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
-    '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
-    '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.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',
-    // testing
-    '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
-    '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
-    '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
-    '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
-    '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
-    '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
-    '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
-    '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',
-
-    // other libraries
-    'rxjs': 'npm:rxjs',
-    'ng2-translate': 'npm:ng2-translate',
-
-    'alfresco-js-api': 'npm:alfresco-js-api/dist',
-    'ng2-activiti-form': 'npm:ng2-activiti-form/dist',
-    'ng2-activiti-processlist': 'npm:ng2-activiti-processlist/dist',
-    'ng2-activiti-tasklist': 'npm:ng2-activiti-tasklist/dist',
-    'ng2-alfresco-core': 'npm:ng2-alfresco-core/dist',
-    'ng2-alfresco-datatable': 'npm:ng2-alfresco-datatable/dist',
-    'ng2-alfresco-documentlist': 'npm:ng2-alfresco-documentlist/dist',
-    'ng2-alfresco-login': 'npm:ng2-alfresco-login/dist',
-    'ng2-alfresco-search': 'npm:ng2-alfresco-search/dist',
-    'ng2-alfresco-tag': 'npm:ng2-alfresco-tag/dist',
-    'ng2-alfresco-upload': 'npm:ng2-alfresco-upload/dist',
-    'ng2-alfresco-viewer': 'npm:ng2-alfresco-viewer/dist',
-    'ng2-alfresco-webscript': 'npm:ng2-alfresco-webscript/dist',
-    'ng2-alfresco-userinfo': 'npm:ng2-alfresco-userinfo/dist'
-};
-
-var packages = {
-    'app': { main: 'index.js',  defaultExtension: 'js', format: 'register' },
-    'rxjs': {  defaultExtension: 'js' },
-    'ng2-translate': { defaultExtension: 'js' },
-
-    'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
-    'ng2-activiti-form': { main: './index.js', defaultExtension: 'js'},
-    'ng2-activiti-processlist': { main: './index.js', defaultExtension: 'js'},
-    'ng2-activiti-tasklist': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-core': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-datatable': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-documentlist': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-login': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-search': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-tag': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-upload': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-viewer': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-webscript': { main: './index.js', defaultExtension: 'js'},
-    'ng2-alfresco-userinfo': { main: './index.js', defaultExtension: 'js'}
-};
-
-var config = {
-    paths: paths,
-    map: map,
-    packages: packages
-};
-
-System.config(config);
-
-System.import('app')
-    .then(initTestBed)
-    .then(initTesting);
-
-function initTestBed(){
-    return Promise.all([
-        System.import('@angular/core/testing'),
-        System.import('@angular/platform-browser-dynamic/testing')
-    ])
-    .then(function (providers) {
-        var coreTesting    = providers[0];
-        var browserTesting = providers[1];
-
-        coreTesting.TestBed.initTestEnvironment(
-            browserTesting.BrowserDynamicTestingModule,
-            browserTesting.platformBrowserDynamicTesting());
-    })
-}
-
-// Import all spec files and start karma
-function initTesting () {
-    return Promise.all(
-        allSpecFiles.map(function (moduleName) {
-            return System.import(moduleName);
-        })
-    )
-    .then(__karma__.start, __karma__.error);
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/karma.conf.js b/ng2-components/ng2-alfresco-userinfo-old/karma.conf.js
deleted file mode 100644
index c0374b25c3..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/karma.conf.js
+++ /dev/null
@@ -1,131 +0,0 @@
-'use strict';
-
-module.exports = function (config) {
-  var configuration = {
-    basePath: '.',
-
-    frameworks: ['jasmine-ajax', 'jasmine'],
-
-    files: [
-      // System.js for module loading
-      'node_modules/systemjs/dist/system.src.js',
-
-      // Polyfills
-      'node_modules/core-js/client/shim.js',
-      'node_modules/reflect-metadata/Reflect.js',
-
-      // zone.js
-      'node_modules/zone.js/dist/zone.js',
-      'node_modules/zone.js/dist/long-stack-trace-zone.js',
-      'node_modules/zone.js/dist/proxy.js',
-      'node_modules/zone.js/dist/sync-test.js',
-      'node_modules/zone.js/dist/jasmine-patch.js',
-      'node_modules/zone.js/dist/async-test.js',
-      'node_modules/zone.js/dist/fake-async-test.js',
-
-      // RxJs
-      { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
-      { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },
-
-      // Paths loaded via module imports:
-      // Angular itself
-      {pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},
-
-      'node_modules/alfresco-js-api/dist/alfresco-js-api.js',
-      {pattern: 'node_modules/ng2-translate/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/ng2-translate/**/*.js.map', included: false, watched: false},
-
-      'karma-test-shim.js',
-
-      // paths loaded via module imports
-      {pattern: 'dist/**/*.js', included: false, watched: true},
-      {pattern: 'dist/**/*.html', included: true, served: true, watched: true},
-      {pattern: 'dist/**/*.css', included: true, served: true, watched: true},
-
-      // ng2-components
-      { pattern: 'node_modules/ng2-activiti-form/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-activiti-processlist/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-activiti-tasklist/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-core/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-datatable/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-documentlist/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-login/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-search/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-tag/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-upload/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-viewer/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-webscript/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-alfresco-userinfo/dist/**/*.js', included: false, served: true, watched: false },
-
-      // paths to support debugging with source maps in dev tools
-      {pattern: 'src/**/*.ts', included: false, watched: false},
-      {pattern: 'dist/**/*.js.map', included: false, watched: false}
-    ],
-
-    exclude: [
-      'node_modules/**/*spec.js'
-    ],
-
-    // proxied base paths
-    proxies: {
-      // required for component assets fetched by Angular's compiler
-      '/src/': '/base/src/'
-    },
-
-    port: 9876,
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-    colors: true,
-
-    autoWatch: true,
-
-    browsers: ['Chrome'],
-
-    customLaunchers: {
-      Chrome_travis_ci: {
-        base: 'Chrome',
-        flags: ['--no-sandbox']
-      }
-    },
-
-    // Karma plugins loaded
-    plugins: [
-      'karma-jasmine',
-      'karma-coverage',
-      'karma-jasmine-ajax',
-      'karma-chrome-launcher',
-      'karma-mocha-reporter',
-      'karma-jasmine-html-reporter'
-    ],
-
-    // Coverage reporter generates the coverage
-    reporters: ['mocha', 'coverage', 'kjhtml'],
-
-    // Source files that you wanna generate coverage for.
-    // Do not include tests or libraries (these files will be instrumented by Istanbul)
-    preprocessors: {
-    //  'dist/**/!(*spec).js': ['coverage']
-    },
-
-    coverageReporter: {
-      dir: 'coverage/',
-      subdir: 'report',
-      reporters: [
-        {type: 'text'},
-        {type: 'json', file: 'coverage-final.json'},
-        {type: 'html'},
-        {type: 'lcov'}
-      ]
-    }
-  };
-
-  if (process.env.TRAVIS) {
-    configuration.browsers = ['Chrome_travis_ci'];
-  }
-
-  config.set(configuration)
-};
diff --git a/ng2-components/ng2-alfresco-userinfo-old/package.json b/ng2-components/ng2-alfresco-userinfo-old/package.json
deleted file mode 100644
index e7981fb168..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/package.json
+++ /dev/null
@@ -1,94 +0,0 @@
-{
-  "name": "ng2-alfresco-userinfo",
-  "description": "This component will show the user information for ECM and BPM",
-  "version": "0.1.0",
-  "author": "vito albano <vito.albano@alfresco.com>",
-  "scripts": {
-    "clean": "rimraf dist node_modules",
-    "build": "npm run tslint && rimraf dist && tsc && npm run copy-dist",
-    "build:w": "npm run tslint && rimraf dist && npm run watch-task",
-    "watch-task": "concurrently \"npm run tsc:w\"  \"npm run copy-dist:w\"  \"license-check\"",
-    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json 'src/{,**/}**.ts'",
-    "copy-dist": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src",
-    "copy-dist:w": "cpx \"./src/**/*.{html,css,json,png,jpg,gif,svg}\" ./dist/src -w",
-    "tsc": "tsc",
-    "tsc:w": "tsc -w",
-    "pretest": "npm run build",
-    "test": "karma start karma.conf.js --reporters mocha,coverage --single-run",
-    "test-browser": "npm run build && concurrently \"karma start karma.conf.js --reporters kjhtml\" \"npm run watch-task\"",
-    "posttest": "remap-istanbul -i coverage/report/coverage-final.json -o coverage/report -t html && remap-istanbul -i coverage/report/coverage-final.json -o coverage/report/coverage-final.json",
-    "coverage": "npm run test && wsrv -o -p 9875 ./coverage/report",
-    "travis": "npm link ng2-alfresco-core"
-  },
-  "main": "./dist/index.js",
-  "typings": "./dist/index.d.ts",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/Alfresco/alfresco-ng2-components.git"
-  },
-  "bugs": {
-    "url": "https://github.com/Alfresco/alfresco-ng2-components/issues"
-  },
-  "license": "Apache-2.0",
-  "contributors": [
-    {
-      "name": "Vito Albano",
-      "email": "vito.albano@alfresco.com"
-    }
-  ],
-  "keywords": [
-    "ng2",
-    "angular",
-    "angular2",
-    "alfresco"
-  ],
-  "dependencies": {
-    "@angular/common": "2.0.0",
-    "@angular/compiler": "2.0.0",
-    "@angular/core": "2.0.0",
-    "@angular/forms": "2.0.0",
-    "@angular/http": "2.0.0",
-    "@angular/platform-browser": "2.0.0",
-    "@angular/platform-browser-dynamic": "2.0.0",
-    "@angular/router": "3.0.0",
-    "@angular/upgrade": "2.0.0",
-    "core-js": "^2.4.1",
-    "reflect-metadata": "^0.1.3",
-    "rxjs": "5.0.0-beta.12",
-    "systemjs": "0.19.27",
-    "zone.js": "^0.6.23",
-    "ng2-translate": "2.5.0",
-    "ng2-alfresco-core": "0.3.2"
-  },
-  "devDependencies": {
-    "@types/core-js": "^0.9.32",
-    "@types/jasmine": "^2.2.33",
-    "concurrently": "^2.2.0",
-    "cpx": "1.3.1",
-    "jasmine-ajax": "3.2.0",
-    "jasmine-core": "2.4.1",
-    "karma": "0.13.22",
-    "karma-chrome-launcher": "1.0.1",
-    "karma-coverage": "1.0.0",
-    "karma-jasmine": "1.0.2",
-    "karma-jasmine-ajax": "^0.1.13",
-    "karma-jasmine-html-reporter": "0.2.0",
-    "karma-mocha-reporter": "2.0.3",
-    "license-check": "1.1.5",
-    "remap-istanbul": "0.6.3",
-    "rimraf": "2.5.2",
-    "traceur": "0.0.91",
-    "tslint": "3.8.1",
-    "typescript": "^2.0.2",
-    "wsrv": "^0.1.5"
-  },
-  "license-check-config": {
-    "src": [
-      "./dist/**/*.js"
-    ],
-    "path": "assets/license_header.txt",
-    "blocking": true,
-    "logInfo": false,
-    "logError": true
-  }
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css
deleted file mode 100644
index 93254d00fa..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.css
+++ /dev/null
@@ -1,53 +0,0 @@
-.profile-image {
-  text-align: center;
-  border-radius: 90%;
-  width: 40px;
-  margin-right: 0%;
-  cursor: pointer;
-  border: 1px solid #999999;
-  vertical-align: middle;
-}
-
-.button-profile {
-  display: inline-block;
-  border: 0px;
-  vertical-align: middle;
-}
-
-.detail-user-profile-list-mdl{
-    margin-right: 10px;
-}
-
-.user-profile-list-mdl{
-    max-height: 450px;
-    min-width: 450px;
-    overflow: auto;
-}
-
-.header-profile{
-    color: rgb(255,152,0);
-    margin-left: 10px;
-}
-
-hr.title-start {
-    border: 0;
-    height: 1px;
-    background: #333;
-    background-image: linear-gradient(to right, #ccc, #333, #ccc);
-}
-
-span.role-label-user{
-    font-weight: 400;
-    line-height: 1;
-    letter-spacing: 0;
-    color: rgba(0,0,0,.87);
-}
-
-.custom-role-style{
-    font-size: 14px;
-    color: #9e9e9e;
-}
-
-.truncate-long-names{
-    text-overflow: ellipsis;
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html
deleted file mode 100644
index 8c01dc7120..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.html
+++ /dev/null
@@ -1,63 +0,0 @@
-<div id="img_container">
-    <span *ngIf="ecmUser">{{ecmUser.firstName || ecmUser.lastName}}</span>
-    <span *ngIf="bpmUser">
-        {{ formatValue(bpmUser.firstName) ||
-           formatValue(bpmUser.lastName)  ||
-           formatValue(bpmUser.fullName) }}
-    </span>
-    <div class="button-profile" id="user-profile" data-automation-id="user-profile">
-                <img id="logged-user-img"
-                     [src]="getUserAvatar()"
-                     class="profile-image"/>
-    </div>
-    <div class="user-profile-list-mdl
-                mdl-menu mdl-menu--bottom-right
-                mdl-js-menu mdl-js-ripple-effect"
-                for="user-profile">
-            <ul class='detail-user-profile-list-mdl mdl-list'>
-                <div *ngIf="ecmUser">
-                    <span class="header-profile"><b>ECM</b></span>
-                    <hr class="title-start">
-                    <li class="mdl-list__item mdl-list__item--two-line">
-                        <span class="mdl-list__item-primary-content">
-                          <i class="mdl-list__item-avatar">
-                              <img id="logged-user-img"
-                                   [src]="getEcmUserDetailAvatarUrl()"
-                                   class="profile-image"/>
-                          </i>
-                          <span class="truncate-long-names">{{ecmUser.firstName}} {{ecmUser.lastName}}</span>
-                          <span class="mdl-list__item-sub-title">{{ecmUser.email}}</span>
-                        </span>
-                        <span class="mdl-list__item-secondary-content custom-role-style">
-                            <span class="role-label-user">Job Role</span>
-                            {{ecmUser.jobTitle}}
-                        </span>
-                    </li>
-                </div>
-
-                <div *ngIf="bpmUser">
-                    <span class="header-profile"><b>BPM</b></span>
-                    <hr class="title-start">
-                    <li class="mdl-list__item mdl-list__item--two-line">
-                        <span class="mdl-list__item-primary-content">
-                          <i class="mdl-list__item-avatar">
-                              <img id="logged-user-img"
-                                   [src]="getBpmUserDetailAvatarUrl()"
-                                   class="profile-image"/>
-                          </i>
-                          <span class="truncate-long-names">
-                              {{formatValue(bpmUser.firstName) }} {{ formatValue(bpmUser.lastName) }}
-                          </span>
-                          <span class="mdl-list__item-sub-title">{{bpmUser.email}}</span>
-                        </span>
-                        <span class="mdl-list__item-secondary-content custom-role-style">
-                            <span class="role-label-user">Tenant</span>
-                            {{bpmUser.tenantName}}
-                        </span>
-                    </li>
-                </div>
-            </ul>
-    </div>
-</div>
-
-
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts
deleted file mode 100644
index a91e2f2ac8..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-// import { UserInfoComponent } from '../src/userinfo.component';
-
-describe('Basic Example test ng2-alfresco-userinfo', () => {
-
-  it('Test hello world', () => {
-       expect(true).toBe(true);
-  });
-
-});
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts b/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts
deleted file mode 100644
index 5154ab5dcf..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/components/user-info.component.ts
+++ /dev/null
@@ -1,93 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-import { Component, OnInit } from '@angular/core';
-import { EcmUserModel } from './../models/ecm-user.model';
-import { BpmUserModel } from './../models/bpm-user.model';
-import { EcmUserService } from './../services/ecm-user.service';
-import { BpmUserService } from './../services/bpm-user.service';
-import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
-
-declare let __moduleName: string;
-
-@Component({
-    selector: 'ng2-alfresco-userinfo',
-    moduleId: __moduleName,
-    styleUrls: ['./userinfo.component.css'],
-    template: `<h1>HELLO</h1>`
-})
-
-export class UserInfoComponent implements OnInit {
-
-    private  ecmUser: EcmUserModel;
-    private  bpmUser: BpmUserModel;
-    private baseComponentPath = __moduleName.replace('userinfo.component.js', '');
-    private  anonymouseImageUrl: string = this.baseComponentPath + 'img/anonymous.gif';
-    public   bpmUserImage: any;
-    public   ecmUserImage: any;
-
-    constructor(private ecmUserService: EcmUserService,
-                private bpmUserService: BpmUserService,
-                public authService: AlfrescoAuthenticationService) {
-    }
-
-    ngOnInit() {
-        if (this.authService.getAlfrescoApi().ecmAuth.isLoggedIn()) {
-            this.ecmUserService.getUserInfo('-me-')
-                .subscribe(
-                    (res) => {
-                    this.ecmUser = <EcmUserModel> res;
-                    this.getEcmUserProfileImage();
-                }
-            );
-        }
-        if (this.authService.getAlfrescoApi().bpmAuth.isLoggedIn()) {
-            this.bpmUserService.getCurrentUserInfo()
-                .subscribe(
-                    (res) => {
-                    this.bpmUser = <BpmUserModel> res;
-                    this.getBpmUserProfileImage();
-                }
-            );
-        }
-    }
-
-    private getBpmUserProfileImage() {
-        this.bpmUserImage = this.bpmUserService.getCurrentUserProfileImage();
-    }
-
-    private getEcmUserProfileImage() {
-        this.ecmUserImage = this.ecmUserService.getCurrentUserProfileImageUrl(this.ecmUser.avatarId);
-    }
-
-    public getUserAvatar() {
-        return this.ecmUserImage || this.bpmUserImage ||  this.anonymouseImageUrl;
-    }
-
-    public getBpmUserDetailAvatarUrl() {
-        return this.bpmUserImage || this.anonymouseImageUrl;
-    }
-
-    public getEcmUserDetailAvatarUrl() {
-        return this.ecmUserImage || this.anonymouseImageUrl;
-    }
-
-    public formatValue(value: string) {
-        return value === 'null' ? null : value;
-    }
-
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json b/ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json
deleted file mode 100644
index 9400e18911..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/i18n/en.json
+++ /dev/null
@@ -1,24 +0,0 @@
-{
-  "FILE_UPLOAD": {
-    "BUTTON": {
-      "UPLOAD_FILE": "Upload file",
-      "UPLOAD_FOLDER": "Upload folder",
-      "CANCEL": "CANCEL"
-    },
-    "MESSAGES": {
-      "COMPLETED": "uploads complete",
-      "PROGRESS": "Upload in progress...",
-      "FOLDER_ALREADY_EXIST": "The folder {0} already exist",
-      "FOLDER_NOT_SUPPORTED": "Folder upload isn't supported by your browser"
-    },
-    "FILE_INFO": {
-      "NAME": "File name",
-      "PROGRESS": "File progress",
-      "SIZE": "File size",
-      "ACTION": "Actions"
-    },
-    "ACTION": {
-      "UNDO": "Undo"
-    }
-  }
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json b/ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json
deleted file mode 100644
index 0208da3079..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/i18n/it.json
+++ /dev/null
@@ -1,24 +0,0 @@
-{
-  "FILE_UPLOAD": {
-    "BUTTON": {
-      "UPLOAD_FILE": "Carica un file",
-      "UPLOAD_FOLDER": "Carica una cartella",
-      "CANCEL": "CANCELLA"
-    },
-    "MESSAGES": {
-      "COMPLETED": "caricamenti completati",
-      "PROGRESS": "caricamento in corso...",
-      "FOLDER_ALREADY_EXIST": "Cartella {0} già presente",
-      "FOLDER_NOT_SUPPORTED": "L' upload di cartelle non é supportato dal tuo browser"
-    },
-    "FILE_INFO": {
-      "NAME": "Nome file",
-      "PROGRESS": "Percentuale caricamento",
-      "SIZE": "Dimensione file",
-      "ACTION": "Azioni"
-    },
-    "ACTION": {
-      "UNDO": "Annulla"
-    }
-  }
-}
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/img/anonymous.gif b/ng2-components/ng2-alfresco-userinfo-old/src/img/anonymous.gif
deleted file mode 100644
index e1b58fa57dfcdfd452ec498c98b930aa905d21d6..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1765
zcmb8pizCyC0|4;vcMq|L=guW!Vi%c59pzQG$YVmt<yA6~M~lTU<bKSWjOE$#nn%cJ
z%r(ytLRfVqH?Fzpl1JWM9*4N!?@#!B{(_Gk(bm+A1b_g@kO!JOIwkKXH#Rq8lkesh
zl`bu>(9<&qUk|0_<~^#dpPrfJR`3LkEhFNwuD*UseB%E9NpnxZIwFun4Gh4>giwRA
zc0?x^01y1ne**w~537AIAf!0BrjESujDjDc-khY>t=wMO?<%F(;}2yFR74Dt%}a)P
zREJt`!8kwq<x*VdR6Whnpm1oeA?|fp+vIA?ZD)aGWvl&{p_QHe#3Xt$;|??BZYt|0
z90X7>m|RZoeK}|r3IHK##rg<YB$QM6s8R|kizul*f|il05;kz8WYBeY;i!tn&MrAA
z6#OY2%<dL-Bf%F5120EJu-}Ga;Dc`^UC6$%NMPb)Hx!tnAf%@kyQC-QLJvG!S{FiF
z*Md<S-x_DPMcS)&luPtPe;8kHpnmi$<7$IRk?Fi<uRc^aluvU_Yhhy#Q`<*?iopZo
zJzED|!ishu$aS~Pn#=wRlJ6orYMC!Ls|f1HxEW974BC}pLFLmBOf@m@e1=-o(=~#-
z))O9GJ1)weSo_1p=x<pHi?(Uk5@0403gMjwI9?F2&gpk=Rk9KPc~;4=r!YQ>zkWXR
z#*`{VI@~f{tInV0ukw<z+d>K$G*WXf9#@J?Z!6r<T}MHwb8+RwHlu`sE1|#RJ)6~o
zzS~F>2$!xjap@7u(QUCMI;#?2#}9bcnDw%MSwt8tuX$>-NEJGdr(T*AtL&uqN~#WT
z-g_QP^LsP+c=+}i&ztKwm?_}Wl%Vf);6;vy(fFPKq-Krf{zpQvQICg(?Ug@>Nx&U+
zjC*f3!1kFY4zS~t!;(qN5%NIU3H4v3)8o8SJ&}xYli-Iq9S6HVS;BT^QM6I<7xiew
zs43F&{rZ7&()90DAGOE2XC;|(F#99fIapv)+E_ML>o!h2H=U!U*6L3=``J^Qqoo7W
zf@~)ZW~T<w&5B|bA63u909!3wv+z1>7YOjSR6)Sl<vLeqs_F29#E00~5Q4J#724Hf
z2nU*_xd>9&+Nd*+aNRrksZvj^#`9rO9o8rC1d|21)u|F3inL-f#Wi}R<~|kmHN&5;
z3B)yYe%YIv8;IuZpFayGV;%0-^uB2NgFe{gg7ft_xj^TT_Y{uR${^)A3ysIpSs39&
z9ijG;m}vnKkiUg2%P?vsYQCJO@$_OV@CO0Hu)t)o;|R^??X%tO1-F=8j*)@eCsBO8
zi%eVFsxw-!Lvd0lwD|S>cPa5}M3u<4Tb}T$Ox;$^a_lM*m{i5Pu{oB{h2Ay`Po(Dx
zD#N-MNvdBGX_`Lud8}5idh^1LixlXK&^sCJ@PI-I<kZ5UstBq>Jn*VhrM|k_W5)x{
zzhbeqUP%h#MU{Oa-7EuT&#~1EiAPO=<DcPE#yPp#!)u-~HSA__SZ5^xa!byP0C8B3
zI$BBFx9SqRqJ3!}IcmkG&S@9J<RJfiz;ucB3Nj+M-nW@f#mueOFFn>nPq4Rbk@D@*
z6M~fh0C=qA2Fx`k=Mt6^izaq#br)QLk3CvAW9%+&^6yXaFr(JLRl%+P{?WF8(;BaX
zE{t!)7R`6~pLq*@-8wtlZL#g$h)*e9)U%B{XxYCXGPN_V;k|Z!l;3$33aB3vZ~j!f
z8jhOM^$Qdom4h>-B7!MgsLVCNNk__$82?`QspL*0zwl&CWb!J(Q;GX2gTXNKJLh7b
zN8^5=;xVjOqw+n`ziQf<^ritlK&M(Z8LjoT%+`GX4nZhrFaHSbxJOg`KARNhh?nMx
zGP`u#0?`@`N33T&?%+eSu$L?L=-+paXBat?0s^Lq(6>66KiD9fJaJdGPrldmp)ES9
zq5Q@w&+dWzairp+mQ9lhlYn@l$-pFQ%6Vm;W0F$S`6)^oDnz!UA}W)wZD#Nf-02yE
zSxiRiSbJrnHZpS2^QFqWDWYiJ2_&D4GxJTob6game4Rnp4-a8oK0|uY-oP;ACYJg=
zfzq$)JUSkdEEQ-FsXFl0O1;D@^(Svq!Dtb~<Z<F_a##)`|J97{F?%M3CB#gtC7TU-
zrBYd7>|zD{Xe%&8EA}t;;Z>bJpL9WgQD_~sHG5(h>mr{Irog}T$u=eqGe-Q&yn=bw
z7r-~(&JD^vmmxkz!hBa8Ik(`jlhvudkmrW!#)Y{1Gd3YvBL>qqDmh!%F}{e44g(m3
zaqT=bY?~3aCoJ(;oj;Ql3NL$?!}~e$!?~b?QkCYp)qa#vtFm`QZozZZrH&eTD*&+g
E7ZAQxl>h($

diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts b/ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts
deleted file mode 100644
index 3ee3fd7222..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/models/bpm-user.model.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-export class BpmUserModel {
-    apps: any;
-    capabilities: string;
-    company: string;
-    created: string;
-    email: string;
-    externalId: string;
-    firstName: string;
-    lastName: string;
-    fullname: string;
-    groups: any;
-    id: string;
-    lastUpdate: string;
-    latestSyncTimeStamp: string;
-    password: string;
-    pictureId: string;
-    status: string;
-    tenantId: string;
-    tenantName: string;
-    tenantPictureId: string;
-    type: string;
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts b/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts
deleted file mode 100644
index 458b6b8ed5..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-company.model.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-export class EcmCompanyModel {
-      organization: string;
-      address1: string;
-      address2: string;
-      address3: string;
-      postcode: string;
-      telephone: string;
-      fax: string;
-      email: string;
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts b/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts
deleted file mode 100644
index 08f24fbcdb..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/models/ecm-user.model.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-import { EcmCompanyModel } from './ecm-company.model';
-
-export class EcmUserModel {
-        id: string;
-        firstName: string;
-        lastName: string;
-        description: string;
-        avatarId: string;
-        email: string;
-        skypeId: string;
-        googleId: string;
-        instantMessageId: string;
-        jobTitle: string;
-        location: string;
-        company: EcmCompanyModel;
-        mobile: string;
-        telephone: string;
-        statusUpdatedAt: string;
-        userStatus: string;
-        enabled: boolean;
-        emailNotificationsEnabled: boolean;
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts
deleted file mode 100644
index 089320a264..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/services/bpm-user.service.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
-import { Injectable } from '@angular/core';
-import { Response } from '@angular/http';
-import { Observable } from 'rxjs/Rx';
-import { BpmUserModel } from '../models/bpm-user.model';
-/**
- *
- * BPMUserService retrieve all the information of an Ecm user.
- *
- * @returns {BPMUserService} .
- */
-@Injectable()
-export class BpmUserService {
-
-    constructor(private authService: AlfrescoAuthenticationService,
-                private settingService: AlfrescoSettingsService) {
-    }
-
-    /**
-     * get User Information via ECM
-     * @param userName - the user name
-     */
-    getCurrentUserInfo(): Observable<BpmUserModel> {
-       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
-            return Observable.fromPromise(this.callApiGetProfile())
-                .map(
-                     (data) => <BpmUserModel> data
-                    )
-                .catch(this.handleError);
-        }
-    }
-
-    /**
-     * get User Information via ECM
-     * @param userName - the user name
-     */
-    getCurrentUserProfileImage(): string {
-       if ( this.authService.getAlfrescoApi().bpmAuth.isLoggedIn() ) {
-            return this.settingService.getBPMApiBaseUrl() + '/api/enterprise/profile-picture';
-       }
-    }
-
-    private callApiGetProfile() {
-        return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
-    }
-    /**
-     * Throw the error
-     * @param error
-     * @returns {ErrorObservable}
-     */
-    private handleError(error: Response) {
-        // in a real world app, we may send the error to some remote logging infrastructure
-        // instead of just logging it to the console
-        console.error(error);
-        return Observable.throw(error || 'Server error');
-    }
-
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts b/ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts
deleted file mode 100644
index 6875ee7d48..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/src/services/ecm-user.service.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-/*!
- * @license
- * Copyright 2016 Alfresco Software, Ltd.
- *
- * Licensed 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.
- */
-
-import { AlfrescoAuthenticationService, AlfrescoContentService } from 'ng2-alfresco-core';
-import { Injectable } from '@angular/core';
-import { Response } from '@angular/http';
-import { Observable } from 'rxjs/Rx';
-import { EcmUserModel } from '../models/ecm-user.model';
-/**
- *
- * ECMUserService retrieve all the information of an Ecm user.
- *
- * @returns {ECMUserService} .
- */
-@Injectable()
-export class EcmUserService {
-
-    constructor(private authService: AlfrescoAuthenticationService,
-                private contentService: AlfrescoContentService) {}
-
-    /**
-     * get User Information via ECM
-     * @param userName - the user name
-     */
-    getUserInfo(userName: string): Observable<EcmUserModel> {
-      if ( this.authService.getAlfrescoApi().ecmAuth.isLoggedIn() ) {
-        return Observable.fromPromise(this.callApiGetPersonInfo(userName))
-            .map(
-                   (data) => <EcmUserModel> data['entry']
-                )
-            .catch(this.handleError);
-      }
-    }
-
-    private callApiGetPersonInfo(userName: string, opts?: any) {
-        return this.authService.getAlfrescoApi().core.peopleApi.getPerson(userName, opts);
-    }
-
-    getCurrentUserProfileImageUrl(avatarId: string) {
-       if ( avatarId ) {
-            let nodeObj = {entry: {id: avatarId}};
-            return this.contentService.getContentUrl(nodeObj);
-       }
-    }
-
-    /**
-     * Throw the error
-     * @param error
-     * @returns {ErrorObservable}
-     */
-    private handleError(error: Response) {
-        // in a real world app, we may send the error to some remote logging infrastructure
-        // instead of just logging it to the console
-        console.error(error);
-        return Observable.throw(error || 'Server error');
-    }
-
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/tsconfig.json b/ng2-components/ng2-alfresco-userinfo-old/tsconfig.json
deleted file mode 100644
index b1effea355..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/tsconfig.json
+++ /dev/null
@@ -1,26 +0,0 @@
-{
-    "compilerOptions": {
-        "target": "es5",
-        "module": "system",
-        "moduleResolution": "node",
-        "emitDecoratorMetadata": true,
-        "experimentalDecorators": true,
-        "sourceMap": true,
-        "removeComments": true,
-        "declaration": true,
-        "noLib": false,
-        "allowUnreachableCode": false,
-        "allowUnusedLabels": false,
-        "noImplicitAny": false,
-        "noImplicitReturns": false,
-        "noImplicitUseStrict": false,
-        "noFallthroughCasesInSwitch": true,
-        "outDir": "dist",
-        "types": ["core-js", "jasmine"]
-    },
-    "exclude": [
-        "demo",
-        "node_modules",
-        "dist"
-    ]
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/tslint.json b/ng2-components/ng2-alfresco-userinfo-old/tslint.json
deleted file mode 100644
index 33220e5038..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/tslint.json
+++ /dev/null
@@ -1,121 +0,0 @@
-{
-  "rules": {
-    "align": [
-      true,
-      "parameters",
-      "statements"
-    ],
-    "ban": false,
-    "class-name": true,
-    "comment-format": [
-      true,
-      "check-space"
-    ],
-    "curly": true,
-    "eofline": true,
-    "forin": true,
-    "indent": [
-      true,
-      "spaces"
-    ],
-    "interface-name": false,
-    "jsdoc-format": true,
-    "label-position": true,
-    "label-undefined": true,
-    "max-line-length": [
-      true,
-      140
-    ],
-    "member-ordering": [
-      true,
-      "static-before-instance",
-      "variables-before-functions"
-    ],
-    "no-any": false,
-    "no-arg": true,
-    "no-bitwise": false,
-    "no-conditional-assignment": true,
-    "no-consecutive-blank-lines": false,
-    "no-console": [
-      true,
-      "debug",
-      "info",
-      "time",
-      "timeEnd",
-      "trace"
-    ],
-    "no-construct": true,
-    "no-constructor-vars": false,
-    "no-debugger": true,
-    "no-duplicate-key": true,
-    "no-duplicate-variable": true,
-    "no-empty": false,
-    "no-eval": true,
-    "no-inferrable-types": false,
-    "no-internal-module": true,
-    "no-require-imports": true,
-    "no-shadowed-variable": true,
-    "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
-    "no-unreachable": true,
-    "no-unused-expression": true,
-    "no-unused-variable": true,
-    "no-use-before-declare": true,
-    "no-var-keyword": true,
-    "no-var-requires": true,
-    "object-literal-sort-keys": false,
-    "one-line": [
-      true,
-      "check-open-brace",
-      "check-catch",
-      "check-else",
-      "check-whitespace"
-    ],
-    "quotemark": [
-      true,
-      "single",
-      "avoid-escape"
-    ],
-    "radix": true,
-    "semicolon": true,
-    "switch-default": true,
-    "trailing-comma": [
-      true,
-      {
-        "multiline": "never",
-        "singleline": "never"
-      }
-    ],
-    "triple-equals": [
-      true,
-      "allow-null-check"
-    ],
-    "typedef": false,
-    "typedef-whitespace": [
-      true,
-      {
-        "call-signature": "nospace",
-        "index-signature": "nospace",
-        "parameter": "nospace",
-        "property-declaration": "nospace",
-        "variable-declaration": "nospace"
-      }
-    ],
-    "use-strict": false,
-    "variable-name": [
-      true,
-      "check-format",
-      "allow-leading-underscore",
-      "ban-keywords"
-    ],
-    "whitespace": [
-      true,
-      "check-branch",
-      "check-operator",
-      "check-separator",
-      "check-type",
-      "check-module",
-      "check-decl"
-    ]
-  }
-}
diff --git a/ng2-components/ng2-alfresco-userinfo-old/typings.json b/ng2-components/ng2-alfresco-userinfo-old/typings.json
deleted file mode 100644
index 7e0e18568d..0000000000
--- a/ng2-components/ng2-alfresco-userinfo-old/typings.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-  "globalDependencies": {
-    "core-js": "registry:dt/core-js#0.0.0+20160317120654",
-    "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
-    "node": "registry:dt/node#4.0.0+20160509154515"
-  }
-}

From 64331a3350c03a69ba1cfd131fead2180d13aedd Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 3 Oct 2016 10:21:36 +0100
Subject: [PATCH 18/26] Fix name in package.json

---
 ng2-components/ng2-alfresco-userinfo/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/package.json b/ng2-components/ng2-alfresco-userinfo/package.json
index 49787abe9d..178fcc0e01 100644
--- a/ng2-components/ng2-alfresco-userinfo/package.json
+++ b/ng2-components/ng2-alfresco-userinfo/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "ng2-alfresco-tag",
-  "description": "Alfresco tag component",
+  "name": "ng2-alfresco-userinfo",
+  "description": "Alfresco User Info component",
   "version": "0.3.2",
   "author": "Alfresco Software, Ltd.",
   "main": "./dist/index.js",

From 27003dd4c4447462aa77a170ee6ddc6688adc9c0 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 3 Oct 2016 10:58:20 +0100
Subject: [PATCH 19/26] Fixed naming for tests

---
 .../components/user-info.component.spec.ts    | 54 +++++++++----------
 .../src/services/bpm-user.service.spec.ts     |  4 +-
 .../src/services/ecm-user.service.spec.ts     |  6 +--
 .../src/testing/fake-bpm-user.service.ts      |  9 ++++
 .../src/testing/fake-ecm-user.service.ts      |  8 +++
 5 files changed, 49 insertions(+), 32 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
index b78cc8cb41..abf318c877 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.spec.ts
@@ -65,7 +65,7 @@ describe('User info component', () => {
         expect(userInfoComp.ecmUserImage).toBeUndefined();
         expect(userInfoComp.bpmUser).toBeUndefined();
         expect(userInfoComp.bpmUserImage).toBeUndefined();
-        expect(userInfoComp.anonymouseImageUrl).not.toBeUndefined();
+        expect(userInfoComp.anonymouseImageUrl).toBeDefined();
     });
 
     it('should NOT have users immediately after ngOnInit', () => {
@@ -74,7 +74,7 @@ describe('User info component', () => {
         expect(userInfoComp.ecmUserImage).toBeUndefined();
         expect(userInfoComp.bpmUser).toBeUndefined();
         expect(userInfoComp.bpmUserImage).toBeUndefined();
-        expect(userInfoComp.anonymouseImageUrl).not.toBeUndefined();
+        expect(userInfoComp.anonymouseImageUrl).toBeDefined();
     });
 
     describe('when user is logged on ecm', () => {
@@ -92,19 +92,19 @@ describe('User info component', () => {
         }));
 
         it('should get the ecm current user image from the service', () => {
-            expect(userInfoComp.ecmUser).not.toBeUndefined();
-            expect(userInfoComp.ecmUserImage).not.toBeUndefined();
+            expect(userInfoComp.ecmUser).toBeDefined();
+            expect(userInfoComp.ecmUserImage).toBeDefined();
             expect(userInfoComp.ecmUserImage).toEqual('fake/url/image/for/ecm/user');
         });
 
         it('should get the ecm user informations from the service', () => {
-            expect(userInfoComp.ecmUser).not.toBeUndefined();
+            expect(userInfoComp.ecmUser).toBeDefined();
             expect(userInfoComp.ecmUser.firstName).toEqual('fake-first-name');
             expect(userInfoComp.ecmUser.lastName).toEqual('fake-last-name');
         });
 
         it('should return the anonynous user avatar image url when user does not have avatarId', async(() => {
-            fakeEcmService.userNeeded = 1;
+            fakeEcmService.respondWithTheUserWithoutImage();
             userInfoComp.ngOnInit();
             fixture.whenStable()
                       .then( () => {
@@ -131,19 +131,19 @@ describe('User info component', () => {
         }));
 
         it('should get the bpm current user image from the service', () => {
-            expect(userInfoComp.bpmUser).not.toBeUndefined();
-            expect(userInfoComp.bpmUserImage).not.toBeUndefined();
+            expect(userInfoComp.bpmUser).toBeDefined();
+            expect(userInfoComp.bpmUserImage).toBeDefined();
             expect(userInfoComp.bpmUserImage).toEqual('fake-picture-id');
         });
 
         it('should get the bpm user informations from the service', () => {
-            expect(userInfoComp.bpmUser).not.toBeUndefined();
+            expect(userInfoComp.bpmUser).toBeDefined();
             expect(userInfoComp.bpmUser.firstName).toEqual('fake-first-name');
             expect(userInfoComp.bpmUser.lastName).toEqual('fake-last-name');
         });
 
         it('should return the anonynous user avatar image url when user does not have avatarId', async(() => {
-            fakeBpmService.userNeeded = 1;
+            fakeBpmService.respondWithTheUserWithoutImage();
             userInfoComp.ngOnInit();
             fixture.whenStable()
                       .then( () => {
@@ -172,26 +172,26 @@ describe('User info component', () => {
         }));
 
         it('should get the bpm current user image from the service', () => {
-            expect(userInfoComp.bpmUser).not.toBeUndefined();
-            expect(userInfoComp.bpmUserImage).not.toBeUndefined();
+            expect(userInfoComp.bpmUser).toBeDefined();
+            expect(userInfoComp.bpmUserImage).toBeDefined();
             expect(userInfoComp.bpmUserImage).toEqual('fake-picture-id');
-            expect(userInfoComp.ecmUser).not.toBeUndefined();
-            expect(userInfoComp.ecmUserImage).not.toBeUndefined();
+            expect(userInfoComp.ecmUser).toBeDefined();
+            expect(userInfoComp.ecmUserImage).toBeDefined();
             expect(userInfoComp.ecmUserImage).toEqual('fake/url/image/for/ecm/user');
         });
 
         it('should get the bpm user informations from the service', () => {
-            expect(userInfoComp.bpmUser).not.toBeUndefined();
+            expect(userInfoComp.bpmUser).toBeDefined();
             expect(userInfoComp.bpmUser.firstName).toEqual('fake-first-name');
             expect(userInfoComp.bpmUser.lastName).toEqual('fake-last-name');
-            expect(userInfoComp.ecmUser).not.toBeUndefined();
+            expect(userInfoComp.ecmUser).toBeDefined();
             expect(userInfoComp.ecmUser.firstName).toEqual('fake-first-name');
             expect(userInfoComp.ecmUser.lastName).toEqual('fake-last-name');
         });
 
         it('should return the anonynous user avatar image url when user does not have avatarId', async(() => {
-            fakeBpmService.userNeeded = 1;
-            fakeEcmService.userNeeded = 1;
+            fakeBpmService.respondWithTheUserWithoutImage();
+            fakeEcmService.respondWithTheUserWithoutImage();
             userInfoComp.ngOnInit();
             fixture.whenStable()
                       .then( () => {
@@ -206,36 +206,36 @@ describe('User info component', () => {
         }));
 
         it('should return the ecm image if exists', async(() => {
-            fakeBpmService.userNeeded = 0;
-            fakeEcmService.userNeeded = 0;
+            fakeBpmService.respondWithTheUserWithImage();
+            fakeEcmService.respondWithTheUserWithImage();
             userInfoComp.ngOnInit();
             fixture.whenStable()
                       .then( () => {
                                      fixture.detectChanges();
                                      let res = userInfoComp.getUserAvatar();
-                                     expect(userInfoComp.bpmUserImage).not.toBeUndefined();
-                                     expect(userInfoComp.ecmUserImage).not.toBeUndefined();
+                                     expect(userInfoComp.bpmUserImage).toBeDefined();
+                                     expect(userInfoComp.ecmUserImage).toBeDefined();
                                      expect(res).toEqual(userInfoComp.ecmUserImage);
                                    });
         }));
 
         it('should return the bpm image if ecm does not have it', async(() => {
-            fakeBpmService.userNeeded = 0;
-            fakeEcmService.userNeeded = 1;
+            fakeBpmService.respondWithTheUserWithImage();
+            fakeEcmService.respondWithTheUserWithoutImage();
             userInfoComp.ngOnInit();
             fixture.whenStable()
                       .then( () => {
                                      fixture.detectChanges();
                                      let res = userInfoComp.getUserAvatar();
-                                     expect(userInfoComp.bpmUserImage).not.toBeUndefined();
+                                     expect(userInfoComp.bpmUserImage).toBeDefined();
                                      expect(userInfoComp.ecmUserImage).toBeUndefined();
                                      expect(res).toEqual(userInfoComp.bpmUserImage);
                                    });
         }));
 
         it('should return the anonynous avatar if no user has it', async(() => {
-            fakeBpmService.userNeeded = 1;
-            fakeEcmService.userNeeded = 1;
+            fakeBpmService.respondWithTheUserWithoutImage();
+            fakeEcmService.respondWithTheUserWithoutImage();
             userInfoComp.ngOnInit();
             fixture.whenStable()
                       .then( () => {
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
index b9655e6951..8899f70daf 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.spec.ts
@@ -93,7 +93,7 @@ describe('Bpm User service', () => {
           spyOn(service, 'callApiGetProfile').and.returnValue(Promise.resolve(fakeBpmUser));
           service.getCurrentUserInfo().subscribe(
                                         (user) => {
-                                                   expect(user).not.toBeUndefined();
+                                                   expect(user).toBeDefined();
                                                    expect(user.firstName).toEqual('fake-first-name');
                                                    expect(user.lastName).toEqual('fake-last-name');
                                                    expect(user.email).toEqual('fakeBpm@fake.com');
@@ -111,7 +111,7 @@ describe('Bpm User service', () => {
           spyOn(service, 'callApiGetProfilePicture').and.returnValue(Promise.resolve('fake/img/path'));
           service.getCurrentUserProfileImage().subscribe(
                                         (path) => {
-                                                   expect(path).not.toBeUndefined();
+                                                   expect(path).toBeDefined();
                                                    expect(path).toEqual('fake/img/path');
                                                    done();
                                                  });
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
index 0677818dfa..4d88d66fe9 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/ecm-user.service.spec.ts
@@ -28,7 +28,7 @@ export var fakeEcmCompany: EcmCompanyModel = {
   address3: 'fake-address-3',
   postcode: 'fAk1',
   telephone: '00000000',
-  fax: '11111111',
+  fax: '=1111111',
   email: 'fakeCompany@fake.com'
 };
 
@@ -118,7 +118,7 @@ describe('Ecm User service', () => {
           spyOn(service, 'callApiGetPersonInfo').and.returnValue(Promise.resolve(userJsApiResponse));
           service.getCurrentUserInfo().subscribe(
                                         (user) => {
-                                                   expect(user).not.toBeUndefined();
+                                                   expect(user).toBeDefined();
                                                    expect(user.firstName).toEqual('fake-first-name');
                                                    expect(user.lastName).toEqual('fake-last-name');
                                                    expect(user.email).toEqual('fakeEcm@ecmUser.com');
@@ -150,7 +150,7 @@ describe('Ecm User service', () => {
         it('should build the body for the content service', () => {
           spyOn(contentServiceForTest, 'getContentUrl').and.callThrough();
           let urlRs = service.getCurrentUserProfileImageUrl('fake-avatar-id');
-          expect(urlRs).not.toBeUndefined();
+          expect(urlRs).toBeDefined();
           expect(contentServiceForTest.getContentUrl).toHaveBeenCalledWith( {entry: {id: 'fake-avatar-id'} });
         });
     });
diff --git a/ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts
index 51a6602cc6..b7a2f87d91 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-bpm-user.service.ts
@@ -86,4 +86,13 @@ export class FakeBpmUserService {
       return this.usersList[this.userNeeded].pictureId;
   };
 
+  respondWithTheUserWithoutImage() {
+    this.userNeeded = 1;
+  }
+
+  respondWithTheUserWithImage() {
+    this.userNeeded = 0;
+  }
+
+
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts
index 0ee8694ede..2133e780b1 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/testing/fake-ecm-user.service.ts
@@ -96,4 +96,12 @@ export class FakeEcmUserService {
     }
   };
 
+  respondWithTheUserWithoutImage() {
+    this.userNeeded = 1;
+  };
+
+  respondWithTheUserWithImage() {
+    this.userNeeded = 0;
+  };
+
 }

From ab1f65d44bd1ce75cc43b2e69acefca6b9f07d82 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 3 Oct 2016 13:07:53 +0100
Subject: [PATCH 20/26] Fixed double name when the two user log in

---
 .../src/components/user-info.component.html                     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
index 8c01dc7120..41c334ce54 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
@@ -1,6 +1,6 @@
 <div id="img_container">
     <span *ngIf="ecmUser">{{ecmUser.firstName || ecmUser.lastName}}</span>
-    <span *ngIf="bpmUser">
+    <span *ngIf="bpmUser && !ecmUser">
         {{ formatValue(bpmUser.firstName) ||
            formatValue(bpmUser.lastName)  ||
            formatValue(bpmUser.fullName) }}

From 2219047c1a4b60fd5d06cb431ff2946e28f6f50a Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 3 Oct 2016 13:41:34 +0100
Subject: [PATCH 21/26] Fixed wrong method and style a little

---
 .../src/components/user-info.component.html               | 8 ++++----
 .../src/services/bpm-user.service.ts                      | 7 ++++++-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
index 41c334ce54..5a8b50db9c 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
+++ b/ng2-components/ng2-alfresco-userinfo/src/components/user-info.component.html
@@ -16,8 +16,8 @@
                 for="user-profile">
             <ul class='detail-user-profile-list-mdl mdl-list'>
                 <div *ngIf="ecmUser">
-                    <span class="header-profile"><b>ECM</b></span>
                     <hr class="title-start">
+                    <span class="header-profile"><b>ECM</b></span>
                     <li class="mdl-list__item mdl-list__item--two-line">
                         <span class="mdl-list__item-primary-content">
                           <i class="mdl-list__item-avatar">
@@ -30,14 +30,14 @@
                         </span>
                         <span class="mdl-list__item-secondary-content custom-role-style">
                             <span class="role-label-user">Job Role</span>
-                            {{ecmUser.jobTitle}}
+                            {{ ecmUser.jobTitle ? ecmUser.jobTitle : 'N/A' }}
                         </span>
                     </li>
                 </div>
-
+                <br>
                 <div *ngIf="bpmUser">
-                    <span class="header-profile"><b>BPM</b></span>
                     <hr class="title-start">
+                    <span class="header-profile"><b>BPM</b></span>
                     <li class="mdl-list__item mdl-list__item--two-line">
                         <span class="mdl-list__item-primary-content">
                           <i class="mdl-list__item-avatar">
diff --git a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
index 9f2c5626dd..1c0dff5bce 100644
--- a/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
+++ b/ng2-components/ng2-alfresco-userinfo/src/services/bpm-user.service.ts
@@ -60,7 +60,12 @@ export class BpmUserService {
      * Call js api to get current user profile picture
      */
     callApiGetProfilePicture() {
-        return this.authService.getAlfrescoApi().activiti.profileApi.getProfile();
+        try {
+            return this.authService.getAlfrescoApi().activiti.profileApi.getProfilePicture();
+        } catch (exc) {
+            console.error(exc);
+            return null;
+        }
     }
 
     /**

From ce931fc4aa3b79157e42aee72d7bf890227017a7 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Mon, 3 Oct 2016 15:30:41 +0100
Subject: [PATCH 22/26] Added new component to shell scripts

---
 scripts/npm-build-all.sh       | 1 +
 scripts/npm-check.sh           | 3 ++-
 scripts/npm-clean.sh           | 3 ++-
 scripts/npm-link-demo-shell.sh | 4 +++-
 scripts/npm-publish.sh         | 3 ++-
 scripts/update-version.sh      | 6 ++++--
 6 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/scripts/npm-build-all.sh b/scripts/npm-build-all.sh
index 55d3310667..5767e52d7a 100755
--- a/scripts/npm-build-all.sh
+++ b/scripts/npm-build-all.sh
@@ -22,6 +22,7 @@ for PACKAGE in \
   ng2-alfresco-search \
   ng2-alfresco-tag \
   ng2-alfresco-upload \
+  ng2-alfresco-userinfo \
   ng2-alfresco-viewer \
   ng2-alfresco-webscript
 do
diff --git a/scripts/npm-check.sh b/scripts/npm-check.sh
index e98fea6553..704e3b72a4 100755
--- a/scripts/npm-check.sh
+++ b/scripts/npm-check.sh
@@ -19,7 +19,8 @@ for PACKAGE in \
   ng2-alfresco-tag \
   ng2-alfresco-upload \
   ng2-alfresco-viewer \
-  ng2-alfresco-webscript
+  ng2-alfresco-webscript \
+  ng2-alfresco-userinfo
 do
   echo "====== Check component: ${PACKAGE} ====="
   cd "$DIR/../ng2-components/${PACKAGE}"
diff --git a/scripts/npm-clean.sh b/scripts/npm-clean.sh
index 557d336dbf..eeffa98fc0 100755
--- a/scripts/npm-clean.sh
+++ b/scripts/npm-clean.sh
@@ -15,7 +15,8 @@ for PACKAGE in \
   ng2-alfresco-tag \
   ng2-alfresco-upload \
   ng2-alfresco-viewer \
-  ng2-alfresco-webscript
+  ng2-alfresco-webscript \
+  ng2-alfresco-userinfo
 do
   echo "====== clean component: ${PACKAGE} ====="
   cd "$DIR/../ng2-components/${PACKAGE}"
diff --git a/scripts/npm-link-demo-shell.sh b/scripts/npm-link-demo-shell.sh
index 3712f17a71..966f1833df 100755
--- a/scripts/npm-link-demo-shell.sh
+++ b/scripts/npm-link-demo-shell.sh
@@ -75,7 +75,8 @@ for PACKAGE in \
   ng2-alfresco-login \
   ng2-alfresco-search \
   ng2-alfresco-upload \
-  ng2-activiti-analytics
+  ng2-activiti-analytics \
+  ng2-alfresco-userinfo
 do
   DESTDIR="$DIR/../ng2-components/${PACKAGE}"
   echo "====== linking component: ${PACKAGE} ====="
@@ -102,6 +103,7 @@ for PACKAGE in \
   ng2-alfresco-upload \
   ng2-alfresco-viewer \
   ng2-alfresco-webscript \
+  ng2-alfresco-userinfo
 do
   DESTDIR="$DIR/../ng2-components/${PACKAGE}"
   echo "====== demo shell linking: ${PACKAGE} ====="
diff --git a/scripts/npm-publish.sh b/scripts/npm-publish.sh
index 8f06c4d942..8d483d2ee7 100755
--- a/scripts/npm-publish.sh
+++ b/scripts/npm-publish.sh
@@ -17,7 +17,8 @@ for PACKAGE in \
   ng2-alfresco-tag \
   ng2-alfresco-upload \
   ng2-alfresco-viewer \
-  ng2-alfresco-webscript
+  ng2-alfresco-webscript \
+  ng2-alfresco-userinfo
 do
   DESTDIR="$DIR/../ng2-components/${PACKAGE}"
   echo "====== PUBLISHING: ${DESTDIR} ====="
diff --git a/scripts/update-version.sh b/scripts/update-version.sh
index 52faaf612f..dca9b25a6b 100755
--- a/scripts/update-version.sh
+++ b/scripts/update-version.sh
@@ -27,7 +27,8 @@ for PACKAGE in \
   ng2-alfresco-tag \
   ng2-alfresco-upload \
   ng2-alfresco-viewer \
-  ng2-alfresco-webscript
+  ng2-alfresco-webscript \
+  ng2-alfresco-userinfo
 do
   DESTDIR="$DIR/../ng2-components/${PACKAGE}"
   echo "====== UPDATE VERSION of ${PACKAGE} to ${VERSION} version in all the package.json ======"
@@ -47,7 +48,8 @@ for PACKAGE in \
   ng2-alfresco-tag \
   ng2-alfresco-upload \
   ng2-alfresco-viewer \
-  ng2-alfresco-webscript
+  ng2-alfresco-webscript \
+  ng2-alfresco-userinfo
 do
   DESTDIR="$DIR/../ng2-components/${PACKAGE}"
   echo "====== UPDATE VERSION OF ${PACKAGE} to ${VERSION} version ======"

From 51beae42dc7c1c13a1eccddc52dfa83015330384 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Tue, 4 Oct 2016 13:01:32 +0100
Subject: [PATCH 23/26] Rebased branch

---
 .../ng2-alfresco-userinfo/README.md           | 376 ++----------------
 .../ng2-alfresco-userinfo/demo/.editorconfig  |  10 +
 .../ng2-alfresco-userinfo/demo/.gitignore     |   8 +-
 .../ng2-alfresco-userinfo/demo/.npmignore     |   3 +
 .../ng2-alfresco-userinfo/demo/README.md      |  20 +-
 .../ng2-alfresco-userinfo/demo/index.html     |  13 +-
 .../ng2-alfresco-userinfo/demo/package.json   |  77 ++++
 .../ng2-alfresco-userinfo/demo/src/main.ts    | 170 ++++----
 .../demo/systemjs.config.js                   |  49 +++
 .../ng2-alfresco-userinfo/demo/tsconfig.json  |  26 ++
 .../ng2-alfresco-userinfo/demo/tslint.json    | 241 ++++++-----
 .../demo/wsrv-config.json                     |   5 +
 ng2-components/update.sh                      |   3 +
 13 files changed, 447 insertions(+), 554 deletions(-)
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/.editorconfig
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/.npmignore
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/package.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
 create mode 100644 ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json

diff --git a/ng2-components/ng2-alfresco-userinfo/README.md b/ng2-components/ng2-alfresco-userinfo/README.md
index a7519e00ea..247591e3ef 100644
--- a/ng2-components/ng2-alfresco-userinfo/README.md
+++ b/ng2-components/ng2-alfresco-userinfo/README.md
@@ -1,75 +1,43 @@
-# Alfresco Tag Component for Angular 2
-<p>
-  <a title='Build Status Travis' href="https://travis-ci.org/Alfresco/alfresco-ng2-components">
-    <img src='https://travis-ci.org/Alfresco/alfresco-ng2-components.svg?branch=master'  alt='travis
-    Status' />
-  </a>
-  <a title='Build Status AppVeyor' href="https://ci.appveyor.com/project/alfresco/alfresco-ng2-components">
-    <img src='https://ci.appveyor.com/api/projects/status/github/Alfresco/alfresco-ng2-components'  alt='travis
-    Status' />
-  </a>
-  <a href='https://codecov.io/gh/Alfresco/alfresco-ng2-components'>
-    <img src='https://img.shields.io/codecov/c/github/Alfresco/alfresco-ng2-components/master.svg?maxAge=2592000' alt='Coverage Status' />
-  </a>
-  <a href='https://www.npmjs.com/package/ng2-alfresco-tag'>
-    <img src='https://img.shields.io/npm/dt/ng2-alfresco-tag.svg' alt='npm downloads' />
-  </a>
-  <a href='https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE'>
-     <img src='https://img.shields.io/hexpm/l/plug.svg' alt='license' />
-  </a>
-  <a href='https://www.alfresco.com/'>
-     <img src='https://img.shields.io/badge/style-component-green.svg?label=alfresco' alt='alfresco component' />
-  </a>
-  <a href='https://angular.io/'>
-     <img src='https://img.shields.io/badge/style-2-red.svg?label=angular' alt='angular 2' />
-  </a>
-  <a href='https://www.typescriptlang.org/docs/tutorial.html'>
-     <img src='https://img.shields.io/badge/style-lang-blue.svg?label=typescript' alt='typescript' />
-  </a>
-  <a href='https://www.alfresco.com/'>
-     <img src='https://img.shields.io/badge/style-%3E5.0.0-blue.svg?label=node%20version' alt='node version' />
-  </a>
-</p>
+# Alfresco User Info Component for Angular 2
+This component will show the user information for ECM and BPM
 
-### Node
-To correctly use this component check that on your machine is running Node version 5.0.0 or higher.
 
-## Install
+## Prerequisites
 
-```sh
-npm install --save ng2-alfresco-tag
+Before you start using this development framework, make sure you have installed all required software and done all the
+necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
+
+## Installation
+
+```bash
+npm install ng2-alfresco-userinfo --save
 ```
-
-Components included:
-
-* Alfresco Tag Component
-
-#### Dependencies
+## Dependencies
 
 Add the following dependency to your index.html:
-
 ```html
 <script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
 ```
+	
+You must separately install the following libraries for your application:
+	
+- [ng2-translate](https://github.com/ocombe/ng2-translate)
+- [ng2-alfresco-core](https://www.npmjs.com/package/ng2-alfresco-core)
 
-The following component needs to be added to your systemjs.config: 
+```sh
+npm install --save ng2-translate ng2-alfresco-core
+```
+	
+#### Material Design Lite
 
-- ng2-translate
-- ng2-alfresco-core
-
-Please refer to the following example to have an idea of how your systemjs.config should look like :
-
-https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-alfresco-tag/demo/systemjs.config.js
-
-#### Style
-The style of this component is based on material design, so if you want to visualize it correctly you have to add the material
+The style of this component is based on [material design](https://getmdl.io/), so if you want to visualize it correctly you have to add the material
 design dependency to your project:
 
 ```sh
 npm install --save material-design-icons material-design-lite
 ```
 
-Also make sure you include these dependencies in your .html page:
+Also make sure you include these dependencies in your `index.html` file:
 
 ```html
 <!-- Google Material Design Lite -->
@@ -77,293 +45,29 @@ Also make sure you include these dependencies in your .html page:
 <script src="node_modules/material-design-lite/material.min.js"></script>
 <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
 ```
-
-#### Basic usage
-
-In this component are present three different tags :
-
-* alfresco-tag-node-actions-list
-* alfresco-tag-list
-* alfresco-tag-node-list
-
-## alfresco-tag-node-actions-list
+	
+## Example
 
 ```html
-<alfresco-tag-node-actions-list [nodeId]="nodeId"></alfresco-tag-node-actions-list>
-```  
-
-```ts
-import { Component, OnInit, Input } from '@angular/core';
-import { bootstrap } from '@angular/platform-browser-dynamic';
-import { HTTP_PROVIDERS } from '@angular/http';
-import {
-    ALFRESCO_CORE_PROVIDERS,
-    AlfrescoSettingsService,
-    AlfrescoAuthenticationService
-} from 'ng2-alfresco-core';
-import { TAGCOMPONENT, TAGSERVICES } from 'ng2-alfresco-tag';
-
-@Component({
-    selector: 'alfresco-tag-demo',
-    template: `
-           <div class="container" *ngIf="authenticated">
-             <alfresco-tag-node-actions-list [nodeId]="nodeId"></alfresco-tag-node-actions-list>
-           </div>
-    `,
-    directives: [TAGCOMPONENT],
-    providers: [TAGSERVICES]
-})
-class TagDemo implements OnInit {
-
-    @Input()
-    nodeId: string = '74cd8a96-8a21-47e5-9b3b-a1b3e296787d';
-
-    authenticated: boolean;
-
-    ecmHost: string = 'http://127.0.0.1:8080';
-
-    ticket: string;
-
-    constructor(private authService: AlfrescoAuthenticationService,
-                private settingsService: AlfrescoSettingsService) {
-        settingsService.ecmHost = this.ecmHost;
-        settingsService.setProviders('ECM');
-    }
-
-    ngOnInit() {
-        this.login();
-    }
-
-    login() {
-        this.authService.login('admin', 'admin').subscribe(
-            ticket => {
-                this.authenticated = true;
-            },
-            error => {
-                this.authenticated = false;
-            });
-    }
-
-    public updateHost(): void {
-        this.settingsService.ecmHost = this.ecmHost;
-        this.login();
-    }
-
-    logData(data) {
-        console.log(data);
-    }
-}
-bootstrap(TagDemo, [
-    HTTP_PROVIDERS,
-    ALFRESCO_CORE_PROVIDERS
-]);
-```  
- 
-### Options
-
-Attribute     | Options     | Default      | Description | Mandatory
----           | ---         | ---          | ---         | ---
-`nodeId`         | *string*    |        | The identifier of a node.| 
-
-![Custom columns](docs/assets/tag3.png)                         
-
-## alfresco-tag-node-list
-
-```html
-<alfresco-tag-node-list [nodeId]="nodeId"></alfresco-tag-node-list>
-``` 
-
-```ts
-import { Component, OnInit, Input } from '@angular/core';
-import { bootstrap } from '@angular/platform-browser-dynamic';
-import { HTTP_PROVIDERS } from '@angular/http';
-import {
-    ALFRESCO_CORE_PROVIDERS,
-    AlfrescoSettingsService,
-    AlfrescoAuthenticationService
-} from 'ng2-alfresco-core';
-
-import { TAGCOMPONENT, TAGSERVICES } from 'ng2-alfresco-tag';
-
-@Component({
-    selector: 'alfresco-tag-demo',
-    template: `
-           <div class="container" *ngIf="authenticated">
-             <alfresco-tag-node-list [nodeId]="nodeId"></alfresco-tag-node-list>
-           </div>
-    `,
-    directives: [TAGCOMPONENT],
-    providers: [TAGSERVICES]
-})
-class TagDemo implements OnInit {
-
-    @Input()
-    nodeId: string = '74cd8a96-8a21-47e5-9b3b-a1b3e296787d';
-
-    authenticated: boolean;
-
-    ecmHost: string = 'http://127.0.0.1:8080';
-
-    ticket: string;
-
-    constructor(private authService: AlfrescoAuthenticationService,
-                private settingsService: AlfrescoSettingsService) {
-        settingsService.ecmHost = this.ecmHost;
-        settingsService.setProviders('ECM');
-    }
-
-    ngOnInit() {
-        this.login();
-    }
-
-    login() {
-        this.authService.login('admin', 'admin').subscribe(
-            ticket => {
-                this.authenticated = true;
-            },
-            error => {
-                this.authenticated = false;
-            });
-    }
-
-    public updateHost(): void {
-        this.settingsService.ecmHost = this.ecmHost;
-        this.login();
-    }
-
-    logData(data) {
-        console.log(data);
-    }
-}
-bootstrap(TagDemo, [
-    HTTP_PROVIDERS,
-    ALFRESCO_CORE_PROVIDERS
-]);
-```  
-
-### Options
-
-Attribute     | Options     | Default      | Description | Mandatory
----           | ---         | ---          | ---         | ---
-`nodeId`         | *string*    |        | The identifier of a node.| 
-
-![Custom columns](docs/assets/tag1.png)                         
-
-## alfresco-tag-list
-
-```html
-<alfresco-tag-list></alfresco-tag-list>
-``` 
-
-```ts
-import { Component, OnInit, Input } from '@angular/core';
-import { bootstrap } from '@angular/platform-browser-dynamic';
-import { HTTP_PROVIDERS } from '@angular/http';
-import {
-    ALFRESCO_CORE_PROVIDERS,
-    AlfrescoSettingsService,
-    AlfrescoAuthenticationService
-} from 'ng2-alfresco-core';
-
-import { TAGCOMPONENT, TAGSERVICES } from 'ng2-alfresco-tag';
-
-@Component({
-    selector: 'alfresco-tag-demo',
-    template: `
-           <div class="container" *ngIf="authenticated">
-             <alfresco-tag-list></alfresco-tag-list>
-           </div>
-    `,
-    directives: [TAGCOMPONENT],
-    providers: [TAGSERVICES]
-})
-class TagDemo implements OnInit {
-
-    authenticated: boolean;
-
-    ecmHost: string = 'http://127.0.0.1:8080';
-
-    constructor(private authService: AlfrescoAuthenticationService,
-                private settingsService: AlfrescoSettingsService) {
-        settingsService.ecmHost = this.ecmHost;
-        settingsService.setProviders('ECM');
-    }
-
-    ngOnInit() {
-        this.login();
-    }
-
-    login() {
-        this.authService.login('admin', 'admin').subscribe(
-            ticket => {
-                this.authenticated = true;
-            },
-            error => {
-                this.authenticated = false;
-            });
-    }
-
-    public updateHost(): void {
-        this.settingsService.ecmHost = this.ecmHost;
-        this.login();
-    }
-
-    logData(data) {
-        console.log(data);
-    }
-}
-bootstrap(TagDemo, [
-    HTTP_PROVIDERS,
-    ALFRESCO_CORE_PROVIDERS
-]);
-```  
-
-![Custom columns](docs/assets/tag2.png)                         
-
-        
-## Build from sources
-Alternatively you can build component from sources with the following commands:
-     
-     
-```sh
-npm install
-npm run build
+<ng2-alfresco-userinfo></ng2-alfresco-userinfo>
 ```
+This will show a round icon with user and on click some user information are showed.
+If user is logged in with ECM and BPM the ECM image will be showed.
 
-##Build the files and keep watching for changes
+## NPM scripts
 
-```sh
-npm run build:w
-```
-    
-## Running unit tests
+| Command | Description |
+| --- | --- |
+| npm run build | Build component |
+| npm run build:w | Build component and keep watching the changes |
+| npm run test | Run unit tests in the console |
+| npm run test-browser | Run unit tests in the browser
+| npm run coverage | Run unit tests and display code coverage report |
 
-```sh
-npm test
-```
+## History
 
-## Running unit tests in browser
+For detailed changelog, check [Releases](https://github.com/alfresco/ng2-alfresco-userinfo/releases).
 
-```sh
-npm test-browser
-```
-
-This task rebuilds all the code, runs tslint, license checks and other quality check tools 
-before performing unit testing. 
-
-## Code coverage
-
-```sh
-npm run coverage
-```
-
-## Demo
-
-If you want have a demo of how the component works, please check the demo folder :
-
-```sh
-cd demo
-npm install
-npm start
-```
+## Contributors
 
+[Contributors](https://github.com/alfresco/ng2-alfresco-userinfo/graphs/contributors)
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/.editorconfig b/ng2-components/ng2-alfresco-userinfo/demo/.editorconfig
new file mode 100644
index 0000000000..8ed330c4a2
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/.editorconfig
@@ -0,0 +1,10 @@
+
+root = true
+
+[{src,scripts}/**.{ts,json,js}]
+end_of_line = crlf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 4
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/.gitignore b/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
index 6afdbb8367..25beca4c27 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
+++ b/ng2-components/ng2-alfresco-userinfo/demo/.gitignore
@@ -1,6 +1,6 @@
-typings/
-node_modules/
+node_modules
 .idea
-dist/
+coverage
+dist
+typings
 !systemjs.config.js
-!browser-sync-config.js
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/.npmignore b/ng2-components/ng2-alfresco-userinfo/demo/.npmignore
new file mode 100644
index 0000000000..c51c008259
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/.npmignore
@@ -0,0 +1,3 @@
+node_modules
+dist
+typings
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/README.md b/ng2-components/ng2-alfresco-userinfo/demo/README.md
index 8d399e6fef..14f9e8502c 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/README.md
+++ b/ng2-components/ng2-alfresco-userinfo/demo/README.md
@@ -1,19 +1,13 @@
-# ng2-alfresco-tag - Demo
+# User info demo
 
-* To install dependencies
+Install:
 
-```sh
-$ npm install
+```
+npm install
 ```
 
-* To provide a live demo
+Run the project:
 
-```sh
-$ npm run start
-```
-
-* To clean npm_modules and typings folder
-
-```sh
-$ npm run clean
 ```
+npm start
+```
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/index.html b/ng2-components/ng2-alfresco-userinfo/demo/index.html
index ee97252ec1..b73b46517f 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/index.html
+++ b/ng2-components/ng2-alfresco-userinfo/demo/index.html
@@ -2,38 +2,33 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>Alfresco Angular 2 Tag - Demo</title>
+    <title>Angular 2 TaskList - Demo</title>
     <base href="./">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
 
     <!-- Google Material Design Lite -->
     <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
     <script src="node_modules/material-design-lite/material.min.js"></script>
     <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
 
+    <!-- 1. Load libraries -->
     <!-- 1. Load libraries -->
     <!-- Polyfill(s) for older browsers -->
     <script src="node_modules/core-js/client/shim.min.js"></script>
-
     <script src="node_modules/zone.js/dist/zone.js"></script>
     <script src="node_modules/reflect-metadata/Reflect.js"></script>
     <script src="node_modules/systemjs/dist/system.src.js"></script>
 
-    <!-- Additional Alfresco libraries -->
     <script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
 
     <script src="systemjs.config.js"></script>
     <script>
-        System.import('app').catch(
-                function (err) {
-                    console.error(err);
-                });
+        System.import('app').catch(function(err){ console.error(err); });
     </script>
 
 </head>
 <body>
 
-<alfresco-tag-demo></alfresco-tag-demo>
+<alfresco-userinfo-demo></alfresco-userinfo-demo>
 
 </body>
 </html>
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/package.json b/ng2-components/ng2-alfresco-userinfo/demo/package.json
new file mode 100644
index 0000000000..368099bb09
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/package.json
@@ -0,0 +1,77 @@
+{
+  "name": "ng2-activiti-tasklist-demo",
+  "description": "Alfresco Angular2 Task List Component - Demo",
+  "version": "0.1.0",
+  "author": "Alfresco Software, Ltd.",
+  "main": "index.js",
+  "scripts": {
+    "clean": "rimraf dist node_modules",
+    "postinstall": "npm run build",
+    "start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
+    "server": "wsrv -o -s -l",
+    "build": "npm run tslint && rimraf dist && npm run tsc",
+    "tsc": "tsc",
+    "tsc:w": "tsc -w",
+    "tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts"
+  },
+  "license": "Apache-2.0",
+  "dependencies": {
+    "@angular/common": "2.0.0",
+    "@angular/compiler": "2.0.0",
+    "@angular/core": "2.0.0",
+    "@angular/forms": "2.0.0",
+    "@angular/http": "2.0.0",
+    "@angular/platform-browser": "2.0.0",
+    "@angular/platform-browser-dynamic": "2.0.0",
+    "@angular/router": "3.0.0",
+    "@angular/upgrade": "2.0.0",
+    "core-js": "^2.4.1",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "5.0.0-beta.12",
+    "systemjs": "0.19.27",
+    "zone.js": "^0.6.23",
+
+    "material-design-icons": "2.2.3",
+    "material-design-lite": "1.2.1",
+    "ng2-translate": "2.5.0",
+
+    "alfresco-js-api": "^0.3.0",
+    "ng2-alfresco-core": "^0.3.0",
+    "ng2-alfresco-userinfo": "0.3.2"
+  },
+  "devDependencies": {
+    "@types/core-js": "^0.9.32",
+    "@types/jasmine": "^2.2.33",
+    "concurrently": "^2.2.0",
+    "rimraf": "2.5.2",
+    "tslint": "3.8.1",
+    "license-check": "1.1.5",
+    "typescript": "^2.0.2",
+    "wsrv": "^0.1.5"
+  },
+  "keywords": [
+    "angular2",
+    "typescript"
+  ],
+  "license-check-config": {
+    "src": [
+      "**/*.js",
+      "**/*.ts",
+      "!/**/coverage/**/*",
+      "!/**/demo/**/*",
+      "!/**/node_modules/**/*",
+      "!/**/typings/**/*",
+      "!*.js"
+    ],
+    "contributors": [
+      {
+        "name": "Vito Albano",
+        "email": "vito.albano@alfresco.com"
+      }
+    ],
+    "path": "assets/license_header.txt",
+    "blocking": true,
+    "logInfo": false,
+    "logError": true
+  }
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
index 8af97cc33a..98ef59e2a1 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
+++ b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
@@ -15,100 +15,130 @@
  * limitations under the License.
  */
 
-import { NgModule, Component, Input, OnInit } from '@angular/core';
+import { NgModule, Component } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { UserInfoComponentModule } from 'ng2-alfresco-userinfo';
+import { CoreModule, MDL } from 'ng2-alfresco-core';
 
-import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } from 'ng2-alfresco-core';
-import { TagModule } from 'ng2-alfresco-tag';
+import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
 
 @Component({
-    selector: 'alfresco-tag-demo',
-    template: `
-               <label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
-               <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>
-               <label for="host"><b>Insert the ip of your Alfresco instance:</b></label><br>
-               <input id="host" type="text" size="48" (change)="updateHost()" [(ngModel)]="ecmHost"><br><br>
-               <div *ngIf="!authenticated" style="color:#FF2323">
-                    Authentication failed to ip {{ ecmHost }} with user: admin, admin, you can still try to add a valid ticket to perform
-                    operations.
+    selector: 'alfresco-userinfo-demo',
+    template: `<h4> START DEMO USERINFO </h4>
+               <div style="border-radius: 8px; position: absolute; background-color:papayawhip; color: cadetblue; left: 320px; top: 30px; z-index: 1;">
+                 <p style="width:120px;margin: 20px;">
+                 <label for="switch1" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
+                     <input type="checkbox" id="switch1" class="mdl-switch__input"
+                      (click)="toggleECM(ecm.checked)" #ecm>
+                     <span class="mdl-switch__label">ECM</span>
+                 </label>
+                 </p>
+                 <p style="width:120px;margin: 20px;">
+                     <label for="switch2" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
+                         <input type="checkbox" id="switch2" class="mdl-switch__input" checked
+                          (click)="toggleBPM(bpm.checked)" #bpm>
+                         <span class="mdl-switch__label">BPM</span>
+                     </label>
+                 </p>
                </div>
-               <hr>
-                <label for="nodeId"><b>Insert Node Id</b></label><br>
-                <input id="nodeId" type="text" size="48"  [(ngModel)]="nodeId"><br>
-        <div class="container" *ngIf="authenticated">
-            <div class="mdl-grid">
-              <div class="mdl-cell mdl-cell--4-col"><alfresco-tag-node-actions-list [nodeId]="nodeId"></alfresco-tag-node-actions-list></div>
-              <div class="mdl-cell mdl-cell--4-col">List Tags ECM <alfresco-tag-list></alfresco-tag-list></div>
-              <div class="mdl-cell mdl-cell--4-col">
-                    Tag list By Node ID 
-                    <alfresco-tag-node-list [nodeId]="nodeId"></alfresco-tag-node-list>
-              </div>
-            </div>
-        </div>
-    `
+               <div *ngIf="isLoggedIn()">
+                   <ng2-alfresco-userinfo></ng2-alfresco-userinfo>
+               </div>
+               <p></p>
+               <div>
+                   <p>
+                       <span>Username</span>
+                       <input id="user" type="text" [(ngModel)]="userToLogin" value="admin"/>
+                   </p>
+                   <p>
+                       <span>Password</span>
+                       <input id="passw" type="password" [(ngModel)]="password" value="admin"/>
+                   </p>
+               <button type="submit" (click)="attemptLogin()"> Login !</button>
+               </div>
+               <span>{{loginErrorMessage}}</span>
+               <button (click)="logout()">Logout</button>`,
+    styles: [
+        ':host > .container {padding: 10px}',
+        '.p-10 { padding: 10px; }'
+    ]
 })
-class TagDemo implements OnInit {
+class UserInfoDemo implements onInit{
 
-    @Input()
-    nodeId: string = '74cd8a96-8a21-47e5-9b3b-a1b3e296787d';
+      public userToLogin: string = 'admin';
+      public password: string = 'admin';
+      public loginErrorMessage: string;
+      public providers: string = 'BPM';
+      private authenticated: boolean;
+      private token: any;
 
-    authenticated: boolean;
+      constructor(private authService: AlfrescoAuthenticationService,
+                  private settingsService: AlfrescoSettingsService) {
+      }
 
-    ecmHost: string = 'http://127.0.0.1:8080';
+      ngOnInit() {
+        this.settingsService.setProviders(this.providers);
+      }
 
-    ticket: string;
+      attemptLogin() {
+          this.loginErrorMessage = '';
+          this.login(this.userToLogin, this.password);
+      }
 
-    constructor(private authService: AlfrescoAuthenticationService,
-                private settingsService: AlfrescoSettingsService) {
+      logout() {
+          this.authService.logout();
+      }
 
-        settingsService.ecmHost = this.ecmHost;
-        settingsService.setProviders('ECM');
+      login(user, password) {
+          this.settingsService.setProviders(this.providers);
+          this.authService.login(user, password).subscribe(
+              token => {
+                  console.log(token);
+                  this.token = token;
+                  this.authenticated = true;
+              },
+              error => {
+                  console.log(error);
+                  this.authenticated = false;
+                  this.loginErrorMessage = error;
+              });
+      }
 
-        if (this.authService.getTicketEcm()) {
-            this.ticket = this.authService.getTicketEcm();
-        }
-    }
+      isLoggedIn(): boolean {
+          return this.authService.isLoggedIn();
+      }
 
-    ngOnInit() {
-        this.login();
-    }
+      toggleECM(checked) {
+          if (checked && this.providers === 'BPM') {
+              this.providers = 'ALL';
+          } else if (checked) {
+              this.providers = 'ECM';
+          } else {
+              this.providers = undefined;
+          }
+      }
 
-    login() {
-        this.authService.login('admin', 'admin').subscribe(
-            ticket => {
-                console.log(ticket);
-                this.ticket = this.authService.getTicketEcm();
-                this.authenticated = true;
-            },
-            error => {
-                console.log(error);
-                this.authenticated = false;
-            });
-    }
+      toggleBPM(checked) {
+          if (checked && this.providers === 'ECM') {
+              this.providers = 'ALL';
+          } else if (checked) {
+              this.providers = 'BPM';
+          } else {
+              this.providers = undefined;
+          }
+      }
 
-    public updateTicket(): void {
-        localStorage.setItem('ticket-ECM', this.ticket);
-    }
-
-    public updateHost(): void {
-        this.settingsService.ecmHost = this.ecmHost;
-        this.login();
-    }
-
-    logData(data) {
-        console.log(data);
-    }
 }
 
 @NgModule({
     imports: [
         BrowserModule,
         CoreModule.forRoot(),
-        TagModule
+        UserInfoComponentModule.forRoot()
     ],
-    declarations: [ TagDemo ],
-    bootstrap:    [ TagDemo ]
+    declarations: [ UserInfoDemo ],
+    bootstrap:    [ UserInfoDemo ]
 })
 export class AppModule { }
 
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js b/ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js
new file mode 100644
index 0000000000..0e5c19f9a4
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/systemjs.config.js
@@ -0,0 +1,49 @@
+/**
+ * System configuration for Angular 2 samples
+ * Adjust as necessary for your application needs.
+ */
+(function (global) {
+    System.config({
+        paths: {
+            // paths serve as alias
+            'npm:': 'node_modules/'
+        },
+        // map tells the System loader where to look for things
+        map: {
+            // our app is within the app folder
+            app: 'dist',
+            // angular bundles
+            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
+            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
+            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.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',
+            // other libraries
+            'rxjs': 'npm:rxjs',
+            'ng2-translate': 'npm:ng2-translate',
+            'ng2-alfresco-core': 'npm:ng2-alfresco-core/dist',
+            'ng2-alfresco-login': 'npm:ng2-alfresco-login/dist',
+            'ng2-alfresco-userinfo': 'npm:ng2-alfresco-userinfo/dist',
+            'alfresco-js-api': 'npm:alfresco-js-api/dist'
+        },
+        // packages tells the System loader how to load when no filename and/or no extension
+        packages: {
+            app: {
+                main: './main.js',
+                defaultExtension: 'js'
+            },
+            rxjs: {
+                defaultExtension: 'js'
+            },
+            'ng2-translate': { defaultExtension: 'js' },
+
+            'ng2-alfresco-core': { main: './index.js', defaultExtension: 'js'},
+            'ng2-alfresco-login': { main: './index.js', defaultExtension: 'js'},
+            'ng2-alfresco-userinfo': { main: './index.js', defaultExtension: 'js'},
+            'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'}
+        }
+    });
+})(this);
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json b/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
new file mode 100644
index 0000000000..b1effea355
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/tsconfig.json
@@ -0,0 +1,26 @@
+{
+    "compilerOptions": {
+        "target": "es5",
+        "module": "system",
+        "moduleResolution": "node",
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "sourceMap": true,
+        "removeComments": true,
+        "declaration": true,
+        "noLib": false,
+        "allowUnreachableCode": false,
+        "allowUnusedLabels": false,
+        "noImplicitAny": false,
+        "noImplicitReturns": false,
+        "noImplicitUseStrict": false,
+        "noFallthroughCasesInSwitch": true,
+        "outDir": "dist",
+        "types": ["core-js", "jasmine"]
+    },
+    "exclude": [
+        "demo",
+        "node_modules",
+        "dist"
+    ]
+}
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/tslint.json b/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
index e550ac11d4..85e9df53c1 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
+++ b/ng2-components/ng2-alfresco-userinfo/demo/tslint.json
@@ -1,124 +1,121 @@
 {
-  "rules": {
-    "align": [
-      true,
-      "parameters",
-      "arguments",
-      "statements"
-    ],
-    "ban": false,
-    "class-name": true,
-    "comment-format": [
-      true,
-      "check-space",
-      "check-lowercase"
-    ],
-    "curly": true,
-    "eofline": true,
-    "forin": true,
-    "indent": [
-      true,
-      "spaces"
-    ],
-    "interface-name": false,
-    "jsdoc-format": true,
-    "label-position": true,
-    "label-undefined": true,
-    "max-line-length": [
-      true,
-      180
-    ],
-    "member-ordering": [
-      true,
-      "public-before-private",
-      "static-before-instance",
-      "variables-before-functions"
-    ],
-    "no-any": false,
-    "no-arg": true,
-    "no-bitwise": true,
-    "no-conditional-assignment": true,
-    "no-consecutive-blank-lines": false,
-    "no-console": [
-      true,
-      "debug",
-      "info",
-      "time",
-      "timeEnd",
-      "trace"
-    ],
-    "no-construct": true,
-    "no-constructor-vars": false,
-    "no-debugger": true,
-    "no-duplicate-key": true,
-    "no-duplicate-variable": true,
-    "no-empty": true,
-    "no-eval": true,
-    "no-inferrable-types": false,
-    "no-internal-module": true,
-    "no-require-imports": true,
-    "no-shadowed-variable": true,
-    "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
-    "no-unreachable": true,
-    "no-unused-expression": true,
-    "no-unused-variable": true,
-    "no-use-before-declare": true,
-    "no-var-keyword": true,
-    "no-var-requires": true,
-    "object-literal-sort-keys": false,
-    "one-line": [
-      true,
-      "check-open-brace",
-      "check-catch",
-      "check-else",
-      "check-whitespace"
-    ],
-    "quotemark": [
-      true,
-      "single",
-      "avoid-escape"
-    ],
-    "radix": true,
-    "semicolon": true,
-    "switch-default": true,
-    "trailing-comma": [
-      true,
-      {
-        "multiline": "never",
-        "singleline": "never"
-      }
-    ],
-    "triple-equals": [
-      true,
-      "allow-null-check"
-    ],
-    "typedef": false,
-    "typedef-whitespace": [
-      true,
-      {
-        "call-signature": "nospace",
-        "index-signature": "nospace",
-        "parameter": "nospace",
-        "property-declaration": "nospace",
-        "variable-declaration": "nospace"
-      }
-    ],
-    "use-strict": false,
-    "variable-name": [
-      true,
-      "check-format",
-      "allow-leading-underscore",
-      "ban-keywords"
-    ],
-    "whitespace": [
-      true,
-      "check-branch",
-      "check-operator",
-      "check-separator",
-      "check-type",
-      "check-module",
-      "check-decl"
-    ]
-  }
+    "rules": {
+        "align": [
+            true,
+            "parameters",
+            "statements"
+        ],
+        "ban": false,
+        "class-name": true,
+        "comment-format": [
+            true,
+            "check-space"
+        ],
+        "curly": true,
+        "eofline": true,
+        "forin": true,
+        "indent": [
+            true,
+            "spaces"
+        ],
+        "interface-name": false,
+        "jsdoc-format": true,
+        "label-position": true,
+        "label-undefined": true,
+        "max-line-length": [
+            true,
+            180
+        ],
+        "member-ordering": [
+            true,
+            "static-before-instance",
+            "variables-before-functions"
+        ],
+        "no-any": false,
+        "no-arg": true,
+        "no-bitwise": false,
+        "no-conditional-assignment": true,
+        "no-consecutive-blank-lines": false,
+        "no-console": [
+            true,
+            "debug",
+            "info",
+            "time",
+            "timeEnd",
+            "trace"
+        ],
+        "no-construct": true,
+        "no-constructor-vars": false,
+        "no-debugger": true,
+        "no-duplicate-key": true,
+        "no-duplicate-variable": true,
+        "no-empty": false,
+        "no-eval": true,
+        "no-inferrable-types": false,
+        "no-internal-module": true,
+        "no-require-imports": true,
+        "no-shadowed-variable": true,
+        "no-switch-case-fall-through": true,
+        "no-trailing-whitespace": true,
+        "no-unreachable": true,
+        "no-unused-expression": true,
+        "no-unused-variable": true,
+        "no-use-before-declare": true,
+        "no-var-keyword": true,
+        "no-var-requires": true,
+        "object-literal-sort-keys": false,
+        "one-line": [
+            true,
+            "check-open-brace",
+            "check-catch",
+            "check-else",
+            "check-whitespace"
+        ],
+        "quotemark": [
+            true,
+            "single",
+            "avoid-escape"
+        ],
+        "radix": true,
+        "semicolon": true,
+        "switch-default": true,
+        "trailing-comma": [
+            true,
+            {
+                "multiline": "never",
+                "singleline": "never"
+            }
+        ],
+        "triple-equals": [
+            true,
+            "allow-null-check"
+        ],
+        "typedef": false,
+        "typedef-whitespace": [
+            true,
+            {
+                "call-signature": "nospace",
+                "index-signature": "nospace",
+                "parameter": "nospace",
+                "property-declaration": "nospace",
+                "variable-declaration": "nospace"
+            }
+        ],
+        "use-strict": false,
+        "variable-name": [
+            true,
+            "check-format",
+            "allow-leading-underscore",
+            "ban-keywords"
+        ],
+        "whitespace": [
+            true,
+            "check-branch",
+            "check-operator",
+            "check-separator",
+            "check-type",
+            "check-module",
+            "check-decl"
+        ]
+    }
 }
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json b/ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json
new file mode 100644
index 0000000000..d8f11c2698
--- /dev/null
+++ b/ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json
@@ -0,0 +1,5 @@
+{
+    "watch": [
+        "node_modules/ng2-alfresco-tag/dist/**/*.{html,htm,css,js}"
+    ]
+}
diff --git a/ng2-components/update.sh b/ng2-components/update.sh
index df9f5c4548..0f7732c5ba 100755
--- a/ng2-components/update.sh
+++ b/ng2-components/update.sh
@@ -34,3 +34,6 @@
 
 (cd ng2-alfresco-tag; npm update;)
 (cd ng2-alfresco-tag/demo; npm update;)
+
+(cd ng2-alfresco-userinfo; npm update;)
+(cd ng2-alfresco-userinfo/demo; npm update;)

From f72165b55f4e788757fbe6f3223de4a0aad25578 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Tue, 4 Oct 2016 15:15:44 +0100
Subject: [PATCH 24/26] Fixed wrong import on demo

---
 .../demo/assets/license_header.txt               | 16 ++++++++++++++++
 .../demo/assets/material.orange-blue.min.css     |  8 ++++++++
 .../ng2-alfresco-userinfo/demo/index.html        |  1 +
 .../ng2-alfresco-userinfo/demo/src/main.ts       |  6 +++---
 4 files changed, 28 insertions(+), 3 deletions(-)
 create mode 100644 ng2-components/ng2-alfresco-search/demo/assets/license_header.txt
 create mode 100644 ng2-components/ng2-alfresco-search/demo/assets/material.orange-blue.min.css

diff --git a/ng2-components/ng2-alfresco-search/demo/assets/license_header.txt b/ng2-components/ng2-alfresco-search/demo/assets/license_header.txt
new file mode 100644
index 0000000000..83fd1531a3
--- /dev/null
+++ b/ng2-components/ng2-alfresco-search/demo/assets/license_header.txt
@@ -0,0 +1,16 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed 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.
+ */
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-search/demo/assets/material.orange-blue.min.css b/ng2-components/ng2-alfresco-search/demo/assets/material.orange-blue.min.css
new file mode 100644
index 0000000000..fb184ae532
--- /dev/null
+++ b/ng2-components/ng2-alfresco-search/demo/assets/material.orange-blue.min.css
@@ -0,0 +1,8 @@
+/**
+ * material-design-lite - Material Design Components in CSS, JS and HTML
+ * @version v1.1.3
+ * @license Apache-2.0
+ * @copyright 2015 Google, Inc.
+ * @link https://github.com/google/material-design-lite
+ */
+@charset "UTF-8";html{color:rgba(0,0,0,.87)}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.browserupgrade{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}.hidden{display:none!important}.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}@media print{*,*:before,*:after,*:first-letter{background:transparent!important;color:#000!important;box-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href)")"}abbr[title]:after{content:" (" attr(title)")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}a,.mdl-accordion,.mdl-button,.mdl-card,.mdl-checkbox,.mdl-dropdown-menu,.mdl-icon-toggle,.mdl-item,.mdl-radio,.mdl-slider,.mdl-switch,.mdl-tabs__tab{-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:rgba(255,255,255,0)}html{width:100%;height:100%;-ms-touch-action:manipulation;touch-action:manipulation}body{width:100%;min-height:100%}main{display:block}*[hidden]{display:none!important}html,body{font-family:"Helvetica","Arial",sans-serif;font-size:14px;font-weight:400;line-height:20px}h1,h2,h3,h4,h5,h6,p{padding:0}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400;line-height:1.35;letter-spacing:-.02em;opacity:.54;font-size:.6em}h1{font-size:56px;line-height:1.35;letter-spacing:-.02em;margin:24px 0}h1,h2{font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400}h2{font-size:45px;line-height:48px}h2,h3{margin:24px 0}h3{font-size:34px;line-height:40px}h3,h4{font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:400}h4{font-size:24px;line-height:32px;-moz-osx-font-smoothing:grayscale;margin:24px 0 16px}h5{font-size:20px;font-weight:500;line-height:1;letter-spacing:.02em}h5,h6{font-family:"Roboto","Helvetica","Arial",sans-serif;margin:24px 0 16px}h6{font-size:16px;letter-spacing:.04em}h6,p{font-weight:400;line-height:24px}p{font-size:14px;letter-spacing:0;margin:0 0 16px}a{color:rgb(68,138,255);font-weight:500}blockquote{font-family:"Roboto","Helvetica","Arial",sans-serif;position:relative;font-size:24px;font-weight:300;font-style:italic;line-height:1.35;letter-spacing:.08em}blockquote:before{position:absolute;left:-.5em;content:'“'}blockquote:after{content:'”';margin-left:-.05em}mark{background-color:#f4ff81}dt{font-weight:700}address{font-size:12px;line-height:1;font-style:normal}address,ul,ol{font-weight:400;letter-spacing:0}ul,ol{font-size:14px;line-height:24px}.mdl-typography--display-4,.mdl-typography--display-4-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:112px;font-weight:300;line-height:1;letter-spacing:-.04em}.mdl-typography--display-4-color-contrast{opacity:.54}.mdl-typography--display-3,.mdl-typography--display-3-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:56px;font-weight:400;line-height:1.35;letter-spacing:-.02em}.mdl-typography--display-3-color-contrast{opacity:.54}.mdl-typography--display-2,.mdl-typography--display-2-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:45px;font-weight:400;line-height:48px}.mdl-typography--display-2-color-contrast{opacity:.54}.mdl-typography--display-1,.mdl-typography--display-1-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:34px;font-weight:400;line-height:40px}.mdl-typography--display-1-color-contrast{opacity:.54}.mdl-typography--headline,.mdl-typography--headline-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:24px;font-weight:400;line-height:32px;-moz-osx-font-smoothing:grayscale}.mdl-typography--headline-color-contrast{opacity:.87}.mdl-typography--title,.mdl-typography--title-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:20px;font-weight:500;line-height:1;letter-spacing:.02em}.mdl-typography--title-color-contrast{opacity:.87}.mdl-typography--subhead,.mdl-typography--subhead-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:16px;font-weight:400;line-height:24px;letter-spacing:.04em}.mdl-typography--subhead-color-contrast{opacity:.87}.mdl-typography--body-2,.mdl-typography--body-2-color-contrast{font-size:14px;font-weight:700;line-height:24px;letter-spacing:0}.mdl-typography--body-2-color-contrast{opacity:.87}.mdl-typography--body-1,.mdl-typography--body-1-color-contrast{font-size:14px;font-weight:400;line-height:24px;letter-spacing:0}.mdl-typography--body-1-color-contrast{opacity:.87}.mdl-typography--body-2-force-preferred-font,.mdl-typography--body-2-force-preferred-font-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;line-height:24px;letter-spacing:0}.mdl-typography--body-2-force-preferred-font-color-contrast{opacity:.87}.mdl-typography--body-1-force-preferred-font,.mdl-typography--body-1-force-preferred-font-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:400;line-height:24px;letter-spacing:0}.mdl-typography--body-1-force-preferred-font-color-contrast{opacity:.87}.mdl-typography--caption,.mdl-typography--caption-force-preferred-font{font-size:12px;font-weight:400;line-height:1;letter-spacing:0}.mdl-typography--caption-force-preferred-font{font-family:"Roboto","Helvetica","Arial",sans-serif}.mdl-typography--caption-color-contrast,.mdl-typography--caption-force-preferred-font-color-contrast{font-size:12px;font-weight:400;line-height:1;letter-spacing:0;opacity:.54}.mdl-typography--caption-force-preferred-font-color-contrast,.mdl-typography--menu{font-family:"Roboto","Helvetica","Arial",sans-serif}.mdl-typography--menu{font-size:14px;font-weight:500;line-height:1;letter-spacing:0}.mdl-typography--menu-color-contrast{opacity:.87}.mdl-typography--menu-color-contrast,.mdl-typography--button,.mdl-typography--button-color-contrast{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;line-height:1;letter-spacing:0}.mdl-typography--button,.mdl-typography--button-color-contrast{text-transform:uppercase}.mdl-typography--button-color-contrast{opacity:.87}.mdl-typography--text-left{text-align:left}.mdl-typography--text-right{text-align:right}.mdl-typography--text-center{text-align:center}.mdl-typography--text-justify{text-align:justify}.mdl-typography--text-nowrap{white-space:nowrap}.mdl-typography--text-lowercase{text-transform:lowercase}.mdl-typography--text-uppercase{text-transform:uppercase}.mdl-typography--text-capitalize{text-transform:capitalize}.mdl-typography--font-thin{font-weight:200!important}.mdl-typography--font-light{font-weight:300!important}.mdl-typography--font-regular{font-weight:400!important}.mdl-typography--font-medium{font-weight:500!important}.mdl-typography--font-bold{font-weight:700!important}.mdl-typography--font-black{font-weight:900!important}.material-icons{font-family:'Material Icons';font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;word-wrap:normal;-moz-font-feature-settings:'liga';font-feature-settings:'liga';-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased}.mdl-color-text--red{color:#f44336 !important}.mdl-color--red{background-color:#f44336 !important}.mdl-color-text--red-50{color:#ffebee !important}.mdl-color--red-50{background-color:#ffebee !important}.mdl-color-text--red-100{color:#ffcdd2 !important}.mdl-color--red-100{background-color:#ffcdd2 !important}.mdl-color-text--red-200{color:#ef9a9a !important}.mdl-color--red-200{background-color:#ef9a9a !important}.mdl-color-text--red-300{color:#e57373 !important}.mdl-color--red-300{background-color:#e57373 !important}.mdl-color-text--red-400{color:#ef5350 !important}.mdl-color--red-400{background-color:#ef5350 !important}.mdl-color-text--red-500{color:#f44336 !important}.mdl-color--red-500{background-color:#f44336 !important}.mdl-color-text--red-600{color:#e53935 !important}.mdl-color--red-600{background-color:#e53935 !important}.mdl-color-text--red-700{color:#d32f2f !important}.mdl-color--red-700{background-color:#d32f2f !important}.mdl-color-text--red-800{color:#c62828 !important}.mdl-color--red-800{background-color:#c62828 !important}.mdl-color-text--red-900{color:#b71c1c !important}.mdl-color--red-900{background-color:#b71c1c !important}.mdl-color-text--red-A100{color:#ff8a80 !important}.mdl-color--red-A100{background-color:#ff8a80 !important}.mdl-color-text--red-A200{color:#ff5252 !important}.mdl-color--red-A200{background-color:#ff5252 !important}.mdl-color-text--red-A400{color:#ff1744 !important}.mdl-color--red-A400{background-color:#ff1744 !important}.mdl-color-text--red-A700{color:#d50000 !important}.mdl-color--red-A700{background-color:#d50000 !important}.mdl-color-text--pink{color:#e91e63 !important}.mdl-color--pink{background-color:#e91e63 !important}.mdl-color-text--pink-50{color:#fce4ec !important}.mdl-color--pink-50{background-color:#fce4ec !important}.mdl-color-text--pink-100{color:#f8bbd0 !important}.mdl-color--pink-100{background-color:#f8bbd0 !important}.mdl-color-text--pink-200{color:#f48fb1 !important}.mdl-color--pink-200{background-color:#f48fb1 !important}.mdl-color-text--pink-300{color:#f06292 !important}.mdl-color--pink-300{background-color:#f06292 !important}.mdl-color-text--pink-400{color:#ec407a !important}.mdl-color--pink-400{background-color:#ec407a !important}.mdl-color-text--pink-500{color:#e91e63 !important}.mdl-color--pink-500{background-color:#e91e63 !important}.mdl-color-text--pink-600{color:#d81b60 !important}.mdl-color--pink-600{background-color:#d81b60 !important}.mdl-color-text--pink-700{color:#c2185b !important}.mdl-color--pink-700{background-color:#c2185b !important}.mdl-color-text--pink-800{color:#ad1457 !important}.mdl-color--pink-800{background-color:#ad1457 !important}.mdl-color-text--pink-900{color:#880e4f !important}.mdl-color--pink-900{background-color:#880e4f !important}.mdl-color-text--pink-A100{color:#ff80ab !important}.mdl-color--pink-A100{background-color:#ff80ab !important}.mdl-color-text--pink-A200{color:#ff4081 !important}.mdl-color--pink-A200{background-color:#ff4081 !important}.mdl-color-text--pink-A400{color:#f50057 !important}.mdl-color--pink-A400{background-color:#f50057 !important}.mdl-color-text--pink-A700{color:#c51162 !important}.mdl-color--pink-A700{background-color:#c51162 !important}.mdl-color-text--purple{color:#9c27b0 !important}.mdl-color--purple{background-color:#9c27b0 !important}.mdl-color-text--purple-50{color:#f3e5f5 !important}.mdl-color--purple-50{background-color:#f3e5f5 !important}.mdl-color-text--purple-100{color:#e1bee7 !important}.mdl-color--purple-100{background-color:#e1bee7 !important}.mdl-color-text--purple-200{color:#ce93d8 !important}.mdl-color--purple-200{background-color:#ce93d8 !important}.mdl-color-text--purple-300{color:#ba68c8 !important}.mdl-color--purple-300{background-color:#ba68c8 !important}.mdl-color-text--purple-400{color:#ab47bc !important}.mdl-color--purple-400{background-color:#ab47bc !important}.mdl-color-text--purple-500{color:#9c27b0 !important}.mdl-color--purple-500{background-color:#9c27b0 !important}.mdl-color-text--purple-600{color:#8e24aa !important}.mdl-color--purple-600{background-color:#8e24aa !important}.mdl-color-text--purple-700{color:#7b1fa2 !important}.mdl-color--purple-700{background-color:#7b1fa2 !important}.mdl-color-text--purple-800{color:#6a1b9a !important}.mdl-color--purple-800{background-color:#6a1b9a !important}.mdl-color-text--purple-900{color:#4a148c !important}.mdl-color--purple-900{background-color:#4a148c !important}.mdl-color-text--purple-A100{color:#ea80fc !important}.mdl-color--purple-A100{background-color:#ea80fc !important}.mdl-color-text--purple-A200{color:#e040fb !important}.mdl-color--purple-A200{background-color:#e040fb !important}.mdl-color-text--purple-A400{color:#d500f9 !important}.mdl-color--purple-A400{background-color:#d500f9 !important}.mdl-color-text--purple-A700{color:#a0f !important}.mdl-color--purple-A700{background-color:#a0f !important}.mdl-color-text--deep-purple{color:#673ab7 !important}.mdl-color--deep-purple{background-color:#673ab7 !important}.mdl-color-text--deep-purple-50{color:#ede7f6 !important}.mdl-color--deep-purple-50{background-color:#ede7f6 !important}.mdl-color-text--deep-purple-100{color:#d1c4e9 !important}.mdl-color--deep-purple-100{background-color:#d1c4e9 !important}.mdl-color-text--deep-purple-200{color:#b39ddb !important}.mdl-color--deep-purple-200{background-color:#b39ddb !important}.mdl-color-text--deep-purple-300{color:#9575cd !important}.mdl-color--deep-purple-300{background-color:#9575cd !important}.mdl-color-text--deep-purple-400{color:#7e57c2 !important}.mdl-color--deep-purple-400{background-color:#7e57c2 !important}.mdl-color-text--deep-purple-500{color:#673ab7 !important}.mdl-color--deep-purple-500{background-color:#673ab7 !important}.mdl-color-text--deep-purple-600{color:#5e35b1 !important}.mdl-color--deep-purple-600{background-color:#5e35b1 !important}.mdl-color-text--deep-purple-700{color:#512da8 !important}.mdl-color--deep-purple-700{background-color:#512da8 !important}.mdl-color-text--deep-purple-800{color:#4527a0 !important}.mdl-color--deep-purple-800{background-color:#4527a0 !important}.mdl-color-text--deep-purple-900{color:#311b92 !important}.mdl-color--deep-purple-900{background-color:#311b92 !important}.mdl-color-text--deep-purple-A100{color:#b388ff !important}.mdl-color--deep-purple-A100{background-color:#b388ff !important}.mdl-color-text--deep-purple-A200{color:#7c4dff !important}.mdl-color--deep-purple-A200{background-color:#7c4dff !important}.mdl-color-text--deep-purple-A400{color:#651fff !important}.mdl-color--deep-purple-A400{background-color:#651fff !important}.mdl-color-text--deep-purple-A700{color:#6200ea !important}.mdl-color--deep-purple-A700{background-color:#6200ea !important}.mdl-color-text--indigo{color:#3f51b5 !important}.mdl-color--indigo{background-color:#3f51b5 !important}.mdl-color-text--indigo-50{color:#e8eaf6 !important}.mdl-color--indigo-50{background-color:#e8eaf6 !important}.mdl-color-text--indigo-100{color:#c5cae9 !important}.mdl-color--indigo-100{background-color:#c5cae9 !important}.mdl-color-text--indigo-200{color:#9fa8da !important}.mdl-color--indigo-200{background-color:#9fa8da !important}.mdl-color-text--indigo-300{color:#7986cb !important}.mdl-color--indigo-300{background-color:#7986cb !important}.mdl-color-text--indigo-400{color:#5c6bc0 !important}.mdl-color--indigo-400{background-color:#5c6bc0 !important}.mdl-color-text--indigo-500{color:#3f51b5 !important}.mdl-color--indigo-500{background-color:#3f51b5 !important}.mdl-color-text--indigo-600{color:#3949ab !important}.mdl-color--indigo-600{background-color:#3949ab !important}.mdl-color-text--indigo-700{color:#303f9f !important}.mdl-color--indigo-700{background-color:#303f9f !important}.mdl-color-text--indigo-800{color:#283593 !important}.mdl-color--indigo-800{background-color:#283593 !important}.mdl-color-text--indigo-900{color:#1a237e !important}.mdl-color--indigo-900{background-color:#1a237e !important}.mdl-color-text--indigo-A100{color:#8c9eff !important}.mdl-color--indigo-A100{background-color:#8c9eff !important}.mdl-color-text--indigo-A200{color:#536dfe !important}.mdl-color--indigo-A200{background-color:#536dfe !important}.mdl-color-text--indigo-A400{color:#3d5afe !important}.mdl-color--indigo-A400{background-color:#3d5afe !important}.mdl-color-text--indigo-A700{color:#304ffe !important}.mdl-color--indigo-A700{background-color:#304ffe !important}.mdl-color-text--blue{color:#2196f3 !important}.mdl-color--blue{background-color:#2196f3 !important}.mdl-color-text--blue-50{color:#e3f2fd !important}.mdl-color--blue-50{background-color:#e3f2fd !important}.mdl-color-text--blue-100{color:#bbdefb !important}.mdl-color--blue-100{background-color:#bbdefb !important}.mdl-color-text--blue-200{color:#90caf9 !important}.mdl-color--blue-200{background-color:#90caf9 !important}.mdl-color-text--blue-300{color:#64b5f6 !important}.mdl-color--blue-300{background-color:#64b5f6 !important}.mdl-color-text--blue-400{color:#42a5f5 !important}.mdl-color--blue-400{background-color:#42a5f5 !important}.mdl-color-text--blue-500{color:#2196f3 !important}.mdl-color--blue-500{background-color:#2196f3 !important}.mdl-color-text--blue-600{color:#1e88e5 !important}.mdl-color--blue-600{background-color:#1e88e5 !important}.mdl-color-text--blue-700{color:#1976d2 !important}.mdl-color--blue-700{background-color:#1976d2 !important}.mdl-color-text--blue-800{color:#1565c0 !important}.mdl-color--blue-800{background-color:#1565c0 !important}.mdl-color-text--blue-900{color:#0d47a1 !important}.mdl-color--blue-900{background-color:#0d47a1 !important}.mdl-color-text--blue-A100{color:#82b1ff !important}.mdl-color--blue-A100{background-color:#82b1ff !important}.mdl-color-text--blue-A200{color:#448aff !important}.mdl-color--blue-A200{background-color:#448aff !important}.mdl-color-text--blue-A400{color:#2979ff !important}.mdl-color--blue-A400{background-color:#2979ff !important}.mdl-color-text--blue-A700{color:#2962ff !important}.mdl-color--blue-A700{background-color:#2962ff !important}.mdl-color-text--light-blue{color:#03a9f4 !important}.mdl-color--light-blue{background-color:#03a9f4 !important}.mdl-color-text--light-blue-50{color:#e1f5fe !important}.mdl-color--light-blue-50{background-color:#e1f5fe !important}.mdl-color-text--light-blue-100{color:#b3e5fc !important}.mdl-color--light-blue-100{background-color:#b3e5fc !important}.mdl-color-text--light-blue-200{color:#81d4fa !important}.mdl-color--light-blue-200{background-color:#81d4fa !important}.mdl-color-text--light-blue-300{color:#4fc3f7 !important}.mdl-color--light-blue-300{background-color:#4fc3f7 !important}.mdl-color-text--light-blue-400{color:#29b6f6 !important}.mdl-color--light-blue-400{background-color:#29b6f6 !important}.mdl-color-text--light-blue-500{color:#03a9f4 !important}.mdl-color--light-blue-500{background-color:#03a9f4 !important}.mdl-color-text--light-blue-600{color:#039be5 !important}.mdl-color--light-blue-600{background-color:#039be5 !important}.mdl-color-text--light-blue-700{color:#0288d1 !important}.mdl-color--light-blue-700{background-color:#0288d1 !important}.mdl-color-text--light-blue-800{color:#0277bd !important}.mdl-color--light-blue-800{background-color:#0277bd !important}.mdl-color-text--light-blue-900{color:#01579b !important}.mdl-color--light-blue-900{background-color:#01579b !important}.mdl-color-text--light-blue-A100{color:#80d8ff !important}.mdl-color--light-blue-A100{background-color:#80d8ff !important}.mdl-color-text--light-blue-A200{color:#40c4ff !important}.mdl-color--light-blue-A200{background-color:#40c4ff !important}.mdl-color-text--light-blue-A400{color:#00b0ff !important}.mdl-color--light-blue-A400{background-color:#00b0ff !important}.mdl-color-text--light-blue-A700{color:#0091ea !important}.mdl-color--light-blue-A700{background-color:#0091ea !important}.mdl-color-text--cyan{color:#00bcd4 !important}.mdl-color--cyan{background-color:#00bcd4 !important}.mdl-color-text--cyan-50{color:#e0f7fa !important}.mdl-color--cyan-50{background-color:#e0f7fa !important}.mdl-color-text--cyan-100{color:#b2ebf2 !important}.mdl-color--cyan-100{background-color:#b2ebf2 !important}.mdl-color-text--cyan-200{color:#80deea !important}.mdl-color--cyan-200{background-color:#80deea !important}.mdl-color-text--cyan-300{color:#4dd0e1 !important}.mdl-color--cyan-300{background-color:#4dd0e1 !important}.mdl-color-text--cyan-400{color:#26c6da !important}.mdl-color--cyan-400{background-color:#26c6da !important}.mdl-color-text--cyan-500{color:#00bcd4 !important}.mdl-color--cyan-500{background-color:#00bcd4 !important}.mdl-color-text--cyan-600{color:#00acc1 !important}.mdl-color--cyan-600{background-color:#00acc1 !important}.mdl-color-text--cyan-700{color:#0097a7 !important}.mdl-color--cyan-700{background-color:#0097a7 !important}.mdl-color-text--cyan-800{color:#00838f !important}.mdl-color--cyan-800{background-color:#00838f !important}.mdl-color-text--cyan-900{color:#006064 !important}.mdl-color--cyan-900{background-color:#006064 !important}.mdl-color-text--cyan-A100{color:#84ffff !important}.mdl-color--cyan-A100{background-color:#84ffff !important}.mdl-color-text--cyan-A200{color:#18ffff !important}.mdl-color--cyan-A200{background-color:#18ffff !important}.mdl-color-text--cyan-A400{color:#00e5ff !important}.mdl-color--cyan-A400{background-color:#00e5ff !important}.mdl-color-text--cyan-A700{color:#00b8d4 !important}.mdl-color--cyan-A700{background-color:#00b8d4 !important}.mdl-color-text--teal{color:#009688 !important}.mdl-color--teal{background-color:#009688 !important}.mdl-color-text--teal-50{color:#e0f2f1 !important}.mdl-color--teal-50{background-color:#e0f2f1 !important}.mdl-color-text--teal-100{color:#b2dfdb !important}.mdl-color--teal-100{background-color:#b2dfdb !important}.mdl-color-text--teal-200{color:#80cbc4 !important}.mdl-color--teal-200{background-color:#80cbc4 !important}.mdl-color-text--teal-300{color:#4db6ac !important}.mdl-color--teal-300{background-color:#4db6ac !important}.mdl-color-text--teal-400{color:#26a69a !important}.mdl-color--teal-400{background-color:#26a69a !important}.mdl-color-text--teal-500{color:#009688 !important}.mdl-color--teal-500{background-color:#009688 !important}.mdl-color-text--teal-600{color:#00897b !important}.mdl-color--teal-600{background-color:#00897b !important}.mdl-color-text--teal-700{color:#00796b !important}.mdl-color--teal-700{background-color:#00796b !important}.mdl-color-text--teal-800{color:#00695c !important}.mdl-color--teal-800{background-color:#00695c !important}.mdl-color-text--teal-900{color:#004d40 !important}.mdl-color--teal-900{background-color:#004d40 !important}.mdl-color-text--teal-A100{color:#a7ffeb !important}.mdl-color--teal-A100{background-color:#a7ffeb !important}.mdl-color-text--teal-A200{color:#64ffda !important}.mdl-color--teal-A200{background-color:#64ffda !important}.mdl-color-text--teal-A400{color:#1de9b6 !important}.mdl-color--teal-A400{background-color:#1de9b6 !important}.mdl-color-text--teal-A700{color:#00bfa5 !important}.mdl-color--teal-A700{background-color:#00bfa5 !important}.mdl-color-text--green{color:#4caf50 !important}.mdl-color--green{background-color:#4caf50 !important}.mdl-color-text--green-50{color:#e8f5e9 !important}.mdl-color--green-50{background-color:#e8f5e9 !important}.mdl-color-text--green-100{color:#c8e6c9 !important}.mdl-color--green-100{background-color:#c8e6c9 !important}.mdl-color-text--green-200{color:#a5d6a7 !important}.mdl-color--green-200{background-color:#a5d6a7 !important}.mdl-color-text--green-300{color:#81c784 !important}.mdl-color--green-300{background-color:#81c784 !important}.mdl-color-text--green-400{color:#66bb6a !important}.mdl-color--green-400{background-color:#66bb6a !important}.mdl-color-text--green-500{color:#4caf50 !important}.mdl-color--green-500{background-color:#4caf50 !important}.mdl-color-text--green-600{color:#43a047 !important}.mdl-color--green-600{background-color:#43a047 !important}.mdl-color-text--green-700{color:#388e3c !important}.mdl-color--green-700{background-color:#388e3c !important}.mdl-color-text--green-800{color:#2e7d32 !important}.mdl-color--green-800{background-color:#2e7d32 !important}.mdl-color-text--green-900{color:#1b5e20 !important}.mdl-color--green-900{background-color:#1b5e20 !important}.mdl-color-text--green-A100{color:#b9f6ca !important}.mdl-color--green-A100{background-color:#b9f6ca !important}.mdl-color-text--green-A200{color:#69f0ae !important}.mdl-color--green-A200{background-color:#69f0ae !important}.mdl-color-text--green-A400{color:#00e676 !important}.mdl-color--green-A400{background-color:#00e676 !important}.mdl-color-text--green-A700{color:#00c853 !important}.mdl-color--green-A700{background-color:#00c853 !important}.mdl-color-text--light-green{color:#8bc34a !important}.mdl-color--light-green{background-color:#8bc34a !important}.mdl-color-text--light-green-50{color:#f1f8e9 !important}.mdl-color--light-green-50{background-color:#f1f8e9 !important}.mdl-color-text--light-green-100{color:#dcedc8 !important}.mdl-color--light-green-100{background-color:#dcedc8 !important}.mdl-color-text--light-green-200{color:#c5e1a5 !important}.mdl-color--light-green-200{background-color:#c5e1a5 !important}.mdl-color-text--light-green-300{color:#aed581 !important}.mdl-color--light-green-300{background-color:#aed581 !important}.mdl-color-text--light-green-400{color:#9ccc65 !important}.mdl-color--light-green-400{background-color:#9ccc65 !important}.mdl-color-text--light-green-500{color:#8bc34a !important}.mdl-color--light-green-500{background-color:#8bc34a !important}.mdl-color-text--light-green-600{color:#7cb342 !important}.mdl-color--light-green-600{background-color:#7cb342 !important}.mdl-color-text--light-green-700{color:#689f38 !important}.mdl-color--light-green-700{background-color:#689f38 !important}.mdl-color-text--light-green-800{color:#558b2f !important}.mdl-color--light-green-800{background-color:#558b2f !important}.mdl-color-text--light-green-900{color:#33691e !important}.mdl-color--light-green-900{background-color:#33691e !important}.mdl-color-text--light-green-A100{color:#ccff90 !important}.mdl-color--light-green-A100{background-color:#ccff90 !important}.mdl-color-text--light-green-A200{color:#b2ff59 !important}.mdl-color--light-green-A200{background-color:#b2ff59 !important}.mdl-color-text--light-green-A400{color:#76ff03 !important}.mdl-color--light-green-A400{background-color:#76ff03 !important}.mdl-color-text--light-green-A700{color:#64dd17 !important}.mdl-color--light-green-A700{background-color:#64dd17 !important}.mdl-color-text--lime{color:#cddc39 !important}.mdl-color--lime{background-color:#cddc39 !important}.mdl-color-text--lime-50{color:#f9fbe7 !important}.mdl-color--lime-50{background-color:#f9fbe7 !important}.mdl-color-text--lime-100{color:#f0f4c3 !important}.mdl-color--lime-100{background-color:#f0f4c3 !important}.mdl-color-text--lime-200{color:#e6ee9c !important}.mdl-color--lime-200{background-color:#e6ee9c !important}.mdl-color-text--lime-300{color:#dce775 !important}.mdl-color--lime-300{background-color:#dce775 !important}.mdl-color-text--lime-400{color:#d4e157 !important}.mdl-color--lime-400{background-color:#d4e157 !important}.mdl-color-text--lime-500{color:#cddc39 !important}.mdl-color--lime-500{background-color:#cddc39 !important}.mdl-color-text--lime-600{color:#c0ca33 !important}.mdl-color--lime-600{background-color:#c0ca33 !important}.mdl-color-text--lime-700{color:#afb42b !important}.mdl-color--lime-700{background-color:#afb42b !important}.mdl-color-text--lime-800{color:#9e9d24 !important}.mdl-color--lime-800{background-color:#9e9d24 !important}.mdl-color-text--lime-900{color:#827717 !important}.mdl-color--lime-900{background-color:#827717 !important}.mdl-color-text--lime-A100{color:#f4ff81 !important}.mdl-color--lime-A100{background-color:#f4ff81 !important}.mdl-color-text--lime-A200{color:#eeff41 !important}.mdl-color--lime-A200{background-color:#eeff41 !important}.mdl-color-text--lime-A400{color:#c6ff00 !important}.mdl-color--lime-A400{background-color:#c6ff00 !important}.mdl-color-text--lime-A700{color:#aeea00 !important}.mdl-color--lime-A700{background-color:#aeea00 !important}.mdl-color-text--yellow{color:#ffeb3b !important}.mdl-color--yellow{background-color:#ffeb3b !important}.mdl-color-text--yellow-50{color:#fffde7 !important}.mdl-color--yellow-50{background-color:#fffde7 !important}.mdl-color-text--yellow-100{color:#fff9c4 !important}.mdl-color--yellow-100{background-color:#fff9c4 !important}.mdl-color-text--yellow-200{color:#fff59d !important}.mdl-color--yellow-200{background-color:#fff59d !important}.mdl-color-text--yellow-300{color:#fff176 !important}.mdl-color--yellow-300{background-color:#fff176 !important}.mdl-color-text--yellow-400{color:#ffee58 !important}.mdl-color--yellow-400{background-color:#ffee58 !important}.mdl-color-text--yellow-500{color:#ffeb3b !important}.mdl-color--yellow-500{background-color:#ffeb3b !important}.mdl-color-text--yellow-600{color:#fdd835 !important}.mdl-color--yellow-600{background-color:#fdd835 !important}.mdl-color-text--yellow-700{color:#fbc02d !important}.mdl-color--yellow-700{background-color:#fbc02d !important}.mdl-color-text--yellow-800{color:#f9a825 !important}.mdl-color--yellow-800{background-color:#f9a825 !important}.mdl-color-text--yellow-900{color:#f57f17 !important}.mdl-color--yellow-900{background-color:#f57f17 !important}.mdl-color-text--yellow-A100{color:#ffff8d !important}.mdl-color--yellow-A100{background-color:#ffff8d !important}.mdl-color-text--yellow-A200{color:#ff0 !important}.mdl-color--yellow-A200{background-color:#ff0 !important}.mdl-color-text--yellow-A400{color:#ffea00 !important}.mdl-color--yellow-A400{background-color:#ffea00 !important}.mdl-color-text--yellow-A700{color:#ffd600 !important}.mdl-color--yellow-A700{background-color:#ffd600 !important}.mdl-color-text--amber{color:#ffc107 !important}.mdl-color--amber{background-color:#ffc107 !important}.mdl-color-text--amber-50{color:#fff8e1 !important}.mdl-color--amber-50{background-color:#fff8e1 !important}.mdl-color-text--amber-100{color:#ffecb3 !important}.mdl-color--amber-100{background-color:#ffecb3 !important}.mdl-color-text--amber-200{color:#ffe082 !important}.mdl-color--amber-200{background-color:#ffe082 !important}.mdl-color-text--amber-300{color:#ffd54f !important}.mdl-color--amber-300{background-color:#ffd54f !important}.mdl-color-text--amber-400{color:#ffca28 !important}.mdl-color--amber-400{background-color:#ffca28 !important}.mdl-color-text--amber-500{color:#ffc107 !important}.mdl-color--amber-500{background-color:#ffc107 !important}.mdl-color-text--amber-600{color:#ffb300 !important}.mdl-color--amber-600{background-color:#ffb300 !important}.mdl-color-text--amber-700{color:#ffa000 !important}.mdl-color--amber-700{background-color:#ffa000 !important}.mdl-color-text--amber-800{color:#ff8f00 !important}.mdl-color--amber-800{background-color:#ff8f00 !important}.mdl-color-text--amber-900{color:#ff6f00 !important}.mdl-color--amber-900{background-color:#ff6f00 !important}.mdl-color-text--amber-A100{color:#ffe57f !important}.mdl-color--amber-A100{background-color:#ffe57f !important}.mdl-color-text--amber-A200{color:#ffd740 !important}.mdl-color--amber-A200{background-color:#ffd740 !important}.mdl-color-text--amber-A400{color:#ffc400 !important}.mdl-color--amber-A400{background-color:#ffc400 !important}.mdl-color-text--amber-A700{color:#ffab00 !important}.mdl-color--amber-A700{background-color:#ffab00 !important}.mdl-color-text--orange{color:#ff9800 !important}.mdl-color--orange{background-color:#ff9800 !important}.mdl-color-text--orange-50{color:#fff3e0 !important}.mdl-color--orange-50{background-color:#fff3e0 !important}.mdl-color-text--orange-100{color:#ffe0b2 !important}.mdl-color--orange-100{background-color:#ffe0b2 !important}.mdl-color-text--orange-200{color:#ffcc80 !important}.mdl-color--orange-200{background-color:#ffcc80 !important}.mdl-color-text--orange-300{color:#ffb74d !important}.mdl-color--orange-300{background-color:#ffb74d !important}.mdl-color-text--orange-400{color:#ffa726 !important}.mdl-color--orange-400{background-color:#ffa726 !important}.mdl-color-text--orange-500{color:#ff9800 !important}.mdl-color--orange-500{background-color:#ff9800 !important}.mdl-color-text--orange-600{color:#fb8c00 !important}.mdl-color--orange-600{background-color:#fb8c00 !important}.mdl-color-text--orange-700{color:#f57c00 !important}.mdl-color--orange-700{background-color:#f57c00 !important}.mdl-color-text--orange-800{color:#ef6c00 !important}.mdl-color--orange-800{background-color:#ef6c00 !important}.mdl-color-text--orange-900{color:#e65100 !important}.mdl-color--orange-900{background-color:#e65100 !important}.mdl-color-text--orange-A100{color:#ffd180 !important}.mdl-color--orange-A100{background-color:#ffd180 !important}.mdl-color-text--orange-A200{color:#ffab40 !important}.mdl-color--orange-A200{background-color:#ffab40 !important}.mdl-color-text--orange-A400{color:#ff9100 !important}.mdl-color--orange-A400{background-color:#ff9100 !important}.mdl-color-text--orange-A700{color:#ff6d00 !important}.mdl-color--orange-A700{background-color:#ff6d00 !important}.mdl-color-text--deep-orange{color:#ff5722 !important}.mdl-color--deep-orange{background-color:#ff5722 !important}.mdl-color-text--deep-orange-50{color:#fbe9e7 !important}.mdl-color--deep-orange-50{background-color:#fbe9e7 !important}.mdl-color-text--deep-orange-100{color:#ffccbc !important}.mdl-color--deep-orange-100{background-color:#ffccbc !important}.mdl-color-text--deep-orange-200{color:#ffab91 !important}.mdl-color--deep-orange-200{background-color:#ffab91 !important}.mdl-color-text--deep-orange-300{color:#ff8a65 !important}.mdl-color--deep-orange-300{background-color:#ff8a65 !important}.mdl-color-text--deep-orange-400{color:#ff7043 !important}.mdl-color--deep-orange-400{background-color:#ff7043 !important}.mdl-color-text--deep-orange-500{color:#ff5722 !important}.mdl-color--deep-orange-500{background-color:#ff5722 !important}.mdl-color-text--deep-orange-600{color:#f4511e !important}.mdl-color--deep-orange-600{background-color:#f4511e !important}.mdl-color-text--deep-orange-700{color:#e64a19 !important}.mdl-color--deep-orange-700{background-color:#e64a19 !important}.mdl-color-text--deep-orange-800{color:#d84315 !important}.mdl-color--deep-orange-800{background-color:#d84315 !important}.mdl-color-text--deep-orange-900{color:#bf360c !important}.mdl-color--deep-orange-900{background-color:#bf360c !important}.mdl-color-text--deep-orange-A100{color:#ff9e80 !important}.mdl-color--deep-orange-A100{background-color:#ff9e80 !important}.mdl-color-text--deep-orange-A200{color:#ff6e40 !important}.mdl-color--deep-orange-A200{background-color:#ff6e40 !important}.mdl-color-text--deep-orange-A400{color:#ff3d00 !important}.mdl-color--deep-orange-A400{background-color:#ff3d00 !important}.mdl-color-text--deep-orange-A700{color:#dd2c00 !important}.mdl-color--deep-orange-A700{background-color:#dd2c00 !important}.mdl-color-text--brown{color:#795548 !important}.mdl-color--brown{background-color:#795548 !important}.mdl-color-text--brown-50{color:#efebe9 !important}.mdl-color--brown-50{background-color:#efebe9 !important}.mdl-color-text--brown-100{color:#d7ccc8 !important}.mdl-color--brown-100{background-color:#d7ccc8 !important}.mdl-color-text--brown-200{color:#bcaaa4 !important}.mdl-color--brown-200{background-color:#bcaaa4 !important}.mdl-color-text--brown-300{color:#a1887f !important}.mdl-color--brown-300{background-color:#a1887f !important}.mdl-color-text--brown-400{color:#8d6e63 !important}.mdl-color--brown-400{background-color:#8d6e63 !important}.mdl-color-text--brown-500{color:#795548 !important}.mdl-color--brown-500{background-color:#795548 !important}.mdl-color-text--brown-600{color:#6d4c41 !important}.mdl-color--brown-600{background-color:#6d4c41 !important}.mdl-color-text--brown-700{color:#5d4037 !important}.mdl-color--brown-700{background-color:#5d4037 !important}.mdl-color-text--brown-800{color:#4e342e !important}.mdl-color--brown-800{background-color:#4e342e !important}.mdl-color-text--brown-900{color:#3e2723 !important}.mdl-color--brown-900{background-color:#3e2723 !important}.mdl-color-text--grey{color:#9e9e9e !important}.mdl-color--grey{background-color:#9e9e9e !important}.mdl-color-text--grey-50{color:#fafafa !important}.mdl-color--grey-50{background-color:#fafafa !important}.mdl-color-text--grey-100{color:#f5f5f5 !important}.mdl-color--grey-100{background-color:#f5f5f5 !important}.mdl-color-text--grey-200{color:#eee !important}.mdl-color--grey-200{background-color:#eee !important}.mdl-color-text--grey-300{color:#e0e0e0 !important}.mdl-color--grey-300{background-color:#e0e0e0 !important}.mdl-color-text--grey-400{color:#bdbdbd !important}.mdl-color--grey-400{background-color:#bdbdbd !important}.mdl-color-text--grey-500{color:#9e9e9e !important}.mdl-color--grey-500{background-color:#9e9e9e !important}.mdl-color-text--grey-600{color:#757575 !important}.mdl-color--grey-600{background-color:#757575 !important}.mdl-color-text--grey-700{color:#616161 !important}.mdl-color--grey-700{background-color:#616161 !important}.mdl-color-text--grey-800{color:#424242 !important}.mdl-color--grey-800{background-color:#424242 !important}.mdl-color-text--grey-900{color:#212121 !important}.mdl-color--grey-900{background-color:#212121 !important}.mdl-color-text--blue-grey{color:#607d8b !important}.mdl-color--blue-grey{background-color:#607d8b !important}.mdl-color-text--blue-grey-50{color:#eceff1 !important}.mdl-color--blue-grey-50{background-color:#eceff1 !important}.mdl-color-text--blue-grey-100{color:#cfd8dc !important}.mdl-color--blue-grey-100{background-color:#cfd8dc !important}.mdl-color-text--blue-grey-200{color:#b0bec5 !important}.mdl-color--blue-grey-200{background-color:#b0bec5 !important}.mdl-color-text--blue-grey-300{color:#90a4ae !important}.mdl-color--blue-grey-300{background-color:#90a4ae !important}.mdl-color-text--blue-grey-400{color:#78909c !important}.mdl-color--blue-grey-400{background-color:#78909c !important}.mdl-color-text--blue-grey-500{color:#607d8b !important}.mdl-color--blue-grey-500{background-color:#607d8b !important}.mdl-color-text--blue-grey-600{color:#546e7a !important}.mdl-color--blue-grey-600{background-color:#546e7a !important}.mdl-color-text--blue-grey-700{color:#455a64 !important}.mdl-color--blue-grey-700{background-color:#455a64 !important}.mdl-color-text--blue-grey-800{color:#37474f !important}.mdl-color--blue-grey-800{background-color:#37474f !important}.mdl-color-text--blue-grey-900{color:#263238 !important}.mdl-color--blue-grey-900{background-color:#263238 !important}.mdl-color--black{background-color:#000 !important}.mdl-color-text--black{color:#000 !important}.mdl-color--white{background-color:#fff !important}.mdl-color-text--white{color:#fff !important}.mdl-color--primary{background-color:rgb(255,152,0)!important}.mdl-color--primary-contrast{background-color:rgb(66,66,66)!important}.mdl-color--primary-dark{background-color:rgb(245,124,0)!important}.mdl-color--accent{background-color:rgb(68,138,255)!important}.mdl-color--accent-contrast{background-color:rgb(255,255,255)!important}.mdl-color-text--primary{color:rgb(255,152,0)!important}.mdl-color-text--primary-contrast{color:rgb(66,66,66)!important}.mdl-color-text--primary-dark{color:rgb(245,124,0)!important}.mdl-color-text--accent{color:rgb(68,138,255)!important}.mdl-color-text--accent-contrast{color:rgb(255,255,255)!important}.mdl-ripple{background:#000;border-radius:50%;height:50px;left:0;opacity:0;pointer-events:none;position:absolute;top:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:50px;overflow:hidden}.mdl-ripple.is-animating{transition:transform .3s cubic-bezier(0,0,.2,1),width .3s cubic-bezier(0,0,.2,1),height .3s cubic-bezier(0,0,.2,1),opacity .6s cubic-bezier(0,0,.2,1);transition:transform .3s cubic-bezier(0,0,.2,1),width .3s cubic-bezier(0,0,.2,1),height .3s cubic-bezier(0,0,.2,1),opacity .6s cubic-bezier(0,0,.2,1),-webkit-transform .3s cubic-bezier(0,0,.2,1)}.mdl-ripple.is-visible{opacity:.3}.mdl-animation--default,.mdl-animation--fast-out-slow-in{transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdl-animation--linear-out-slow-in{transition-timing-function:cubic-bezier(0,0,.2,1)}.mdl-animation--fast-out-linear-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.mdl-badge{position:relative;white-space:nowrap;margin-right:24px}.mdl-badge:not([data-badge]){margin-right:auto}.mdl-badge[data-badge]:after{content:attr(data-badge);display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;position:absolute;top:-11px;right:-24px;font-family:"Roboto","Helvetica","Arial",sans-serif;font-weight:600;font-size:12px;width:22px;height:22px;border-radius:50%;background:rgb(68,138,255);color:rgb(255,255,255)}.mdl-button .mdl-badge[data-badge]:after{top:-10px;right:-5px}.mdl-badge.mdl-badge--no-background[data-badge]:after{color:rgb(68,138,255);background:rgba(255,255,255,.2);box-shadow:0 0 1px gray}.mdl-badge.mdl-badge--overlap{margin-right:10px}.mdl-badge.mdl-badge--overlap:after{right:-10px}.mdl-button{background:0 0;border:none;border-radius:2px;color:#000;position:relative;height:36px;margin:0;min-width:64px;padding:0 16px;display:inline-block;font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:0;overflow:hidden;will-change:box-shadow;transition:box-shadow .2s cubic-bezier(.4,0,1,1),background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1);outline:none;cursor:pointer;text-decoration:none;text-align:center;line-height:36px;vertical-align:middle}.mdl-button::-moz-focus-inner{border:0}.mdl-button:hover{background-color:rgba(158,158,158,.2)}.mdl-button:focus:not(:active){background-color:rgba(0,0,0,.12)}.mdl-button:active{background-color:rgba(158,158,158,.4)}.mdl-button.mdl-button--colored{color:rgb(255,152,0)}.mdl-button.mdl-button--colored:focus:not(:active){background-color:rgba(0,0,0,.12)}input.mdl-button[type="submit"]{-webkit-appearance:none}.mdl-button--raised{background:rgba(158,158,158,.2);box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)}.mdl-button--raised:active{box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);background-color:rgba(158,158,158,.4)}.mdl-button--raised:focus:not(:active){box-shadow:0 0 8px rgba(0,0,0,.18),0 8px 16px rgba(0,0,0,.36);background-color:rgba(158,158,158,.4)}.mdl-button--raised.mdl-button--colored{background:rgb(255,152,0);color:rgb(66,66,66)}.mdl-button--raised.mdl-button--colored:hover{background-color:rgb(255,152,0)}.mdl-button--raised.mdl-button--colored:active{background-color:rgb(255,152,0)}.mdl-button--raised.mdl-button--colored:focus:not(:active){background-color:rgb(255,152,0)}.mdl-button--raised.mdl-button--colored .mdl-ripple{background:rgb(66,66,66)}.mdl-button--fab{border-radius:50%;font-size:24px;height:56px;margin:auto;min-width:56px;width:56px;padding:0;overflow:hidden;background:rgba(158,158,158,.2);box-shadow:0 1px 1.5px 0 rgba(0,0,0,.12),0 1px 1px 0 rgba(0,0,0,.24);position:relative;line-height:normal}.mdl-button--fab .material-icons{position:absolute;top:50%;left:50%;-webkit-transform:translate(-12px,-12px);transform:translate(-12px,-12px);line-height:24px;width:24px}.mdl-button--fab.mdl-button--mini-fab{height:40px;min-width:40px;width:40px}.mdl-button--fab .mdl-button__ripple-container{border-radius:50%;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-button--fab:active{box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2);background-color:rgba(158,158,158,.4)}.mdl-button--fab:focus:not(:active){box-shadow:0 0 8px rgba(0,0,0,.18),0 8px 16px rgba(0,0,0,.36);background-color:rgba(158,158,158,.4)}.mdl-button--fab.mdl-button--colored{background:rgb(68,138,255);color:rgb(255,255,255)}.mdl-button--fab.mdl-button--colored:hover{background-color:rgb(68,138,255)}.mdl-button--fab.mdl-button--colored:focus:not(:active){background-color:rgb(68,138,255)}.mdl-button--fab.mdl-button--colored:active{background-color:rgb(68,138,255)}.mdl-button--fab.mdl-button--colored .mdl-ripple{background:rgb(255,255,255)}.mdl-button--icon{border-radius:50%;font-size:24px;height:32px;margin-left:0;margin-right:0;min-width:32px;width:32px;padding:0;overflow:hidden;color:inherit;line-height:normal}.mdl-button--icon .material-icons{position:absolute;top:50%;left:50%;-webkit-transform:translate(-12px,-12px);transform:translate(-12px,-12px);line-height:24px;width:24px}.mdl-button--icon.mdl-button--mini-icon{height:24px;min-width:24px;width:24px}.mdl-button--icon.mdl-button--mini-icon .material-icons{top:0;left:0}.mdl-button--icon .mdl-button__ripple-container{border-radius:50%;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-button__ripple-container{display:block;height:100%;left:0;position:absolute;top:0;width:100%;z-index:0;overflow:hidden}.mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple,.mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple{background-color:transparent}.mdl-button--primary.mdl-button--primary{color:rgb(255,152,0)}.mdl-button--primary.mdl-button--primary .mdl-ripple{background:rgb(66,66,66)}.mdl-button--primary.mdl-button--primary.mdl-button--raised,.mdl-button--primary.mdl-button--primary.mdl-button--fab{color:rgb(66,66,66);background-color:rgb(255,152,0)}.mdl-button--accent.mdl-button--accent{color:rgb(68,138,255)}.mdl-button--accent.mdl-button--accent .mdl-ripple{background:rgb(255,255,255)}.mdl-button--accent.mdl-button--accent.mdl-button--raised,.mdl-button--accent.mdl-button--accent.mdl-button--fab{color:rgb(255,255,255);background-color:rgb(68,138,255)}.mdl-button[disabled][disabled],.mdl-button.mdl-button--disabled.mdl-button--disabled{color:rgba(0,0,0,.26);cursor:default;background-color:transparent}.mdl-button--fab[disabled][disabled],.mdl-button--fab.mdl-button--disabled.mdl-button--disabled{background-color:rgba(0,0,0,.12);color:rgba(0,0,0,.26)}.mdl-button--raised[disabled][disabled],.mdl-button--raised.mdl-button--disabled.mdl-button--disabled{background-color:rgba(0,0,0,.12);color:rgba(0,0,0,.26);box-shadow:none}.mdl-button--colored[disabled][disabled],.mdl-button--colored.mdl-button--disabled.mdl-button--disabled{color:rgba(0,0,0,.26)}.mdl-button .material-icons{vertical-align:middle}.mdl-card{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;font-size:16px;font-weight:400;min-height:200px;overflow:hidden;width:330px;z-index:1;position:relative;background:#fff;border-radius:2px;box-sizing:border-box}.mdl-card__media{background-color:rgb(68,138,255);background-repeat:repeat;background-position:50% 50%;background-size:cover;background-origin:padding-box;background-attachment:scroll;box-sizing:border-box}.mdl-card__title{-webkit-align-items:center;-ms-flex-align:center;align-items:center;color:#000;display:block;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:stretch;-ms-flex-pack:stretch;justify-content:stretch;line-height:normal;padding:16px;-webkit-perspective-origin:165px 56px;perspective-origin:165px 56px;-webkit-transform-origin:165px 56px;transform-origin:165px 56px;box-sizing:border-box}.mdl-card__title.mdl-card--border{border-bottom:1px solid rgba(0,0,0,.1)}.mdl-card__title-text{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end;color:inherit;display:block;display:-webkit-flex;display:-ms-flexbox;display:flex;font-size:24px;font-weight:300;line-height:normal;overflow:hidden;-webkit-transform-origin:149px 48px;transform-origin:149px 48px;margin:0}.mdl-card__subtitle-text{font-size:14px;color:rgba(0,0,0,.54);margin:0}.mdl-card__supporting-text{color:rgba(0,0,0,.54);font-size:1rem;line-height:18px;overflow:hidden;padding:16px;width:90%}.mdl-card__actions{font-size:16px;line-height:normal;width:100%;background-color:transparent;padding:8px;box-sizing:border-box}.mdl-card__actions.mdl-card--border{border-top:1px solid rgba(0,0,0,.1)}.mdl-card--expand{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.mdl-card__menu{position:absolute;right:16px;top:16px}.mdl-checkbox{position:relative;z-index:1;vertical-align:middle;display:inline-block;box-sizing:border-box;width:100%;height:24px;margin:0;padding:0}.mdl-checkbox.is-upgraded{padding-left:24px}.mdl-checkbox__input{line-height:24px}.mdl-checkbox.is-upgraded .mdl-checkbox__input{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-checkbox__box-outline{position:absolute;top:3px;left:0;display:inline-block;box-sizing:border-box;width:16px;height:16px;margin:0;cursor:pointer;overflow:hidden;border:2px solid rgba(0,0,0,.54);border-radius:2px;z-index:2}.mdl-checkbox.is-checked .mdl-checkbox__box-outline{border:2px solid rgb(255,152,0)}fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline,.mdl-checkbox.is-disabled .mdl-checkbox__box-outline{border:2px solid rgba(0,0,0,.26);cursor:auto}.mdl-checkbox__focus-helper{position:absolute;top:3px;left:0;display:inline-block;box-sizing:border-box;width:16px;height:16px;border-radius:50%;background-color:transparent}.mdl-checkbox.is-focused .mdl-checkbox__focus-helper{box-shadow:0 0 0 8px rgba(0,0,0,.1);background-color:rgba(0,0,0,.1)}.mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper{box-shadow:0 0 0 8px rgba(255,152,0,.26);background-color:rgba(255,152,0,.26)}.mdl-checkbox__tick-outline{position:absolute;top:0;left:0;height:100%;width:100%;-webkit-mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg==");background:0 0;transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:background}.mdl-checkbox.is-checked .mdl-checkbox__tick-outline{background:rgb(255,152,0)url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K")}fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline,.mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline{background:rgba(0,0,0,.26)url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K")}.mdl-checkbox__label{position:relative;cursor:pointer;font-size:16px;line-height:24px;margin:0}fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,.mdl-checkbox.is-disabled .mdl-checkbox__label{color:rgba(0,0,0,.26);cursor:auto}.mdl-checkbox__ripple-container{position:absolute;z-index:2;top:-6px;left:-10px;box-sizing:border-box;width:36px;height:36px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-checkbox__ripple-container .mdl-ripple{background:rgb(255,152,0)}fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container,.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container{cursor:auto}fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple,.mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple{background:0 0}.mdl-data-table{position:relative;border:1px solid rgba(0,0,0,.12);border-collapse:collapse;white-space:nowrap;font-size:13px;background-color:#fff}.mdl-data-table thead{padding-bottom:3px}.mdl-data-table thead .mdl-data-table__select{margin-top:0}.mdl-data-table tbody tr{position:relative;height:48px;transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:background-color}.mdl-data-table tbody tr.is-selected{background-color:#e0e0e0}.mdl-data-table tbody tr:hover{background-color:#eee}.mdl-data-table td{text-align:right}.mdl-data-table th{padding:0 18px 12px 18px;text-align:right}.mdl-data-table td:first-of-type,.mdl-data-table th:first-of-type{padding-left:24px}.mdl-data-table td:last-of-type,.mdl-data-table th:last-of-type{padding-right:24px}.mdl-data-table td{position:relative;height:48px;border-top:1px solid rgba(0,0,0,.12);border-bottom:1px solid rgba(0,0,0,.12);padding:12px 18px;box-sizing:border-box}.mdl-data-table td,.mdl-data-table td .mdl-data-table__select{vertical-align:middle}.mdl-data-table th{position:relative;vertical-align:bottom;text-overflow:ellipsis;font-weight:700;line-height:24px;letter-spacing:0;height:48px;font-size:12px;color:rgba(0,0,0,.54);padding-bottom:8px;box-sizing:border-box}.mdl-data-table th.mdl-data-table__header--sorted-ascending,.mdl-data-table th.mdl-data-table__header--sorted-descending{color:rgba(0,0,0,.87)}.mdl-data-table th.mdl-data-table__header--sorted-ascending:before,.mdl-data-table th.mdl-data-table__header--sorted-descending:before{font-family:'Material Icons';font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;word-wrap:normal;-moz-font-feature-settings:'liga';font-feature-settings:'liga';-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased;font-size:16px;content:"\e5d8";margin-right:5px;vertical-align:sub}.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover,.mdl-data-table th.mdl-data-table__header--sorted-descending:hover{cursor:pointer}.mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before,.mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before{color:rgba(0,0,0,.26)}.mdl-data-table th.mdl-data-table__header--sorted-descending:before{content:"\e5db"}.mdl-data-table__select{width:16px}.mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric{text-align:left}.mdl-dialog{border:none;box-shadow:0 9px 46px 8px rgba(0,0,0,.14),0 11px 15px -7px rgba(0,0,0,.12),0 24px 38px 3px rgba(0,0,0,.2);width:280px}.mdl-dialog__title{padding:24px 24px 0;margin:0;font-size:2.5rem}.mdl-dialog__actions{padding:8px 8px 8px 24px;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.mdl-dialog__actions>*{margin-right:8px;height:36px}.mdl-dialog__actions>*:first-child{margin-right:0}.mdl-dialog__actions--full-width{padding:0 0 8px}.mdl-dialog__actions--full-width>*{height:48px;-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;padding-right:16px;margin-right:0;text-align:right}.mdl-dialog__content{padding:20px 24px 24px;color:rgba(0,0,0,.54)}.mdl-mega-footer{padding:16px 40px;color:#9e9e9e;background-color:#424242}.mdl-mega-footer--top-section:after,.mdl-mega-footer--middle-section:after,.mdl-mega-footer--bottom-section:after,.mdl-mega-footer__top-section:after,.mdl-mega-footer__middle-section:after,.mdl-mega-footer__bottom-section:after{content:'';display:block;clear:both}.mdl-mega-footer--left-section,.mdl-mega-footer__left-section,.mdl-mega-footer--right-section,.mdl-mega-footer__right-section{margin-bottom:16px}.mdl-mega-footer--right-section a,.mdl-mega-footer__right-section a{display:block;margin-bottom:16px;color:inherit;text-decoration:none}@media screen and (min-width:760px){.mdl-mega-footer--left-section,.mdl-mega-footer__left-section{float:left}.mdl-mega-footer--right-section,.mdl-mega-footer__right-section{float:right}.mdl-mega-footer--right-section a,.mdl-mega-footer__right-section a{display:inline-block;margin-left:16px;line-height:36px;vertical-align:middle}}.mdl-mega-footer--social-btn,.mdl-mega-footer__social-btn{width:36px;height:36px;padding:0;margin:0;background-color:#9e9e9e;border:none}.mdl-mega-footer--drop-down-section,.mdl-mega-footer__drop-down-section{display:block;position:relative}@media screen and (min-width:760px){.mdl-mega-footer--drop-down-section,.mdl-mega-footer__drop-down-section{width:33%}.mdl-mega-footer--drop-down-section:nth-child(1),.mdl-mega-footer--drop-down-section:nth-child(2),.mdl-mega-footer__drop-down-section:nth-child(1),.mdl-mega-footer__drop-down-section:nth-child(2){float:left}.mdl-mega-footer--drop-down-section:nth-child(3),.mdl-mega-footer__drop-down-section:nth-child(3){float:right}.mdl-mega-footer--drop-down-section:nth-child(3):after,.mdl-mega-footer__drop-down-section:nth-child(3):after{clear:right}.mdl-mega-footer--drop-down-section:nth-child(4),.mdl-mega-footer__drop-down-section:nth-child(4){clear:right;float:right}.mdl-mega-footer--middle-section:after,.mdl-mega-footer__middle-section:after{content:'';display:block;clear:both}.mdl-mega-footer--bottom-section,.mdl-mega-footer__bottom-section{padding-top:0}}@media screen and (min-width:1024px){.mdl-mega-footer--drop-down-section,.mdl-mega-footer--drop-down-section:nth-child(3),.mdl-mega-footer--drop-down-section:nth-child(4),.mdl-mega-footer__drop-down-section,.mdl-mega-footer__drop-down-section:nth-child(3),.mdl-mega-footer__drop-down-section:nth-child(4){width:24%;float:left}}.mdl-mega-footer--heading-checkbox,.mdl-mega-footer__heading-checkbox{position:absolute;width:100%;height:55.8px;padding:32px;margin:-16px 0 0;cursor:pointer;z-index:1;opacity:0}.mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after{font-family:'Material Icons';content:'\E5CE'}.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list{display:none}.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after{font-family:'Material Icons';content:'\E5CF'}.mdl-mega-footer--heading,.mdl-mega-footer__heading{position:relative;width:100%;padding-right:39.8px;margin-bottom:16px;box-sizing:border-box;font-size:14px;line-height:23.8px;font-weight:500;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#e0e0e0}.mdl-mega-footer--heading:after,.mdl-mega-footer__heading:after{content:'';position:absolute;top:0;right:0;display:block;width:23.8px;height:23.8px;background-size:cover}.mdl-mega-footer--link-list,.mdl-mega-footer__link-list{list-style:none;padding:0;margin:0 0 32px}.mdl-mega-footer--link-list:after,.mdl-mega-footer__link-list:after{clear:both;display:block;content:''}.mdl-mega-footer--link-list li,.mdl-mega-footer__link-list li{font-size:14px;font-weight:400;letter-spacing:0;line-height:20px}.mdl-mega-footer--link-list a,.mdl-mega-footer__link-list a{color:inherit;text-decoration:none;white-space:nowrap}@media screen and (min-width:760px){.mdl-mega-footer--heading-checkbox,.mdl-mega-footer__heading-checkbox{display:none}.mdl-mega-footer--heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox+.mdl-mega-footer__heading:after{content:''}.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer--heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer--link-list,.mdl-mega-footer__heading-checkbox:checked~.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading+.mdl-mega-footer__link-list,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading+.mdl-mega-footer--link-list{display:block}.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer--heading-checkbox:checked+.mdl-mega-footer__heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer--heading:after,.mdl-mega-footer__heading-checkbox:checked+.mdl-mega-footer__heading:after{content:''}}.mdl-mega-footer--bottom-section,.mdl-mega-footer__bottom-section{padding-top:16px;margin-bottom:16px}.mdl-logo{margin-bottom:16px;color:#fff}.mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li,.mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li{float:left;margin-bottom:0;margin-right:16px}@media screen and (min-width:760px){.mdl-logo{float:left;margin-bottom:0;margin-right:16px}}.mdl-mini-footer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:32px 16px;color:#9e9e9e;background-color:#424242}.mdl-mini-footer:after{content:'';display:block}.mdl-mini-footer .mdl-logo{line-height:36px}.mdl-mini-footer--link-list,.mdl-mini-footer__link-list{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap;list-style:none;margin:0;padding:0}.mdl-mini-footer--link-list li,.mdl-mini-footer__link-list li{margin-bottom:0;margin-right:16px}@media screen and (min-width:760px){.mdl-mini-footer--link-list li,.mdl-mini-footer__link-list li{line-height:36px}}.mdl-mini-footer--link-list a,.mdl-mini-footer__link-list a{color:inherit;text-decoration:none;white-space:nowrap}.mdl-mini-footer--left-section,.mdl-mini-footer__left-section{display:inline-block;-webkit-order:0;-ms-flex-order:0;order:0}.mdl-mini-footer--right-section,.mdl-mini-footer__right-section{display:inline-block;-webkit-order:1;-ms-flex-order:1;order:1}.mdl-mini-footer--social-btn,.mdl-mini-footer__social-btn{width:36px;height:36px;padding:0;margin:0;background-color:#9e9e9e;border:none}.mdl-icon-toggle{position:relative;z-index:1;vertical-align:middle;display:inline-block;height:32px;margin:0;padding:0}.mdl-icon-toggle__input{line-height:32px}.mdl-icon-toggle.is-upgraded .mdl-icon-toggle__input{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-icon-toggle__label{display:inline-block;position:relative;cursor:pointer;height:32px;width:32px;min-width:32px;color:#616161;border-radius:50%;padding:0;margin-left:0;margin-right:0;text-align:center;background-color:transparent;will-change:background-color;transition:background-color .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1)}.mdl-icon-toggle__label.material-icons{line-height:32px;font-size:24px}.mdl-icon-toggle.is-checked .mdl-icon-toggle__label{color:rgb(255,152,0)}.mdl-icon-toggle.is-disabled .mdl-icon-toggle__label{color:rgba(0,0,0,.26);cursor:auto;transition:none}.mdl-icon-toggle.is-focused .mdl-icon-toggle__label{background-color:rgba(0,0,0,.12)}.mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label{background-color:rgba(255,152,0,.26)}.mdl-icon-toggle__ripple-container{position:absolute;z-index:2;top:-2px;left:-2px;box-sizing:border-box;width:36px;height:36px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-icon-toggle__ripple-container .mdl-ripple{background:#616161}.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container{cursor:auto}.mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple{background:0 0}.mdl-list{display:block;padding:8px 0;list-style:none}.mdl-list__item{font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:16px;font-weight:400;letter-spacing:.04em;line-height:1;min-height:48px;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;padding:16px;cursor:default;color:rgba(0,0,0,.87);overflow:hidden}.mdl-list__item,.mdl-list__item .mdl-list__item-primary-content{box-sizing:border-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.mdl-list__item .mdl-list__item-primary-content{-webkit-order:0;-ms-flex-order:0;order:0;-webkit-flex-grow:2;-ms-flex-positive:2;flex-grow:2;text-decoration:none}.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon{margin-right:32px}.mdl-list__item .mdl-list__item-primary-content .mdl-list__item-avatar{margin-right:16px}.mdl-list__item .mdl-list__item-secondary-content{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:column;-ms-flex-flow:column;flex-flow:column;-webkit-align-items:flex-end;-ms-flex-align:end;align-items:flex-end;margin-left:16px}.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-action label{display:inline}.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-info{font-size:12px;font-weight:400;line-height:1;letter-spacing:0;color:rgba(0,0,0,.54)}.mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-sub-header{padding:0 0 0 16px}.mdl-list__item-icon,.mdl-list__item-icon.material-icons{height:24px;width:24px;font-size:24px;box-sizing:border-box;color:#757575}.mdl-list__item-avatar,.mdl-list__item-avatar.material-icons{height:40px;width:40px;box-sizing:border-box;border-radius:50%;background-color:#757575;font-size:40px;color:#fff}.mdl-list__item--two-line{height:72px}.mdl-list__item--two-line .mdl-list__item-primary-content{height:36px;line-height:20px;display:block}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-avatar{float:left}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-icon{float:left;margin-top:6px}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-secondary-content{height:36px}.mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title{font-size:14px;font-weight:400;letter-spacing:0;line-height:18px;color:rgba(0,0,0,.54);display:block;padding:0}.mdl-list__item--three-line{height:88px}.mdl-list__item--three-line .mdl-list__item-primary-content{height:52px;line-height:20px;display:block}.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-avatar,.mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-icon{float:left}.mdl-list__item--three-line .mdl-list__item-secondary-content{height:52px}.mdl-list__item--three-line .mdl-list__item-text-body{font-size:14px;font-weight:400;letter-spacing:0;line-height:18px;height:52px;color:rgba(0,0,0,.54);display:block;padding:0}.mdl-menu__container{display:block;margin:0;padding:0;border:none;position:absolute;overflow:visible;height:0;width:0;visibility:hidden;z-index:-1}.mdl-menu__container.is-visible,.mdl-menu__container.is-animating{z-index:999;visibility:visible}.mdl-menu__outline{display:block;background:#fff;margin:0;padding:0;border:none;border-radius:2px;position:absolute;top:0;left:0;overflow:hidden;opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:0 0;transform-origin:0 0;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);will-change:transform;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1);z-index:-1}.mdl-menu__container.is-visible .mdl-menu__outline{opacity:1;-webkit-transform:scale(1);transform:scale(1);z-index:999}.mdl-menu__outline.mdl-menu--bottom-right{-webkit-transform-origin:100% 0;transform-origin:100% 0}.mdl-menu__outline.mdl-menu--top-left{-webkit-transform-origin:0 100%;transform-origin:0 100%}.mdl-menu__outline.mdl-menu--top-right{-webkit-transform-origin:100% 100%;transform-origin:100% 100%}.mdl-menu{position:absolute;list-style:none;top:0;left:0;height:auto;width:auto;min-width:124px;padding:8px 0;margin:0;opacity:0;clip:rect(0 0 0 0);z-index:-1}.mdl-menu__container.is-visible .mdl-menu{opacity:1;z-index:999}.mdl-menu.is-animating{transition:opacity .2s cubic-bezier(.4,0,.2,1),clip .3s cubic-bezier(.4,0,.2,1)}.mdl-menu.mdl-menu--bottom-right{left:auto;right:0}.mdl-menu.mdl-menu--top-left{top:auto;bottom:0}.mdl-menu.mdl-menu--top-right{top:auto;left:auto;bottom:0;right:0}.mdl-menu.mdl-menu--unaligned{top:auto;left:auto}.mdl-menu__item{display:block;border:none;color:rgba(0,0,0,.87);background-color:transparent;text-align:left;margin:0;padding:0 16px;outline-color:#bdbdbd;position:relative;overflow:hidden;font-size:14px;font-weight:400;letter-spacing:0;text-decoration:none;cursor:pointer;height:48px;line-height:48px;white-space:nowrap;opacity:0;transition:opacity .2s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mdl-menu__container.is-visible .mdl-menu__item{opacity:1}.mdl-menu__item::-moz-focus-inner{border:0}.mdl-menu__item--full-bleed-divider{border-bottom:1px solid rgba(0,0,0,.12)}.mdl-menu__item[disabled],.mdl-menu__item[data-mdl-disabled]{color:#bdbdbd;background-color:transparent;cursor:auto}.mdl-menu__item[disabled]:hover,.mdl-menu__item[data-mdl-disabled]:hover{background-color:transparent}.mdl-menu__item[disabled]:focus,.mdl-menu__item[data-mdl-disabled]:focus{background-color:transparent}.mdl-menu__item[disabled] .mdl-ripple,.mdl-menu__item[data-mdl-disabled] .mdl-ripple{background:0 0}.mdl-menu__item:hover{background-color:#eee}.mdl-menu__item:focus{outline:none;background-color:#eee}.mdl-menu__item:active{background-color:#e0e0e0}.mdl-menu__item--ripple-container{display:block;height:100%;left:0;position:absolute;top:0;width:100%;z-index:0;overflow:hidden}.mdl-progress{display:block;position:relative;height:4px;width:500px;max-width:100%}.mdl-progress>.bar{display:block;position:absolute;top:0;bottom:0;width:0%;transition:width .2s cubic-bezier(.4,0,.2,1)}.mdl-progress>.progressbar{background-color:rgb(255,152,0);z-index:1;left:0}.mdl-progress>.bufferbar{background-image:linear-gradient(to right,rgba(66,66,66,.7),rgba(66,66,66,.7)),linear-gradient(to right,rgb(255,152,0),rgb(255,152,0));z-index:0;left:0}.mdl-progress>.auxbar{right:0}@supports (-webkit-appearance:none){.mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate)>.auxbar,.mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate)>.auxbar{background-image:linear-gradient(to right,rgba(66,66,66,.7),rgba(66,66,66,.7)),linear-gradient(to right,rgb(255,152,0),rgb(255,152,0));-webkit-mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=");mask:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjEyIiBoZWlnaHQ9IjQiIHZpZXdQb3J0PSIwIDAgMTIgNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxlbGxpcHNlIGN4PSIyIiBjeT0iMiIgcng9IjIiIHJ5PSIyIj4KICAgIDxhbmltYXRlIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIyIiB0bz0iLTEwIiBkdXI9IjAuNnMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIiAvPgogIDwvZWxsaXBzZT4KICA8ZWxsaXBzZSBjeD0iMTQiIGN5PSIyIiByeD0iMiIgcnk9IjIiIGNsYXNzPSJsb2FkZXIiPgogICAgPGFuaW1hdGUgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE0IiB0bz0iMiIgZHVyPSIwLjZzIiByZXBlYXRDb3VudD0iaW5kZWZpbml0ZSIgLz4KICA8L2VsbGlwc2U+Cjwvc3ZnPgo=")}}.mdl-progress:not(.mdl-progress--indeterminate)>.auxbar,.mdl-progress:not(.mdl-progress__indeterminate)>.auxbar{background-image:linear-gradient(to right,rgba(66,66,66,.9),rgba(66,66,66,.9)),linear-gradient(to right,rgb(255,152,0),rgb(255,152,0))}.mdl-progress.mdl-progress--indeterminate>.bar1,.mdl-progress.mdl-progress__indeterminate>.bar1{-webkit-animation-name:indeterminate1;animation-name:indeterminate1}.mdl-progress.mdl-progress--indeterminate>.bar1,.mdl-progress.mdl-progress__indeterminate>.bar1,.mdl-progress.mdl-progress--indeterminate>.bar3,.mdl-progress.mdl-progress__indeterminate>.bar3{background-color:rgb(255,152,0);-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear}.mdl-progress.mdl-progress--indeterminate>.bar3,.mdl-progress.mdl-progress__indeterminate>.bar3{background-image:none;-webkit-animation-name:indeterminate2;animation-name:indeterminate2}@-webkit-keyframes indeterminate1{0%{left:0%;width:0%}50%{left:25%;width:75%}75%{left:100%;width:0%}}@keyframes indeterminate1{0%{left:0%;width:0%}50%{left:25%;width:75%}75%{left:100%;width:0%}}@-webkit-keyframes indeterminate2{0%,50%{left:0%;width:0%}75%{left:0%;width:25%}100%{left:100%;width:0%}}@keyframes indeterminate2{0%,50%{left:0%;width:0%}75%{left:0%;width:25%}100%{left:100%;width:0%}}.mdl-navigation{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;box-sizing:border-box}.mdl-navigation__link{color:#424242;text-decoration:none;margin:0;font-size:14px;font-weight:400;line-height:24px;letter-spacing:0;opacity:.87}.mdl-navigation__link .material-icons{vertical-align:middle}.mdl-layout{width:100%;height:100%;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow-y:auto;overflow-x:hidden;position:relative;-webkit-overflow-scrolling:touch}.mdl-layout.is-small-screen .mdl-layout--large-screen-only{display:none}.mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only{display:none}.mdl-layout__container{position:absolute;width:100%;height:100%}.mdl-layout__title,.mdl-layout-title{display:block;position:relative;font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:20px;line-height:1;letter-spacing:.02em;font-weight:400;box-sizing:border-box}.mdl-layout-spacer{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.mdl-layout__drawer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;width:240px;height:100%;max-height:100%;position:absolute;top:0;left:0;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);box-sizing:border-box;border-right:1px solid #e0e0e0;background:#fafafa;-webkit-transform:translateX(-250px);transform:translateX(-250px);-webkit-transform-style:preserve-3d;transform-style:preserve-3d;will-change:transform;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:transform;transition-property:transform,-webkit-transform;color:#424242;overflow:visible;overflow-y:auto;z-index:5}.mdl-layout__drawer.is-visible{-webkit-transform:translateX(0);transform:translateX(0)}.mdl-layout__drawer.is-visible~.mdl-layout__content.mdl-layout__content{overflow:hidden}.mdl-layout__drawer>*{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}.mdl-layout__drawer>.mdl-layout__title,.mdl-layout__drawer>.mdl-layout-title{line-height:64px;padding-left:40px}@media screen and (max-width:1024px){.mdl-layout__drawer>.mdl-layout__title,.mdl-layout__drawer>.mdl-layout-title{line-height:56px;padding-left:16px}}.mdl-layout__drawer .mdl-navigation{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-ms-flex-align:stretch;-ms-grid-row-align:stretch;align-items:stretch;padding-top:16px}.mdl-layout__drawer .mdl-navigation .mdl-navigation__link{display:block;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;padding:16px 40px;margin:0;color:#757575}@media screen and (max-width:1024px){.mdl-layout__drawer .mdl-navigation .mdl-navigation__link{padding:16px}}.mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover{background-color:#e0e0e0}.mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current{background-color:#000;color:#e0e0e0}@media screen and (min-width:1025px){.mdl-layout--fixed-drawer>.mdl-layout__drawer{-webkit-transform:translateX(0);transform:translateX(0)}}.mdl-layout__drawer-button{display:block;position:absolute;height:48px;width:48px;border:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;overflow:hidden;text-align:center;cursor:pointer;font-size:26px;line-height:50px;font-family:Helvetica,Arial,sans-serif;margin:10px 12px;top:0;left:0;color:rgb(66,66,66);z-index:4}.mdl-layout__header .mdl-layout__drawer-button{position:absolute;color:rgb(255,255,255);background-color:inherit}@media screen and (max-width:1024px){.mdl-layout__header .mdl-layout__drawer-button{margin:4px}}@media screen and (max-width:1024px){.mdl-layout__drawer-button{margin:4px;color:rgba(0,0,0,.5)}}@media screen and (min-width:1025px){.mdl-layout--fixed-drawer>.mdl-layout__drawer-button,.mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button{display:none}}.mdl-layout--no-drawer-button .mdl-layout__drawer-button{display:none}.mdl-layout__header{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;box-sizing:border-box;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;margin:0;padding:0;border:none;min-height:64px;max-height:1000px;z-index:3;background-color:rgb(31,188,210);color:rgb(255,255,255);box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:max-height,box-shadow}@media screen and (max-width:1024px){.mdl-layout__header{min-height:56px}}.mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen)>.mdl-layout__header{margin-left:240px;width:calc(100% - 240px)}@media screen and (min-width:1025px){.mdl-layout--fixed-drawer>.mdl-layout__header .mdl-layout__header-row{padding-left:40px}}.mdl-layout__header>.mdl-layout-icon{position:absolute;left:40px;top:16px;height:32px;width:32px;overflow:hidden;z-index:3;display:block}@media screen and (max-width:1024px){.mdl-layout__header>.mdl-layout-icon{left:16px;top:12px}}.mdl-layout.has-drawer .mdl-layout__header>.mdl-layout-icon{display:none}.mdl-layout__header.is-compact{max-height:64px}@media screen and (max-width:1024px){.mdl-layout__header.is-compact{max-height:56px}}.mdl-layout__header.is-compact.has-tabs{height:112px}@media screen and (max-width:1024px){.mdl-layout__header.is-compact.has-tabs{min-height:104px}}@media screen and (max-width:1024px){.mdl-layout__header{display:none}.mdl-layout--fixed-header>.mdl-layout__header{display:-webkit-flex;display:-ms-flexbox;display:flex}}.mdl-layout__header--transparent.mdl-layout__header--transparent{background-color:transparent;box-shadow:none}.mdl-layout__header--seamed,.mdl-layout__header--scroll{box-shadow:none}.mdl-layout__header--waterfall{box-shadow:none;overflow:hidden}.mdl-layout__header--waterfall.is-casting-shadow{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)}.mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top{-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.mdl-layout__header-row{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;box-sizing:border-box;-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:64px;margin:0;padding:0 40px 0 80px}.mdl-layout--no-drawer-button .mdl-layout__header-row{padding-left:40px}@media screen and (min-width:1025px){.mdl-layout--no-desktop-drawer-button .mdl-layout__header-row{padding-left:40px}}@media screen and (max-width:1024px){.mdl-layout__header-row{height:56px;padding:0 16px 0 72px}.mdl-layout--no-drawer-button .mdl-layout__header-row{padding-left:16px}}.mdl-layout__header-row>*{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}.mdl-layout__header--scroll .mdl-layout__header-row{width:100%}.mdl-layout__header-row .mdl-navigation{margin:0;padding:0;height:64px;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-ms-flex-align:center;-ms-grid-row-align:center;align-items:center}@media screen and (max-width:1024px){.mdl-layout__header-row .mdl-navigation{height:56px}}.mdl-layout__header-row .mdl-navigation__link{display:block;color:rgb(255,255,255);line-height:64px;padding:0 24px}@media screen and (max-width:1024px){.mdl-layout__header-row .mdl-navigation__link{line-height:56px;padding:0 16px}}.mdl-layout__obfuscator{background-color:transparent;position:absolute;top:0;left:0;height:100%;width:100%;z-index:4;visibility:hidden;transition-property:background-color;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdl-layout__obfuscator.is-visible{background-color:rgba(0,0,0,.5);visibility:visible}@supports (pointer-events:auto){.mdl-layout__obfuscator{background-color:rgba(0,0,0,.5);opacity:0;transition-property:opacity;visibility:visible;pointer-events:none}.mdl-layout__obfuscator.is-visible{pointer-events:auto;opacity:1}}.mdl-layout__content{-ms-flex:0 1 auto;position:relative;display:inline-block;overflow-y:auto;overflow-x:hidden;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;z-index:1;-webkit-overflow-scrolling:touch}.mdl-layout--fixed-drawer>.mdl-layout__content{margin-left:240px}.mdl-layout__container.has-scrolling-header .mdl-layout__content{overflow:visible}@media screen and (max-width:1024px){.mdl-layout--fixed-drawer>.mdl-layout__content{margin-left:0}.mdl-layout__container.has-scrolling-header .mdl-layout__content{overflow-y:auto;overflow-x:hidden}}.mdl-layout__tab-bar{height:96px;margin:0;width:calc(100% - 112px);padding:0 0 0 56px;display:-webkit-flex;display:-ms-flexbox;display:flex;background-color:rgb(255,152,0);overflow-y:hidden;overflow-x:scroll}.mdl-layout__tab-bar::-webkit-scrollbar{display:none}.mdl-layout--no-drawer-button .mdl-layout__tab-bar{padding-left:16px;width:calc(100% - 32px)}@media screen and (min-width:1025px){.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar{padding-left:16px;width:calc(100% - 32px)}}@media screen and (max-width:1024px){.mdl-layout__tab-bar{width:calc(100% - 60px);padding:0 0 0 60px}.mdl-layout--no-drawer-button .mdl-layout__tab-bar{width:calc(100% - 8px);padding-left:4px}}.mdl-layout--fixed-tabs .mdl-layout__tab-bar{padding:0;overflow:hidden;width:100%}.mdl-layout__tab-bar-container{position:relative;height:48px;width:100%;border:none;margin:0;z-index:2;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;overflow:hidden}.mdl-layout__container>.mdl-layout__tab-bar-container{position:absolute;top:0;left:0}.mdl-layout__tab-bar-button{display:inline-block;position:absolute;top:0;height:48px;width:56px;z-index:4;text-align:center;background-color:rgb(255,152,0);color:transparent;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button,.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button{width:16px}.mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons,.mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons{position:relative;left:-4px}@media screen and (max-width:1024px){.mdl-layout__tab-bar-button{display:none;width:60px}}.mdl-layout--fixed-tabs .mdl-layout__tab-bar-button{display:none}.mdl-layout__tab-bar-button .material-icons{line-height:48px}.mdl-layout__tab-bar-button.is-active{color:rgb(66,66,66)}.mdl-layout__tab-bar-left-button{left:0}.mdl-layout__tab-bar-right-button{right:0}.mdl-layout__tab{margin:0;border:none;padding:0 24px;float:left;position:relative;display:block;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;text-decoration:none;height:48px;line-height:48px;text-align:center;font-weight:500;font-size:14px;text-transform:uppercase;color:rgba(66,66,66,.6);overflow:hidden}@media screen and (max-width:1024px){.mdl-layout__tab{padding:0 12px}}.mdl-layout--fixed-tabs .mdl-layout__tab{float:none;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:0}.mdl-layout.is-upgraded .mdl-layout__tab.is-active{color:rgb(66,66,66)}.mdl-layout.is-upgraded .mdl-layout__tab.is-active::after{height:2px;width:100%;display:block;content:" ";bottom:0;left:0;position:absolute;background:rgb(68,138,255);-webkit-animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;transition:all 1s cubic-bezier(.4,0,1,1)}.mdl-layout__tab .mdl-layout__tab-ripple-container{display:block;position:absolute;height:100%;width:100%;left:0;top:0;z-index:1;overflow:hidden}.mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple{background-color:rgb(66,66,66)}.mdl-layout__tab-panel{display:block}.mdl-layout.is-upgraded .mdl-layout__tab-panel{display:none}.mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active{display:block}.mdl-radio{position:relative;font-size:16px;line-height:24px;display:inline-block;box-sizing:border-box;margin:0;padding-left:0}.mdl-radio.is-upgraded{padding-left:24px}.mdl-radio__button{line-height:24px}.mdl-radio.is-upgraded .mdl-radio__button{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-radio__outer-circle{position:absolute;top:4px;left:0;display:inline-block;box-sizing:border-box;width:16px;height:16px;margin:0;cursor:pointer;border:2px solid rgba(0,0,0,.54);border-radius:50%;z-index:2}.mdl-radio.is-checked .mdl-radio__outer-circle{border:2px solid rgb(255,152,0)}.mdl-radio__outer-circle fieldset[disabled] .mdl-radio,.mdl-radio.is-disabled .mdl-radio__outer-circle{border:2px solid rgba(0,0,0,.26);cursor:auto}.mdl-radio__inner-circle{position:absolute;z-index:1;margin:0;top:8px;left:4px;box-sizing:border-box;width:8px;height:8px;cursor:pointer;transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:transform;transition-property:transform,-webkit-transform;-webkit-transform:scale3d(0,0,0);transform:scale3d(0,0,0);border-radius:50%;background:rgb(255,152,0)}.mdl-radio.is-checked .mdl-radio__inner-circle{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}fieldset[disabled] .mdl-radio .mdl-radio__inner-circle,.mdl-radio.is-disabled .mdl-radio__inner-circle{background:rgba(0,0,0,.26);cursor:auto}.mdl-radio.is-focused .mdl-radio__inner-circle{box-shadow:0 0 0 10px rgba(0,0,0,.1)}.mdl-radio__label{cursor:pointer}fieldset[disabled] .mdl-radio .mdl-radio__label,.mdl-radio.is-disabled .mdl-radio__label{color:rgba(0,0,0,.26);cursor:auto}.mdl-radio__ripple-container{position:absolute;z-index:2;top:-9px;left:-13px;box-sizing:border-box;width:42px;height:42px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)}.mdl-radio__ripple-container .mdl-ripple{background:rgb(255,152,0)}fieldset[disabled] .mdl-radio .mdl-radio__ripple-container,.mdl-radio.is-disabled .mdl-radio__ripple-container{cursor:auto}fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple,.mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple{background:0 0}_:-ms-input-placeholder,:root .mdl-slider.mdl-slider.is-upgraded{-ms-appearance:none;height:32px;margin:0}.mdl-slider{width:calc(100% - 40px);margin:0 20px}.mdl-slider.is-upgraded{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:2px;background:0 0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:0;padding:0;color:rgb(255,152,0);-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;z-index:1;cursor:pointer}.mdl-slider.is-upgraded::-moz-focus-outer{border:0}.mdl-slider.is-upgraded::-ms-tooltip{display:none}.mdl-slider.is-upgraded::-webkit-slider-runnable-track{background:0 0}.mdl-slider.is-upgraded::-moz-range-track{background:0 0;border:none}.mdl-slider.is-upgraded::-ms-track{background:0 0;color:transparent;height:2px;width:100%;border:none}.mdl-slider.is-upgraded::-ms-fill-lower{padding:0;background:linear-gradient(to right,transparent,transparent 16px,rgb(255,152,0)16px,rgb(255,152,0)0)}.mdl-slider.is-upgraded::-ms-fill-upper{padding:0;background:linear-gradient(to left,transparent,transparent 16px,rgba(0,0,0,.26)16px,rgba(0,0,0,.26)0)}.mdl-slider.is-upgraded::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;box-sizing:border-box;border-radius:50%;background:rgb(255,152,0);border:none;transition:transform .18s cubic-bezier(.4,0,.2,1),border .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1);transition:transform .18s cubic-bezier(.4,0,.2,1),border .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1),-webkit-transform .18s cubic-bezier(.4,0,.2,1)}.mdl-slider.is-upgraded::-moz-range-thumb{-moz-appearance:none;width:12px;height:12px;box-sizing:border-box;border-radius:50%;background-image:none;background:rgb(255,152,0);border:none}.mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb{box-shadow:0 0 0 10px rgba(255,152,0,.26)}.mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb{box-shadow:0 0 0 10px rgba(255,152,0,.26)}.mdl-slider.is-upgraded:active::-webkit-slider-thumb{background-image:none;background:rgb(255,152,0);-webkit-transform:scale(1.5);transform:scale(1.5)}.mdl-slider.is-upgraded:active::-moz-range-thumb{background-image:none;background:rgb(255,152,0);transform:scale(1.5)}.mdl-slider.is-upgraded::-ms-thumb{width:32px;height:32px;border:none;border-radius:50%;background:rgb(255,152,0);transform:scale(.375);transition:transform .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1);transition:transform .18s cubic-bezier(.4,0,.2,1),background .28s cubic-bezier(.4,0,.2,1),-webkit-transform .18s cubic-bezier(.4,0,.2,1)}.mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb{background:radial-gradient(circle closest-side,rgb(255,152,0)0%,rgb(255,152,0)37.5%,rgba(255,152,0,.26)37.5%,rgba(255,152,0,.26)100%);transform:scale(1)}.mdl-slider.is-upgraded:active::-ms-thumb{background:rgb(255,152,0);transform:scale(.5625)}.mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb{border:2px solid rgba(0,0,0,.26);background:0 0}.mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb{border:2px solid rgba(0,0,0,.26);background:0 0}.mdl-slider.is-upgraded.is-lowest-value+.mdl-slider__background-flex>.mdl-slider__background-upper{left:6px}.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb{box-shadow:0 0 0 10px rgba(0,0,0,.12);background:rgba(0,0,0,.12)}.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb{box-shadow:0 0 0 10px rgba(0,0,0,.12);background:rgba(0,0,0,.12)}.mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb{border:1.6px solid rgba(0,0,0,.26);-webkit-transform:scale(1.5);transform:scale(1.5)}.mdl-slider.is-upgraded.is-lowest-value:active+.mdl-slider__background-flex>.mdl-slider__background-upper{left:9px}.mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb{border:1.5px solid rgba(0,0,0,.26);transform:scale(1.5)}.mdl-slider.is-upgraded.is-lowest-value::-ms-thumb{background:radial-gradient(circle closest-side,transparent 0%,transparent 66.67%,rgba(0,0,0,.26)66.67%,rgba(0,0,0,.26)100%)}.mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb{background:radial-gradient(circle closest-side,rgba(0,0,0,.12)0%,rgba(0,0,0,.12)25%,rgba(0,0,0,.26)25%,rgba(0,0,0,.26)37.5%,rgba(0,0,0,.12)37.5%,rgba(0,0,0,.12)100%);transform:scale(1)}.mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb{transform:scale(.5625);background:radial-gradient(circle closest-side,transparent 0%,transparent 77.78%,rgba(0,0,0,.26)77.78%,rgba(0,0,0,.26)100%)}.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower{background:0 0}.mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper{margin-left:6px}.mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper{margin-left:9px}.mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb,.mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb,.mdl-slider.is-upgraded:disabled::-webkit-slider-thumb{-webkit-transform:scale(.667);transform:scale(.667);background:rgba(0,0,0,.26)}.mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb,.mdl-slider.is-upgraded:disabled:active::-moz-range-thumb,.mdl-slider.is-upgraded:disabled::-moz-range-thumb{transform:scale(.667);background:rgba(0,0,0,.26)}.mdl-slider.is-upgraded:disabled+.mdl-slider__background-flex>.mdl-slider__background-lower{background-color:rgba(0,0,0,.26);left:-6px}.mdl-slider.is-upgraded:disabled+.mdl-slider__background-flex>.mdl-slider__background-upper{left:6px}.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb{border:3px solid rgba(0,0,0,.26);background:0 0;-webkit-transform:scale(.667);transform:scale(.667)}.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb{border:3px solid rgba(0,0,0,.26);background:0 0;transform:scale(.667)}.mdl-slider.is-upgraded.is-lowest-value:disabled:active+.mdl-slider__background-flex>.mdl-slider__background-upper{left:6px}.mdl-slider.is-upgraded:disabled:focus::-ms-thumb,.mdl-slider.is-upgraded:disabled:active::-ms-thumb,.mdl-slider.is-upgraded:disabled::-ms-thumb{transform:scale(.25);background:rgba(0,0,0,.26)}.mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb,.mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb{transform:scale(.25);background:radial-gradient(circle closest-side,transparent 0%,transparent 50%,rgba(0,0,0,.26)50%,rgba(0,0,0,.26)100%)}.mdl-slider.is-upgraded:disabled::-ms-fill-lower{margin-right:6px;background:linear-gradient(to right,transparent,transparent 25px,rgba(0,0,0,.26)25px,rgba(0,0,0,.26)0)}.mdl-slider.is-upgraded:disabled::-ms-fill-upper{margin-left:6px}.mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper{margin-left:6px}.mdl-slider__ie-container{height:18px;overflow:visible;border:none;margin:none;padding:none}.mdl-slider__container{height:18px;position:relative;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row}.mdl-slider__container,.mdl-slider__background-flex{background:0 0;display:-webkit-flex;display:-ms-flexbox;display:flex}.mdl-slider__background-flex{position:absolute;height:2px;width:calc(100% - 52px);top:50%;left:0;margin:0 26px;overflow:hidden;border:0;padding:0;-webkit-transform:translate(0,-1px);transform:translate(0,-1px)}.mdl-slider__background-lower{background:rgb(255,152,0)}.mdl-slider__background-lower,.mdl-slider__background-upper{-webkit-flex:0;-ms-flex:0;flex:0;position:relative;border:0;padding:0}.mdl-slider__background-upper{background:rgba(0,0,0,.26);transition:left .18s cubic-bezier(.4,0,.2,1)}.mdl-snackbar{position:fixed;bottom:0;left:50%;cursor:default;background-color:#323232;z-index:3;display:block;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;font-family:"Roboto","Helvetica","Arial",sans-serif;will-change:transform;-webkit-transform:translate(0,80px);transform:translate(0,80px);transition:transform .25s cubic-bezier(.4,0,1,1);transition:transform .25s cubic-bezier(.4,0,1,1),-webkit-transform .25s cubic-bezier(.4,0,1,1);pointer-events:none}@media (max-width:479px){.mdl-snackbar{width:100%;left:0;min-height:48px;max-height:80px}}@media (min-width:480px){.mdl-snackbar{min-width:288px;max-width:568px;border-radius:2px;-webkit-transform:translate(-50%,80px);transform:translate(-50%,80px)}}.mdl-snackbar--active{-webkit-transform:translate(0,0);transform:translate(0,0);pointer-events:auto;transition:transform .25s cubic-bezier(0,0,.2,1);transition:transform .25s cubic-bezier(0,0,.2,1),-webkit-transform .25s cubic-bezier(0,0,.2,1)}@media (min-width:480px){.mdl-snackbar--active{-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}}.mdl-snackbar__text{padding:14px 12px 14px 24px;vertical-align:middle;color:#fff;float:left}.mdl-snackbar__action{background:0 0;border:none;color:rgb(68,138,255);float:right;padding:14px 24px 14px 12px;font-family:"Roboto","Helvetica","Arial",sans-serif;font-size:14px;font-weight:500;text-transform:uppercase;line-height:1;letter-spacing:0;overflow:hidden;outline:none;opacity:0;pointer-events:none;cursor:pointer;text-decoration:none;text-align:center;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.mdl-snackbar__action::-moz-focus-inner{border:0}.mdl-snackbar__action:not([aria-hidden]){opacity:1;pointer-events:auto}.mdl-spinner{display:inline-block;position:relative;width:28px;height:28px}.mdl-spinner:not(.is-upgraded).is-active:after{content:"Loading..."}.mdl-spinner.is-upgraded.is-active{-webkit-animation:mdl-spinner__container-rotate 1568.23529412ms linear infinite;animation:mdl-spinner__container-rotate 1568.23529412ms linear infinite}@-webkit-keyframes mdl-spinner__container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes mdl-spinner__container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.mdl-spinner__layer{position:absolute;width:100%;height:100%;opacity:0}.mdl-spinner__layer-1{border-color:#42a5f5}.mdl-spinner--single-color .mdl-spinner__layer-1{border-color:rgb(255,152,0)}.mdl-spinner.is-active .mdl-spinner__layer-1{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__layer-2{border-color:#f44336}.mdl-spinner--single-color .mdl-spinner__layer-2{border-color:rgb(255,152,0)}.mdl-spinner.is-active .mdl-spinner__layer-2{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__layer-3{border-color:#fdd835}.mdl-spinner--single-color .mdl-spinner__layer-3{border-color:rgb(255,152,0)}.mdl-spinner.is-active .mdl-spinner__layer-3{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__layer-4{border-color:#4caf50}.mdl-spinner--single-color .mdl-spinner__layer-4{border-color:rgb(255,152,0)}.mdl-spinner.is-active .mdl-spinner__layer-4{-webkit-animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(.4,0,.2,1)infinite both,mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(.4,0,.2,1)infinite both}@-webkit-keyframes mdl-spinner__fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@keyframes mdl-spinner__fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes mdl-spinner__layer-1-fade-in-out{from,25%{opacity:.99}26%,89%{opacity:0}90%,100%{opacity:.99}}@keyframes mdl-spinner__layer-1-fade-in-out{from,25%{opacity:.99}26%,89%{opacity:0}90%,100%{opacity:.99}}@-webkit-keyframes mdl-spinner__layer-2-fade-in-out{from,15%{opacity:0}25%,50%{opacity:.99}51%{opacity:0}}@keyframes mdl-spinner__layer-2-fade-in-out{from,15%{opacity:0}25%,50%{opacity:.99}51%{opacity:0}}@-webkit-keyframes mdl-spinner__layer-3-fade-in-out{from,40%{opacity:0}50%,75%{opacity:.99}76%{opacity:0}}@keyframes mdl-spinner__layer-3-fade-in-out{from,40%{opacity:0}50%,75%{opacity:.99}76%{opacity:0}}@-webkit-keyframes mdl-spinner__layer-4-fade-in-out{from,65%{opacity:0}75%,90%{opacity:.99}100%{opacity:0}}@keyframes mdl-spinner__layer-4-fade-in-out{from,65%{opacity:0}75%,90%{opacity:.99}100%{opacity:0}}.mdl-spinner__gap-patch{position:absolute;box-sizing:border-box;top:0;left:45%;width:10%;height:100%;overflow:hidden;border-color:inherit}.mdl-spinner__gap-patch .mdl-spinner__circle{width:1000%;left:-450%}.mdl-spinner__circle-clipper{display:inline-block;position:relative;width:50%;height:100%;overflow:hidden;border-color:inherit}.mdl-spinner__circle-clipper .mdl-spinner__circle{width:200%}.mdl-spinner__circle{box-sizing:border-box;height:100%;border-width:3px;border-style:solid;border-color:inherit;border-bottom-color:transparent!important;border-radius:50%;-webkit-animation:none;animation:none;position:absolute;top:0;right:0;bottom:0;left:0}.mdl-spinner__left .mdl-spinner__circle{border-right-color:transparent!important;-webkit-transform:rotate(129deg);transform:rotate(129deg)}.mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle{-webkit-animation:mdl-spinner__left-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__left-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both}.mdl-spinner__right .mdl-spinner__circle{left:-100%;border-left-color:transparent!important;-webkit-transform:rotate(-129deg);transform:rotate(-129deg)}.mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle{-webkit-animation:mdl-spinner__right-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both;animation:mdl-spinner__right-spin 1333ms cubic-bezier(.4,0,.2,1)infinite both}@-webkit-keyframes mdl-spinner__left-spin{from{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}}@keyframes mdl-spinner__left-spin{from{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}}@-webkit-keyframes mdl-spinner__right-spin{from{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}}@keyframes mdl-spinner__right-spin{from{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}}.mdl-switch{position:relative;z-index:1;vertical-align:middle;display:inline-block;box-sizing:border-box;width:100%;height:24px;margin:0;padding:0;overflow:visible;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.mdl-switch.is-upgraded{padding-left:28px}.mdl-switch__input{line-height:24px}.mdl-switch.is-upgraded .mdl-switch__input{position:absolute;width:0;height:0;margin:0;padding:0;opacity:0;-ms-appearance:none;-moz-appearance:none;-webkit-appearance:none;appearance:none;border:none}.mdl-switch__track{background:rgba(0,0,0,.26);position:absolute;left:0;top:5px;height:14px;width:36px;border-radius:14px;cursor:pointer}.mdl-switch.is-checked .mdl-switch__track{background:rgba(255,152,0,.5)}.mdl-switch__track fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__track{background:rgba(0,0,0,.12);cursor:auto}.mdl-switch__thumb{background:#fafafa;position:absolute;left:0;top:2px;height:20px;width:20px;border-radius:50%;cursor:pointer;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);transition-duration:.28s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:left}.mdl-switch.is-checked .mdl-switch__thumb{background:rgb(255,152,0);left:16px;box-shadow:0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12)}.mdl-switch__thumb fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__thumb{background:#bdbdbd;cursor:auto}.mdl-switch__focus-helper{position:absolute;top:50%;left:50%;-webkit-transform:translate(-4px,-4px);transform:translate(-4px,-4px);display:inline-block;box-sizing:border-box;width:8px;height:8px;border-radius:50%;background-color:transparent}.mdl-switch.is-focused .mdl-switch__focus-helper{box-shadow:0 0 0 20px rgba(0,0,0,.1);background-color:rgba(0,0,0,.1)}.mdl-switch.is-focused.is-checked .mdl-switch__focus-helper{box-shadow:0 0 0 20px rgba(255,152,0,.26);background-color:rgba(255,152,0,.26)}.mdl-switch__label{position:relative;cursor:pointer;font-size:16px;line-height:24px;margin:0;left:24px}.mdl-switch__label fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__label{color:#bdbdbd;cursor:auto}.mdl-switch__ripple-container{position:absolute;z-index:2;top:-12px;left:-14px;box-sizing:border-box;width:48px;height:48px;border-radius:50%;cursor:pointer;overflow:hidden;-webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000);transition-duration:.4s;transition-timing-function:step-end;transition-property:left}.mdl-switch__ripple-container .mdl-ripple{background:rgb(255,152,0)}.mdl-switch__ripple-container fieldset[disabled] .mdl-switch,.mdl-switch.is-disabled .mdl-switch__ripple-container{cursor:auto}fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple,.mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple{background:0 0}.mdl-switch.is-checked .mdl-switch__ripple-container{left:2px}.mdl-tabs{display:block;width:100%}.mdl-tabs__tab-bar{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-content:space-between;-ms-flex-line-pack:justify;align-content:space-between;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;height:48px;padding:0;margin:0;border-bottom:1px solid #e0e0e0}.mdl-tabs__tab{margin:0;border:none;padding:0 24px;float:left;position:relative;display:block;text-decoration:none;height:48px;line-height:48px;text-align:center;font-weight:500;font-size:14px;text-transform:uppercase;color:rgba(0,0,0,.54);overflow:hidden}.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active{color:rgba(0,0,0,.87)}.mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after{height:2px;width:100%;display:block;content:" ";bottom:0;left:0;position:absolute;background:rgb(255,152,0);-webkit-animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;animation:border-expand .2s cubic-bezier(.4,0,.4,1).01s alternate forwards;transition:all 1s cubic-bezier(.4,0,1,1)}.mdl-tabs__tab .mdl-tabs__ripple-container{display:block;position:absolute;height:100%;width:100%;left:0;top:0;z-index:1;overflow:hidden}.mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple{background:rgb(255,152,0)}.mdl-tabs__panel{display:block}.mdl-tabs.is-upgraded .mdl-tabs__panel{display:none}.mdl-tabs.is-upgraded .mdl-tabs__panel.is-active{display:block}@-webkit-keyframes border-expand{0%{opacity:0;width:0}100%{opacity:1;width:100%}}@keyframes border-expand{0%{opacity:0;width:0}100%{opacity:1;width:100%}}.mdl-textfield{position:relative;font-size:16px;display:inline-block;box-sizing:border-box;width:300px;max-width:100%;margin:0;padding:20px 0}.mdl-textfield .mdl-button{position:absolute;bottom:20px}.mdl-textfield--align-right{text-align:right}.mdl-textfield--full-width{width:100%}.mdl-textfield--expandable{min-width:32px;width:auto;min-height:32px}.mdl-textfield__input{border:none;border-bottom:1px solid rgba(0,0,0,.12);display:block;font-size:16px;font-family:"Helvetica","Arial",sans-serif;margin:0;padding:4px 0;width:100%;background:0 0;text-align:left;color:inherit}.mdl-textfield__input[type="number"]{-moz-appearance:textfield}.mdl-textfield__input[type="number"]::-webkit-inner-spin-button,.mdl-textfield__input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.mdl-textfield.is-focused .mdl-textfield__input{outline:none}.mdl-textfield.is-invalid .mdl-textfield__input{border-color:#d50000;box-shadow:none}fieldset[disabled] .mdl-textfield .mdl-textfield__input,.mdl-textfield.is-disabled .mdl-textfield__input{background-color:transparent;border-bottom:1px dotted rgba(0,0,0,.12);color:rgba(0,0,0,.26)}.mdl-textfield textarea.mdl-textfield__input{display:block}.mdl-textfield__label{bottom:0;color:rgba(0,0,0,.26);font-size:16px;left:0;right:0;pointer-events:none;position:absolute;display:block;top:24px;width:100%;overflow:hidden;white-space:nowrap;text-align:left}.mdl-textfield.is-dirty .mdl-textfield__label,.mdl-textfield.has-placeholder .mdl-textfield__label{visibility:hidden}.mdl-textfield--floating-label .mdl-textfield__label{transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label{transition:none}fieldset[disabled] .mdl-textfield .mdl-textfield__label,.mdl-textfield.is-disabled.is-disabled .mdl-textfield__label{color:rgba(0,0,0,.26)}.mdl-textfield--floating-label.is-focused .mdl-textfield__label,.mdl-textfield--floating-label.is-dirty .mdl-textfield__label,.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label{color:rgb(255,152,0);font-size:12px;top:4px;visibility:visible}.mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label,.mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label,.mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label{top:-16px}.mdl-textfield--floating-label.is-invalid .mdl-textfield__label{color:#d50000;font-size:12px}.mdl-textfield__label:after{background-color:rgb(255,152,0);bottom:20px;content:'';height:2px;left:45%;position:absolute;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);visibility:hidden;width:10px}.mdl-textfield.is-focused .mdl-textfield__label:after{left:0;visibility:visible;width:100%}.mdl-textfield.is-invalid .mdl-textfield__label:after{background-color:#d50000}.mdl-textfield__error{color:#d50000;position:absolute;font-size:12px;margin-top:3px;visibility:hidden;display:block}.mdl-textfield.is-invalid .mdl-textfield__error{visibility:visible}.mdl-textfield__expandable-holder{display:inline-block;position:relative;margin-left:32px;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);display:inline-block;max-width:.1px}.mdl-textfield.is-focused .mdl-textfield__expandable-holder,.mdl-textfield.is-dirty .mdl-textfield__expandable-holder{max-width:600px}.mdl-textfield__expandable-holder .mdl-textfield__label:after{bottom:0}.mdl-tooltip{-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:top center;transform-origin:top center;will-change:transform;z-index:999;background:rgba(97,97,97,.9);border-radius:2px;color:#fff;display:inline-block;font-size:10px;font-weight:500;line-height:14px;max-width:170px;position:fixed;top:-500px;left:-500px;padding:8px;text-align:center}.mdl-tooltip.is-active{-webkit-animation:pulse 200ms cubic-bezier(0,0,.2,1)forwards;animation:pulse 200ms cubic-bezier(0,0,.2,1)forwards}.mdl-tooltip--large{line-height:14px;font-size:14px;padding:16px}@-webkit-keyframes pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}50%{-webkit-transform:scale(.99);transform:scale(.99)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1;visibility:visible}}@keyframes pulse{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}50%{-webkit-transform:scale(.99);transform:scale(.99)}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1;visibility:visible}}.mdl-shadow--2dp{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12)}.mdl-shadow--3dp{box-shadow:0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.2),0 1px 8px 0 rgba(0,0,0,.12)}.mdl-shadow--4dp{box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2)}.mdl-shadow--6dp{box-shadow:0 6px 10px 0 rgba(0,0,0,.14),0 1px 18px 0 rgba(0,0,0,.12),0 3px 5px -1px rgba(0,0,0,.2)}.mdl-shadow--8dp{box-shadow:0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12),0 5px 5px -3px rgba(0,0,0,.2)}.mdl-shadow--16dp{box-shadow:0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2)}.mdl-shadow--24dp{box-shadow:0 9px 46px 8px rgba(0,0,0,.14),0 11px 15px -7px rgba(0,0,0,.12),0 24px 38px 3px rgba(0,0,0,.2)}.mdl-grid{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;margin:0 auto;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}.mdl-grid.mdl-grid--no-spacing{padding:0}.mdl-cell{box-sizing:border-box}.mdl-cell--top{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start}.mdl-cell--middle{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.mdl-cell--bottom{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.mdl-cell--stretch{-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch}.mdl-grid.mdl-grid--no-spacing>.mdl-cell{margin:0}.mdl-cell--order-1{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12{-webkit-order:12;-ms-flex-order:12;order:12}@media (max-width:479px){.mdl-grid{padding:8px}.mdl-cell{margin:8px;width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell{width:100%}.mdl-cell--hide-phone{display:none!important}.mdl-cell--order-1-phone.mdl-cell--order-1-phone{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2-phone.mdl-cell--order-2-phone{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3-phone.mdl-cell--order-3-phone{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4-phone.mdl-cell--order-4-phone{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5-phone.mdl-cell--order-5-phone{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6-phone.mdl-cell--order-6-phone{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7-phone.mdl-cell--order-7-phone{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8-phone.mdl-cell--order-8-phone{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9-phone.mdl-cell--order-9-phone{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10-phone.mdl-cell--order-10-phone{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11-phone.mdl-cell--order-11-phone{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12-phone.mdl-cell--order-12-phone{-webkit-order:12;-ms-flex-order:12;order:12}.mdl-cell--1-col,.mdl-cell--1-col-phone.mdl-cell--1-col-phone{width:calc(25% - 16px)}.mdl-grid--no-spacing>.mdl-cell--1-col,.mdl-grid--no-spacing>.mdl-cell--1-col-phone.mdl-cell--1-col-phone{width:25%}.mdl-cell--2-col,.mdl-cell--2-col-phone.mdl-cell--2-col-phone{width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell--2-col,.mdl-grid--no-spacing>.mdl-cell--2-col-phone.mdl-cell--2-col-phone{width:50%}.mdl-cell--3-col,.mdl-cell--3-col-phone.mdl-cell--3-col-phone{width:calc(75% - 16px)}.mdl-grid--no-spacing>.mdl-cell--3-col,.mdl-grid--no-spacing>.mdl-cell--3-col-phone.mdl-cell--3-col-phone{width:75%}.mdl-cell--4-col,.mdl-cell--4-col-phone.mdl-cell--4-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--4-col,.mdl-grid--no-spacing>.mdl-cell--4-col-phone.mdl-cell--4-col-phone{width:100%}.mdl-cell--5-col,.mdl-cell--5-col-phone.mdl-cell--5-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--5-col,.mdl-grid--no-spacing>.mdl-cell--5-col-phone.mdl-cell--5-col-phone{width:100%}.mdl-cell--6-col,.mdl-cell--6-col-phone.mdl-cell--6-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--6-col,.mdl-grid--no-spacing>.mdl-cell--6-col-phone.mdl-cell--6-col-phone{width:100%}.mdl-cell--7-col,.mdl-cell--7-col-phone.mdl-cell--7-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--7-col,.mdl-grid--no-spacing>.mdl-cell--7-col-phone.mdl-cell--7-col-phone{width:100%}.mdl-cell--8-col,.mdl-cell--8-col-phone.mdl-cell--8-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--8-col,.mdl-grid--no-spacing>.mdl-cell--8-col-phone.mdl-cell--8-col-phone{width:100%}.mdl-cell--9-col,.mdl-cell--9-col-phone.mdl-cell--9-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--9-col,.mdl-grid--no-spacing>.mdl-cell--9-col-phone.mdl-cell--9-col-phone{width:100%}.mdl-cell--10-col,.mdl-cell--10-col-phone.mdl-cell--10-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--10-col,.mdl-grid--no-spacing>.mdl-cell--10-col-phone.mdl-cell--10-col-phone{width:100%}.mdl-cell--11-col,.mdl-cell--11-col-phone.mdl-cell--11-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--11-col,.mdl-grid--no-spacing>.mdl-cell--11-col-phone.mdl-cell--11-col-phone{width:100%}.mdl-cell--12-col,.mdl-cell--12-col-phone.mdl-cell--12-col-phone{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--12-col,.mdl-grid--no-spacing>.mdl-cell--12-col-phone.mdl-cell--12-col-phone{width:100%}.mdl-cell--1-offset,.mdl-cell--1-offset-phone.mdl-cell--1-offset-phone{margin-left:calc(25% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-phone.mdl-cell--1-offset-phone{margin-left:25%}.mdl-cell--2-offset,.mdl-cell--2-offset-phone.mdl-cell--2-offset-phone{margin-left:calc(50% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-phone.mdl-cell--2-offset-phone{margin-left:50%}.mdl-cell--3-offset,.mdl-cell--3-offset-phone.mdl-cell--3-offset-phone{margin-left:calc(75% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-phone.mdl-cell--3-offset-phone{margin-left:75%}}@media (min-width:480px) and (max-width:839px){.mdl-grid{padding:8px}.mdl-cell{margin:8px;width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell{width:50%}.mdl-cell--hide-tablet{display:none!important}.mdl-cell--order-1-tablet.mdl-cell--order-1-tablet{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2-tablet.mdl-cell--order-2-tablet{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3-tablet.mdl-cell--order-3-tablet{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4-tablet.mdl-cell--order-4-tablet{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5-tablet.mdl-cell--order-5-tablet{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6-tablet.mdl-cell--order-6-tablet{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7-tablet.mdl-cell--order-7-tablet{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8-tablet.mdl-cell--order-8-tablet{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9-tablet.mdl-cell--order-9-tablet{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10-tablet.mdl-cell--order-10-tablet{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11-tablet.mdl-cell--order-11-tablet{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12-tablet.mdl-cell--order-12-tablet{-webkit-order:12;-ms-flex-order:12;order:12}.mdl-cell--1-col,.mdl-cell--1-col-tablet.mdl-cell--1-col-tablet{width:calc(12.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--1-col,.mdl-grid--no-spacing>.mdl-cell--1-col-tablet.mdl-cell--1-col-tablet{width:12.5%}.mdl-cell--2-col,.mdl-cell--2-col-tablet.mdl-cell--2-col-tablet{width:calc(25% - 16px)}.mdl-grid--no-spacing>.mdl-cell--2-col,.mdl-grid--no-spacing>.mdl-cell--2-col-tablet.mdl-cell--2-col-tablet{width:25%}.mdl-cell--3-col,.mdl-cell--3-col-tablet.mdl-cell--3-col-tablet{width:calc(37.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--3-col,.mdl-grid--no-spacing>.mdl-cell--3-col-tablet.mdl-cell--3-col-tablet{width:37.5%}.mdl-cell--4-col,.mdl-cell--4-col-tablet.mdl-cell--4-col-tablet{width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell--4-col,.mdl-grid--no-spacing>.mdl-cell--4-col-tablet.mdl-cell--4-col-tablet{width:50%}.mdl-cell--5-col,.mdl-cell--5-col-tablet.mdl-cell--5-col-tablet{width:calc(62.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--5-col,.mdl-grid--no-spacing>.mdl-cell--5-col-tablet.mdl-cell--5-col-tablet{width:62.5%}.mdl-cell--6-col,.mdl-cell--6-col-tablet.mdl-cell--6-col-tablet{width:calc(75% - 16px)}.mdl-grid--no-spacing>.mdl-cell--6-col,.mdl-grid--no-spacing>.mdl-cell--6-col-tablet.mdl-cell--6-col-tablet{width:75%}.mdl-cell--7-col,.mdl-cell--7-col-tablet.mdl-cell--7-col-tablet{width:calc(87.5% - 16px)}.mdl-grid--no-spacing>.mdl-cell--7-col,.mdl-grid--no-spacing>.mdl-cell--7-col-tablet.mdl-cell--7-col-tablet{width:87.5%}.mdl-cell--8-col,.mdl-cell--8-col-tablet.mdl-cell--8-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--8-col,.mdl-grid--no-spacing>.mdl-cell--8-col-tablet.mdl-cell--8-col-tablet{width:100%}.mdl-cell--9-col,.mdl-cell--9-col-tablet.mdl-cell--9-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--9-col,.mdl-grid--no-spacing>.mdl-cell--9-col-tablet.mdl-cell--9-col-tablet{width:100%}.mdl-cell--10-col,.mdl-cell--10-col-tablet.mdl-cell--10-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--10-col,.mdl-grid--no-spacing>.mdl-cell--10-col-tablet.mdl-cell--10-col-tablet{width:100%}.mdl-cell--11-col,.mdl-cell--11-col-tablet.mdl-cell--11-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--11-col,.mdl-grid--no-spacing>.mdl-cell--11-col-tablet.mdl-cell--11-col-tablet{width:100%}.mdl-cell--12-col,.mdl-cell--12-col-tablet.mdl-cell--12-col-tablet{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--12-col,.mdl-grid--no-spacing>.mdl-cell--12-col-tablet.mdl-cell--12-col-tablet{width:100%}.mdl-cell--1-offset,.mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet{margin-left:calc(12.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet{margin-left:12.5%}.mdl-cell--2-offset,.mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet{margin-left:calc(25% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet{margin-left:25%}.mdl-cell--3-offset,.mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet{margin-left:calc(37.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet{margin-left:37.5%}.mdl-cell--4-offset,.mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet{margin-left:calc(50% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet{margin-left:50%}.mdl-cell--5-offset,.mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet{margin-left:calc(62.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet{margin-left:62.5%}.mdl-cell--6-offset,.mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet{margin-left:calc(75% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet{margin-left:75%}.mdl-cell--7-offset,.mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet{margin-left:calc(87.5% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet{margin-left:87.5%}}@media (min-width:840px){.mdl-grid{padding:8px}.mdl-cell{margin:8px;width:calc(33.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell{width:33.3333333333%}.mdl-cell--hide-desktop{display:none!important}.mdl-cell--order-1-desktop.mdl-cell--order-1-desktop{-webkit-order:1;-ms-flex-order:1;order:1}.mdl-cell--order-2-desktop.mdl-cell--order-2-desktop{-webkit-order:2;-ms-flex-order:2;order:2}.mdl-cell--order-3-desktop.mdl-cell--order-3-desktop{-webkit-order:3;-ms-flex-order:3;order:3}.mdl-cell--order-4-desktop.mdl-cell--order-4-desktop{-webkit-order:4;-ms-flex-order:4;order:4}.mdl-cell--order-5-desktop.mdl-cell--order-5-desktop{-webkit-order:5;-ms-flex-order:5;order:5}.mdl-cell--order-6-desktop.mdl-cell--order-6-desktop{-webkit-order:6;-ms-flex-order:6;order:6}.mdl-cell--order-7-desktop.mdl-cell--order-7-desktop{-webkit-order:7;-ms-flex-order:7;order:7}.mdl-cell--order-8-desktop.mdl-cell--order-8-desktop{-webkit-order:8;-ms-flex-order:8;order:8}.mdl-cell--order-9-desktop.mdl-cell--order-9-desktop{-webkit-order:9;-ms-flex-order:9;order:9}.mdl-cell--order-10-desktop.mdl-cell--order-10-desktop{-webkit-order:10;-ms-flex-order:10;order:10}.mdl-cell--order-11-desktop.mdl-cell--order-11-desktop{-webkit-order:11;-ms-flex-order:11;order:11}.mdl-cell--order-12-desktop.mdl-cell--order-12-desktop{-webkit-order:12;-ms-flex-order:12;order:12}.mdl-cell--1-col,.mdl-cell--1-col-desktop.mdl-cell--1-col-desktop{width:calc(8.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--1-col,.mdl-grid--no-spacing>.mdl-cell--1-col-desktop.mdl-cell--1-col-desktop{width:8.3333333333%}.mdl-cell--2-col,.mdl-cell--2-col-desktop.mdl-cell--2-col-desktop{width:calc(16.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--2-col,.mdl-grid--no-spacing>.mdl-cell--2-col-desktop.mdl-cell--2-col-desktop{width:16.6666666667%}.mdl-cell--3-col,.mdl-cell--3-col-desktop.mdl-cell--3-col-desktop{width:calc(25% - 16px)}.mdl-grid--no-spacing>.mdl-cell--3-col,.mdl-grid--no-spacing>.mdl-cell--3-col-desktop.mdl-cell--3-col-desktop{width:25%}.mdl-cell--4-col,.mdl-cell--4-col-desktop.mdl-cell--4-col-desktop{width:calc(33.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--4-col,.mdl-grid--no-spacing>.mdl-cell--4-col-desktop.mdl-cell--4-col-desktop{width:33.3333333333%}.mdl-cell--5-col,.mdl-cell--5-col-desktop.mdl-cell--5-col-desktop{width:calc(41.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--5-col,.mdl-grid--no-spacing>.mdl-cell--5-col-desktop.mdl-cell--5-col-desktop{width:41.6666666667%}.mdl-cell--6-col,.mdl-cell--6-col-desktop.mdl-cell--6-col-desktop{width:calc(50% - 16px)}.mdl-grid--no-spacing>.mdl-cell--6-col,.mdl-grid--no-spacing>.mdl-cell--6-col-desktop.mdl-cell--6-col-desktop{width:50%}.mdl-cell--7-col,.mdl-cell--7-col-desktop.mdl-cell--7-col-desktop{width:calc(58.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--7-col,.mdl-grid--no-spacing>.mdl-cell--7-col-desktop.mdl-cell--7-col-desktop{width:58.3333333333%}.mdl-cell--8-col,.mdl-cell--8-col-desktop.mdl-cell--8-col-desktop{width:calc(66.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--8-col,.mdl-grid--no-spacing>.mdl-cell--8-col-desktop.mdl-cell--8-col-desktop{width:66.6666666667%}.mdl-cell--9-col,.mdl-cell--9-col-desktop.mdl-cell--9-col-desktop{width:calc(75% - 16px)}.mdl-grid--no-spacing>.mdl-cell--9-col,.mdl-grid--no-spacing>.mdl-cell--9-col-desktop.mdl-cell--9-col-desktop{width:75%}.mdl-cell--10-col,.mdl-cell--10-col-desktop.mdl-cell--10-col-desktop{width:calc(83.3333333333% - 16px)}.mdl-grid--no-spacing>.mdl-cell--10-col,.mdl-grid--no-spacing>.mdl-cell--10-col-desktop.mdl-cell--10-col-desktop{width:83.3333333333%}.mdl-cell--11-col,.mdl-cell--11-col-desktop.mdl-cell--11-col-desktop{width:calc(91.6666666667% - 16px)}.mdl-grid--no-spacing>.mdl-cell--11-col,.mdl-grid--no-spacing>.mdl-cell--11-col-desktop.mdl-cell--11-col-desktop{width:91.6666666667%}.mdl-cell--12-col,.mdl-cell--12-col-desktop.mdl-cell--12-col-desktop{width:calc(100% - 16px)}.mdl-grid--no-spacing>.mdl-cell--12-col,.mdl-grid--no-spacing>.mdl-cell--12-col-desktop.mdl-cell--12-col-desktop{width:100%}.mdl-cell--1-offset,.mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop{margin-left:calc(8.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop{margin-left:8.3333333333%}.mdl-cell--2-offset,.mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop{margin-left:calc(16.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop{margin-left:16.6666666667%}.mdl-cell--3-offset,.mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop{margin-left:calc(25% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop{margin-left:25%}.mdl-cell--4-offset,.mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop{margin-left:calc(33.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop{margin-left:33.3333333333%}.mdl-cell--5-offset,.mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop{margin-left:calc(41.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop{margin-left:41.6666666667%}.mdl-cell--6-offset,.mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop{margin-left:calc(50% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop{margin-left:50%}.mdl-cell--7-offset,.mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop{margin-left:calc(58.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop{margin-left:58.3333333333%}.mdl-cell--8-offset,.mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop{margin-left:calc(66.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--8-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop{margin-left:66.6666666667%}.mdl-cell--9-offset,.mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop{margin-left:calc(75% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--9-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop{margin-left:75%}.mdl-cell--10-offset,.mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop{margin-left:calc(83.3333333333% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--10-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop{margin-left:83.3333333333%}.mdl-cell--11-offset,.mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop{margin-left:calc(91.6666666667% + 8px)}.mdl-grid.mdl-grid--no-spacing>.mdl-cell--11-offset,.mdl-grid.mdl-grid--no-spacing>.mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop{margin-left:91.6666666667%}}body{margin:0}.styleguide-demo h1{margin:48px 24px 0}.styleguide-demo h1:after{content:'';display:block;width:100%;border-bottom:1px solid rgba(0,0,0,.5);margin-top:24px}.styleguide-demo{opacity:0;transition:opacity .6s ease}.styleguide-masthead{height:256px;background:#212121;padding:115px 16px 0}.styleguide-container{position:relative;max-width:960px;width:100%}.styleguide-title{color:#fff;bottom:auto;position:relative;font-size:56px;font-weight:300;line-height:1;letter-spacing:-.02em}.styleguide-title:after{border-bottom:0}.styleguide-title span{font-weight:300}.mdl-styleguide .mdl-layout__drawer .mdl-navigation__link{padding:10px 24px}.demosLoaded .styleguide-demo{opacity:1}iframe{display:block;width:100%;border:none}iframe.heightSet{overflow:hidden}.demo-wrapper{margin:24px}.demo-wrapper iframe{border:1px solid rgba(0,0,0,.5)}
\ No newline at end of file
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/index.html b/ng2-components/ng2-alfresco-userinfo/demo/index.html
index b73b46517f..88aef33b46 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/index.html
+++ b/ng2-components/ng2-alfresco-userinfo/demo/index.html
@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
     <script src="node_modules/material-design-lite/material.min.js"></script>
     <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
+    <link rel="stylesheet" href="./assets/material.orange-blue.min.css">
 
     <!-- 1. Load libraries -->
     <!-- 1. Load libraries -->
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
index 98ef59e2a1..cb56b38c7b 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
+++ b/ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
@@ -15,11 +15,11 @@
  * limitations under the License.
  */
 
-import { NgModule, Component } from '@angular/core';
+import { NgModule, Component, OnInit } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { UserInfoComponentModule } from 'ng2-alfresco-userinfo';
-import { CoreModule, MDL } from 'ng2-alfresco-core';
+import { CoreModule } from 'ng2-alfresco-core';
 
 import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
 
@@ -64,7 +64,7 @@ import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfr
         '.p-10 { padding: 10px; }'
     ]
 })
-class UserInfoDemo implements onInit{
+class UserInfoDemo implements OnInit {
 
       public userToLogin: string = 'admin';
       public password: string = 'admin';

From c595716f2093cf6f199b04afb7194f94ceb36a61 Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Tue, 4 Oct 2016 15:18:49 +0100
Subject: [PATCH 25/26] Fixed comments on PR

---
 ng2-components/ng2-alfresco-userinfo/.travis.yml     | 12 ------------
 ng2-components/ng2-alfresco-userinfo/demo/index.html |  3 +--
 .../ng2-alfresco-userinfo/demo/package.json          |  4 ++--
 .../ng2-alfresco-userinfo/demo/wsrv-config.json      |  5 -----
 4 files changed, 3 insertions(+), 21 deletions(-)
 delete mode 100644 ng2-components/ng2-alfresco-userinfo/.travis.yml
 delete mode 100644 ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json

diff --git a/ng2-components/ng2-alfresco-userinfo/.travis.yml b/ng2-components/ng2-alfresco-userinfo/.travis.yml
deleted file mode 100644
index ab817d7644..0000000000
--- a/ng2-components/ng2-alfresco-userinfo/.travis.yml
+++ /dev/null
@@ -1,12 +0,0 @@
-language: node_js
-node_js:
-  - v5
-  - v4
-  - '0.12'
-  - '0.10'
-install: npm install
-sudo: false
-after_success:
-  npm run coverage
-# Send coverage data to Coveralls
-after_script: "cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js"
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/index.html b/ng2-components/ng2-alfresco-userinfo/demo/index.html
index 88aef33b46..b82fe16e83 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/index.html
+++ b/ng2-components/ng2-alfresco-userinfo/demo/index.html
@@ -1,8 +1,7 @@
-<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <title>Angular 2 TaskList - Demo</title>
+    <title>Angular 2 UserInfo - Demo</title>
     <base href="./">
 
     <!-- Google Material Design Lite -->
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/package.json b/ng2-components/ng2-alfresco-userinfo/demo/package.json
index 368099bb09..da764e7fbc 100644
--- a/ng2-components/ng2-alfresco-userinfo/demo/package.json
+++ b/ng2-components/ng2-alfresco-userinfo/demo/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "ng2-activiti-tasklist-demo",
-  "description": "Alfresco Angular2 Task List Component - Demo",
+  "name": "ng2-alfresco-userinfo-demo",
+  "description": "Alfresco Angular2 User Info Component - Demo",
   "version": "0.1.0",
   "author": "Alfresco Software, Ltd.",
   "main": "index.js",
diff --git a/ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json b/ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json
deleted file mode 100644
index d8f11c2698..0000000000
--- a/ng2-components/ng2-alfresco-userinfo/demo/wsrv-config.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-    "watch": [
-        "node_modules/ng2-alfresco-tag/dist/**/*.{html,htm,css,js}"
-    ]
-}

From 38cf2ddbef7652da4fe5d96c248a807d214f76ec Mon Sep 17 00:00:00 2001
From: Vito Albano <valbano@MacPro.local>
Date: Tue, 4 Oct 2016 16:09:37 +0100
Subject: [PATCH 26/26] addded component to travis.yml

---
 .travis.yml | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/.travis.yml b/.travis.yml
index 01b318ed4f..3a5d6d84f9 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -32,6 +32,7 @@ env:
     - MODULE=ng2-activiti-tasklist
     - MODULE=ng2-activiti-processlist
     - MODULE=ng2-activiti-analytics
+    - MODULE=ng2-alfresco-userinfo
 
 before_script:
   - if ([ "$MODULE" != "ng2-alfresco-core" ]); then
@@ -83,3 +84,4 @@ cache:
   - ng2-components/ng2-alfresco-webscript/node_modules
   - ng2-components/ng2-alfresco-tag/node_modules
   - ng2-components/ng2-alfresco-analytics/node_modules
+  - ng2-components/ng2-alfresco-userinfo/node_modules