this is the demo that a Simple chat client , you must open it on webkit Browser like: chrome and Safari,
the demo use a web socket server based on node.js: websocket-server-node.js,
but i think it cant Deploy on google app engine ,
so did you know how to make a websocket using python on google app engine ,
and running the demo on it ,
thanks
this is the code :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<meta name="viewport" content="width=620" />
<title>HTML5 Demo: Web Socket</title>
<link rel="stylesheet" href="http://html5demos.com/css/html5demos.css" type="text/css" />
<script src="http://html5demos.com/js/h5utils.js"></script></head>
<body>
<section id="wrapper">
<header>
<h1>Web Socket</h1>
</header>
<style>
#chat { width: 97%; }
.them { font-weight: bold; }
.them:before { content: 'them '; color: #bbb; font-size: 14px; }
.you { font-style: italic; }
.you:before { content: 'you '; color: #bbb; font-size: 14px; font-weight: bold; }
#log {
overflow: auto;
max-height: 300px;
list-style: none;
padding: 0;
/* margin: 0;*/
}
#log li {
border-top: 1px solid #ccc;
margin: 0;
padding: 10px 0;
}
</style>
<article>
<form>
<input type="text" id="chat" placeholder="type and press enter to chat" />
</form>
<p id="status">Not connected</p>
<p>Users connected: <span id="connected">0</span></p>
<p>To test, open two windows with Web Socket support, type a message above and press return.</p>
<p>The server side code is available here: <a href="http://github.com/remy/html5demos/tree/master/server/">node-web-socket & server</a> (note that it runs on <a href="http://nodejs.org/" title="node.js">nodejs</a>)</p>
<ul id="log"></ul>
</article>
<script>
function openConnection() {
// uses global 'conn' object
if (conn.readyState === undefined || conn.readyState > 1) {
conn = new WebSocket('ws://node.remysharp.com:8001');
conn.onopen = function () {
state.className = 'success';
state.innerHTML = 'Socket open';
};
conn.onmessage = function (event) {
var message = JSON.parse(event.data);
if (typeof message == 'string') {
log.innerHTML = '<li class="them">' + message.replace(/[<>&]/g, function (m) { return entities[m]; }) + '</li>' + log.innerHTML;
} else {
connected.innerHTML = message;
}
};
conn.onclose = function (event) {
state.className = 'fail';
state.innerHTML = 'Socket closed';
};
}
}
var connected = document.getElementById('connected'),
log = document.getElementById('log'),
chat = document.getElementById('chat'),
form = chat.form,
conn = {},
state = document.getElementById('status'),
entities = {
'<' : '<',
'>' : '>',
'&' : '&'
};
if (window.WebSocket === undefined) {
state.innerHTML = 'Sockets not supported';
state.className = 'fail';
} else {
state.onclick = function () {
if (conn.readyState !== 1) {
conn.close();
setTimeout(function () {
openConnection();
}, 250);
}
};
addEvent(form, 'submit', function (event) {
event.preventDefault();
// if we're connected
if (conn.readyState === 1) {
conn.send(JSON.stringify(chat.value));
log.innerHTML = '<li class="you">' + chat.value.replace(/[<>&]/g, function (m) { return entities[m]; }) + '</li>' + log.innerHTML;
chat.value = '';
}
});
openConnection();
}
</script> <footer><a href="/">HTML5 demos</a>/<a id="built" href="http://twitter.com/rem">@rem built this</a>/<a href="#view-source">view source</a></footer>
</section>
<a href="http://github.com/remy/html5demos"><img style="position: absolute; top: 0; left: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png" alt="Fork me on GitHub" /></a>
</body>
</html>
I think you should wait for Channel API.
this is already part of the SDK but does not work in production.
Here a video that show this new upcoming feature
Here a demo application with a multiplayer trivia-quiz
EDIT:
available with SDK 1.4.0