issues

public/intro.html

@@ -24,10 +24,16 @@ <h4>Interactively run Javascript on multiple browsers</h4>
       </ul>
 
       <p>To get started, you simply create a room with <i>browser 1</i>, and then copy-n-paste the URL to <i>browser 2</i>, <i>browser 3</i>, <i>browser 4</i> and so on. Are you ready to give it a go?</p>
-      <form action="/create_room" method="post">
+      <form id="form" action="/create_room" method="post">
         <button class="button" type="submit">Create a Room</button>
         <div class="clear"></div>
       </form>
+      <script>
+        if (location.hostname !== 'localhost'){
+          var url = 'http://' + location.hostname + ':' + 46071 + '/create_room'
+          document.getElementById('form').setAttribute('action', url)
+        }
+      </script>
     </div>
   </div>
   <div id="bottom">
@@ -38,6 +44,7 @@ <h2>How it Works</h2>
       <h2>Credits</h2>
       <ul>
         <li>LearnBoost's <a href="http://socket.io">Socket.IO</a></li>
+        <li><a href="http://expressjs.com/">Express</a> node web framework</a></li>
         <li><a href="http://nodejs.org/">node.js</a> by Ryan Dahl</li>
         <li>Chris Done's <a href="https://github.com/chrisdone/jquery-console">jQuery Console</a></li>
         <li>Arunjit Singh's <a href="https://github.com/arunjitsingh/socket-chat">Socket Chat</a> which I used as a reference implementation.</a></li>

public/javascripts/client.js

@@ -96,8 +96,14 @@ var retryIntervalID
 function connect(){
     io.setPath('/')
     displayData({announcement: 'Connecting...'})
-    socket = new io.Socket(location.hostname, {port:location.port, 
-        transports: ['websocket', 'htmlfile', 'xhr-multipart', 'xhr-polling']});
+
+    var host = 'tutti.tobyho.com' // location.hostname
+    var port = 46071 // location.port
+
+    socket = new io.Socket(host, {port:port, 
+        transports: ['xhr-polling']
+        //transports: ['websocket', 'htmlfile', 'xhr-multipart', 'xhr-polling']
+        });
 
     socket.on('connect', function(){
         if (retryIntervalID){

public/javascripts/socket.io.js

@@ -488,6 +488,135 @@ if ('jQuery' in this) jQuery.io = this.io;
 	};
 
 })();
+
+/**
+ * Socket.IO client
+ * 
+ * @author Guillermo Rauch <guillermo@learnboost.com>
+ * @license The MIT license.
+ * @copyright Copyright (c) 2010 LearnBoost <dev@learnboost.com>
+ */
+(function(){
+    io.JSONP = [];
+
+    JSONPPolling = io.Transport['jsonp-polling'] = function(){
+    	io.Transport.XHR.apply(this, arguments);
+    	this._insertAt = document.getElementsByTagName('script')[0];
+    	this._index = io.JSONP.length;
+    	io.JSONP.push(this);
+    };
+
+    io.util.inherit(JSONPPolling, io.Transport['xhr-polling']);
+
+    JSONPPolling.prototype.type = 'jsonp-polling';
+
+    JSONPPolling.prototype._send = function(data){
+    	var self = this;
+    	if (!('_form' in this)){
+    		var form = document.createElement('FORM'),
+    		    area = document.createElement('TEXTAREA'),
+    		    id = this._iframeId = 'socket_io_iframe_' + this._index,
+    		    iframe;
+
+    		form.style.position = 'absolute';
+    		form.style.top = '-1000px';
+    		form.style.left = '-1000px';
+    		form.target = id;
+    		form.method = 'POST';
+    		form.action = this._prepareUrl() + '/' + (+new Date) + '/' + this._index;
+    		area.name = 'data';
+    		form.appendChild(area);
+    		this._insertAt.parentNode.insertBefore(form, this._insertAt);
+    		document.body.appendChild(form);
+
+    		this._form = form;
+    		this._area = area;
+    	}
+
+    	function complete(){
+    		initIframe();
+    		self._posting = false;
+    		self._checkSend();
+    	};
+
+    	function initIframe(){
+    		if (self._iframe){
+    			self._form.removeChild(self._iframe);
+    		} 
+
+    		try {
+    			// ie6 dynamic iframes with target="" support (thanks Chris Lambacher)
+    			iframe = document.createElement('<iframe name="'+ self._iframeId +'">');
+    		} catch(e){
+    			iframe = document.createElement('iframe');
+    			iframe.name = self._iframeId;
+    		}
+
+    		iframe.id = self._iframeId;
+
+    		self._form.appendChild(iframe);
+    		self._iframe = iframe;
+    	};
+
+    	initIframe();
+
+    	this._posting = true;
+    	this._area.value = data;
+
+    	try {
+    		this._form.submit();
+    	} catch(e){}
+
+    	if (this._iframe.attachEvent){
+    		iframe.onreadystatechange = function(){
+    			if (self._iframe.readyState == 'complete') complete();
+    		};
+    	} else {
+    		this._iframe.onload = complete;
+    	}
+    };
+
+    JSONPPolling.prototype._get = function(){
+    	var self = this,
+    			script = document.createElement('SCRIPT');
+    	if (this._script){
+    		this._script.parentNode.removeChild(this._script);
+    		this._script = null;
+    	}
+    	script.async = true;
+    	script.src = this._prepareUrl() + '/' + (+new Date) + '/' + this._index;
+    	script.onerror = function(){
+    		self._onDisconnect();
+    	};
+    	this._insertAt.parentNode.insertBefore(script, this._insertAt);
+    	this._script = script;
+    };
+
+    JSONPPolling.prototype.disconnect = function(){
+    	if (this._script){
+    		this._script.parentNode.removeChild(this._script);
+    		this._script = null;
+    	}
+      io.Transport['xhr-polling'].prototype.disconnect.call(this);
+      return this;
+    };
+
+    JSONPPolling.prototype._ = function(){
+    	this._onData.apply(this, arguments);
+    	this._get();
+    	return this;
+    };
+
+    JSONPPolling.check = function(){
+    	return true;
+    };
+
+    JSONPPolling.xdomainCheck = function(){
+    	return true;
+    };
+})()
+
+
 /**
  * Socket.IO client
  * 

server.js

@@ -9,11 +9,10 @@ var json = json = JSON.stringify
 var AllConfigs = {
     // Production HTTP domain
     prodhttp: {
-        port: 46071,
+        port: 26730,
         rooms: true,
         http: true,
-        socket: false,
-        socketLocation: 'http://tutti.tobyho.com:46071'
+        socket: false
     },
     // Production socket.io domain
     prodsocket: {