added jquery, underscore, render using underscore templates, changed …

…ejs templates, changed config options, added camera id to door config

.gitignore

@@ -1,4 +1,4 @@
 node_modules/
 *.swp
 node.out
-
+.DS_Store

app.js

@@ -8,6 +8,7 @@ var routes      = require('./routes');
 var user        = require('./routes/user');
 var http        = require('http');
 var path        = require('path');
+var ejs         = require('ejs');
     een         = require('./een.js');
 
 var serialport  = require('serialport');
@@ -29,6 +30,9 @@ var app = express(),
     server = http.createServer(app),
     io = require('socket.io').listen(server, { log: false });
 
+// change default template tags to playnice with underscore template tags
+ejs.open = '{{';
+ejs.close = '}}';
 
 // all environments
 app.set('port', process.env.PORT || 3000);
@@ -97,7 +101,8 @@ function dataFromSerial(data) {
             'badgeName': badgeName(data),
             'status': checkPermission(data) ? 'authorized' : 'rejected',
             'timestamp': new Date(),
-            'door': config.serial.DOOR
+            'door': config.serial.DOOR,
+            'camera': config.serial.CAMERA
         });
     }
 }

config.js

@@ -1,13 +1,14 @@
 var serialport = require('serialport');
 
+exports.username = 'username'
+exports.password = 'password'
 
 // TODO: put this information in doors object and allow multiple doors/readers
 exports.serial = {
-  username: 'username',
-  password: 'password',
   //PORT: '/dev/tty.usbserial-AD026AOP',
   PORT: '',
   DOOR: 'Front Door',
+  CAMERA: '100bc4a3',
   serial_open: false,
   serial_opts: { 'baudrate':   9600,
                   'parser':     serialport.parsers.readline('\n') }

package.json

@@ -10,7 +10,8 @@
     "ejs": "*",
     "serialport": "~1.3.1",
     "socket.io": "~0.9.16",
-    "nodemon": "~1.0.15"
+    "nodemon": "~1.0.15",
+    "request": "~2.34.0"
   },
   "description": "example integration between EEN api and RFID on the raspberry pi",
   "main": "app.js",

public/js/app.js

@@ -1,4 +1,4 @@
-var socket = io.connect('http://192.168.11.55:3000');
+var socket = io.connect('http://localhost:3000');
 
 socket.on('current_state', function (data) {
    console.log(data);
@@ -23,7 +23,7 @@ socket.on('disconnect', function(data) {
 });
 
 socket.on('event', function(data) {
-    var item = document.createElement('li');
-    item.textContent = [ data.door, data.status, data.badgeName].join(' ');
-    document.getElementById('scan_history').appendChild(item);
+    var template_src = $('#message_template');
+    var html_output = _.template(template_src.html(), { 'data': data })
+    $('#scan_history').append(html_output)
 });

views/index.ejs

@@ -10,7 +10,23 @@
     <p>Badge Scan History:
         <ul id="scan_history"></ul>
     </p>
+
+    <!-- templates -->
+    <script type="text/template" id="message_template">
+      <div>
+        <span>
+          <img src='/img/prev/<%= data.camera %>' style='height:100px; widht:100px;'>
+        </span>
+        <span>
+          <%= [ data.door, data.status, data.badgeName].join(' ') %>
+        </span>
+      </div>
+    </script>
+
+    <!-- includes -->
+    <script src="/js/jquery-2.1.0.min.js"></script>
+    <script src="/js/underscore-1.6.0.min.js"></script>
+    <script src="/socket.io/socket.io.js"></script>
+    <script src="/js/app.js"></script>
   </body>
-<script src="/socket.io/socket.io.js"></script>
-<script src="/js/app.js"></script>
 </html>