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 @@
{{ 'example.with.data' | translate:data }}
{{ example }}
+ {{ title }}
+ development
+ production
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
@@ -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}