Coloring selected gene and other changes

	- Added some new config files to manage builds easily
	- Changed all config files to reflect having Firebase
	- Cleaned scatter and row charts component code
	- Fixes #2
	- Fixed the positioning in the row chart to reflect
	how the forest plot works
	- Improved scatter and row charts tooltips
	- Removed the line chart component
	- Changed how the data is passed to the targets list and search
	components

config/build-utils.js

@@ -3,8 +3,11 @@ const path = require('path');
 const fs = require('fs');
 const helpers = require('./helpers');
 
+const APP_COMMON_CONFIG = require('./config.common.json');
+
 const DEFAULT_METADATA = {
-  title: 'Wall of Targets',
+  title: APP_COMMON_CONFIG.title,
+  description: APP_COMMON_CONFIG.description,
   baseUrl: '/',
   isDevServer: helpers.isWebpackDevServer(),
   HMR: helpers.hasProcessFlag('hot'),

config/config.common.json

@@ -0,0 +1,4 @@
+{
+    "title": "Wall of Targets",
+    "description": "Wall of Targets is an application to aggregate genomic evidence supporting candidate gene and module targets nominated by members of the AMP-AD consortium."
+}

config/config.dev.json

@@ -0,0 +1,10 @@
+{
+    "firebase": {
+        "apiKey": "AIzaSyBMS96wgJfydRf7BLDVh4DGtRKAZT8UpTM",
+        "authDomain": "wall-of-targets.firebaseapp.com",
+        "databaseURL": "https://wall-of-targets.firebaseio.com",
+        "projectId": "wall-of-targets",
+        "storageBucket": "wall-of-targets.appspot.com",
+        "messagingSenderId": "256222676709"
+    }
+}

config/config.prod.json

@@ -0,0 +1,11 @@
+{
+    "firebase": {
+        "apiKey": "AIzaSyBMS96wgJfydRf7BLDVh4DGtRKAZT8UpTM",
+        "authDomain": "wall-of-targets.firebaseapp.com",
+        "databaseURL": "https://wall-of-targets.firebaseio.com",
+        "projectId": "wall-of-targets",
+        "storageBucket": "wall-of-targets.appspot.com",
+        "messagingSenderId": "256222676709"
+    },
+    "gtmKey" : "GTM-XXXXXXX"
+}

config/karma.conf.js

@@ -1,11 +1,11 @@
 /**
- * @author: @AngularClass
+ * @author: tipe.io
  */
 
 module.exports = function (config) {
-  var testWebpackConfig = require('./webpack.test.js')({ env: 'test' });
+  const testWebpackConfig = require('./webpack.test.js')({ env: 'test' });
 
-  var configuration = {
+  const configuration = {
 
     /**
      * Base path that will be used to resolve all patterns (e.g. files, exclude).
@@ -74,7 +74,7 @@ module.exports = function (config) {
        * webpack-dev-middleware configuration
        * i.e.
        */
-      noInfo: true,
+      logLevel: 'warn',
       /**
        * and use stats to turn off verbose output
        */
@@ -120,28 +120,55 @@ module.exports = function (config) {
      * available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
      */
     browsers: [
-      'Chrome'
+      'Chrome',
+      'ChromeTravisCi'
     ],
 
     customLaunchers: {
       ChromeTravisCi: {
-        base: 'Chrome',
-        flags: ['--no-sandbox']
+        base: 'ChromeHeadless',
+        flags: ['--no-sandbox', '--disable-gpu']
       }
     },
 
     /**
      * Continuous Integration mode
      * if true, Karma captures browsers, runs the tests and exits
      */
-    singleRun: true
+    singleRun: true,
+    /**
+     * For slower machines you may need to have a longer browser
+     * wait time . Uncomment the line below if required.
+     */
+    // browserNoActivityTimeout: 30000
+
   };
 
+  // Optional Sonar Qube Reporter
+  if (process.env.SONAR_QUBE) {
+
+    // SonarQube reporter plugin configuration
+    configuration.sonarQubeUnitReporter = {
+      sonarQubeVersion: '5.x',
+      outputFile: 'reports/ut_report.xml',
+      overrideTestDescription: true,
+      testPath: 'src/app',
+      testFilePattern: '.spec.ts',
+      useBrowserName: false
+    };
+
+    // Additional lcov format required for
+    // sonarqube
+    configuration.remapCoverageReporter.lcovonly = './coverage/coverage.lcov';
+
+    configuration.reporters.push('sonarqubeUnit');
+  }
+
   if (process.env.TRAVIS) {
     configuration.browsers = [
       'ChromeTravisCi'
     ];
   }
 
   config.set(configuration);
-};
+};

config/nginx-custom.conf

@@ -0,0 +1,19 @@
+server {
+  listen 80;
+
+  gzip on;
+  gzip_http_version 1.1;
+  gzip_disable      "MSIE [1-6]\.";
+  gzip_min_length   1100;
+  gzip_vary         on;
+  gzip_proxied      expired no-cache no-store private auth;
+  gzip_types        text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript;
+  gzip_comp_level   5;
+
+  root /usr/share/nginx/html;
+
+  location / {
+    index index.html index.htm;
+    try_files $uri $uri/ /index.html =404;
+  }
+}

config/protractor.conf.js

@@ -1,5 +1,5 @@
 /**
- * @author: @AngularClass
+ * @author: tipe.io
  */
 
 require('ts-node/register');
@@ -17,24 +17,23 @@ exports.config = {
   ],
   exclude: [],
 
-  framework: 'jasmine2',
+  framework: 'jasmine',
 
-  allScriptsTimeout: 110000,
+  allScriptsTimeout: 11000,
 
   jasmineNodeOpts: {
     showTiming: true,
     showColors: true,
     isVerbose: false,
     includeStackTrace: false,
-    defaultTimeoutInterval: 400000
+    defaultTimeoutInterval: 40000
   },
-  directConnect: true,
 
+  directConnect: true,
   capabilities: {
-    'browserName': 'chrome',
-    'chromeOptions': {
-      //'args': ["--headless", "--disable-gpu", "--window-size=1280x800",  "--no-sandbox"]
-      'args': ['show-fps-counter=true']
+    browserName: 'chrome',
+    chromeOptions: {
+      args: [ "--headless", "--disable-gpu", "--window-size=800x600", "--no-sandbox" ]
     }
   },
 
@@ -51,4 +50,4 @@ exports.config = {
    useAllAngular2AppRoots: true,
 
    SELENIUM_PROMISE_MANAGER: false,
-};
+};

config/spec-bundle.js

@@ -1,5 +1,5 @@
 /**
- * @author: @AngularClass
+ * @author: tipe.io
  */
 
 /**
@@ -60,4 +60,4 @@ function requireAll(requireContext) {
 /**
  * Requires and returns all modules that match
  */
-var modules = requireAll(testContext);
+var modules = requireAll(testContext);

config/webpack.common.js

@@ -17,6 +17,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
 const InlineManifestWebpackPlugin = require('inline-manifest-webpack-plugin');
 const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin');
 const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin');
+const ProvidePlugin = require('webpack/lib/ProvidePlugin');
 const ngcWebpack = require('ngc-webpack');
 
 const buildUtils = require('./build-utils');
@@ -28,20 +29,24 @@ const buildUtils = require('./build-utils');
  * See: http://webpack.github.io/docs/configuration.html#cli
  */
 module.exports = function (options) {
-  const isProd = options.env === 'production';
-  const METADATA = Object.assign({}, buildUtils.DEFAULT_METADATA, options.metadata || {});
-  const ngcWebpackConfig = buildUtils.ngcWebpackSetup(isProd, METADATA);
-  const supportES2015 = buildUtils.supportES2015(METADATA.tsConfigPath);
-
-  const entry = {
-    polyfills: './src/polyfills.browser.ts',
-    main:      './src/main.browser.ts'
-  };
+    const isProd = options.env === 'production';
+    const APP_CONFIG = require(process.env.ANGULAR_CONF_FILE || (isProd ? './config.prod.json' : './config.dev.json'));
+
+    const METADATA = Object.assign({}, buildUtils.DEFAULT_METADATA,options.metadata || {});
+    const GTM_API_KEY = process.env.GTM_API_KEY || APP_CONFIG.gtmKey;
+
+    const ngcWebpackConfig = buildUtils.ngcWebpackSetup(isProd, METADATA);
+    const supportES2015 = buildUtils.supportES2015(METADATA.tsConfigPath);
 
-  Object.assign(ngcWebpackConfig.plugin, {
-    tsConfigPath: METADATA.tsConfigPath,
-    mainPath: entry.main
-  });
+    const entry = {
+      polyfills: './src/polyfills.browser.ts',
+      main:      './src/main.browser.ts'
+    };
+
+    Object.assign(ngcWebpackConfig.plugin, {
+      tsConfigPath: METADATA.tsConfigPath,
+      mainPath: entry.main
+    });
 
   return {
     /**
@@ -179,7 +184,8 @@ module.exports = function (options) {
         'AOT': METADATA.AOT,
         'process.env.ENV': JSON.stringify(METADATA.ENV),
         'process.env.NODE_ENV': JSON.stringify(METADATA.ENV),
-        'process.env.HMR': METADATA.HMR
+        'process.env.HMR': METADATA.HMR,
+        'FIREBASE_CONFIG': JSON.stringify(APP_CONFIG.firebase)
       }),
 
       /**
@@ -303,6 +309,10 @@ module.exports = function (options) {
        * https://github.com/szrenwei/inline-manifest-webpack-plugin
        */
       new InlineManifestWebpackPlugin(),
+
+      new ProvidePlugin({
+        'dc': 'dc'
+      })
     ],
 
     /**
@@ -312,14 +322,12 @@ module.exports = function (options) {
      * See: https://webpack.github.io/docs/configuration.html#node
      */
     node: {
-      global: true,
-      crypto: 'empty',
-      process: true,
-      module: false,
-      clearImmediate: false,
-      setImmediate: false,
-      fs: 'empty',
-      readline: 'empty'
+        global: true,
+        crypto: 'empty',
+        process: true,
+        module: false,
+        clearImmediate: false,
+        setImmediate: false
     }
 
   };

src/app/charts/charts.module.ts

@@ -4,7 +4,6 @@ import { CommonModule } from '@angular/common';
 import { AppSharedModule } from '../shared';
 
 import { ScatterPlotViewComponent } from './scatter-plot/scatter-plot-view';
-import { LineChartViewComponent } from './line-chart/line-chart-view';
 import { SelectMenuViewComponent } from './select-menu/select-menu-view';
 import { RowChartViewComponent } from './row-chart/row-chart-view';
 
@@ -22,7 +21,6 @@ import {
 @NgModule({
     declarations: [
         ScatterPlotViewComponent,
-        LineChartViewComponent,
         SelectMenuViewComponent,
         RowChartViewComponent
     ],
@@ -41,7 +39,6 @@ import {
     ],
     exports: [
         ScatterPlotViewComponent,
-        LineChartViewComponent,
         SelectMenuViewComponent,
         RowChartViewComponent
     ]

src/app/charts/row-chart/row-chart-view/row-chart-view.component.html

@@ -8,7 +8,7 @@ <h2 class="chart chart-header">{{title}}</h2>
         <div #studies class="col-md-4 rc" style="padding-right: 0px;">
         </div>
         <div class="col-md-8" style="padding-left: 0px;">
-            <div #chart class="rc"></div>
+            <div #chart class="rc" [ngStyle]="displayChart()"></div>
         </div>
     </div>
 </div>