joshua
/
beats-website
Archived
1
0
Fork 0
Code Releases Activity
Browse Source

Created nice observer

master
Joshua Moerman 11 years ago
parent
c9128789c1
commit
aaa00ff806
1 changed files with 49 additions and 2 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 51
      observer.html

51
observer.html
View File

@ -1,11 +1,36 @@
<!DOCTYPE html>
<meta charset="utf-8" />
<title>WebSocket Test</title>
<style type="text/css">
body {
font-size: 16pt;
}
#screen {
background-color: #fda;
position: absolute;
top: 0px;
left: 0px;
width: 1280px;
height: 800px;
opacity: 0.5;
}
.user {
border: 3px solid #0af;
text-align: right;
position: absolute;
opacity: 0.5;
}
.user .name {
padding: 4px;
background-color: #0af;
}
</style>
<script language="javascript" type="text/javascript">
var websocket;
var list_of_people;
var the_screen;
function init() {
the_screen = document.getElementById("screen");
testWebSocket();
}
function testWebSocket() {
@ -21,7 +46,26 @@
websocket.send("a");
}
function onMessage(evt) {
list_of_people = JSON.parse(evt.data);
var people = JSON.parse(evt.data);
the_screen.innerHTML = '';
for (var i = people.length - 1; i >= 0; i--) {
var name = document.createElement('span')
name.className = "name";
name.innerText = people[i].name;
var user = document.createElement('div');
user.className = 'user';
user.appendChild(name);
user.style.width = people[i].width + "px";
user.style.height = people[i].height + "px";
the_screen.appendChild(user);
};
setTimeout(function(){
websocket.send("a");
}, 500);
}
function onError(evt) {
document.getElementById("status").innerHTML = 'ERROR: ' + evt.data;
@ -36,4 +80,7 @@
<p>Response of server: <span id="people"></span>
<p>Status: <span id="status">unknown</span>
<div id="screen">
</div>
</html>