2010-10-29 14:15:22 +01:00
<!DOCTYPE html>
< html lang = "en" >
< head >
2013-01-31 19:50:57 +08:00
< meta charset = utf-8 http-equiv = "Content-Language" content = "en" / >
2016-07-13 08:45:22 +08:00
< script src = "/lws-common.js" > < / script >
2010-11-11 13:19:19 +00:00
< title > Minimal Websocket test app< / title >
2013-01-31 19:50:57 +08:00
< style type = "text/css" >
2016-02-20 14:05:55 +08:00
span.title { font-size:18pt; font: Arial; font-weight:normal; text-align:center; color:#000000; }
2013-01-31 19:50:57 +08:00
.browser { font-size:18pt; font: Arial; font-weight:normal; text-align:center; color:#ffff00; vertical-align:middle; text-align:center; background:#d0b070; padding:12px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px;}
2016-02-20 07:52:35 +08:00
.group2 { vertical-align:middle;
text-align:center;
background:#f0f0e0;
padding:12px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px; }
.explain { vertical-align:middle;
text-align:center;
background:#f0f0c0; padding:12px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
color:#404000; }
2016-02-20 14:05:55 +08:00
td.wsstatus { vertical-align:middle; width:200px; height:50px;
text-align:center;
background:#f0f0c0; padding:6px;
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
color:#404000; }
2016-06-08 10:07:02 +08:00
.tdform { vertical-align:middle; width:200px; height:50px;
text-align:center;
background:#f0f0d0; padding:6px;
-webkit-border-radius:8px;
-moz-border-radius:8px; margin:10px;
border-radius:8px;
border: 1px solid black;
border-collapse: collapse;font-size:18pt; font: Arial; font-weight:normal; text-align:center; color:#000000;
color:#404000; }
2016-02-20 14:05:55 +08:00
td.l { vertical-align:middle;
text-align:center;
background:#d0d0b0;
padding:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px; }
2013-01-31 19:50:57 +08:00
.content { vertical-align:top; text-align:center; background:#fffff0; padding:12px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
.canvas { vertical-align:top; text-align:center; background:#efefd0; padding:12px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
2016-02-20 07:52:35 +08:00
.tabs {
position: relative;
min-height: 750px; /* This part sucks */
clear: both;
margin: 25px 0;
}
.tab {
float: left;
}
.tab label {
background: #eee;
padding: 10px;
border: 1px solid #ccc;
margin-left: -1px;
position: relative;
left: 1px;
}
.tab [type=radio] {
display: none;
}
.content {
position: absolute;
top: 28px;
left: 0;
background: white;
right: 0;
bottom: 0;
padding: 20px;
border: 1px solid #ccc;
}
[type=radio]:checked ~ label {
background: white;
border-bottom: 1px solid white;
z-index: 2;
}
[type=radio]:checked ~ label ~ .content {
z-index: 1;
}
2013-01-31 19:50:57 +08:00
< / style >
2010-10-29 14:15:22 +01:00
< / head >
< body >
2013-01-31 19:50:57 +08:00
< header > < / header >
< article >
2010-11-11 13:19:19 +00:00
2013-01-31 19:50:57 +08:00
< table > < tr > < td >
2016-02-20 07:52:35 +08:00
< table width = 600px >
< tr >
< td valign = middle align = center >
< a href = "https://libwebsockets.org" >
2016-04-08 18:30:45 +08:00
< img src = "libwebsockets.org-logo.png" > < / a > < / td > < td >
2016-02-20 07:52:35 +08:00
< section class = "browser" > Detected Browser:
< div id = brow > ...< / div > < / section >
< / td >
< / tr >
2013-01-31 19:50:57 +08:00
2010-11-12 13:10:40 +00:00
< / table >
2016-02-20 07:52:35 +08:00
< / td > < / tr >
< tr > < td colspan = 2 align = center >
2016-04-08 18:30:45 +08:00
Click < a href = "leaf.jpg" target = "_blank" > Here< / a > to
2016-02-20 07:52:35 +08:00
have the test server send a big picture by http.
< / td > < / tr >
< tr > < td colspan = 2 >
< div class = "tabs" >
< div class = "tab" >
< input type = "radio" id = "tab-1" name = "tab-group-1" checked >
< label for = "tab-1" > Dumb Increment Demo< / label >
< div class = "content" >
< div id = "dumb" class = "group2" >
2016-02-20 14:05:55 +08:00
< table >
< tr >
< td id = wsdi_statustd align = center class = "wsstatus" >
< span id = wsdi_status > Websocket connection not initialized< / span > < / td >
< td > < span class = "title" > dumb increment-protocol< / span > < / td >
< / tr >
2016-02-20 07:52:35 +08:00
< tr >
2016-02-20 14:05:55 +08:00
< td class = "explain" colspan = 2 >
2016-02-20 07:52:35 +08:00
The incrementing number is coming from the server at 20Hz and is individual for
2013-01-31 19:50:57 +08:00
each connection to the server... try opening a second browser window.
< br / > < br / >
2016-02-20 07:52:35 +08:00
The button sends a message over the websocket link to ask the server
to zero just this connection's number.
< / td >
< / tr >
2016-02-20 14:05:55 +08:00
< tr >
< td align = center > < div id = number style = "font-size:120%;" > < / div > < / td >
< td align = center >
2016-08-27 17:07:06 +08:00
< input type = button id = offset value = "Reset counter" >
< input type = button id = junk value = "Send junk" >
2016-02-20 14:05:55 +08:00
< / td >
< / tr >
2016-02-20 07:52:35 +08:00
< / table >
< / div >
< / div >
< / div >
< div class = "tab" >
< input type = "radio" id = "tab-2" name = "tab-group-1" >
< label for = "tab-2" > Mirror Demo< / label >
< div class = "content" >
< div id = "mirror" class = "group2" >
< table >
< tr >
2016-02-20 14:05:55 +08:00
< td colspan = 1 id = wslm_statustd align = center class = "wsstatus" >
< span id = wslm_status > Websocket connection not initialized< / span >
< / td >
< td >
< span class = "title" > lws-mirror-protocol< / span >
< / td >
< / tr >
< tr >
< td colspan = 2 >
2016-02-20 07:52:35 +08:00
< div class = "explain" >
2010-11-12 13:10:40 +00:00
Use the mouse to draw on the canvas below -- all other browser windows open
on this page see your drawing in realtime and you can see any of theirs as
well.
2013-01-31 19:50:57 +08:00
< br / > < br / >
2010-11-12 13:10:40 +00:00
The lws-mirror protocol doesn't interpret what is being sent to it, it just
re-sends it to every other websocket it has a connection with using that
protocol, including the guy who sent the packet.
2013-01-31 19:50:57 +08:00
< br / > < br / >
< b > libwebsockets-test-client< / b > joins in by spamming circles on to this shared canvas when
run.
2016-02-20 07:52:35 +08:00
< / div >
< / td >
< / tr >
< tr >
2016-02-20 14:05:55 +08:00
< td colspan = 2 > Drawing color:
2016-08-27 17:07:06 +08:00
< select id = "color" >
2016-02-20 07:52:35 +08:00
< option value = #000000 > Black< / option >
< option value = #0000ff > Blue< / option >
< option value = #20ff20 > Green< / option >
< option value = #802020 > Dark Red< / option >
< / select >
< / tr >
< tr >
2016-02-20 14:05:55 +08:00
< td colspan = 2 width = 500 height = 320 >
2016-02-20 07:52:35 +08:00
< div id = "wslm_drawing" style = "background:white" > < / div >
< / td >
< / tr >
< / table >
< / div >
< / div >
< / div >
< div class = "tab" >
< input type = "radio" id = "tab-3" name = "tab-group-1" >
< label for = "tab-3" > Close Testing< / label >
< div class = "content" >
< div id = "ot" class = "group2" >
< table >
< tr >
2016-02-20 14:05:55 +08:00
< td >
2016-02-20 07:52:35 +08:00
< / td > < / tr >
2016-02-20 14:05:55 +08:00
< tr > < td id = ot_statustd align = center class = "wsstatus" >
< span id = ot_status > Websocket connection not initialized< / span >
< / td >
< td colspan = 2 > < span class = "title" > Open and close testing< / span > < / td >
2015-11-15 09:24:25 +08:00
< / tr >
2016-02-20 14:05:55 +08:00
< tr >
< td class = "explain" colspan = 3 style = "padding:3" >
2015-11-15 09:24:25 +08:00
To help with open and close testing, you can open and close a connection by hand using
2016-02-20 07:52:35 +08:00
the buttons.< br >
"< b > Close< / b > " closes the connection from the browser with code 3000
and reason 'Bye!".< br >
"< b > Request Server Close< / b > " sends a message asking the server to
initiate the close, which it does with code 1001 and reason "Seeya".
2016-02-20 14:05:55 +08:00
< / td > < / tr >
< tr >
2016-08-27 17:07:06 +08:00
< td align = center > < input type = button id = ot_open_btn value = "Open" > < / td >
< td align = center > < input type = button id = ot_close_btn disabled value = "Close" > < / td >
< td align = center > < input type = button id = ot_req_close_btn disabled value = "Request Server Close" > < / td >
2016-02-20 14:05:55 +08:00
< / tr >
< / table >
2015-11-15 09:24:25 +08:00
2016-02-20 14:05:55 +08:00
< / div >
< / div >
< / div >
< div class = "tab" >
< input type = "radio" id = "tab-4" name = "tab-group-1" >
< label for = "tab-4" > Server info< / label >
< div class = "content" >
< div id = "ot" class = "group2" >
< table >
< tr >
< td id = s_statustd align = center class = "wsstatus" >
< div id = s_status > Websocket connection not initialized< / div >
< / td >
< td colspan = 1 >
2017-03-20 19:07:19 +08:00
< span class = "title" > Server Info< / span > < input type = button id = pmd value = "Test pmd" >
2016-02-20 14:05:55 +08:00
< / td >
< / tr > < tr >
< td class = "explain" colspan = 2 >
This information is sent by the server over a ws[s] link and updated live
whenever the information changes server-side.
< / td > < / tr >
< tr >
2016-04-25 10:04:49 +08:00
< td align = center colspan = 2 > < div id = servinfo > < / div > < / td >
2016-02-20 14:05:55 +08:00
< / tr >
< tr >
< td align = center colspan = 2 > < div id = conninfo style = "border : solid 2px #e0d040; padding : 4px; width : 500px; height : 350px; overflow : auto; " > < /< / div > < / td >
< / tr >
< / table >
2016-04-25 10:04:49 +08:00
< / div >
< / div >
< / div >
< div class = "tab" >
< input type = "radio" id = "tab-5" name = "tab-group-1" >
< label for = "tab-5" > POST< / label >
< div class = "content" >
< div id = "ot" class = "group2" >
2016-06-08 10:07:02 +08:00
< table width = 100% >
2016-04-25 10:04:49 +08:00
< tr >
< td colspan = 1 >
< span class = "title" > POST Form testing< / span >
< / td >
< / tr > < tr >
< td class = "explain" colspan = 2 >
This tests POST handling in lws.
< / td > < / tr >
< tr >
2016-06-08 10:07:02 +08:00
< td align = center colspan = 2 class = tdform > < div id = postinfo style = form >
FORM 1: send with urlencoded POST body args< br >
2016-04-25 10:04:49 +08:00
< form action = "formtest" method = "post" >
2016-06-08 10:07:02 +08:00
< span style = "font-size:12pt;" > Some text: < / span >
< input type = "text" name = "text" value = "Give me some text" > < br >
< input type = "submit" name = "send" value = "Send the form" >
< / form >
< / div > < / td >
< / tr >
2016-08-27 17:07:06 +08:00
< script nonce = "lwscaro" >
2016-06-08 10:07:02 +08:00
function check_file()
{
var f = document.getElementById('file').files[0];
var max_len = 100000;
var dis = 0;
if (f) {
if (f.size >= max_len) {
dis = 1;
document.getElementById('file_info').innerHTML =
"< span style = \"color:red;font-weight:bold\" > File larger than "+max_len+"< / span > ";
} else
document.getElementById('file_info').innerHTML =
"File length "+f.size;
} else
dis = 1;
document.getElementById('upload').disabled = dis;
}
< / script >
< tr >
< td align = center colspan = 2 class = tdform > < div id = postinfo style = form >
FORM 2: send with multipart/form-data< br >
(can handle file upload, test limited to 100KB)< br >
< form name = multipart action = "formtest" method = "post" enctype = "multipart/form-data" >
< span style = "font-size:12pt;" > Some text: < / span >
< input type = "text" name = "text" value = "Give me some text" >
< br >
2016-08-27 17:07:06 +08:00
< input type = "file" name = "file" id = "file" size = "20" > < span id = file_info style = "font-size:12pt;" > < / span > < br >
2016-06-08 10:07:02 +08:00
< input type = "submit" id = "upload" name = "upload" disabled = 1 value = "Upload" >
2016-04-25 10:04:49 +08:00
< / form >
< / div > < / td >
< / tr >
2016-06-08 10:07:02 +08:00
2016-04-25 10:04:49 +08:00
< / table >
2016-02-20 07:52:35 +08:00
< / div >
< / div >
< / div >
2013-01-31 19:50:57 +08:00
2016-02-20 07:52:35 +08:00
< / div >
2013-01-31 19:50:57 +08:00
< / td > < / tr > < / table >
2016-02-20 07:52:35 +08:00
Looking for support? < a href = "https://libwebsockets.org" > https://libwebsockets.org< / a > , < a href = "https://github.com/warmcat/libwebsockets" > https://github.com/warmcat/libwebsockets< / a > < / a > < br / >
Join the mailing list: < a href = "https://libwebsockets.org/mailman/listinfo/libwebsockets" > https://libwebsockets.org/mailman/listinfo/libwebsockets< / a >
2013-01-31 19:50:57 +08:00
< / article >
2010-11-11 13:19:19 +00:00
2016-08-27 17:07:06 +08:00
< script nonce = "lwscaro" >
document.getElementById('file').onchange = check_file;
document.getElementById('offset').onclick = reset;
document.getElementById('junk').onclick = junk;
document.getElementById('color').onclick = update_color;
document.getElementById('ot_open_btn').onclick = ot_open;
document.getElementById('ot_close_btn').onclick = ot_close;
document.getElementById('ot_req_close_btn').onclick = ot_req_close;
2017-03-20 19:07:19 +08:00
document.getElementById('pmd').onclick = on_pmd;
2011-09-25 10:01:02 +01:00
2016-02-20 14:05:55 +08:00
/*
* We display untrusted stuff in html context... reject anything
* that has HTML stuff in it
*/
function san(s)
{
if (s.search("< ") != -1)
return "invalid string";
return s;
}
2016-07-13 08:45:22 +08:00
lws_gray_out(true,{'zindex':'499'});
2011-09-25 10:01:02 +01:00
/* BrowserDetect came from http://www.quirksmode.org/js/detect.html */
var BrowserDetect = {
init: function () {
this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
this.version = this.searchVersion(navigator.userAgent)
|| this.searchVersion(navigator.appVersion)
|| "an unknown version";
this.OS = this.searchString(this.dataOS) || "an unknown OS";
},
searchString: function (data) {
for (var i=0;i< data.length ; i + + ) {
var dataString = data[i].string;
var dataProp = data[i].prop;
this.versionSearchString = data[i].versionSearch || data[i].identity;
if (dataString) {
if (dataString.indexOf(data[i].subString) != -1)
return data[i].identity;
}
else if (dataProp)
return data[i].identity;
}
},
searchVersion: function (dataString) {
var index = dataString.indexOf(this.versionSearchString);
if (index == -1) return;
return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
},
dataBrowser: [
{
string: navigator.userAgent,
subString: "Chrome",
identity: "Chrome"
},
{ string: navigator.userAgent,
subString: "OmniWeb",
versionSearch: "OmniWeb/",
identity: "OmniWeb"
},
{
string: navigator.vendor,
subString: "Apple",
identity: "Safari",
versionSearch: "Version"
},
{
prop: window.opera,
identity: "Opera",
versionSearch: "Version"
},
{
string: navigator.vendor,
subString: "iCab",
identity: "iCab"
},
{
string: navigator.vendor,
subString: "KDE",
identity: "Konqueror"
},
{
string: navigator.userAgent,
subString: "Firefox",
identity: "Firefox"
},
{
string: navigator.vendor,
subString: "Camino",
identity: "Camino"
},
{ // for newer Netscapes (6+)
string: navigator.userAgent,
subString: "Netscape",
identity: "Netscape"
},
{
string: navigator.userAgent,
subString: "MSIE",
identity: "Explorer",
versionSearch: "MSIE"
},
{
string: navigator.userAgent,
subString: "Gecko",
identity: "Mozilla",
versionSearch: "rv"
},
{ // for older Netscapes (4-)
string: navigator.userAgent,
subString: "Mozilla",
identity: "Netscape",
versionSearch: "Mozilla"
}
],
dataOS : [
{
string: navigator.platform,
subString: "Win",
identity: "Windows"
},
{
string: navigator.platform,
subString: "Mac",
identity: "Mac"
},
{
string: navigator.userAgent,
subString: "iPhone",
identity: "iPhone/iPod"
},
{
string: navigator.platform,
subString: "Linux",
identity: "Linux"
}
]
};
BrowserDetect.init();
document.getElementById("brow").textContent = " " + BrowserDetect.browser + " "
+ BrowserDetect.version +" " + BrowserDetect.OS +" ";
2010-10-29 14:15:22 +01:00
var pos = 0;
2017-07-08 15:58:40 +08:00
function get_appropriate_ws_url(extra_url)
2010-11-12 13:10:40 +00:00
{
2010-11-15 19:39:30 +00:00
var pcol;
var u = document.URL;
2010-11-08 17:03:03 +00:00
/*
* We open the websocket encrypted if this page came on an
* https:// url itself, otherwise unencrypted
*/
2010-11-15 19:39:30 +00:00
if (u.substring(0, 5) == "https") {
pcol = "wss://";
u = u.substr(8);
} else {
pcol = "ws://";
if (u.substring(0, 4) == "http")
u = u.substr(7);
}
u = u.split('/');
2013-12-10 21:20:03 +08:00
/* + "/xxx" bit is for IE10 workaround */
2017-07-08 15:58:40 +08:00
return pcol + u[0] + "/" + extra_url;
2010-11-12 13:10:40 +00:00
}
2017-07-08 15:58:40 +08:00
var params = {};
2010-11-15 19:39:30 +00:00
2017-07-08 15:58:40 +08:00
if (location.search) {
var parts = location.search.substring(1).split('&');
for (var i = 0; i < parts.length ; i + + ) {
var nv = parts[i].split('=');
if (!nv[0]) continue;
params[nv[0]] = nv[1] || true;
}
}
var mirror_name = "";
if (params.mirror)
mirror_name = params.mirror;
console.log(mirror_name);
2017-07-19 04:39:14 +08:00
2017-07-08 15:58:40 +08:00
2017-07-19 04:39:14 +08:00
/*
* if using lws-meta to carry the other ws connections, declare the
* parent connection object and start its connection to the server.
*
* These helpers are defined in lws-common.js
*/
2017-07-10 10:03:31 +08:00
2017-07-19 04:39:14 +08:00
var lws_meta = new lws_meta_ws();
lws_meta.new_parent(get_appropriate_ws_url("?mirror=" + mirror_name));
2017-07-10 10:03:31 +08:00
2017-07-08 15:58:40 +08:00
document.getElementById("number").textContent = get_appropriate_ws_url(mirror_name);
2010-11-15 19:39:30 +00:00
2010-11-12 13:10:40 +00:00
/* dumb increment protocol */
2017-07-19 04:39:14 +08:00
/*
* to connect via an lws-meta connection, start the connection using
* lws_meta.new_ws(). To connect by independent connection, start
* the connection using just new_ws()
*/
2010-11-08 17:03:03 +00:00
2017-07-19 04:39:14 +08:00
var socket_di = lws_meta.new_ws("", "dumb-increment-protocol");
2010-10-29 14:15:22 +01:00
try {
2010-11-12 13:10:40 +00:00
socket_di.onopen = function() {
2010-11-12 14:12:13 +00:00
document.getElementById("wsdi_statustd").style.backgroundColor = "#40ff40";
2016-02-20 14:05:55 +08:00
document.getElementById("wsdi_status").innerHTML =
" < b > websocket connection opened< / b > < br > " +
san(socket_di.extensions);
2010-11-11 13:19:19 +00:00
}
2010-11-12 13:10:40 +00:00
socket_di.onmessage =function got_packet(msg) {
2010-11-12 14:12:13 +00:00
document.getElementById("number").textContent = msg.data + "\n";
2010-11-11 13:19:19 +00:00
}
2010-11-12 13:10:40 +00:00
socket_di.onclose = function(){
2010-11-12 14:12:13 +00:00
document.getElementById("wsdi_statustd").style.backgroundColor = "#ff4040";
document.getElementById("wsdi_status").textContent = " websocket connection CLOSED ";
2010-11-11 13:19:19 +00:00
}
} catch(exception) {
2010-11-12 13:10:40 +00:00
alert('< p > Error' + exception);
2010-11-11 13:19:19 +00:00
}
2016-02-20 14:05:55 +08:00
var socket_status, jso, s;
2017-07-19 04:39:14 +08:00
socket_status = lws_meta.new_ws(get_appropriate_ws_url(""), "lws-status");
2016-02-20 14:05:55 +08:00
try {
socket_status.onopen = function() {
document.getElementById("s_statustd").style.backgroundColor = "#40ff40";
document.getElementById("s_status").innerHTML =
" < b > websocket connection opened< / b > < br > " +
2016-04-01 08:43:13 +08:00
san(socket_status.extensions);
2016-02-20 14:05:55 +08:00
}
socket_status.onmessage =function got_packet(msg) {
2016-07-23 14:18:25 +08:00
var s;
2017-07-19 04:39:14 +08:00
console.log(msg.data);
2016-02-20 14:05:55 +08:00
jso = JSON.parse(msg.data);
document.getElementById("servinfo").innerHTML =
"< table > < tr > < td class = l > Build info< / td > < td > "+
san(jso.version) + "< / td > < / tr > " +
"< tr > < td class = l > Server info< / td > < td > " +
san(jso.hostname) + "< / td > < / tr > " +
"< / table > ";
s="< table > ";
var n;
2016-07-23 14:18:25 +08:00
for (n = 0; n < jso.conns.length ; n + + ) {
2016-08-23 18:29:17 +08:00
var d = new Date(parseInt(jso.conns[n].time) * 1000);
2016-07-23 14:18:25 +08:00
2016-02-20 14:05:55 +08:00
s = s + "< tr > < td class = l > client " + (n + 1) +
"< / td > < td > < b > " + san(jso.conns[n].peer) +
2016-07-23 14:18:25 +08:00
"< / b > < br > " + san(d.toString()) +
2016-02-20 14:05:55 +08:00
"< br > " + san(jso.conns[n].ua) +
"< / td > < / tr > ";
2016-07-23 14:18:25 +08:00
}
2016-02-20 14:05:55 +08:00
s = s + "< / table > ";
document.getElementById("conninfo").innerHTML = s;
}
socket_status.onclose = function(){
document.getElementById("s_statustd").style.backgroundColor = "#ff4040";
document.getElementById("s_status").textContent = " websocket connection CLOSED ";
}
} catch(exception) {
alert('< p > Error' + exception);
}
2010-11-11 13:19:19 +00:00
function reset() {
2010-11-12 13:10:40 +00:00
socket_di.send("reset\n");
}
2016-04-01 08:43:13 +08:00
function junk() {
for(var word = ''; word.length < 9000 ; word + = ' a ' ) { }
socket_di.send(word);
}
2017-03-20 19:07:19 +08:00
function on_pmd() {
2017-03-26 10:08:35 +08:00
socket_status.send("{ \"RequestType\":\"DDoS\", \"blob\":\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABQCAYAAACOEfKtAAAJbElEQVR4Xu2af4xUVxXHv+e9O0OhIEibgrRlF8rOG6CWKiumrUlTo6byj6mmNFta2DdQsRJJrP5j+0cnjSVp1BoSU1yzO28LEeL6h7GJNhpJNa2CBQ1gd9k3QPlRBU2LLV0W2p173zFvZvbtzOybmbd7J9DEd/+befece97nfe+95/4gxEWLAGlZx8aIAWqKIAYYA9QkoGkeKzAGqElA0zxWYAxQk4CmeazAGKAmAU3zWIExQE0CmuaxAmOAmgQ0zWMFxgA1CWiaxwqMAWoS0DRvrQJ3ujeb17Hrx6SuzLwV32x7VzO+1pj3HJprJue8BcBQCSONRzr+2RrHaO2OtHDc1wDcUwqOj0s7nWpVoDp+hOMeA5Au+zggbesuHX+Vti1VoOh3j4BxRxEf8xmVSbe3KlAdP2bOPUmEpaXviiGZsVbq+IsBxgCnpp9YgVPjNan2RwagmXMfUpnUAEAc9k6Rx8AHB0zzy3euU5nUXk02RXMzl+9Ssw8PYN06FeYvOkAmM5dfpzLWL6LGFXkSMR13jIAEmKXMpBM6AIXjeih+BVLqTEcSWfJ/T71ks4bZ9vAYgU1/epC2ZegAFLnhAogEM0tV5x1r/UcGKBw3UJ1sTyVwH8laZ5EU2DO4WCTFmXFbOTbnemxZdHnq9AAMvDVTjF4ObKVS7di8IvA97jOSArNsiLZ8oGBpW5HYRKrkB1IFcGwkiS2dhWkB7B1qE6Z5uiUAew7NEsk5o4EveEtgLw98TwngwIApRlcFoogBVnzdSArUAWg6+T4QS3U69Xi98eiqK7A4vnX1+YsldWbPJmSzk8fJa6FAP67FXTv9sVLZqU1k9rvHibGsmKQzBlTGeih0gqgcA69CFxaO+zKA+4uxEF6W3dbaSXFdA4Bmzt1DhK5SLHycTMd9n4A5pT9oSNqp0GXO1VagcFx/cphZhnZF2tasjwJAkRs+CqJPFvEBIzHA8a8ScQyMAdbbTGgJwAY7FS3LA3edXCyUbJoHitzwKIhK3Zb5ssykr5/Uha9BHigc9whQ3nHyu7DIDe8A0TY/OI/xtJexngnP5ocLRCRAkLLbas1KhOGps6lE2MxvOO6TBvBsMS7Pe8rbtHz7pLhavRLpdwtgCDCkzIS/o9Gff8pg/n55EtlRSqT7h+8B0xhs62AYvHJlf524QZ3duzs0pfCT7aj7gQNsmqPHH1V2qr9+ewBePHYXIICNHfsb1TNzw7Y6e343svdNWh35dpHyQL9iKUV5VGVSu+qt94tx7DrZCa8wA93pP0deiTR80fLDyACjOGthncgAp9FmqwG+CsbnynHkpW1Z04ip5Sai3x0CY3kpU+P9sjt9d6saaSlA9JybJWaMXARDyRFjLrZ1fNiqQLX8DAwmxai4CCAhzblzsWFhsH7W8lvM8eOiRSAGqIUvVqAmvhhgDFCbgKaDqY+B2ayBBV2fQJJnwzQlSL6HjcsvhMaRHUwG/2dXjjWMtXdwPjBjPryCARKXIcQ7sJd8EOn9fFuTbkCBCDOMUZw69596SXWVv4HB2bicXAClBARdwqm95+stEurFER1gz6GESM45DGBFmLNJW+C5E7cKUmfH68pkoh3rl046r8CL7s3CQ+hdFQY2KNvaXS94o8/\" }");
socket_status.send("{ \"RequestType\":\"SendImage\", \"RequestID\":\"283463389\", \"toType\":\"toUser\", \"toID\":\"1036\", \"fileType\":\"image/jpeg\", \"blob\":\"data:image/jpeg;base64,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
socket_status.send("{ \"RequestType\":\"SendImage\", \"RequestID\":\"788346414\", \"toType\":\"toUser\", \"toID\":\"1036\", \"fileType\":\"image/jpeg\", \"blob\":\"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/2wBDAQMDAwQDBAgEBAgQCwkLEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBD/wAARCAHgAoADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD9U6KKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAopNy/wB4fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/AHh+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv8AeH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/wB4fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/AHh+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv8AeH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/wB4fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/AHh+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv8AeH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv94fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/wB4fnRuX+8PzoAWik3L/eH50bl/vD86AFopNy/3h+dG5f7w/OgBaKTcv94fnRuX+8PzoAxst6mky3940UmRQA7J9TRk+ppKKAAFh/EaCWP8RoooAXJ9TRk+ppKKADL/AN40Zf8AvGkwKMCgA3N/eNG5v7xoI70Ad6AF3Mf4iPxpMsP4j+dHSlxmgBCWH8R/OlBb+8fzpCM96OgoAVWb+8fzoLN6n86OBTSc0AOy3940Zb+8aTg0YFACkv8A3jRlv7xpNvvSYx3oAXLn+I0Ev/eNAwOc0YBNABubHU/nSbm/vH86VaMc5oATc394/nTt3+0aTb70baAAl8/eP50uW/vGk20baADc3940B27k0babQA/Lf3jRlv7xpMAdTRgHpQA4lj/EaTLf3jTSMUvFAC5b+8aMt/eNJjHNGAelAC5b+8aMt/eNJxQSD3oAXLf3jRlv7xpNvvRjHegBSW/vGgFv7xpuB60YHrQA7Lf3jRlv7xpAQO9IMDvQA7Lf3jRlv7xpuM96XbQAuW/vGjLf3jSfLR8tAC5b+8aAW/vGkAFJgetADst/eNGW/vGk2+9IAPWgB5LH+I0mW/vGmkYpeKAFy3940Zb+8aTGOaMA9KAFy3940Zb+8aTigkHvQAuW/vGjLf3jSbfejGO9ACkt/eNALf3jTcD1owPWgB2Wz940mWzjcaP
2017-03-20 19:07:19 +08:00
}
2015-11-15 09:24:25 +08:00
var socket_ot;
function ot_open() {
2017-07-10 10:03:31 +08:00
2017-07-19 04:39:14 +08:00
socket_ot = lws_meta.new_ws(get_appropriate_ws_url(""), "dumb-increment-protocol");
console.log("ot_open");
2017-07-10 10:03:31 +08:00
2015-11-15 09:24:25 +08:00
try {
socket_ot.onopen = function() {
document.getElementById("ot_statustd").style.backgroundColor = "#40ff40";
2016-02-20 14:05:55 +08:00
document.getElementById("ot_status").innerHTML = " < b > websocket connection opened< / b > < br > " + san(socket_di.extensions);
2015-11-15 09:24:25 +08:00
document.getElementById("ot_open_btn").disabled = true;
document.getElementById("ot_close_btn").disabled = false;
2015-12-26 17:20:34 +08:00
document.getElementById("ot_req_close_btn").disabled = false;
2017-07-19 04:39:14 +08:00
console.log("ot_open.onopen");
2015-11-15 09:24:25 +08:00
}
2015-12-26 17:20:34 +08:00
socket_ot.onclose = function(e){
2015-11-15 09:24:25 +08:00
document.getElementById("ot_statustd").style.backgroundColor = "#ff4040";
2015-12-26 17:20:34 +08:00
document.getElementById("ot_status").textContent = " websocket connection CLOSED, code: " + e.code +
", reason: " + e.reason;
2015-11-15 09:24:25 +08:00
document.getElementById("ot_open_btn").disabled = false;
document.getElementById("ot_close_btn").disabled = true;
2015-12-26 17:20:34 +08:00
document.getElementById("ot_req_close_btn").disabled = true;
2015-11-15 09:24:25 +08:00
}
} catch(exception) {
alert('< p > Error' + exception);
}
}
2015-12-26 17:20:34 +08:00
/* browser will close the ws in a controlled way */
2015-11-15 09:24:25 +08:00
function ot_close() {
2015-12-26 15:47:06 +08:00
socket_ot.close(3000, "Bye!");
2015-11-15 09:24:25 +08:00
}
2010-11-12 13:10:40 +00:00
2015-12-26 17:20:34 +08:00
/* we ask the server to close the ws in a controlled way */
function ot_req_close() {
socket_ot.send("closeme\n");
}
2010-11-12 13:10:40 +00:00
/* lws-mirror protocol */
var down = 0;
var no_last = 1;
2010-11-12 14:12:13 +00:00
var last_x = 0, last_y = 0;
2010-11-12 13:10:40 +00:00
var ctx;
2011-09-25 10:01:02 +01:00
var socket_lm;
2010-11-12 13:10:40 +00:00
var color = "#000000";
2017-07-19 04:39:14 +08:00
socket_lm = lws_meta.new_ws(get_appropriate_ws_url("?mirror=" + mirror_name),
2017-07-10 10:03:31 +08:00
"lws-mirror-protocol");
2011-09-25 10:01:02 +01:00
2010-11-12 13:10:40 +00:00
try {
socket_lm.onopen = function() {
2010-11-12 14:12:13 +00:00
document.getElementById("wslm_statustd").style.backgroundColor = "#40ff40";
2016-02-20 14:05:55 +08:00
document.getElementById("wslm_status").innerHTML =
" < b > websocket connection opened< / b > < br > " +
2016-04-01 08:43:13 +08:00
san(socket_lm.extensions);
2016-07-13 08:45:22 +08:00
lws_gray_out(false);
2010-11-12 13:10:40 +00:00
}
socket_lm.onmessage =function got_packet(msg) {
2011-01-27 06:26:52 +00:00
j = msg.data.split(';');
f = 0;
while (f < j.length - 1 ) {
i = j[f].split(' ');
if (i[0] == 'd') {
ctx.strokeStyle = i[1];
ctx.beginPath();
ctx.moveTo(+(i[2]), +(i[3]));
ctx.lineTo(+(i[4]), +(i[5]));
ctx.stroke();
}
if (i[0] == 'c') {
ctx.strokeStyle = i[1];
ctx.beginPath();
ctx.arc(+(i[2]), +(i[3]), +(i[4]), 0, Math.PI*2, true);
ctx.stroke();
}
f++;
2010-11-12 13:10:40 +00:00
}
}
socket_lm.onclose = function(){
2010-11-12 14:12:13 +00:00
document.getElementById("wslm_statustd").style.backgroundColor = "#ff4040";
document.getElementById("wslm_status").textContent = " websocket connection CLOSED ";
2016-07-13 08:45:22 +08:00
lws_gray_out(true,{'zindex':'499'});
2010-11-12 13:10:40 +00:00
}
} catch(exception) {
alert('< p > Error' + exception);
}
var canvas = document.createElement('canvas');
canvas.height = 300;
canvas.width = 480;
ctx = canvas.getContext("2d");
document.getElementById('wslm_drawing').appendChild(canvas);
canvas.addEventListener('mousemove', ev_mousemove, false);
canvas.addEventListener('mousedown', ev_mousedown, false);
canvas.addEventListener('mouseup', ev_mouseup, false);
2010-11-12 14:12:13 +00:00
offsetX = offsetY = 0;
element = canvas;
if (element.offsetParent) {
do {
offsetX += element.offsetLeft;
offsetY += element.offsetTop;
} while ((element = element.offsetParent));
}
2010-11-12 13:10:40 +00:00
function update_color() {
color = document.getElementById("color").value;
}
function ev_mousedown (ev) {
down = 1;
2010-11-11 13:19:19 +00:00
}
2010-10-29 14:15:22 +01:00
2010-11-12 13:10:40 +00:00
function ev_mouseup(ev) {
down = 0;
no_last = 1;
}
function ev_mousemove (ev) {
var x, y;
2010-11-12 14:12:13 +00:00
if (ev.offsetX) {
x = ev.offsetX;
y = ev.offsetY;
} else {
x = ev.layerX - offsetX;
y = ev.layerY - offsetY;
}
2010-11-12 13:10:40 +00:00
if (!down)
return;
if (no_last) {
no_last = 0;
last_x = x;
last_y = y;
return;
}
2011-01-27 06:26:52 +00:00
socket_lm.send("d " + color + " " + last_x + " " + last_y + " " + x + ' ' + y + ';');
2010-11-12 13:10:40 +00:00
last_x = x;
last_y = y;
}
2010-10-29 14:15:22 +01:00
< / script >
< / body >
< / html >
