update remote control checkbox

index.html

@@ -7,6 +7,7 @@
     <link rel="stylesheet" href="bootstrap.min.css">
     <link rel="shortcut icon" type="image/png" href="logo.png"/>
     <script src="jquery.min.js"></script>
+    <script src="bootstrap.min.js"></script>
     <script src="blockly_compressed.js"></script>
     <script src="sumorobot_compressed.js"></script>
     <script src="blocks_compressed.js"></script>
@@ -40,11 +41,17 @@
             <a href="#" class="btn btn-lg btn-robot-nr">5</a>
             <a href="#" class="btn btn-lg btn-robot-add">+</a>
         </div>
-        <div>
-            <label class="form-check-label">
-                <input type="checkbox" class="form-check-input big-checkbox" id="remote-control">
-                Remote control
+        <div class="remote-label">
+            <div class="btn-group form-check-label" data-toggle="buttons">
+                <label class="btn btn-primary active" id="remote-disabled">
+                    <input type="radio" name="remote" autocomplete="off" checked> Disabled
                 </label>
+              <label class="btn btn-primary" id="remote-enabled">
+                    <input type="radio" name="remote" autocomplete="off"> Enabled
+              </label>
+            </div>
+            Remote control
+            <!--<input type="checkbox" class="form-check-input big-checkbox" id="remote-control">-->
         </div>
     </div>
 

styles.css

@@ -38,6 +38,11 @@ input.has-error {
 .input-group-addon {
     padding: 0.5vw 1vw !important;
 }
+div.remote-label {
+    font-size: 4vw;
+    margin-top: 1vw;
+    font-weight: bold;
+}
 .btn-group-control {
     z-index: 34;
     bottom: 0px;
@@ -57,6 +62,9 @@ input.has-error {
     border-width: 3px !important;
     background-color: #44CC00 !important;
 }
+.btn-primary {
+    border-width: 3px !important;
+}
 .btn-danger {
     border-width: 3px !important;
     background-color: #b80000 !important;

sumorobot.js

@@ -374,7 +374,10 @@ window.onload = function() {
                 pythonEnabled = !pythonEnabled;
                 break;
             case 82: // r
-                $("#remote-control").click();
+                if (remoteControl)
+                    $("#remote-disabled").click();
+                else
+                    $("#remote-enabled").click();
                 break;
             case 83: // s
                 $(".btn-stop").addClass("hover");
@@ -423,9 +426,14 @@ window.onload = function() {
         workspace.highlightBlock(highlighted, false);
     });
 
-    /* remote control checkbox listener */
-    $("#remote-control").click(function() {
-        remoteControl = $("#remote-control").is(":checked");
+    /* remote control enable listener */
+    $("#remote-enabled").click(function() {
+        remoteControl = true;
+    });
+
+    /* remote control disable listener */
+    $("#remote-disabled").click(function() {
+        remoteControl = false;
     });
 
     /* robot number button listener */