diff --git a/css/serialMonitor.css b/css/serialMonitor.css index 4589d322f155d6bdd4008e36befe6e95e4c3c135..1bc878d64c09ab04f76f2f2612e2c5195c496c51 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 f1e4af19c34d167e589477e78fcfac16d462d778..a3985bfd8105c75aa8a06243aca2415f27a59475 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 31593129110dab6bf6c8fde6f92fd4b0bde23c10..8defaaa758b5a8a58668ebce759186952ec76613 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/>"); },