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.
131 lines
3.8 KiB
131 lines
3.8 KiB
<!-- |
|
FSWebServer - Example Index Page |
|
Copyright (c) 2015 Hristo Gochkov. All rights reserved. |
|
This file is part of the ESP8266WebServer library for Arduino environment. |
|
|
|
This library is free software; you can redistribute it and/or |
|
modify it under the terms of the GNU Lesser General Public |
|
License as published by the Free Software Foundation; either |
|
version 2.1 of the License, or (at your option) any later version. |
|
This library is distributed in the hope that it will be useful, |
|
but WITHOUT ANY WARRANTY; without even the implied warranty of |
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU |
|
Lesser General Public License for more details. |
|
You should have received a copy of the GNU Lesser General Public |
|
License along with this library; if not, write to the Free Software |
|
Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA |
|
--> |
|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> |
|
<title>WebSocketTester</title> |
|
<style type="text/css" media="screen"> |
|
body { |
|
margin:0; |
|
padding:0; |
|
background-color: black; |
|
} |
|
|
|
#dbg, #input_div, #input_el { |
|
font-family: monaco; |
|
font-size: 12px; |
|
line-height: 13px; |
|
color: #AAA; |
|
} |
|
|
|
#dbg, #input_div { |
|
margin:0; |
|
padding:0; |
|
padding-left:4px; |
|
} |
|
|
|
#input_el { |
|
width:98%; |
|
background-color: rgba(0,0,0,0); |
|
border: 0px; |
|
} |
|
#input_el:focus { |
|
outline: none; |
|
} |
|
</style> |
|
<script type="text/javascript"> |
|
var ws = null; |
|
function ge(s){ return document.getElementById(s);} |
|
function ce(s){ return document.createElement(s);} |
|
function stb(){ window.scrollTo(0, document.body.scrollHeight || document.documentElement.scrollHeight); } |
|
function sendBlob(str){ |
|
var buf = new Uint8Array(str.length); |
|
for (var i = 0; i < str.length; ++i) buf[i] = str.charCodeAt(i); |
|
ws.send(buf); |
|
} |
|
function addMessage(m){ |
|
var msg = ce("div"); |
|
msg.innerText = m; |
|
ge("dbg").appendChild(msg); |
|
stb(); |
|
} |
|
function startSocket(){ |
|
ws = new WebSocket('ws://'+document.location.host+'/ws',['arduino']); |
|
ws.binaryType = "arraybuffer"; |
|
ws.onopen = function(e){ |
|
addMessage("Connected"); |
|
}; |
|
ws.onclose = function(e){ |
|
addMessage("Disconnected"); |
|
}; |
|
ws.onerror = function(e){ |
|
console.log("ws error", e); |
|
addMessage("Error"); |
|
}; |
|
ws.onmessage = function(e){ |
|
var msg = ""; |
|
if(e.data instanceof ArrayBuffer){ |
|
msg = "BIN:"; |
|
var bytes = new Uint8Array(e.data); |
|
for (var i = 0; i < bytes.length; i++) { |
|
msg += String.fromCharCode(bytes[i]); |
|
} |
|
} else { |
|
msg = "TXT:"+e.data; |
|
} |
|
addMessage(msg); |
|
}; |
|
ge("input_el").onkeydown = function(e){ |
|
stb(); |
|
if(e.keyCode == 13 && ge("input_el").value != ""){ |
|
ws.send(ge("input_el").value); |
|
ge("input_el").value = ""; |
|
} |
|
} |
|
} |
|
function startEvents(){ |
|
var es = new EventSource('/events'); |
|
es.onopen = function(e) { |
|
addMessage("Events Opened"); |
|
}; |
|
es.onerror = function(e) { |
|
if (e.target.readyState != EventSource.OPEN) { |
|
addMessage("Events Closed"); |
|
} |
|
}; |
|
es.onmessage = function(e) { |
|
addMessage("Event: " + e.data); |
|
}; |
|
es.addEventListener('ota', function(e) { |
|
addMessage("Event[ota]: " + e.data); |
|
}, false); |
|
} |
|
function onBodyLoad(){ |
|
startSocket(); |
|
startEvents(); |
|
} |
|
</script> |
|
</head> |
|
<body id="body" onload="onBodyLoad()"> |
|
<pre id="dbg"></pre> |
|
<div id="input_div"> |
|
$<input type="text" value="" id="input_el"> |
|
</div> |
|
</body> |
|
</html>
|
|
|