You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
96 lines
2.8 KiB
96 lines
2.8 KiB
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
<link rel="icon" href="../../favicon.ico">
|
|
|
|
<title>Sming Framework with Bootstrap best friends</title>
|
|
|
|
<!-- Bootstrap core CSS -->
|
|
<link href="bootstrap.css" rel="stylesheet">
|
|
<script src="jquery.js"></script>
|
|
|
|
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
|
<!--[if lt IE 9]>
|
|
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
|
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
|
<![endif]-->
|
|
</head>
|
|
|
|
<script>
|
|
$( document ).ready(function() {
|
|
|
|
(function worker() {
|
|
$.getJSON('ajax/input', function(data) {
|
|
$.each( data.gpio, function( key, val ) {
|
|
var target = $('#gpio' + key);
|
|
target.removeClass("label-default");
|
|
if (val)
|
|
target.removeClass("label-danger").addClass("label-success");
|
|
else
|
|
target.removeClass("label-success").addClass("label-danger");
|
|
});
|
|
setTimeout(worker, 400);
|
|
});
|
|
})();
|
|
|
|
$(".switch-freq").click(function() {
|
|
var freq = $(this).attr('data-value');
|
|
$.getJSON('ajax/frequency', {value: freq}, function(data) {
|
|
$("#display-freq").text(data.value);
|
|
});
|
|
});
|
|
|
|
});
|
|
</script>
|
|
<body>
|
|
|
|
<div class="container">
|
|
<div class="header">
|
|
<nav>
|
|
<ul class="nav nav-pills pull-right">
|
|
<li role="presentation" class="active"><a href="#">Home</a></li>
|
|
<li role="presentation"><a href="#">About</a></li>
|
|
<li role="presentation"><a href="#">Contact</a></li>
|
|
</ul>
|
|
</nav>
|
|
<h3 class="text-muted">Sming Framework</h3>
|
|
</div>
|
|
|
|
<div class="jumbotron">
|
|
<h1>Sming AJAX Example</h1>
|
|
<p class="lead">Sming: Let's do smart things!
|
|
</p>
|
|
</div>
|
|
|
|
<div class="row marketing">
|
|
<div class="col-lg-6">
|
|
<h3>Reading Input value</h3>
|
|
<p><span id="gpio0" class="label label-default">GPIO0</span>
|
|
<p><span id="gpio2" class="label label-default">GPIO2</span>
|
|
</div>
|
|
|
|
<div class="col-lg-6">
|
|
<h3>Send AJAX Command</h3>
|
|
<p>Switch CPU frequency</p>
|
|
<button type="button" class="switch-freq btn btn-info" data-value="80">80 MHz</button>
|
|
<button type="button" class="switch-freq btn btn-primary" data-value="160">160 MHz</button>
|
|
<p>
|
|
<p>Current frequency:</p>
|
|
<div id="display-freq" class="well well-lg">N/A</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<footer class="footer">
|
|
<p>© Company 2014</p>
|
|
</footer>
|
|
|
|
</div> <!-- /container -->
|
|
</body>
|
|
</html>
|
|
|