mongoose/examples/CC3200/slfs/index.html

84 lines
9.1 KiB
HTML
Raw Normal View History

l<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>CC3200 Mongoose sensor demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script type="text/javascript" src="main.js"></script>
<style>
* {
outline: none;
box-sizing: border-box;
}
body {
background: #7cf;
color: #555;
margin: 0;
padding: 0;
font: 16px/1.4 Helvetica, Arial, sans-serif;
}
div.content {
width: 800px;
margin: 1em auto;
padding: 2em;
background-color: #fff;
border-radius: 1em;
}
a:link, a:visited {
color: #69c;
text-decoration: none;
}
#graphs {
margin-top: 1em;
}
.graph {
min-height: 12em;
border: 0px solid #ccc;
position: relative;
margin: 0;
padding-right: 5px;
width: 100%;
display: inline-block;
}
.graph_title {
position: absolute;
top: 0.5em; left: 1em;
color: #ccc;
font-weight: bold;
z-index: 999;
}
button { font-size: 100%; }
</style>
</head>
<body>
<div class="content">
<img src="data:image/png;base64,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
" style="float:right; height: 50px; border-radius: 3px;">
<h1>Mongoose on CC3200 LaunchPad</h1>
<p>
This web page demonstrates how Mongoose embedded networking library can be
used to implement real-time data exchange. Here, a TI CC3200 board pushes
JSON-encoded WebSocket frames to the connected browser, which in turn
graphs the data. Also, the browser can send commands to the device wrapped
into a WebSocket frame to turn an LED on/off.
</p>
<button id="on_off_button">Switch LED off</button>
<div id="graphs"></div>
</div>
</body>
</html>