Browse Source

Moar color for the led switch in the trigger

Rorist 7 years ago
parent
commit
7b7881f106
3 changed files with 41 additions and 4 deletions
  1. 14 0
      main.js
  2. 12 0
      style.css
  3. 15 4
      trigger.html

+ 14 - 0
main.js

@@ -199,6 +199,20 @@ function switchTheLight(red, green, blue) {
     requestObject.send("red=" + red + "&green=" + green + "&blue=" + blue);
 }
 
+function switchTheLightColor(color) {
+    switch(color) {
+        case 'red':
+            switchTheLight(255, 0, 0)
+            break;
+        case 'green':
+            switchTheLight(0, 255, 0)
+            break;
+        case 'blue':
+            switchTheLight(0, 0, 255)
+            break;
+    }
+}
+
 function switchTheLightOn() {
     "set strict";
   switchTheLight(255, 255, 255)

+ 12 - 0
style.css

@@ -102,6 +102,18 @@ div .button, button, input[type=submit] {
     border-radius: 5px;
 }
 
+div .btn_red {
+    background: #ff0000;
+}
+
+div .btn_green {
+    background: #00ff00;
+}
+
+div .btn_blue {
+    background: #0000ff;
+}
+
 
 div .button:active, button:active, input[type=submit]:active {
     background: #006100;

+ 15 - 4
trigger.html

@@ -44,13 +44,24 @@
           "first-minute">2</span> <span class="number" id=
           "second-minute">2</span>
         </div>
-          <input type="button" onclick="switchTheLightOn()" value="Switch the light on" class="button">
-          <input type="button" onclick="switchTheLightOff()" value="Switch the light off" class="button">
-          <input type="button" onclick="switchTheLightToPolice()" value="Police!" class="button">
         </form>
       </div>
-
+      
       <div id="msg-block"></div>
+      </fieldset>
+      <br/>
+      <fieldset>
+        <legend>Lights</legend>
+        <input type="button" onclick="switchTheLightColor('red')" value="ON" class="button btn_red">
+        <input type="button" onclick="switchTheLightColor('green')" value="ON" class="button btn_green">
+        <input type="button" onclick="switchTheLightColor('blue')" value="ON" class="button btn_blue">
+        <br/>
+        <input type="button" onclick="switchTheLightOn()" value="ON" class="button">
+        <input type="button" onclick="switchTheLightOff()" value="OFF" class="button">
+        <input type="button" onclick="switchTheLightToPolice()" value="Police!" class="button">
+        <br/>
+      </fieldset>
+
   </div>
 
   <script type="text/javascript" src="main.js"></script>