Merge branch 'motion'

angular-cli-build.js

@@ -11,6 +11,7 @@ module.exports = function(defaults) {
       'ng2-charts/bundles/ng2-charts.js',
       'chroma-js/chroma.js',
       'plotly.js/dist/plotly.js',
+      'brainbrowser/build/brainbrowser-2.3.0/**/*.js',
       'systemjs/dist/system-polyfills.js',
       'systemjs/dist/system.src.js',
       'zone.js/dist/*.js',

package.json

@@ -40,6 +40,7 @@
     "@angular/platform-browser": "2.0.0-rc.1",
     "@angular/platform-browser-dynamic": "2.0.0-rc.1",
     "@angular/router": "2.0.0-rc.1",
+    "brainbrowser": "^2.3.0",
     "chart.js": "^1.0.2",
     "chroma-js": "^1.1.1",
     "dsp.js": "neurojs/dsp.js",

src/app/dashboard.component.html

@@ -7,6 +7,7 @@
       <a [routerLink]="['/frequency/line', { type: 'Line' }]">Frequency Line</a>
       <a [routerLink]="['/frequency/radar', { type: 'Radar' }]">Frequency Radar</a>
       <a [routerLink]="['/frequency/bands']">Frequency Bands</a>
+      <a [routerLink]="['/motion']">Motion</a>
       <a [routerLink]="['/topo']">Topo</a>
     </nav>
     <router-outlet></router-outlet>

src/app/dashboard.component.ts

@@ -4,6 +4,7 @@ import { TimeSeriesComponent } from './time-series';
 import { FrequencyComponent } from './frequency';
 import { FrequencyBandsComponent } from './frequency-bands';
 import { TopoComponent } from './topo';
+import { MotionComponent } from './motion';
 import { Routes, Router, ROUTER_PROVIDERS, ROUTER_DIRECTIVES } from '@angular/router';
 
 @Component({
@@ -21,6 +22,7 @@ import { Routes, Router, ROUTER_PROVIDERS, ROUTER_DIRECTIVES } from '@angular/ro
   { path: '/frequency/line', component: FrequencyComponent },
   { path: '/frequency/radar', component: FrequencyComponent },
   { path: '/frequency/bands', component: FrequencyBandsComponent },
+  { path: '/motion', component: MotionComponent },
   { path: '/topo', component: TopoComponent }
 ])
 

src/app/motion/index.ts

@@ -0,0 +1 @@
+export { MotionComponent } from './motion.component';

src/app/motion/motion.component.css

@@ -0,0 +1,25 @@
+
+:host {
+  display: block;
+  margin: 20px;
+  padding: 20px;
+  box-shadow: 0 0 5px rgba(0,0,0,0.3);
+  background-color: #333333;
+  position: relative;
+  height: 100%;
+  width: 768px;
+  overflow: hidden;
+}
+
+h2 {
+  position: absolute;
+  margin: 0;
+  top: 10px;
+  right: 20px;
+  font-weight: 300;
+}
+
+#brainbrowser {
+  width: 100%;
+  height: 500px;
+}

src/app/motion/motion.component.html

@@ -0,0 +1,4 @@
+<section class="motion" [ngClass]="{ 'loading': !model }">
+    <h2>Motion</h2>
+    <article id="brainbrowser"></article>
+</section>

src/app/motion/motion.component.spec.ts

@@ -0,0 +1,46 @@
+import {
+  beforeEach,
+  beforeEachProviders,
+  describe,
+  expect,
+  it,
+  inject,
+} from '@angular/core/testing';
+import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing';
+import { Component } from '@angular/core';
+import { By } from '@angular/platform-browser';
+import { MotionComponent } from './motion.component';
+
+describe('Component: Motion', () => {
+  let builder: TestComponentBuilder;
+
+  beforeEachProviders(() => [MotionComponent]);
+  beforeEach(inject([TestComponentBuilder], function (tcb: TestComponentBuilder) {
+    builder = tcb;
+  }));
+
+  it('should inject the component', inject([MotionComponent],
+      (component: MotionComponent) => {
+    expect(component).toBeTruthy();
+  }));
+
+  it('should create the component', inject([], () => {
+    return builder.createAsync(MotionComponentTestController)
+      .then((fixture: ComponentFixture<any>) => {
+        let query = fixture.debugElement.query(By.directive(MotionComponent));
+        expect(query).toBeTruthy();
+        expect(query.componentInstance).toBeTruthy();
+      });
+  }));
+});
+
+@Component({
+  selector: 'test',
+  template: `
+    <bci-motion></bci-motion>
+  `,
+  directives: [MotionComponent]
+})
+class MotionComponentTestController {
+}
+

src/app/motion/motion.component.ts

@@ -0,0 +1,53 @@
+import { Component, OnInit, ElementRef } from '@angular/core';
+import * as io from 'socket.io-client';
+import { Constants } from '../shared/constants';
+
+declare var BrainBrowser;
+
+@Component({
+  moduleId: module.id,
+  selector: 'bci-motion',
+  templateUrl: 'motion.component.html',
+  styleUrls: ['motion.component.css'],
+  providers: [Constants]
+})
+
+export class MotionComponent implements OnInit {
+
+  socket: any;
+  viewer: any;
+  model: any;
+  constructor(private view: ElementRef, private constants: Constants) {
+    this.socket = io(constants.socket.url);
+  }
+  
+  private rotation = [];
+
+  ngOnInit() {
+    BrainBrowser.config.set('worker_dir', 'vendor/brainbrowser/build/brainbrowser-2.3.0/workers');
+    
+    this.socket.on(this.constants.socket.events.motion, (data) => {
+      this.rotation = data.data;
+      
+      if (this.model) {
+        this.viewer.resetView();
+        this.viewer.model.rotation.set(...this.rotation);
+      }
+    });
+  }
+  
+  ngAfterViewInit () {
+    this.viewer = BrainBrowser.SurfaceViewer.start('brainbrowser', (viewer) => {
+      this.viewer = viewer;
+      this.viewer.render();
+      this.viewer.setWireframe(true);
+      this.viewer.loadModelFromURL('app/motion/models/brain-surface.obj');
+      this.viewer.setClearColor(0x333333);
+      
+      this.viewer.addEventListener('displaymodel', (data) => {
+        this.model = data.model;
+      });
+    });
+  }
+
+}

src/app/shared/constants.ts

@@ -9,7 +9,8 @@ export class Constants {
           fft: 'bci:fft',
           time: 'bci:time',
           topo: 'bci:topo',
-          filter: 'bci:filter'
+          filter: 'bci:filter',
+          motion: 'bci:motion'
       }
   };
   

src/index.html

@@ -36,6 +36,7 @@
   <script src="vendor/chart.js/Chart.js"></script>
   <script src="vendor/chroma-js/chroma.js"></script>
   <script src="vendor/plotly.js/dist/plotly.js"></script>
+  <script src="vendor/brainbrowser/build/brainbrowser-2.3.0/brainbrowser.surface-viewer.min.js"></script>
   <script src="vendor/es6-shim/es6-shim.js"></script>
   <script src="vendor/reflect-metadata/Reflect.js"></script>
   <script src="vendor/systemjs/dist/system.src.js"></script>

src/server/app.js

@@ -1,15 +1,18 @@
 'use strict';
+ 
+const constants = require('./constants'); 
+const io = require('socket.io')(process.env.app_port || constants.sockets.port);
 
 const Connectors = require('./connectors');
 const Providers = require('./providers');
-const Modules = require('./modules');  
-const constants = require('./constants'); 
+const Modules = require('./modules'); 
 
 const Connector = new Connectors.Serialport({
     verbose: true
 });
 
-const Signal = new Providers.Signal();
+const Signal = new Providers.Signal({ io });
+const Motion = new Providers.Motion({ io });
 
 Connector.start().then(() => {
     const FFT = new Modules.FFT({ Signal });
@@ -19,8 +22,7 @@ Connector.start().then(() => {
 
 Connector.stream((data) => {
     Signal.buffer(data);
+    Motion.capture(data);
 });
 
 process.on(constants.events.terminate, Connector.stop);
-
-

src/server/constants/index.js

@@ -41,11 +41,15 @@ module.exports = {
         time: 'bci:time',
         signal: 'bci:signal',
         filter: 'bci:filter',
+        motion: 'bci:motion',
         terminate: 'SIGINT'
     },
     topo: {
         params: [0,10,11],
         x: [3,7,2,8,0,10,3,7], 
         y: [0,0,3,3,8,8,10,10]
+    },
+    sockets: {
+        port: 8080
     }
 };

src/server/providers/index.js

@@ -1,7 +1,9 @@
 'use strict';
 
 const Signal = require('./signal.provider');
+const Motion = require('./motion.provider');
 
 module.exports = {
-    Signal
+    Signal,
+    Motion
 }

src/server/providers/motion.provider.js

@@ -0,0 +1,57 @@
+'use strict';
+
+const constants = require('../constants');
+const Utils = require('../utils');
+
+module.exports = class Motion {
+    
+    constructor ({ io }) {
+        this.io = io;
+        this.auxData = [];
+        this.count = 0;
+    }
+    
+    capture ({ auxData }) {
+        
+        if (Utils.signal.isSimulated()) {
+            this.simulate();
+        } else {
+            if (this.hasMotion(auxData)) {
+                this.auxData = this.amplify(auxData);
+                this.emit();
+            }
+        }   
+             
+    }
+    
+    hasMotion (auxData) {
+        return auxData.reduce((a, b) => a + b, 0);
+    }
+    
+    amplify (auxData) {
+        return auxData.map(axis => Math.round(axis));
+    }
+    
+    simulate () {
+        this.count++;
+            
+        if (this.count === 10) {
+            this.auxData = [
+                Math.round(Math.random() * 180),
+                Math.round(Math.random() * 180),
+                Math.round(Math.random() * 180)
+            ];
+            this.count = 0;
+            
+            
+            this.emit();
+        }            
+    }
+    
+    emit () {
+        this.io.emit(constants.events.motion, {
+            data: this.auxData
+        });
+    }
+    
+}

src/server/providers/signal.provider.js

@@ -1,6 +1,5 @@
 'use strict';
 
-const io = require('socket.io')(process.env.app_port || 8080);
 const EventEmitter = require('events');
 const Utils = require('../utils');
 const constants = require('../constants');
@@ -9,7 +8,7 @@ class SignalEmitter extends EventEmitter {}
 
 module.exports = class Signal {
     
-    constructor () {
+    constructor ({ io }) {
         this.io = io;
         this.emitter = new SignalEmitter();
         this.bins = constants.signal.bins;

src/system-config.ts

@@ -7,7 +7,8 @@ const map: any = {
   'ng2-charts': 'vendor/ng2-charts/bundles/ng2-charts.js',
   'socket.io-client': 'vendor/socket.io-client/socket.io.js',
   'chroma-js': 'vendor/chroma-js/chroma.js',
-  'plotly': 'vendor/plotly.js/dist/plotly.js'
+  'plotly': 'vendor/plotly.js/dist/plotly.js',
+  'brainbrowser': 'vendor/brainbrowser/build/brainbrowser-2.3.0/brainbrowser.surface-viewer.min.js'
 };  
 
 /** User packages configuration. */
@@ -42,6 +43,7 @@ const barrels: string[] = [
   'app/frequency-band',
   'app/topo',
   'app/filters',
+  'app/motion',
   /** @cli-barrel */
 ];