Chat example

Simple chat room example. The client code uses Knockout and jQuery.

Server - examples/

#!/usr/bin/env python

import example_pythonpath
from example_utils import ExampleServer, ExampleStaticFile

class ChatServer(ExampleServer):
    urls = [
        ('/', ExampleStaticFile('chat.html')),
    ] + ExampleServer.urls

    def rpc_message(self, request):

if __name__ == '__main__':

Client - examples/chat.html

<!DOCTYPE html>


	<title>Mushroom Chat Example</title>
<style type="text/css">
	#messages {
		border: 1px solid #999;
		padding: 0.5em;
		margin: 1em 0;
		height: 20em;
		overflow: auto;


<h1>Welcome to Mushroom Chat Example</h1>

<div id="loading" data-bind="visible: !online()">Loading...</div>

<div style="display: none" data-bind="visible: online">

<div data-bind="visible: !usernameSet()">
	<h2>Choose username</h2>
	<form id="login-form" data-bind="submit: setUsername">
		<input name="username" data-bind="value: username, valueUpdate: 'afterkeydown'">
		<input type="submit" value="Ok" data-bind="enable: username() !== ''">

<div data-bind="visible: usernameSet">
	<h2>Current discussion</h2>
	<div id="messages">
		<div data-bind="if: messages().length === 0">No chat messages, yet. :-(</div>
		<!-- ko foreach: messages -->
		<div class="message">
			&lt;<span class="username" data-bind="text: username"></span>&gt;
			<span class="message" data-bind="text: message"></span>
		<!-- /ko -->
	<form id="form" data-bind="submit: sendMessage">
		<input name="message" data-bind="value: message, valueUpdate: 'afterkeydown'">
		<input type="submit" value="Send" data-bind="enable: message() !== ''">


<script type="text/javascript" src="/js/mushroom.js"></script>
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/knockout.js"></script>
<script type="text/javascript">
$(function() {
	var model = {
		username: ko.observable(''),
		usernameSet: ko.observable(false),
		message: ko.observable(''),
		messages: ko.observableArray(),
		online: ko.observable(false),
		setUsername: function() {
		sendMessage: function() {
			client.notify('message', {
				username: this.username(),
				message: this.message()
			return false;
	var client = new mushroom.Client({
		url: '/'
	client.signals.connected.connect(function() {;
	client.method('message', function(request) {