shiogen/SampleHtmlConsole.html

## SampleHtmlConsole.html
<html>
  <head>
    <title>jumpwire.io Sample HTML Console</title>
    <!-- Include bootstrap CSS -->
    <link rel="stylesheet"
    href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
  </head>
  <body>
    <div class="container" role="main">
      <p>
        <a href="https://console.jumpwire.io/" target="_blank">
          jumpwire.io console
        </a>
      </p>
      <h3>Toggle LED</h3>
      <button id="LEDON" class="btn btn-danger btn-lg" style="display:none">
        Turn OFF
      </button>
      <button id="LEDOFF" class="btn btn-default btn-lg" style="display:none">
        Turn ON
      </button>
    </div>

    <!-- Include libraries -->
    <script src="https://cdn.socket.io/socket.io-1.3.5.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <!-- Script for jumpwire.io -->
    <script>
      //Connect to jumpwire.io server
      var socket = io('https://socket.jumpwire.io');

      //Catch jumpwire.io message
      socket.on('f', function(msg){
        if(msg[0]=='A'){        //if Key is A
          if(msg[1]==0){        // and Value is 0
            $('#LEDON').hide();
            $('#LEDOFF').show();
          }else if(msg[1]==1){    // and Value is 1
            $('#LEDOFF').hide();
            $('#LEDON').show();
          }
        }
      });

      //On "Turn OFF" button click
      $('#LEDON').click(function(){
        //Throw 0 to Key A
        socket.emit('f', ['A', 0] );  //always use 'f'. ['key(A-Z)',value(float)]
      });

      //On "Turn ON" button click
      $('#LEDOFF').click(function(){
        //Throw 1 to Key A
        socket.emit('f', ['A', 1] );  //always use 'f'. ['key(A-Z)',value(float)]
      });
    </script>
  </body>
</html>
	<html>
	<head>
	<title>jumpwire.io Sample HTML Console</title>
	<!-- Include bootstrap CSS -->
	<link rel="stylesheet"
	href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
	</head>
	<body>
	<div class="container" role="main">
	<p>
	<a href="https://console.jumpwire.io/" target="_blank">
	jumpwire.io console
	</a>
	</p>
	<h3>Toggle LED</h3>
	<button id="LEDON" class="btn btn-danger btn-lg" style="display:none">
	Turn OFF
	</button>
	<button id="LEDOFF" class="btn btn-default btn-lg" style="display:none">
	Turn ON
	</button>
	</div>

	<!-- Include libraries -->
	<script src="https://cdn.socket.io/socket.io-1.3.5.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

	<!-- Script for jumpwire.io -->
	<script>
	//Connect to jumpwire.io server
	var socket = io('https://socket.jumpwire.io');

	//Catch jumpwire.io message
	socket.on('f', function(msg){
	if(msg[0]=='A'){ //if Key is A
	if(msg[1]==0){ // and Value is 0
	$('#LEDON').hide();
	$('#LEDOFF').show();
	}else if(msg[1]==1){ // and Value is 1
	$('#LEDOFF').hide();
	$('#LEDON').show();
	}
	}
	});

	//On "Turn OFF" button click
	$('#LEDON').click(function(){
	//Throw 0 to Key A
	socket.emit('f', ['A', 0] ); //always use 'f'. ['key(A-Z)',value(float)]
	});

	//On "Turn ON" button click
	$('#LEDOFF').click(function(){
	//Throw 1 to Key A
	socket.emit('f', ['A', 1] ); //always use 'f'. ['key(A-Z)',value(float)]
	});
	</script>
	</body>
	</html>