WIP: npm+webpack mostly working

.gitignore

@@ -62,3 +62,6 @@ target/
 # Vagrant
 .vagrant
 Vagrantfile
+
+# Node JS stuff
+node_modules

nengo_gui/static/ace.js

@@ -8,6 +8,12 @@
  * page is loaded.
  */
 
+require('./ace.css');
+var ace = require('brace');
+require('brace/mode/python');
+var $ = require('jquery');
+var interact = require('interact.js');
+var Nengo = require('./nengo');
 
 Nengo.disable_editor = function() {
     $('#Toggle_ace').css('display', 'none');
@@ -17,7 +23,7 @@ Nengo.disable_editor = function() {
 }
 
 Nengo.Ace = function (uid, args) {
-    this.AceRange = ace.require('ace/range').Range;
+    this.AceRange = ace.Range;
     if (uid[0] === '<') {
         console.log("invalid uid for Ace: " + uid);
     }

nengo_gui/static/app.js

@@ -0,0 +1,45 @@
+// Requires all of the files that make up the Nengo JS app
+
+require('./favicon.ico');
+require('./app.css');
+
+require('bootstrap/dist/css/bootstrap.min.css');
+require('jqueryfiletree/dist/jQueryFileTree.min.css');
+
+require('expose?$!expose?jQuery!jquery');
+require('bootstrap');
+require('jqueryfiletree');
+require('jquery-ui');
+
+require('expose?Nengo!./nengo');
+
+require('./ace');
+require('./config');
+require('./data_to_csv');
+require('./datastore');
+require('./hotkeys');
+require('./menu');
+require('./modal');
+require('./side_menu');
+require('./sim_control');
+require('./tooltips');
+require('./top_toolbar');
+require('./viewport');
+
+require('./components/component');
+require('./components/value');
+
+require('./components/2d_axes');
+require('./components/htmlview');
+require('./components/image');
+require('./components/netgraph');
+require('./components/netgraph_conn');
+require('./components/netgraph_item');
+require('./components/pointer');
+require('./components/raster');
+require('./components/slider');
+require('./components/slidercontrol');
+require('./components/spa_similarity');  // Must go after value
+require('./components/time_axes');
+require('./components/xy_axes');
+require('./components/xyvalue');

nengo_gui/static/components/2d_axes.js

@@ -9,6 +9,10 @@
  * @param {float} args.max_value - maximum value on y-axis
  */
 
+var d3 = require('d3');
+var $ = require('jquery');
+var Nengo = require('../nengo');
+
 Nengo.Axes2D = function(parent, args) {
     var self = this;
 

nengo_gui/static/components/component.js

@@ -14,10 +14,15 @@
  * @param {boolean} args.label_visible - whether the label should be shown
  * @param {int} args.id - the id of the server-side component to connect to
  *
- * Component is inherited by specific component 
+ * Component is inherited by specific component
  * class prototypes (ie. Slider, Value)
  *
  */
+
+var interact = require('interact.js');
+var $ = require('jquery');
+var Nengo = require('../nengo');
+
 Nengo.Component = function(parent, args) {
     var self = this;
 

nengo_gui/static/components/htmlview.js

@@ -8,6 +8,8 @@
  * @param {dict} args - A set of constructor arguments (see Nengo.Component)
  */
 
+var Nengo = require('../nengo');
+
 Nengo.HTMLView = function(parent, sim, args) {
     Nengo.Component.call(this, parent, args);
     var self = this;

nengo_gui/static/components/image.js

@@ -10,6 +10,9 @@
  * @param {float} args.maxy - maximum value on y-axis
  */
 
+var d3 = require('d3');
+var Nengo = require('../nengo');
+
 Nengo.Image = function(parent, sim, args) {
     var self = this;
 

nengo_gui/static/components/netgraph.css

@@ -4,21 +4,21 @@
 
 .ensemble{
     stroke-width:1;
-    }
+}
 
 g.node rect{
     stroke-width:1;
-    }
+}
 
 g.net rect{
     stroke-width:1;
-    }
+}
 
 .netgraph g text {
     text-anchor: middle;
     dominant-baseline: text-before-edge;
     cursor: default !important;
-    }
+}
 
 .netgraph g text:active {
     cursor: move;
@@ -62,4 +62,3 @@ rect.view{
     text-anchor: middle;
     dominant-baseline: text-before-edge;
 }
-

nengo_gui/static/components/netgraph.js

@@ -9,6 +9,12 @@
  * NetGraph constructor is written into HTML file from the python
  * server and is run on page load.
  */
+
+require('./netgraph.css');
+var interact = require('interact.js');
+var $ = require('jquery');
+var Nengo = require('../nengo');
+
 Nengo.NetGraph = function(parent, args) {
     if (args.uid[0] === '<') {
         console.log("invalid uid for NetGraph: " + args.uid);
@@ -127,7 +133,7 @@ Nengo.NetGraph = function(parent, args) {
 
     this.width = $(this.svg).width();
     this.height = $(this.svg).height();
-    
+
     this.tool_height = $(toolbar.toolbar).height();
 
     /** three separate layers, so that expanded networks are at the back,
@@ -144,10 +150,7 @@ Nengo.NetGraph = function(parent, args) {
      *  this is needed for saving the SVG plot to disk*/
 
     /** load contents of the CSS file as string */
-    var file = document.getElementById('netgraphcss');
-    var css = Array.prototype.map.call(file.sheet.cssRules, function
-            css_text(x) {return x.cssText; } ).join('\n');
-
+    var css = require('css-to-string-loader!./netgraph.css');
     /** embed CSS code into SVG tag */
     var s = document.createElement('style');
     s.setAttribute('type', 'text/css');
@@ -348,9 +351,9 @@ Nengo.NetGraph.prototype.on_message = function(event) {
         item.y = data.pos[1];
         item.width = data.size[0];
         item.height = data.size[1];
-        
+
         item.redraw();
-        
+
         this.scaleMiniMap();
 
     } else if (data.type === 'config') {
@@ -373,7 +376,7 @@ Nengo.NetGraph.prototype.on_message = function(event) {
         if (item === undefined) {
             item = this.svg_conns[data.uid];
         }
-        
+
         item.remove();
 
     } else if (data.type === 'reconnect') {
@@ -461,7 +464,7 @@ Nengo.NetGraph.prototype.create_object = function(info) {
 Nengo.NetGraph.prototype.create_connection = function(info) {
 	var conn_mini = new Nengo.NetGraphConnection(this, info, true);
     this.minimap_conns[info.uid] = conn_mini;
-    
+
     var conn = new Nengo.NetGraphConnection(this, info, false, conn_mini);
     this.svg_conns[info.uid] = conn;
 };
@@ -480,7 +483,7 @@ Nengo.NetGraph.prototype.on_resize = function(event) {
                 var new_width = item.get_screen_width() / this.scale;
                 var new_height = item.get_screen_height() / this.scale;
                 item.width = new_width/(2*width);
-                item.height = new_height/(2*height);               
+                item.height = new_height/(2*height);
             }
         }
     }
@@ -583,7 +586,7 @@ Nengo.NetGraph.prototype.create_minimap = function () {
 
     this.mm_width = $(this.minimap).width();
     this.mm_height = $(this.minimap).height();
-    
+
     // default display minimap
     this.mm_display = true;
     this.toggleMiniMap();
@@ -665,7 +668,7 @@ Nengo.NetGraph.prototype.scaleMiniMap = function () {
  * main viewport and scale the viewbox to reflect that. */
 Nengo.NetGraph.prototype.scaleMiniMapViewBox = function () {
     if (!this.mm_display) { return; }
-    
+
     var mm_w = this.mm_width
     var mm_h = this.mm_height
 

nengo_gui/static/components/netgraph_conn.js

@@ -9,6 +9,9 @@
  * @param {array of strings} info.pre - uid to connect from and its parents
  * @param {array of strings} info.post - uid to connect to and its parents
  */
+
+var Nengo = require('../nengo');
+
 Nengo.NetGraphConnection = function(ng, info, minimap, mini_conn) {
     this.ng = ng;
     this.uid = info.uid;
@@ -190,15 +193,15 @@ Nengo.NetGraphConnection.prototype.find_post = function() {
 Nengo.NetGraphConnection.prototype.set_pres = function(pres) {
     this.pres = pres;
     this.set_pre(this.find_pre());
-    
+
     if (!this.minimap) {
     	this.mini_conn.set_pres(pres);
     }
 }
 Nengo.NetGraphConnection.prototype.set_posts = function(posts) {
     this.posts = posts;
     this.set_post(this.find_post());
-    
+
     if (!this.minimap) {
     	this.mini_conn.set_posts(posts);
     }
@@ -236,7 +239,7 @@ Nengo.NetGraphConnection.prototype.remove = function() {
     this.removed = true;
 
     delete this.ng.svg_conns[this.uid];
-    
+
     if (!this.minimap) {
     	this.mini_conn.remove();
     }
@@ -341,7 +344,7 @@ Nengo.NetGraphConnection.prototype.redraw = function() {
         this.marker.setAttribute('transform',
                           'translate(' + mx + ',' + my + ') rotate('+ angle +')');
     }
-    
+
     if (!this.minimap && this.ng.mm_display) {
     	this.mini_conn.redraw();
     }