From 5ada934e67dd3032075c5a965b79da8439da42e2 Mon Sep 17 00:00:00 2001
From: Giuseppe Digilio <giuseppe.digilio@4science.it>
Date: Fri, 20 Jan 2017 15:08:30 +0100
Subject: [PATCH 1/5] Add a mechanism to configure environment variables.

---
 .gitignore                             |  6 ++
 README.md                              | 87 ++++++++++++++++----------
 config/environment.common.default.json |  3 +
 config/environment.default.json        | 26 ++++++++
 src/app/app.component.html             |  3 +
 src/app/app.component.ts               |  9 +++
 src/config.ts                          | 34 ++++++++++
 7 files changed, 134 insertions(+), 34 deletions(-)
 create mode 100644 config/environment.common.default.json
 create mode 100644 config/environment.default.json
 create mode 100644 src/config.ts

diff --git a/.gitignore b/.gitignore
index 0e713600f8..26069b858d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,6 +5,12 @@
 /tsd_typings/
 npm-debug.log
 
+/config/environment.common.json
+/config/environment.prod.json
+/config/environment.dev.json
+
+/coverage
+
 /dist/
 
 .idea
diff --git a/README.md b/README.md
index a4f1f64f85..5208b4336c 100644
--- a/README.md
+++ b/README.md
@@ -32,6 +32,7 @@ Then go to [http://localhost:3000](http://localhost:3000) in your browser
 * [Introduction to the technology](#introduction-to-the-technology)
 * [Requirements](#requirements)
 * [Installing](#installing)
+* [Configuring](#Configuring)
 * [Running the app](#running-the-app)
 * [Running in production mode](#running-in-production-mode)
 * [Cleaning](#cleaning)
@@ -57,6 +58,20 @@ If you have [`nvm`](https://github.com/creationix/nvm#install-script) or [`nvm-w
 * `npm run global` to install the required global dependencies
 * `npm install` to install the local dependencies
 
+## Configuring
+Templates for environmental and shareable configuration files are located in `config/` folder in json format.
+
+To configure application settings:
+* Create a new `environment.common.json` file in `config/` folder using `environment.common.default.json` as template;
+* Create a new `environment.dev.json` file in `config/` folder using `environment.default.json` as template;
+* Create a new `environment.prod.json` file in `config/` folder using `environment.default.json` as template;
+
+Note: JSON standard does not allow comments so remove them whether you are copying from templates.
+ 
+To use setting parameters in your component:
+```bash
+import { GlobalConfig } from "../config";
+```
 
 ## Running the app
 After you have installed all dependencies you can now run the app. Run `npm run watch:dev` to start a local server which will watch for changes, rebuild the code, and reload the server for you. You can visit it at `http://localhost:3000`.
@@ -153,40 +168,44 @@ See [the guide on the wiki](https://wiki.duraspace.org/display/DSPACE/DSpace+7+-
 ## File Structure
 ```
 dspace-angular
-├── README.md               * This document
-├── app.json                * Application manifest file
-├── e2e                     * Folder for e2e test files
-├── karma.conf.js           * Unit Test configuration file
-├── nodemon.json            * Nodemon (https://nodemon.io/) configuration
-├── package.json            * This file describes the npm package for this project, its dependencies, scripts, etc.
-├── protractor.conf.js      * E2E tests configuration file
-├── resources               * Folder for static resources
-│   ├── i18n                * Folder for i18n translations
-│   └── images              * Folder for images
-├── rollup-client.js        * Rollup (http://rollupjs.org/) configuration for the client
-├── rollup-server.js        * Rollup (http://rollupjs.org/) configuration for the server
-├── src                     * The source of the application
-│   ├── app                 * The location of the app module, and root of the application shared by client and server
-│   ├── backend             * Folder containing a mock of the REST API, hosted by the express server
-│   ├── browser.module.ts   * The root module for the client
-│   ├── client.aot.ts       * The bootstrap file for the client, in production
-│   ├── client.ts           * The bootstrap file for the client, during development
-│   ├── index-aot.html      * The index.html file, for production
-│   ├── index.html          * The index.html file, for development
-│   ├── node.module.ts      * The root module for the server
-│   ├── server.aot.ts       * The express (http://expressjs.com/) config and bootstrap file for the server, in production
-│   ├── server.routes.ts    * The routes file for the server
-│   ├── server.ts           * The express (http://expressjs.com/) config and bootstrap file for the server, during development
-│   ├── styles              * Folder containing global styles.
-│   │   ├── main.scss       * Global scss file
-│   │   └── variables.scss  * Global sass variables file
-│   └── typings.d.ts        * File that allows you to add custom typings for libraries without TypeScript support
-├── tsconfig.aot.json       * TypeScript config for production builds
-├── tsconfig.json           * TypeScript config for development build
-├── tslint.json             * TSLint (https://palantir.github.io/tslint/) configuration
-├── webpack.config.ts       * Webpack (https://webpack.github.io/) config for development builds
-├── webpack.test.config.ts  * Webpack (https://webpack.github.io/) config for testing
-└── webpack.prod.config.ts  * Webpack (https://webpack.github.io/) config for production builds
+├── README.md                            * This document
+├── app.json                             * Application manifest file
+├── config                               * Folder for configuration files
+│   ├── environment.common.default.json  * Template for general configuration file
+│   └── environment.default.json         * Template for the dev and prod configuration files
+├── e2e                                  * Folder for e2e test files
+├── karma.conf.js                        * Unit Test configuration file
+├── nodemon.json                         * Nodemon (https://nodemon.io/) configuration
+├── package.json                         * This file describes the npm package for this project, its dependencies, scripts, etc.
+├── protractor.conf.js                   * E2E tests configuration file
+├── resources                            * Folder for static resources
+│   ├── i18n                             * Folder for i18n translations
+│   └── images                           * Folder for images
+├── rollup-client.js                     * Rollup (http://rollupjs.org/) configuration for the client
+├── rollup-server.js                     * Rollup (http://rollupjs.org/) configuration for the server
+├── src                                  * The source of the application
+│   ├── app                              * The location of the app module, and root of the application shared by client and server
+│   ├── backend                          * Folder containing a mock of the REST API, hosted by the express server
+│   ├── browser.module.ts                * The root module for the client
+│   ├── client.aot.ts                    * The bootstrap file for the client, in production
+│   ├── client.ts                        * The bootstrap file for the client, during development
+│   ├── config.ts                        * File that loads common and environment settings and makes available to app components 
+│   ├── index-aot.html                   * The index.html file, for production
+│   ├── index.html                       * The index.html file, for development
+│   ├── node.module.ts                   * The root module for the server
+│   ├── server.aot.ts                    * The express (http://expressjs.com/) config and bootstrap file for the server, in production
+│   ├── server.routes.ts                 * The routes file for the server
+│   ├── server.ts                        * The express (http://expressjs.com/) config and bootstrap file for the server, during development
+│   ├── styles                           * Folder containing global styles.
+│   │   ├── main.scss                    * Global scss file
+│   │   └── variables.scss               * Global sass variables file
+│   └── typings.d.ts                     * File that allows you to add custom typings for libraries without TypeScript support
+├── tsconfig.aot.json                    * TypeScript config for production builds
+├── tsconfig.json                        * TypeScript config for development build
+├── tslint.json                          * TSLint (https://palantir.github.io/tslint/) configuration
+├── webpack.config.ts                    * Webpack (https://webpack.github.io/) config for development builds
+├── webpack.test.config.ts               * Webpack (https://webpack.github.io/) config for testing
+└── webpack.prod.config.ts               * Webpack (https://webpack.github.io/) config for production builds
 ```
 
 ## 3rd Party Library Installation
diff --git a/config/environment.common.default.json b/config/environment.common.default.json
new file mode 100644
index 0000000000..3d0d59c400
--- /dev/null
+++ b/config/environment.common.default.json
@@ -0,0 +1,3 @@
+{
+  "title": ""
+}
diff --git a/config/environment.default.json b/config/environment.default.json
new file mode 100644
index 0000000000..acc05d5790
--- /dev/null
+++ b/config/environment.default.json
@@ -0,0 +1,26 @@
+{
+  "production": false,
+  // Location of REST API
+  "rest": {
+    // By default, we are currently using a local proxy running on port 5050.
+    // This is necessary because our actual REST API doesn't provide CORS headers yet!
+    // The actual REST API path is in the 'proxy' settings below.
+    // NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
+    "nameSpace": "",
+    "baseURL": ""
+  },
+  // REST Location that we are proxying (see src/proxy.ts)
+  // (Since we are using a proxy at this time, the actual REST API goes here)
+  "proxy": {
+    "nameSpace": "",
+    "baseURL": ""
+    // E.g. to use demo.dspace.org REST API, use the below values *instead*
+    //nameSpace: '/rest',
+    //baseURL: 'https://demo.dspace.org'
+  },
+  // Path and Port in use for this Angular2 UI
+  "ui": {
+    "nameSpace": "",
+    "baseURL": ""
+  }
+}
diff --git a/src/app/app.component.html b/src/app/app.component.html
index a562e0b675..595008f565 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -4,6 +4,9 @@
   <main>
     <p>{{ 'example.with.data' | translate:data }}</p>
     <p>{{ example }}</p>
+    <p><b>{{ title }}</b></p>
+    <h2 *ngIf="!env" style="color:green">development</h2>
+    <h2 *ngIf="env" style="color:red">production</h2>
     <router-outlet></router-outlet>
   </main>
 </div>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 15485eb6a6..530e47dce3 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -9,6 +9,7 @@ import { TranslateService } from "ng2-translate";
 import { HostWindowState } from "./shared/host-window.reducer";
 import { Store } from "@ngrx/store";
 import { HostWindowActions } from "./shared/host-window.actions";
+import { GlobalConfig } from "../config";
 
 @Component({
   changeDetection: ChangeDetectionStrategy.Default,
@@ -27,6 +28,13 @@ export class AppComponent implements OnDestroy, OnInit {
     recipient: 'World'
   };
 
+  title: string = GlobalConfig.title;
+  env: string = GlobalConfig.production;
+
+  styles = {
+    color: 'red'
+  };
+
   constructor(
     private translate: TranslateService,
     private store: Store<HostWindowState>
@@ -51,6 +59,7 @@ export class AppComponent implements OnDestroy, OnInit {
 
   @HostListener('window:resize', ['$event'])
   private onResize(event): void {
+    console.log(GlobalConfig.rest.baseURL);
     this.store.dispatch(
       HostWindowActions.resize(event.target.innerWidth, event.target.innerHeight)
     );
diff --git a/src/config.ts b/src/config.ts
new file mode 100644
index 0000000000..9544ad0c2d
--- /dev/null
+++ b/src/config.ts
@@ -0,0 +1,34 @@
+// Look in ./config folder for config
+
+const path = require('path');
+
+let configContext = require.context("../config", false, /json$/);
+let EnvConfig : any = {};
+let EnvConfigFile : string;
+let CommonConfig : any = {};
+
+try {
+    CommonConfig = configContext('./environment.common.json');
+} catch (e) {
+    throw new Error(`Cannot find file "${path.resolve('config', './environment.common.json')}"`);
+}
+
+switch (process.env.NODE_ENV) {
+    case 'prod':
+    case 'production':
+        EnvConfigFile = './environment.prod.json';
+        break;
+    case 'dev':
+    case 'development':
+    default:
+        EnvConfigFile = './environment.dev.json';
+}
+try {
+    EnvConfig = configContext(EnvConfigFile);
+} catch (e) {
+    throw new Error(`Cannot find file "${path.resolve('config', EnvConfigFile)}"`);
+}
+
+const GlobalConfig = Object.assign(CommonConfig, EnvConfig);
+
+export {GlobalConfig}

From 0079d6d63183bcc42e5ead3560db07a33291344a Mon Sep 17 00:00:00 2001
From: Giuseppe Digilio <giuseppe.digilio@4science.it>
Date: Fri, 20 Jan 2017 15:30:41 +0100
Subject: [PATCH 2/5] README.md changed

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 708131046a..1050a095dc 100644
--- a/README.md
+++ b/README.md
@@ -32,7 +32,7 @@ Then go to [http://localhost:3000](http://localhost:3000) in your browser
 * [Introduction to the technology](#introduction-to-the-technology)
 * [Requirements](#requirements)
 * [Installing](#installing)
-* [Configuring](#Configuring)
+* [Configuring](#configuring)
 * [Running the app](#running-the-app)
 * [Running in production mode](#running-in-production-mode)
 * [Cleaning](#cleaning)

From 3f484ebf4fa62f62ff86a900ac59328806f3580c Mon Sep 17 00:00:00 2001
From: Giuseppe Digilio <giuseppe.digilio@4science.it>
Date: Fri, 20 Jan 2017 15:39:23 +0100
Subject: [PATCH 3/5] README.md changed

---
 README.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 1050a095dc..2fcfc9cdd6 100644
--- a/README.md
+++ b/README.md
@@ -61,14 +61,14 @@ If you have [`nvm`](https://github.com/creationix/nvm#install-script) or [`nvm-w
 ## Configuring
 Templates for environmental and shareable configuration files are located in `config/` folder in json format.
 
-To configure application settings:
+To make the configuration:
 * Create a new `environment.common.json` file in `config/` folder using `environment.common.default.json` as template;
 * Create a new `environment.dev.json` file in `config/` folder using `environment.default.json` as template;
 * Create a new `environment.prod.json` file in `config/` folder using `environment.default.json` as template;
 
-Note: JSON standard does not allow comments so remove them whether you are copying from templates.
+Note: JSON standard does not allow comments so you need to remove them whether you are copying from templates.
  
-To use setting parameters in your component:
+To use the configuration parameters in your component:
 ```bash
 import { GlobalConfig } from "../config";
 ```
@@ -190,7 +190,7 @@ dspace-angular
 │   ├── browser.module.ts                * The root module for the client
 │   ├── client.aot.ts                    * The bootstrap file for the client, in production
 │   ├── client.ts                        * The bootstrap file for the client, during development
-│   ├── config.ts                        * File that loads common and environment settings and makes available to app components 
+│   ├── config.ts                        * File that loads environmental and shareable settings and makes them available to app components 
 │   ├── index-aot.html                   * The index.html file, for production
 │   ├── index.html                       * The index.html file, for development
 │   ├── node.module.ts                   * The root module for the server

From 589c9d5822bee68cd5709128d008198cc2ad7667 Mon Sep 17 00:00:00 2001
From: Giuseppe Digilio <giuseppe.digilio@4science.it>
Date: Fri, 27 Jan 2017 18:34:24 +0100
Subject: [PATCH 4/5] Default configuration file added

---
 .gitignore                             |  5 +-
 README.md                              | 88 ++++++++++++--------------
 config/environment.common.default.json |  3 -
 config/environment.default.js          | 14 ++++
 config/environment.default.json        | 26 --------
 src/app/app.component.ts               |  1 -
 src/config.ts                          | 30 ++++-----
 7 files changed, 73 insertions(+), 94 deletions(-)
 delete mode 100644 config/environment.common.default.json
 create mode 100644 config/environment.default.js
 delete mode 100644 config/environment.default.json

diff --git a/.gitignore b/.gitignore
index 26069b858d..b7d0ce01ab 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,9 +5,8 @@
 /tsd_typings/
 npm-debug.log
 
-/config/environment.common.json
-/config/environment.prod.json
-/config/environment.dev.json
+/config/environment.dev.js
+/config/environment.prod.js
 
 /coverage
 
diff --git a/README.md b/README.md
index 2fcfc9cdd6..80702dc46b 100644
--- a/README.md
+++ b/README.md
@@ -59,14 +59,11 @@ If you have [`nvm`](https://github.com/creationix/nvm#install-script) or [`nvm-w
 * `npm install` to install the local dependencies
 
 ## Configuring
-Templates for environmental and shareable configuration files are located in `config/` folder in json format.
+Default configuration file is located in `config/` folder.
 
-To make the configuration:
-* Create a new `environment.common.json` file in `config/` folder using `environment.common.default.json` as template;
-* Create a new `environment.dev.json` file in `config/` folder using `environment.default.json` as template;
-* Create a new `environment.prod.json` file in `config/` folder using `environment.default.json` as template;
-
-Note: JSON standard does not allow comments so you need to remove them whether you are copying from templates.
+To change the default configuration values, create local files that override the parameters you need to change:
+* Create a new `environment.dev.js` file in `config/` for `devel` environment;
+* Create a new `environment.prod.js` file in `config/` for `production` environment;
  
 To use the configuration parameters in your component:
 ```bash
@@ -168,45 +165,44 @@ See [the guide on the wiki](https://wiki.duraspace.org/display/DSPACE/DSpace+7+-
 ## File Structure
 ```
 dspace-angular
-├── README.md                            * This document
-├── app.json                             * Application manifest file
-├── config                               * Folder for configuration files
-│   ├── environment.common.default.json  * Template for general configuration file
-│   └── environment.default.json         * Template for the dev and prod configuration files
-├── e2e                                  * Folder for e2e test files
-├── karma.conf.js                        * Unit Test configuration file
-├── nodemon.json                         * Nodemon (https://nodemon.io/) configuration
-├── package.json                         * This file describes the npm package for this project, its dependencies, scripts, etc.
-├── postcss.config.json                  * PostCSS (http://postcss.org/) configuration file
-├── protractor.conf.js                   * E2E tests configuration file
-├── resources                            * Folder for static resources
-│   ├── i18n                             * Folder for i18n translations
-│   └── images                           * Folder for images
-├── rollup-client.js                     * Rollup (http://rollupjs.org/) configuration for the client
-├── rollup-server.js                     * Rollup (http://rollupjs.org/) configuration for the server
-├── src                                  * The source of the application
-│   ├── app                              * The location of the app module, and root of the application shared by client and server
-│   ├── backend                          * Folder containing a mock of the REST API, hosted by the express server
-│   ├── browser.module.ts                * The root module for the client
-│   ├── client.aot.ts                    * The bootstrap file for the client, in production
-│   ├── client.ts                        * The bootstrap file for the client, during development
-│   ├── config.ts                        * File that loads environmental and shareable settings and makes them available to app components 
-│   ├── index-aot.html                   * The index.html file, for production
-│   ├── index.html                       * The index.html file, for development
-│   ├── node.module.ts                   * The root module for the server
-│   ├── server.aot.ts                    * The express (http://expressjs.com/) config and bootstrap file for the server, in production
-│   ├── server.routes.ts                 * The routes file for the server
-│   ├── server.ts                        * The express (http://expressjs.com/) config and bootstrap file for the server, during development
-│   ├── styles                           * Folder containing global styles.
-│   │   ├── main.scss                    * Global scss file
-│   │   └── variables.scss               * Global sass variables file
-│   └── typings.d.ts                     * File that allows you to add custom typings for libraries without TypeScript support
-├── tsconfig.aot.json                    * TypeScript config for production builds
-├── tsconfig.json                        * TypeScript config for development build
-├── tslint.json                          * TSLint (https://palantir.github.io/tslint/) configuration
-├── webpack.config.ts                    * Webpack (https://webpack.github.io/) config for development builds
-├── webpack.test.config.ts               * Webpack (https://webpack.github.io/) config for testing
-└── webpack.prod.config.ts               * Webpack (https://webpack.github.io/) config for production builds
+├── README.md                   * This document
+├── app.json                    * Application manifest file
+├── config                      * Folder for configuration files
+│   └── environment.default.js  * Default configuration files
+├── e2e                         * Folder for e2e test files
+├── karma.conf.js               * Unit Test configuration file
+├── nodemon.json                * Nodemon (https://nodemon.io/) configuration
+├── package.json                * This file describes the npm package for this project, its dependencies, scripts, etc.
+├── postcss.config.json         * PostCSS (http://postcss.org/) configuration file
+├── protractor.conf.js          * E2E tests configuration file
+├── resources                   * Folder for static resources
+│   ├── i18n                    * Folder for i18n translations
+│   └── images                  * Folder for images
+├── rollup-client.js            * Rollup (http://rollupjs.org/) configuration for the client
+├── rollup-server.js            * Rollup (http://rollupjs.org/) configuration for the server
+├── src                         * The source of the application
+│   ├── app                     * The location of the app module, and root of the application shared by client and server
+│   ├── backend                 * Folder containing a mock of the REST API, hosted by the express server
+│   ├── browser.module.ts       * The root module for the client
+│   ├── client.aot.ts           * The bootstrap file for the client, in production
+│   ├── client.ts               * The bootstrap file for the client, during development
+│   ├── config.ts               * File that loads environmental and shareable settings and makes them available to app components 
+│   ├── index-aot.html          * The index.html file, for production
+│   ├── index.html              * The index.html file, for development
+│   ├── node.module.ts          * The root module for the server
+│   ├── server.aot.ts           * The express (http://expressjs.com/) config and bootstrap file for the server, in production
+│   ├── server.routes.ts        * The routes file for the server
+│   ├── server.ts               * The express (http://expressjs.com/) config and bootstrap file for the server, during development
+│   ├── styles                  * Folder containing global styles.
+│   │   ├── main.scss           * Global scss file
+│   │   └── variables.scss      * Global sass variables file
+│   └── typings.d.ts            * File that allows you to add custom typings for libraries without TypeScript support
+├── tsconfig.aot.json           * TypeScript config for production builds
+├── tsconfig.json               * TypeScript config for development build
+├── tslint.json                 * TSLint (https://palantir.github.io/tslint/) configuration
+├── webpack.config.ts           * Webpack (https://webpack.github.io/) config for development builds
+├── webpack.test.config.ts      * Webpack (https://webpack.github.io/) config for testing
+└── webpack.prod.config.ts      * Webpack (https://webpack.github.io/) config for production builds
 ```
 
 ## 3rd Party Library Installation
diff --git a/config/environment.common.default.json b/config/environment.common.default.json
deleted file mode 100644
index 3d0d59c400..0000000000
--- a/config/environment.common.default.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "title": ""
-}
diff --git a/config/environment.default.js b/config/environment.default.js
new file mode 100644
index 0000000000..17d6f5afdc
--- /dev/null
+++ b/config/environment.default.js
@@ -0,0 +1,14 @@
+module.exports = {
+  "production": false,
+  // The REST API Location.
+  "rest": {
+    // NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
+    "nameSpace": "/api",
+    "baseURL": "http://localhost:3000"
+  },
+  // Path and Port in use for this Angular2 UI
+  "ui": {
+    "nameSpace": "/",
+    "baseURL": "http://localhost:3000"
+  }
+}
diff --git a/config/environment.default.json b/config/environment.default.json
deleted file mode 100644
index acc05d5790..0000000000
--- a/config/environment.default.json
+++ /dev/null
@@ -1,26 +0,0 @@
-{
-  "production": false,
-  // Location of REST API
-  "rest": {
-    // By default, we are currently using a local proxy running on port 5050.
-    // This is necessary because our actual REST API doesn't provide CORS headers yet!
-    // The actual REST API path is in the 'proxy' settings below.
-    // NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
-    "nameSpace": "",
-    "baseURL": ""
-  },
-  // REST Location that we are proxying (see src/proxy.ts)
-  // (Since we are using a proxy at this time, the actual REST API goes here)
-  "proxy": {
-    "nameSpace": "",
-    "baseURL": ""
-    // E.g. to use demo.dspace.org REST API, use the below values *instead*
-    //nameSpace: '/rest',
-    //baseURL: 'https://demo.dspace.org'
-  },
-  // Path and Port in use for this Angular2 UI
-  "ui": {
-    "nameSpace": "",
-    "baseURL": ""
-  }
-}
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 530e47dce3..df07b35edc 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -59,7 +59,6 @@ export class AppComponent implements OnDestroy, OnInit {
 
   @HostListener('window:resize', ['$event'])
   private onResize(event): void {
-    console.log(GlobalConfig.rest.baseURL);
     this.store.dispatch(
       HostWindowActions.resize(event.target.innerWidth, event.target.innerHeight)
     );
diff --git a/src/config.ts b/src/config.ts
index 9544ad0c2d..e4dc549265 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -2,33 +2,33 @@
 
 const path = require('path');
 
-let configContext = require.context("../config", false, /json$/);
+let configContext = require.context("../config", false, /js$/);
 let EnvConfig : any = {};
 let EnvConfigFile : string;
-let CommonConfig : any = {};
+let DefaultConfig : any = {};
 
 try {
-    CommonConfig = configContext('./environment.common.json');
+  DefaultConfig = configContext('./environment.default.js');
 } catch (e) {
-    throw new Error(`Cannot find file "${path.resolve('config', './environment.common.json')}"`);
+  throw new Error(`Cannot find file "${path.resolve('config', './environment.default.js')}"`);
 }
 
 switch (process.env.NODE_ENV) {
-    case 'prod':
-    case 'production':
-        EnvConfigFile = './environment.prod.json';
-        break;
-    case 'dev':
-    case 'development':
-    default:
-        EnvConfigFile = './environment.dev.json';
+  case 'prod':
+  case 'production':
+    EnvConfigFile = './environment.prod.js';
+    break;
+  case 'dev':
+  case 'development':
+  default:
+    EnvConfigFile = './environment.dev.js';
 }
 try {
-    EnvConfig = configContext(EnvConfigFile);
+  EnvConfig = configContext(EnvConfigFile);
 } catch (e) {
-    throw new Error(`Cannot find file "${path.resolve('config', EnvConfigFile)}"`);
+  EnvConfig = {};
 }
 
-const GlobalConfig = Object.assign(CommonConfig, EnvConfig);
+const GlobalConfig = Object.assign(DefaultConfig, EnvConfig);
 
 export {GlobalConfig}

From 845e921fe73fd7bd35f0b82304f54b5a6147a703 Mon Sep 17 00:00:00 2001
From: Giuseppe Digilio <giuseppe.digilio@4science.it>
Date: Fri, 27 Jan 2017 18:40:27 +0100
Subject: [PATCH 5/5] app.component.ts and app.component.html changed

---
 src/app/app.component.html | 1 -
 src/app/app.component.ts   | 1 -
 2 files changed, 2 deletions(-)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 595008f565..7db769997d 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -4,7 +4,6 @@
   <main>
     <p>{{ 'example.with.data' | translate:data }}</p>
     <p>{{ example }}</p>
-    <p><b>{{ title }}</b></p>
     <h2 *ngIf="!env" style="color:green">development</h2>
     <h2 *ngIf="env" style="color:red">production</h2>
     <router-outlet></router-outlet>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index df07b35edc..ff181e97b1 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -28,7 +28,6 @@ export class AppComponent implements OnDestroy, OnInit {
     recipient: 'World'
   };
 
-  title: string = GlobalConfig.title;
   env: string = GlobalConfig.production;
 
   styles = {