From be961240388d112981cfc1cead4294fc827cba7b Mon Sep 17 00:00:00 2001
From: Amanda Ghassaei <amandaghassaei@gmail.com>
Date: Fri, 11 Sep 2015 15:29:08 -0400
Subject: [PATCH] position panel templating

---
 css/serialMonitor.css                         | 13 ++++++++++--
 .../PositionControlPanelView.html             | 11 +++++-----
 js/SerialMonitor/PositionControlPanelView.js  | 21 +++++++++++++------
 js/SerialMonitor/PositionDataView.html        |  6 ++++++
 4 files changed, 37 insertions(+), 14 deletions(-)
 create mode 100644 js/SerialMonitor/PositionDataView.html

diff --git a/css/serialMonitor.css b/css/serialMonitor.css
index 5fcd784b..e5b0d44e 100644
--- a/css/serialMonitor.css
+++ b/css/serialMonitor.css
@@ -39,7 +39,7 @@ body {
 }
 
 
-.btn {
+#controlPanel .btn {
       padding: 5px 10px;
       margin: 5px 10px;
 }
@@ -81,4 +81,13 @@ span.outgoing {
     background-color: #fdfdfd;
     display: inline-block;
     font-size: 30px;
-}
\ No newline at end of file
+}
+#positionPanel .btn-block {
+    margin-bottom: 15px;
+}
+
+#positionDataError{
+    font-size: 19px;
+    text-align: center;
+    padding-top: 20px;
+}
diff --git a/js/SerialMonitor/PositionControlPanelView.html b/js/SerialMonitor/PositionControlPanelView.html
index 3a26afc0..15f398bb 100644
--- a/js/SerialMonitor/PositionControlPanelView.html
+++ b/js/SerialMonitor/PositionControlPanelView.html
@@ -1,6 +1,5 @@
-X: <%= xAxis %><br/>
-Y: <%= yAxis %><br/>
-Z: <%= zAxis %><br/><br/>
-A: <%= aAxis %><br/>
-B: <%= bAxis %><br/>
-C: <%= cAxis %><br/>
\ No newline at end of file
+<div id="positionData">
+</div><br/>
+<a href="#" id="askForPosition" class="btn btn-block btn-lg btn-default">Refresh</a>
+<a href="#" id="askForPosition" class="btn btn-block btn-lg btn-warning">Pause</a>
+<a href="#" id="stopMachine" class="btn pull-right btn-block btn-lg btn-danger">Stop</a>
\ No newline at end of file
diff --git a/js/SerialMonitor/PositionControlPanelView.js b/js/SerialMonitor/PositionControlPanelView.js
index d2f5742f..511318a5 100644
--- a/js/SerialMonitor/PositionControlPanelView.js
+++ b/js/SerialMonitor/PositionControlPanelView.js
@@ -3,7 +3,8 @@
  */
 
 
-define(['jquery', 'underscore', 'backbone', 'text!PositionControlPanelView.html'], function($, _, Backbone, template){
+define(['jquery', 'underscore', 'backbone', 'text!PositionControlPanelView.html', 'text!PositionDataView.html'],
+    function($, _, Backbone, template, positionTemplate){
 
     return Backbone.View.extend({
 
@@ -18,18 +19,26 @@ define(['jquery', 'underscore', 'backbone', 'text!PositionControlPanelView.html'
             this.render();
         },
 
-        _makeTemplateJSON: function(){
-            console.log(this.model);
+        _renderPositionData: function(){
             var machineState = this.model.getMachineState();
-            if (machineState === null) return {};
-            return machineState.toJSON();
+            console.log(machineState);
+            if (machineState === null) {
+                $("#positionData").html("<div id='positionDataError'>no position data available</div>");
+                return;
+            }
+            $("#positionData").html(_.template(positionTemplate)(machineState.toJSON()));
+        },
+
+        _makeTemplateJSON: function(){
+            return {};
         },
 
         render: function(){
             this.$el.html(this.template(this._makeTemplateJSON()));
+            this._renderPositionData();
         },
 
-        template: _.template(template)
+        template: _.template(template),
 
     });
 
diff --git a/js/SerialMonitor/PositionDataView.html b/js/SerialMonitor/PositionDataView.html
new file mode 100644
index 00000000..3a26afc0
--- /dev/null
+++ b/js/SerialMonitor/PositionDataView.html
@@ -0,0 +1,6 @@
+X: <%= xAxis %><br/>
+Y: <%= yAxis %><br/>
+Z: <%= zAxis %><br/><br/>
+A: <%= aAxis %><br/>
+B: <%= bAxis %><br/>
+C: <%= cAxis %><br/>
\ No newline at end of file
-- 
GitLab