Browse Source

Trigger: message when the status is changing, fix breath

Aubort Jean-Baptiste 6 years ago
parent
commit
a174c43eba
3 changed files with 18 additions and 5 deletions
  1. 3 2
      main.js
  2. 9 0
      style.css
  3. 6 3
      trigger.html

+ 3 - 2
main.js

@@ -125,6 +125,7 @@ function openSpace(hoursOpen) {
     }
     var confirm_return = confirm("Are you sure you want to open the hackerspace ?");
     if (confirm_return) {
+        msgBlock.innerHTML = "Opening space...";
         var requestUrl = baseUrl + "?do=custom&hours=" + hoursOpen,
             requestObject = new XMLHttpRequest();
         requestObject.open("GET", requestUrl, true);
@@ -153,6 +154,7 @@ function closeSpace() {
     if (!confirm_value) {
         return;
     }
+    msgBlock.innerHTML = "Closing space...";
     requestObject.open("GET", requestUrl, true);
     requestObject.onreadystatechange = function() {
         if (requestObject.readyState == 4) {
@@ -207,14 +209,13 @@ function switchTheLight(red, green, blue) {
 
 function setTheBreathSpeed() {
     "set strict";
-	console.log("changing the breath speed");
 	var breathValue = slider.value;
     var requestUrl = "http://led.fixme.ch/rgb/";
     var requestObject = new XMLHttpRequest();
     requestObject.open("POST", requestUrl, true);
     requestObject.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
     requestObject.send("breath=" + breathValue);
-	
+    document.getElementById("breathValue").innerText = breathValue;
 }
 
 function switchTheLightColor(color) {

+ 9 - 0
style.css

@@ -171,3 +171,12 @@ div .button[disabled]:active, button[disabled]:active, input[type=submit][disabl
     width:220px;
     height: 50px;
 }
+
+.breathSlider{
+    padding: 0;
+}
+
+#breathBox span {
+    width: 48px;
+    display: inline-block;
+}

+ 6 - 3
trigger.html

@@ -50,9 +50,7 @@
       </fieldset>
       <br/>
       <fieldset>
-		  <legend>Lights</legend>
-		  <input type="range" min=0 max=255 onupdate="setTheBreathSpeed()" id="breathSlider" class="button">
-        <br/>
+        <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">
@@ -61,6 +59,11 @@
         <input type="button" onclick="switchTheLightOff()" value="OFF" class="button">
         <input type="button" onclick="switchTheLightToPolice()" value="Police!" class="button">
         <br/>
+        <div id="breathBox">
+            <label for="breathSlider">Breath:</label>
+            <input type="range" value=0 min=0 max=255 step=5 onchange="setTheBreathSpeed()" id="breathSlider" class="breathSlider">
+            <span id="breathValue">0</span>
+        </div>
       </fieldset>
 
   </div>