update design build

client/config/design/app.js

@@ -1,6 +1,7 @@
 import Styles from 'config/styles';
 import Templates from 'config/templates';
-import {hashHistory} from 'react-router';
+import createHistory from 'history/lib/createHashHistory';
+import { useQueries } from 'history';
 import app from './../../app';
 
 Promise.all([
@@ -8,5 +9,5 @@ Promise.all([
   Styles.sync()
 ]).then(()=>{
   jQuery('#compiling_layouts').remove();
-  app(hashHistory);
+  app(useQueries(createHistory));
 });

client/config/design/component_map.js

@@ -1 +1 @@
-export const COMPONENT_MAP = {"about":"dashboard/about/about","energy":"dashboard/energy/energy","energy_graph":"dashboard/energy/graph/graph","energy_table":"dashboard/energy/table/table","house":"dashboard/house/house","layout":"dashboard/layout/layout","power_graph":"dashboard/power/graph/graph","power":"dashboard/power/power","power_table":"dashboard/power/table/table"}
+export const COMPONENT_MAP = {"energy":"dashboard/energy/energy","energy_graph":"dashboard/energy/graph/graph","energy_table":"dashboard/energy/table/table","layout":"dashboard/layout/layout","power_graph":"dashboard/power/graph/graph","power":"dashboard/power/power","power_table":"dashboard/power/table/table"}

client/config/design/style.js

@@ -1,5 +1,4 @@
 // Vendor Stylesheets
 require('bootstrap/dist/css/bootstrap.min.css');
-require('font-awesome/css/font-awesome.min.css');
 require(__dirname + '/../../d3/chart.scss');
 

client/config/design/styles.js

@@ -9,10 +9,13 @@ class Styles {
       var done = new Promise((fnResolve, fnReject)=>{
         Styles.addCss(view, fnResolve)
       }).then((result)=>{
-        css += result;
+        if (result) css += result;
       });
       all.push(done);
     }
+    var app_styles =
+    all.push(Styles.addAppCss()
+      .then((result)=>{ if(result)css += result; }));
     return Promise.all(all)
       .then(()=>{
         jQuery('head').append(`<style>${css}</style>`);
@@ -31,6 +34,19 @@ class Styles {
     });
   }
 
+  static addAppCss(){
+    return new Promise((fnResolve, fnReject)=>{
+      jQuery.ajax({
+        url: '/dashboard/app.scss'
+      }).then((scss)=>{
+        var sass = new Sass();
+        sass.compile(scss, (result, a)=>{
+          fnResolve(result.text);
+        });
+      });
+    });
+  }
+
 }
 
 export default Styles;

client/config/design/templates.js

@@ -1,4 +1,4 @@
-import rt from 'react-templates';
+import react_templates from 'react-templates/dist/reactTemplates';
 import React from 'react';
 import _ from 'lodash';
 
@@ -8,33 +8,36 @@ var TEMPLATES = {};
 
 class Templates {
 
+  static forComponent(name){
+    return TEMPLATES[name];
+  }
+
   static sync(){
-    var all = [];
+    var all = [],
+      eval_context = {
+        '_': _,
+        'React': React
+      };
+    for (var component_name in COMPONENT_MAP){
+      var component = require('./../../' + COMPONENT_MAP[component_name] + '.component');
+      eval_context[component.NAME] = component;
+    }
     for (var component_name in COMPONENT_MAP){
       var done = new Promise((fnResolve, fnReject)=>{
-        Templates.evalTemplate(component_name, fnResolve);
+        Templates.evalTemplate(component_name, eval_context, fnResolve);
       });
       all.push(done);
     }
     return Promise.all(all);
   }
 
-  static forComponent(name){
-    return TEMPLATES[name];
-  }
-
-  static evalTemplate(component_name, fnResolve){
+  static evalTemplate(component_name, eval_context, fnResolve){
     jQuery.ajax({
       url: COMPONENT_MAP[component_name] + '.rt'
     }).done((template)=>{
-      var code = rt.convertTemplateToReact(template, {modules: 'none', name: component_name}),
-        eval_context = {};
-      code = code.replace('var ' + component_name + ' = ', 'eval_context.' + component_name + ' = ');
-      new Function('with(this){ ' + code + ' } ').call({
-        eval_context: eval_context,
-        '_': _,
-        'React': React
-      });
+      var code = react_templates.convertTemplateToReact(template, {modules: 'none', name: component_name}),
+      code = code.replace('var ' + component_name + ' = ', 'this.' + component_name + ' = ');
+      new Function('with(this){ ' + code + ' } ').call(eval_context);
       TEMPLATES[component_name] = eval_context[component_name];
       fnResolve();
     });

client/config/test/webpack.js

@@ -1,55 +0,0 @@
-import webpack from 'webpack';
-
-module.exports = {
-  entry: {
-    app: __dirname + '/../../config/development/app',
-    style: __dirname + '/../../config/development/style'
-  },
-  output: {
-    filename: '[name].js',
-    path: __dirname + '/../../build/development'
-  },
-  module: {
-      loaders: [
-          {
-              test: /\.scss$/,
-              loaders: ['style', 'raw', 'sass']
-          }, {
-              test: /\.css$/,
-              loaders: ['style', 'raw']
-          }, {
-            test: /\.js$/,
-            loader: 'babel'
-          }, {
-            test: /\.json$/,
-            loader: 'json'
-          }, {
-            test: /\.rt/,
-            loader: "react-templates-loader?targetVersion=0.14.0"
-          }
-      ]
-  },
-  sassLoader: {
-    includePaths: [__dirname + '/../..', __dirname + '/../../../node_modules']
-  },
-  plugins: [
-      new webpack.ProvidePlugin({
-          $: "jquery",
-          jQuery: "jquery",
-          "window.jQuery": "jquery"
-      }),
-      new webpack.ProvidePlugin({
-          d3: "d3",
-          "window.d3": "d3"
-      })
-  ],
-  node: {
-    fs: "empty"
-  },
-  resolve: {
-      alias: {
-          api: __dirname + '/../../api/development',
-          config: __dirname + '/../../config/development'
-      }
-  }
-}