schuster-rainer/rx_websocket_protokol.html

## rx_websocket_protokol.html
<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="utf-8" />
  <title>Pushing with Rx and websock.js</title>
  <script src="script/jquery-1.7.1.js" type="text/javascript"></script>
  <script src="script/rx.min.js" type="text/javascript"></script>
  <script src="script/rx.jquery.js" type="text/javascript"></script>
  <script src="script/rx.time.min.js" type="text/javascript"></script>
  <script src="script/base64.js"></script>
  <script src="script/util.js"></script>
  <script src="script/websock.js"></script>
  <script src="script/coffee-script.js"></script>
  <script type="text/coffeescript">
    jQuery ->
      ws = new Websock
      channel = new Rx.Subject()

      log = (msg) -> console.log msg

      ws.on 'message', () ->
        log ">> WebSocket.onmessage"
        packetSize = ws.rQlen()
        packetData = ws.rQshiftStr packetSize
        obj = $.parseJSON packetData
        channel.onNext obj

      ws.on 'open', (e) ->
        log ">> WebSocket.onopen"
        log "<< WebSocket.send_string"
        ws.send_string '{"method":"scanned", "params": ["1"], "id":1}'
        ws.send_string '{"method":"scanned", "params": ["2"], "id":2}'
        ws.send_string '{"method":"shutter", "params": ["open"], "id":3}'
        ws.send_string '{"method":"shutter", "params": ["close"], "id":4}'
        ws.send_string '{"method":"scanned", "params": ["3"], "id":5}'

      ws.on 'close', (e) ->
        log ">> WebSocket.onclose"
        channel.onCompleted '{"message":">> RX.onCompleted"}'

      ws.on 'error', (e) ->
        log ">> WebSocket.onerror"
        channel.onError '{"error":">> RX.onError"}'

      #select topic based on methodName
      topic = (methodName) ->
        method = channel
          .where((msg) -> msg.method == methodName)
          .select((msg) -> {"params":msg.params, "id":msg.id})

      bind = (methodName, handler) ->
        topic(methodName).subscribe(handler)

      topic("shutter").subscribe (msg) -> log ("Shutter: " + msg.params[0])
      # and the jQuery like syntax
      bind 'scanned', (msg) -> log ("Barcode Scanned: " + msg.params[0])


      #scanned.subscribe (msg) -> log ("Barcode scanned: " + msg.params)
      #shutter = channel.where((msg) -> msg.method == "shutter")
      #shutter.subscribe (msg) -> log ("Shutter: " + msg.params)

      url = "ws://localhost:54321"
      log "Rx Demo: << is used to signal an action"
      log "         >> is used to signal a reaction"
      log "<< connecting to EchoWebSocket at " + url

      ws.open url
  </script>
</head>
<style type="text/css">
    html, body {
        width:  100%;
        height: 100%;
        margin: 0px;
        font-family: Consolas, monospace;
    }
</style>
<body>
  <div id="container"></div>
</body>
</html>

## socket_server.py
# -*- coding: utf-8 -*-
from multiprocessing import Process

def cherrypy_server(host="127.0.0.1",
                    port=54321):

    import cherrypy
    import ws4py.websocket as ws
    import ws4py.server.cherrypyserver as server

    config = {'server.socket_host': host,
              'server.socket_port': port,
              'log.screen': False
              }
    cherrypy.config.update(config)
    server.WebSocketPlugin(cherrypy.engine).subscribe()
    cherrypy.tools.websocket = server.WebSocketTool()

    class Root(object):
        @cherrypy.expose
        def index(self):
            pass

    config = {
        '/': {
            'tools.websocket.on': True,
            'tools.websocket.handler_cls': ws.EchoWebSocket
            }
        }
    cherrypy.quickstart(Root(), '/', config)

if __name__ == '__main__':
    p0 = Process(target=cherrypy_server)
    p0.daemon = True
    p0.start()
    p0.join()
	<!DOCTYPE html>
	<html lang="de">
	<head>
	<meta charset="utf-8" />
	<title>Pushing with Rx and websock.js</title>
	<script src="script/jquery-1.7.1.js" type="text/javascript"></script>
	<script src="script/rx.min.js" type="text/javascript"></script>
	<script src="script/rx.jquery.js" type="text/javascript"></script>
	<script src="script/rx.time.min.js" type="text/javascript"></script>
	<script src="script/base64.js"></script>
	<script src="script/util.js"></script>
	<script src="script/websock.js"></script>
	<script src="script/coffee-script.js"></script>
	<script type="text/coffeescript">
	jQuery ->
	ws = new Websock
	channel = new Rx.Subject()

	log = (msg) -> console.log msg

	ws.on 'message', () ->
	log ">> WebSocket.onmessage"
	packetSize = ws.rQlen()
	packetData = ws.rQshiftStr packetSize
	obj = $.parseJSON packetData
	channel.onNext obj

	ws.on 'open', (e) ->
	log ">> WebSocket.onopen"
	log "<< WebSocket.send_string"
	ws.send_string '{"method":"scanned", "params": ["1"], "id":1}'
	ws.send_string '{"method":"scanned", "params": ["2"], "id":2}'
	ws.send_string '{"method":"shutter", "params": ["open"], "id":3}'
	ws.send_string '{"method":"shutter", "params": ["close"], "id":4}'
	ws.send_string '{"method":"scanned", "params": ["3"], "id":5}'

	ws.on 'close', (e) ->
	log ">> WebSocket.onclose"
	channel.onCompleted '{"message":">> RX.onCompleted"}'

	ws.on 'error', (e) ->
	log ">> WebSocket.onerror"
	channel.onError '{"error":">> RX.onError"}'

	#select topic based on methodName
	topic = (methodName) ->
	method = channel
	.where((msg) -> msg.method == methodName)
	.select((msg) -> {"params":msg.params, "id":msg.id})

	bind = (methodName, handler) ->
	topic(methodName).subscribe(handler)

	topic("shutter").subscribe (msg) -> log ("Shutter: " + msg.params[0])
	# and the jQuery like syntax
	bind 'scanned', (msg) -> log ("Barcode Scanned: " + msg.params[0])


	#scanned.subscribe (msg) -> log ("Barcode scanned: " + msg.params)
	#shutter = channel.where((msg) -> msg.method == "shutter")
	#shutter.subscribe (msg) -> log ("Shutter: " + msg.params)

	url = "ws://localhost:54321"
	log "Rx Demo: << is used to signal an action"
	log " >> is used to signal a reaction"
	log "<< connecting to EchoWebSocket at " + url

	ws.open url
	</script>
	</head>
	<style type="text/css">
	html, body {
	width: 100%;
	height: 100%;
	margin: 0px;
	font-family: Consolas, monospace;
	}
	</style>
	<body>
	<div id="container"></div>
	</body>
	</html>
	# -- coding: utf-8 --
	from multiprocessing import Process

	def cherrypy_server(host="127.0.0.1",
	port=54321):

	import cherrypy
	import ws4py.websocket as ws
	import ws4py.server.cherrypyserver as server

	config = {'server.socket_host': host,
	'server.socket_port': port,
	'log.screen': False
	}
	cherrypy.config.update(config)
	server.WebSocketPlugin(cherrypy.engine).subscribe()
	cherrypy.tools.websocket = server.WebSocketTool()

	class Root(object):
	@cherrypy.expose
	def index(self):
	pass

	config = {
	'/': {
	'tools.websocket.on': True,
	'tools.websocket.handler_cls': ws.EchoWebSocket
	}
	}
	cherrypy.quickstart(Root(), '/', config)

	if __name__ == '__main__':
	p0 = Process(target=cherrypy_server)
	p0.daemon = True
	p0.start()
	p0.join()