From 068abffbe63d659eff43e394d3ac23964a8fb77b Mon Sep 17 00:00:00 2001
From: Amanda Ghassaei <amandaghassaei@gmail.com>
Date: Thu, 10 Sep 2015 15:52:22 -0400
Subject: [PATCH] control panel

---
 css/serialMonitor.css                   | 24 ++++++++++++++++++++++++
 js/SerialMonitor/SerialMonitorView.html |  6 +++++-
 js/SerialMonitor/SerialMonitorView.js   |  6 ++++++
 3 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/css/serialMonitor.css b/css/serialMonitor.css
index 4589d322..1bc878d6 100644
--- a/css/serialMonitor.css
+++ b/css/serialMonitor.css
@@ -18,4 +18,28 @@
 
   #serialMonitorView {
       overflow: hidden;
+  }
+
+
+  .btn {
+      padding: 5px 10px;
+      margin: 5px 10px;
+  }
+
+  #controlPanel {
+    background: #eee;
+    width: 100%;
+    position: absolute;
+    bottom: 40px;
+  }
+
+  .checkbox input[type="checkbox"].custom-checkbox:checked + .icons .icon-checked, .radio input[type="checkbox"].custom-checkbox:checked + .icons .icon-checked, .checkbox input[type="radio"].custom-radio:checked + .icons .icon-checked, .radio input[type="radio"].custom-radio:checked + .icons .icon-checked {
+    color: #888;
+  }
+
+  #autoscrollCheckbox {
+    display: inline-block;
+    position: absolute;
+    margin-left: 10px;
+    margin-top: 12px;
   }
\ No newline at end of file
diff --git a/js/SerialMonitor/SerialMonitorView.html b/js/SerialMonitor/SerialMonitorView.html
index f1e4af19..a3985bfd 100644
--- a/js/SerialMonitor/SerialMonitorView.html
+++ b/js/SerialMonitor/SerialMonitorView.html
@@ -1,5 +1,9 @@
 <div id="serialMonitorOutput"></div>
 <div id="controlPanel">
-
+    <label id="autoscrollCheckbox" class="checkbox" for="autoscroll">
+        <input id="autoscroll" data-property="autoscroll" type="checkbox" <% if (autoscroll){ %> checked="checked"<% } %> value="" data-toggle="checkbox" class="serialMonitor custom-checkbox">
+        <span class="icons"><span class="icon-unchecked"></span><span class="icon-checked"></span></span>
+    Autoscroll</label>
+    <a href="#" id="clearMonitor" class="pull-right btn btn-lg btn-default">Clear</a><br/>
 </div>
 <input id="sendSerialMessage" value="" placeholder="Send Message" class="form-control" type="text">
\ No newline at end of file
diff --git a/js/SerialMonitor/SerialMonitorView.js b/js/SerialMonitor/SerialMonitorView.js
index 31593129..8defaaa7 100644
--- a/js/SerialMonitor/SerialMonitorView.js
+++ b/js/SerialMonitor/SerialMonitorView.js
@@ -11,6 +11,7 @@ define(['jquery', 'underscore', 'commParentMenu', 'serialComm', 'text!SerialMoni
         el: "#serialMonitorView",
 
         events: {
+            "click #clearMonitor":                   "_clear"
         },
 
         __initialize: function(){
@@ -21,6 +22,11 @@ define(['jquery', 'underscore', 'commParentMenu', 'serialComm', 'text!SerialMoni
             return this.model.toJSON();
         },
 
+        _clear: function(e){
+            e.preventDefault();
+            $("#serialMonitorOutput").html("");
+        },
+
         _updateIncomingMessage: function(){
             $("#serialMonitorOutput").append(serialComm.get("lastMessageReceived") + "<br/>");
         },
-- 
GitLab