Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- *My buttons didn't change to off or on whenever I was clicking them, this is why I added the "document.getElementById("LED4").innerHTML = "LED 4 is OFF (D9)";" or "document.getElementById("LED4").innerHTML = "LED 4 is ON (D9)"; "
- You are going to save me from a lot of trouble if you find the mistake :P Thank you very much*
- <!DOCTYPE html>
- <html>
- <head>
- <title>H4X</title>
- <script>
- strLED1 = "";
- strLED2 = "";
- strLED3 = "";
- strLED4 = "";
- strLED5 = "";
- strLED6 = "";
- strLED7 = "";
- strLED8 = "";
- strLED9 = "";
- strLED10 = "";
- strLED11 = "";
- strLED12 = "";
- strLED13 = "";
- strLED14 = "";
- strLED15 = "";
- strLED16 = "";
- strLED17 = "";
- strLED18 = "";
- strLED19 = "";
- strLED20 = "";
- var LED3_state = 0;
- var LED4_state = 0;
- var LED5_state = 0;
- var LED6_state = 0;
- var LED7_state = 0;
- var LED8_state = 0;
- var LED9_state = 0;
- var LED10_state = 0;
- var LED11_state = 0;
- var LED12_state = 0;
- var LED13_state = 0;
- var LED14_state = 0;
- var LED15_state = 0;
- var LED16_state = 0;
- var LED17_state = 0;
- var LED18_state = 0;
- var LED19_state = 0;
- var LED20_state = 0;
- function GetArduinoIO()
- {
- nocache = "&nocache=" + Math.random() * 1000000;
- var request = new XMLHttpRequest();
- request.onreadystatechange = function()
- {
- if (this.readyState == 4) {
- if (this.status == 200) {
- if (this.responseXML != null) {
- // XML file received - contains analog values, switch values and LED states
- var count;
- // get analog inputs
- var num_an = this.responseXML.getElementsByTagName('analog').length;
- for (count = 0; count < num_an; count++) {
- document.getElementsByClassName("analog")[count].innerHTML =
- this.responseXML.getElementsByTagName('analog')[count].childNodes[0].nodeValue;
- }
- // get switch inputs
- var num_an = this.responseXML.getElementsByTagName('switch').length;
- for (count = 0; count < num_an; count++) {
- document.getElementsByClassName("switches")[count].innerHTML =
- this.responseXML.getElementsByTagName('switch')[count].childNodes[0].nodeValue;
- }
- // LED 1
- if (this.responseXML.getElementsByTagName('LED')[0].childNodes[0].nodeValue === "checked") {
- document.LED_form.LED1.checked = true;
- }
- else {
- document.LED_form.LED1.checked = false;
- }
- // LED 2
- if (this.responseXML.getElementsByTagName('LED')[1].childNodes[0].nodeValue === "checked") {
- document.LED_form.LED2.checked = true;
- }
- else {
- document.LED_form.LED2.checked = false;
- }
- // LED 3
- if (this.responseXML.getElementsByTagName('LED')[2].childNodes[0].nodeValue === "on") {
- document.getElementById("LED3").innerHTML = "LED 3 is ON (D8)";
- LED3_state = 1;
- }
- else {
- document.getElementById("LED3").innerHTML = "LED 3 is OFF (D8)";
- LED3_state = 0;
- }
- // LED 4
- if (this.responseXML.getElementsByTagName('LED')[3].childNodes[0].nodeValue === "on") {
- document.getElementById("LED4").innerHTML = "LED 4 is ON (D9)";
- LED4_state = 1;
- }
- else {
- document.getElementById("LED4").innerHTML = "LED 4 is OFF (D9)";
- LED4_state = 0;
- }
- // LED 5
- if (this.responseXML.getElementsByTagName('LED')[4].childNodes[0].nodeValue === "on") {
- document.getElementById("LED5").innerHTML = "LED 5 is ON (D22)";
- LED5_state = 1;
- }
- else {
- document.getElementById("LED5").innerHTML = "LED 4 is OFF (D22)";
- LED5_state = 0;
- }
- // LED 6
- if (this.responseXML.getElementsByTagName('LED')[5].childNodes[0].nodeValue === "on") {
- document.getElementById("LED6").innerHTML = "LED 6 is ON (D23)";
- LED6_state = 1;
- }
- else {
- document.getElementById("LED6").innerHTML = "LED 6 is OFF (D23)";
- LED6_state = 0;
- }
- // LED 7
- if (this.responseXML.getElementsByTagName('LED')[6].childNodes[0].nodeValue === "on") {
- document.getElementById("LED7").innerHTML = "LED 7 is ON (D24)";
- LED7_state = 1;
- }
- else {
- document.getElementById("LED7").innerHTML = "LED 7 is OFF (D24)";
- LED7_state = 0;
- }
- // LED 8
- if (this.responseXML.getElementsByTagName('LED')[7].childNodes[0].nodeValue === "on") {
- document.getElementById("LED8").innerHTML = "LED 8 is ON (D25)";
- LED8_state = 1;
- }
- else {
- document.getElementById("LED8").innerHTML = "LED 8 is OFF (D25)";
- LED8_state = 0;
- }
- // LED 9
- if (this.responseXML.getElementsByTagName('LED')[8].childNodes[0].nodeValue === "on") {
- document.getElementById("LED9").innerHTML = "LED 9 is ON (D26)";
- LED9_state = 1;
- }
- else {
- document.getElementById("LED9").innerHTML = "LED 9 is OFF (D26)";
- LED9_state = 0;
- }
- // LED 10
- if (this.responseXML.getElementsByTagName('LED')[9].childNodes[0].nodeValue === "on") {
- document.getElementById("LED10").innerHTML = "LED 10 is ON (D27)";
- LED10_state = 1;
- }
- else {
- document.getElementById("LED10").innerHTML = "LED 10 is OFF (D27)";
- LED10_state = 0;
- }
- // LED 11
- if (this.responseXML.getElementsByTagName('LED')[10].childNodes[0].nodeValue === "on") {
- document.getElementById("LED11").innerHTML = "LED 11 is ON (D28)";
- LED11_state = 1;
- }
- else {
- document.getElementById("LED11").innerHTML = "LED 11 is OFF (D28)";
- LED11_state = 0;
- }
- // LED 12
- if (this.responseXML.getElementsByTagName('LED')[11].childNodes[0].nodeValue === "on") {
- document.getElementById("LED12").innerHTML = "LED 12 is ON (D29)";
- LED12_state = 1;
- }
- else {
- document.getElementById("LED12").innerHTML = "LED 12 is OFF (D29)";
- LED12_state = 0;
- }
- // LED 13
- if (this.responseXML.getElementsByTagName('LED')[12].childNodes[0].nodeValue === "on") {
- document.getElementById("LED13").innerHTML = "LED 13 is ON (D30)";
- LED13_state = 1;
- }
- else {
- document.getElementById("LED13").innerHTML = "LED 13 is OFF (D30)";
- LED13_state = 0;
- }
- // LED 14
- if (this.responseXML.getElementsByTagName('LED')[13].childNodes[0].nodeValue === "on") {
- document.getElementById("LED14").innerHTML = "LED 14 is ON (D31)";
- LED14_state = 1;
- }
- else {
- document.getElementById("LED14").innerHTML = "LED 14 is OFF (D31)";
- LED14_state = 0;
- }
- // LED 15
- if (this.responseXML.getElementsByTagName('LED')[14].childNodes[0].nodeValue === "on") {
- document.getElementById("LED15").innerHTML = "LED 15 is ON (D32)";
- LED15_state = 1;
- }
- else {
- document.getElementById("LED15").innerHTML = "LED 15 is OFF (D32)";
- LED15_state = 0;
- }
- // LED 16
- if (this.responseXML.getElementsByTagName('LED')[15].childNodes[0].nodeValue === "on") {
- document.getElementById("LED16").innerHTML = "LED 16 is ON (D33)";
- LED16_state = 1;
- }
- else {
- document.getElementById("LED16").innerHTML = "LED 16 is OFF (D33)";
- LED16_state = 0;
- }
- // LED 17
- if (this.responseXML.getElementsByTagName('LED')[16].childNodes[0].nodeValue === "on") {
- document.getElementById("LED17").innerHTML = "LED 17 is ON (D34)";
- LED17_state = 1;
- }
- else {
- document.getElementById("LED17").innerHTML = "LED 17 is OFF (D34)";
- LED17_state = 0;
- }
- // LED 18
- if (this.responseXML.getElementsByTagName('LED')[17].childNodes[0].nodeValue === "on") {
- document.getElementById("LED18").innerHTML = "LED 18 is ON (D35)";
- LED18_state = 1;
- }
- else {
- document.getElementById("LED18").innerHTML = "LED 18 is OFF (D35)";
- LED18_state = 0;
- }
- // LED 19
- if (this.responseXML.getElementsByTagName('LED')[18].childNodes[0].nodeValue === "on") {
- document.getElementById("LED19").innerHTML = "LED 19 is ON (D36)";
- LED19_state = 1;
- }
- else {
- document.getElementById("LED19").innerHTML = "LED 19 is OFF (D36)";
- LED19_state = 0;
- }
- // LED 20
- if (this.responseXML.getElementsByTagName('LED')[19].childNodes[0].nodeValue === "on") {
- document.getElementById("LED20").innerHTML = "LED 20 is ON (D37)";
- LED20_state = 1;
- }
- else {
- document.getElementById("LED20").innerHTML = "LED 20 is OFF (D37)";
- LED20_state = 0;
- } }
- }
- }
- }
- // send HTTP GET request with LEDs to switch on/off if any
- request.open("GET", "ajax_inputs" + strLED1 + strLED2 + strLED3 + strLED4 + strLED5 + strLED6 + strLED7 + strLED8 + strLED9 + strLED10 + strLED11 + strLED12 + strLED13 + strLED14 + strLED15 + strLED16 + strLED17 + strLED18 + strLED19 + strLED20 + nocache, true);
- request.send(null);
- setTimeout('GetArduinoIO()', 1000);
- strLED1 = "";
- strLED2 = "";
- strLED3 = "";
- strLED4 = "";
- strLED5 = "";
- strLED6 = "";
- strLED7 = "";
- strLED8 = "";
- strLED9 = "";
- strLED10 = "";
- strLED11 = "";
- strLED12 = "";
- strLED13 = "";
- strLED14 = "";
- strLED15 = "";
- strLED16 = "";
- strLED17 = "";
- strLED18 = "";
- strLED19 = "";
- strLED20 = "";
- }
- // service LEDs when checkbox checked/unchecked
- function GetCheck()
- {
- if (LED_form.LED1.checked) {
- strLED1 = "&LED1=1";
- }
- else {
- strLED1 = "&LED1=0";
- }
- if (LED_form.LED2.checked) {
- strLED2 = "&LED2=1";
- }
- else {
- strLED2 = "&LED2=0";
- }
- }
- function GetButton1()
- {
- if (LED3_state === 1) {
- LED3_state = 0;
- document.getElementById("LED3").innerHTML = "LED 3 is OFF (D8)";
- strLED3 = "&LED3=0";
- }
- else {
- LED3_state = 1;
- document.getElementById("LED3").innerHTML = "LED 3 is ON (D8)";
- strLED3 = "&LED3=1";
- }
- }
- function GetButton2()
- {
- if (LED4_state === 1) {
- LED4_state = 0;
- document.getElementById("LED4").innerHTML = "LED 4 is OFF (D9)";
- strLED4 = "&LED4=0";
- }
- else {
- LED4_state = 1;
- document.getElementById("LED4").innerHTML = "LED 4 is ON (D9)";
- strLED4 = "&LED4=1";
- }
- }
- function GetButton3()
- {
- if (LED5_state === 1) {
- LED5_state = 0;
- document.getElementById("LED5").innerHTML = "LED 5 is OFF (D22)";
- strLED5 = "&LED5=0";
- }
- else {
- LED5_state = 1;
- document.getElementById("LED5").innerHTML = "LED 5 is ON (D22)";
- strLED5 = "&LED5=1";
- }
- }
- function GetButton4()
- {
- if (LED6_state === 1) {
- LED6_state = 0;
- document.getElementById("LED6").innerHTML = "LED 6 is OFF (D23)";
- strLED6 = "&LED6=0";
- }
- else {
- LED6_state = 1;
- document.getElementById("LED6").innerHTML = "LED 6 is ON (D23)";
- strLED6 = "&LED6=1";
- }
- }
- function GetButton5()
- {
- if (LED7_state === 1) {
- LED7_state = 0;
- document.getElementById("LED7").innerHTML = "LED 7 is OFF (D24)";
- strLED7 = "&LED7=0";
- }
- else {
- LED7_state = 1;
- document.getElementById("LED7").innerHTML = "LED 7 is ON (D24)";
- strLED7 = "&LED7=1";
- }
- }
- function GetButton6()
- {
- if (LED8_state === 1) {
- LED8_state = 0;
- document.getElementById("LED8").innerHTML = "LED 8 is OFF (D25)";
- strLED8 = "&LED8=0";
- }
- else {
- LED8_state = 1;
- document.getElementById("LED8").innerHTML = "LED 8 is ON (D25)";
- strLED8 = "&LED8=1";
- }
- }
- function GetButton7()
- {
- if (LED9_state === 1) {
- LED9_state = 0;
- document.getElementById("LED9").innerHTML = "LED 9 is OFF (D26)";
- strLED9 = "&LED9=0";
- }
- else {
- LED9_state = 1;
- document.getElementById("LED9").innerHTML = "LED 9 is ON (D26)";
- strLED9 = "&LED9=1";
- }
- }
- function GetButton8()
- {
- if (LED10_state === 1) {
- LED10_state = 0;
- document.getElementById("LED10").innerHTML = "LED 10 is OFF (D27)";
- strLED10 = "&LED10=0";
- }
- else {
- LED10_state = 1;
- document.getElementById("LED10").innerHTML = "LED 10 is ON (D27)";
- strLED10 = "&LED10=1";
- }
- }
- function GetButton9()
- {
- if (LED11_state === 1) {
- LED11_state = 0;
- document.getElementById("LED11").innerHTML = "LED 11 is OFF (D28)";
- strLED11 = "&LED11=0";
- }
- else {
- LED11_state = 1;
- document.getElementById("LED11").innerHTML = "LED 11 is ON (D28)";
- strLED11 = "&LED11=1";
- }
- }
- function GetButton10()
- {
- if (LED12_state === 1) {
- LED12_state = 0;
- document.getElementById("LED12").innerHTML = "LED 12 is OFF (D29)";
- strLED12 = "&LED12=0";
- }
- else {
- LED12_state = 1;
- document.getElementById("LED12").innerHTML = "LED 12 is ON (D29)";
- strLED12 = "&LED12=1";
- }
- }
- function GetButton11()
- {
- if (LED13_state === 1) {
- LED13_state = 0;
- document.getElementById("LED13").innerHTML = "LED 13 is OFF (D30)";
- strLED13 = "&LED13=0";
- }
- else {
- LED13_state = 1;
- document.getElementById("LED13").innerHTML = "LED 13 is ON (D30)";
- strLED13 = "&LED13=1";
- }
- }
- function GetButton12()
- {
- if (LED14_state === 1) {
- LED14_state = 0;
- document.getElementById("LED14").innerHTML = "LED 14 is OFF (D31)";
- strLED14 = "&LED14=0";
- }
- else {
- LED14_state = 1;
- document.getElementById("LED14").innerHTML = "LED 14 is ON (D31)";
- strLED14 = "&LED14=1";
- }
- }
- function GetButton13()
- {
- if (LED15_state === 1) {
- LED15_state = 0;
- document.getElementById("LED15").innerHTML = "LED 15 is OFF (D32)";
- strLED15 = "&LED15=0";
- }
- else {
- LED15_state = 1;
- document.getElementById("LED15").innerHTML = "LED 15 is ON (D32)";
- strLED15 = "&LED15=1";
- }
- }
- function GetButton14()
- {
- if (LED16_state === 1) {
- LED16_state = 0;
- document.getElementById("LED16").innerHTML = "LED 16 is OFF (D33)";
- strLED16 = "&LED16=0";
- }
- else {
- LED16_state = 1;
- document.getElementById("LED16").innerHTML = "LED 16 is ON (D33)";
- strLED16 = "&LED16=1";
- }
- }
- function GetButton15()
- {
- if (LED17_state === 1) {
- LED17_state = 0;
- document.getElementById("LED17").innerHTML = "LED 17 is OFF (D34)";
- strLED17 = "&LED17=0";
- }
- else {
- LED17_state = 1;
- document.getElementById("LED17").innerHTML = "LED 17 is ON (D34)";
- strLED17 = "&LED17=1";
- }
- }
- function GetButton16()
- {
- if (LED18_state === 1) {
- LED18_state = 0;
- document.getElementById("LED18").innerHTML = "LED 18 is OFF (D35)";
- strLED18 = "&LED18=0";
- }
- else {
- LED18_state = 1;
- document.getElementById("LED18").innerHTML = "LED 18 is ON (D35)";
- strLED18 = "&LED18=1";
- }
- }
- function GetButton17()
- {
- if (LED19_state === 1) {
- LED19_state = 0;
- document.getElementById("LED19").innerHTML = "LED 19 is OFF (D36)";
- strLED19 = "&LED19=0";
- }
- else {
- LED19_state = 1;
- document.getElementById("LED19").innerHTML = "LED 19 is ON (D36)";
- strLED19 = "&LED19=1";
- }
- }
- function GetButton18()
- {
- if (LED20_state === 1) {
- LED20_state = 0;
- document.getElementById("LED20").innerHTML = "LED 20 is OFF (D37)";
- strLED20 = "&LED20=0";
- }
- else {
- LED20_state = 1;
- document.getElementById("LED20").innerHTML = "LED 20 is ON (D37)";
- strLED20 = "&LED20=1";
- }
- }
- </script>
- <style>
- .IO_box {
- float: left;
- margin: 0 20px 20px 0;
- border: 1px solid blue;
- padding: 0 5px 0 5px;
- width: 120px;
- }
- h1 {
- font-size: 120%;
- color: blue;
- margin: 0 0 10px 0;
- }
- h2 {
- font-size: 85%;
- color: #5734E6;
- margin: 5px 0 5px 0;
- }
- p, form, button {
- font-size: 80%;
- color: #252525;
- }
- .small_text {
- font-size: 70%;
- color: #737373;
- }
- </style>
- </head>
- <body onload="GetArduinoIO()">
- <h1>Arduino Ajax I/O</h1>
- <div class="IO_box">
- <h2>Analog Inputs</h2>
- <p class="small_text">A0 used by Ethernet shield</p>
- <p class="small_text">A1 used by Ethernet shield</p>
- <p>A2: <span class="analog">...</span></p>
- <p>A3: <span class="analog">...</span></p>
- <p>A4: <span class="analog">...</span></p>
- <p>A5: <span class="analog">...</span></p>
- </div>
- <div class="IO_box">
- <h2>Switch Inputs</h2>
- <p class="small_text">D0: used by serial RX</p>
- <p class="small_text">D1: used by serial TX</p>
- <p>Switch 1 (D2): <span class="switches">...</span></p>
- <p>Switch 2 (D3): <span class="switches">...</span></p>
- <p class="small_text">D4: used by Ethernet shield</p>
- <p>Switch 3 (D5): <span class="switches">...</span></p>
- </div>
- <div class="IO_box">
- <h2>LEDs Using Checkboxes</h2>
- <form id="check_LEDs" name="LED_form">
- <input type="checkbox" name="LED1" value="0" onclick="GetCheck()" />LED 1 (D6)<br /><br />
- <input type="checkbox" name="LED2" value="0" onclick="GetCheck()" />LED 2 (D7)<br /><br />
- </form>
- </div>
- <div class="IO_box">
- <h2>LEDs Using Buttons</h2>
- <button type="button" id="LED3" onclick="GetButton1()">LED 3 is OFF (D8)</button><br /><br />
- <button type="button" id="LED4" onclick="GetButton2()">LED 4 is OFF (D9)</button><br /><br />
- <button type="button" id="LED5" onclick="GetButton3()">LED 5 is OFF (D22)</button><br /><br />
- <button type="button" id="LED6" onclick="GetButton4()">LED 6 is OFF (D23)</button><br /><br />
- <button type="button" id="LED7" onclick="GetButton5()">LED 7 is OFF (D24)</button><br /><br />
- <button type="button" id="LED8" onclick="GetButton6()">LED 8 is OFF (D25)</button><br /><br />
- <button type="button" id="LED9" onclick="GetButton7()">LED 9 is OFF (D26)</button><br /><br />
- <button type="button" id="LED10" onclick="GetButton8()">LED 10 is OFF (D27)</button><br /><br />
- <button type="button" id="LED11" onclick="GetButton9()">LED 11 is OFF (D28)</button><br /><br />
- <button type="button" id="LED12" onclick="GetButton10()">LED 12 is OFF (D29)</button><br /><br />
- <button type="button" id="LED13" onclick="GetButton11()">LED 13 is OFF (D30)</button><br /><br />
- <button type="button" id="LED14" onclick="GetButton12()">LED 14 is OFF (D31)</button><br /><br />
- <button type="button" id="LED15" onclick="GetButton13()">LED 15 is OFF (D32)</button><br /><br />
- <button type="button" id="LED16" onclick="GetButton14()">LED 16 is OFF (D33)</button><br /><br />
- <button type="button" id="LED17" onclick="GetButton15()">LED 17 is OFF (D34)</button><br /><br />
- <button type="button" id="LED18" onclick="GetButton16()">LED 18 is OFF (D35)</button><br /><br />
- <button type="button" id="LED19" onclick="GetButton17()">LED 19 is OFF (D36)</button><br /><br />
- <button type="button" id="LED20" onclick="GetButton18()">LED 20 is OFF (D37)</button><br /><br />
- <p class="small_text">D10 to D13 used by Ethernet shield</p>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement