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