Permalink
Browse files

Update to newest Flash WebSocket implementation

  • Loading branch information...
1 parent 8414755 commit 6962b6d96ed6bcc4990698cb043ce43cc09d6c4b @pusewicz pusewicz committed Oct 9, 2010
Showing with 162 additions and 85 deletions.
  1. BIN public/WebSocketMain.swf
  2. +1 −1 public/vendor/FABridge.js
  3. +160 −83 public/vendor/web_socket.js
  4. +1 −1 views/index.haml
View
Binary file not shown.
@@ -362,7 +362,7 @@ FABridge.prototype =
// accepts a type structure, returns a constructed type
addTypeDataToCache: function(typeData)
{
- newType = new ASProxy(this, typeData.name);
+ var newType = new ASProxy(this, typeData.name);
var accessors = typeData.accessors;
for (var i = 0; i < accessors.length; i++)
{
View
@@ -10,83 +10,104 @@
var console = window.console;
if (!console) console = {log: function(){ }, error: function(){ }};
- function hasFlash() {
- if ('navigator' in window && 'plugins' in navigator && navigator.plugins['Shockwave Flash']) {
- return !!navigator.plugins['Shockwave Flash'].description;
- }
- if ('ActiveXObject' in window) {
- try {
- return !!new ActiveXObject('ShockwaveFlash.ShockwaveFlash').GetVariable('$version');
- } catch (e) {}
- }
- return false;
- }
-
- if (!hasFlash()) {
+ if (!swfobject.hasFlashPlayerVersion("9.0.0")) {
console.error("Flash Player is not installed.");
return;
}
+ if (location.protocol == "file:") {
+ console.error(
+ "WARNING: web-socket-js doesn't work in file:///... URL " +
+ "unless you set Flash Security Settings properly. " +
+ "Open the page via Web server i.e. http://...");
+ }
WebSocket = function(url, protocol, proxyHost, proxyPort, headers) {
var self = this;
self.readyState = WebSocket.CONNECTING;
self.bufferedAmount = 0;
- WebSocket.__addTask(function() {
- self.__flash =
- WebSocket.__flash.create(url, protocol, proxyHost || null, proxyPort || 0, headers || null);
-
- self.__flash.addEventListener("open", function(fe) {
- try {
- if (self.onopen) self.onopen();
- } catch (e) {
- console.error(e.toString());
- }
+ // Uses setTimeout() to make sure __createFlash() runs after the caller sets ws.onopen etc.
+ // Otherwise, when onopen fires immediately, onopen is called before it is set.
+ setTimeout(function() {
+ WebSocket.__addTask(function() {
+ self.__createFlash(url, protocol, proxyHost, proxyPort, headers);
});
+ }, 1);
+ }
+
+ WebSocket.prototype.__createFlash = function(url, protocol, proxyHost, proxyPort, headers) {
+ var self = this;
+ self.__flash =
+ WebSocket.__flash.create(url, protocol, proxyHost || null, proxyPort || 0, headers || null);
- self.__flash.addEventListener("close", function(fe) {
- try {
- if (self.onclose) self.onclose();
- } catch (e) {
- console.error(e.toString());
+ self.__flash.addEventListener("open", function(fe) {
+ try {
+ self.readyState = self.__flash.getReadyState();
+ if (self.__timer) clearInterval(self.__timer);
+ if (window.opera) {
+ // Workaround for weird behavior of Opera which sometimes drops events.
+ self.__timer = setInterval(function () {
+ self.__handleMessages();
+ }, 500);
}
- });
+ if (self.onopen) self.onopen();
+ } catch (e) {
+ console.error(e.toString());
+ }
+ });
- self.__flash.addEventListener("message", function(fe) {
- var data = decodeURIComponent(fe.getData());
- try {
- if (self.onmessage) {
- var e;
- if (window.MessageEvent) {
- e = document.createEvent("MessageEvent");
- e.initMessageEvent("message", false, false, data, null, null, window);
- } else { // IE
- e = {data: data};
- }
- self.onmessage(e);
- }
- } catch (e) {
- console.error(e.toString());
- }
- });
+ self.__flash.addEventListener("close", function(fe) {
+ try {
+ self.readyState = self.__flash.getReadyState();
+ if (self.__timer) clearInterval(self.__timer);
+ if (self.onclose) self.onclose();
+ } catch (e) {
+ console.error(e.toString());
+ }
+ });
- self.__flash.addEventListener("stateChange", function(fe) {
- try {
- self.readyState = fe.getReadyState();
- self.bufferedAmount = fe.getBufferedAmount();
- } catch (e) {
- console.error(e.toString());
- }
- });
+ self.__flash.addEventListener("message", function() {
+ try {
+ self.__handleMessages();
+ } catch (e) {
+ console.error(e.toString());
+ }
+ });
- //console.log("[WebSocket] Flash object is ready");
+ self.__flash.addEventListener("error", function(fe) {
+ try {
+ if (self.__timer) clearInterval(self.__timer);
+ if (self.onerror) self.onerror();
+ } catch (e) {
+ console.error(e.toString());
+ }
});
- }
+
+ self.__flash.addEventListener("stateChange", function(fe) {
+ try {
+ self.readyState = self.__flash.getReadyState();
+ self.bufferedAmount = fe.getBufferedAmount();
+ } catch (e) {
+ console.error(e.toString());
+ }
+ });
+
+ //console.log("[WebSocket] Flash object is ready");
+ };
WebSocket.prototype.send = function(data) {
+ if (this.__flash) {
+ this.readyState = this.__flash.getReadyState();
+ }
if (!this.__flash || this.readyState == WebSocket.CONNECTING) {
throw "INVALID_STATE_ERR: Web Socket connection has not been established";
}
- var result = this.__flash.send(data);
+ // We use encodeURIComponent() here, because FABridge doesn't work if
+ // the argument includes some characters. We don't use escape() here
+ // because of this:
+ // https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Functions#escape_and_unescape_Functions
+ // But it looks decodeURIComponent(encodeURIComponent(s)) doesn't
+ // preserve all Unicode characters either e.g. "\uffff" in Firefox.
+ var result = this.__flash.send(encodeURIComponent(data));
if (result < 0) { // success
return true;
} else {
@@ -96,14 +117,21 @@
};
WebSocket.prototype.close = function() {
- if (!this.__flash) return;
- if (this.readyState != WebSocket.OPEN) return;
- this.__flash.close();
+ var self = this;
+ if (!self.__flash) return;
+ self.readyState = self.__flash.getReadyState();
+ if (self.readyState == WebSocket.CLOSED || self.readyState == WebSocket.CLOSING) return;
+ self.__flash.close();
// Sets/calls them manually here because Flash WebSocketConnection.close cannot fire events
// which causes weird error:
// > You are trying to call recursively into the Flash Player which is not allowed.
- this.readyState = WebSocket.CLOSED;
- if (this.onclose) this.onclose();
+ self.readyState = WebSocket.CLOSED;
+ if (self.__timer) clearInterval(self.__timer);
+ if (self.onclose) {
+ // Make it asynchronous so that it looks more like an actual
+ // close event
+ setTimeout(self.onclose, 1);
+ }
};
/**
@@ -122,7 +150,7 @@
this.__events[type] = [];
if ('function' == typeof this['on' + type]) {
this.__events[type].defaultHandler = this['on' + type];
- this['on' + type] = WebSocket_FireEvent(this, type);
+ this['on' + type] = this.__createEventHandler(this, type);
}
}
this.__events[type].push(listener);
@@ -171,12 +199,35 @@
}
};
+ WebSocket.prototype.__handleMessages = function() {
+ // Gets data using readSocketData() instead of getting it from event object
+ // of Flash event. This is to make sure to keep message order.
+ // It seems sometimes Flash events don't arrive in the same order as they are sent.
+ var arr = this.__flash.readSocketData();
+ for (var i = 0; i < arr.length; i++) {
+ var data = decodeURIComponent(arr[i]);
+ try {
+ if (this.onmessage) {
+ var e;
+ if (window.MessageEvent && !window.opera) {
+ e = document.createEvent("MessageEvent");
+ e.initMessageEvent("message", false, false, data, null, null, window, null);
+ } else { // IE and Opera, the latter one truncates the data parameter after any 0x00 bytes
+ e = {data: data};
+ }
+ this.onmessage(e);
+ }
+ } catch (e) {
+ console.error(e.toString());
+ }
+ }
+ };
+
/**
- *
* @param {object} object
* @param {string} type
*/
- function WebSocket_FireEvent(object, type) {
+ WebSocket.prototype.__createEventHandler = function(object, type) {
return function(data) {
var event = new WebSocketEvent();
event.initEvent(type, true, true);
@@ -242,29 +293,45 @@
WebSocket.CONNECTING = 0;
WebSocket.OPEN = 1;
- WebSocket.CLOSED = 2;
+ WebSocket.CLOSING = 2;
+ WebSocket.CLOSED = 3;
WebSocket.__tasks = [];
WebSocket.__initialize = function() {
- if (!WebSocket.__swfLocation) {
- console.error("[WebSocket] set WebSocket.__swfLocation to location of WebSocketMain.swf");
+ if (WebSocket.__swfLocation) {
+ // For backword compatibility.
+ window.WEB_SOCKET_SWF_LOCATION = WebSocket.__swfLocation;
+ }
+ if (!window.WEB_SOCKET_SWF_LOCATION) {
+ console.error("[WebSocket] set WEB_SOCKET_SWF_LOCATION to location of WebSocketMain.swf");
return;
}
var container = document.createElement("div");
container.id = "webSocketContainer";
- // Puts the Flash out of the window. Note that we cannot use display: none or visibility: hidden
- // here because it prevents Flash from loading at least in IE.
+ // Hides Flash box. We cannot use display: none or visibility: hidden because it prevents
+ // Flash from loading at least in IE. So we move it out of the screen at (-100, -100).
+ // But this even doesn't work with Flash Lite (e.g. in Droid Incredible). So with Flash
+ // Lite, we put it at (0, 0). This shows 1x1 box visible at left-top corner but this is
+ // the best we can do as far as we know now.
container.style.position = "absolute";
- container.style.left = "-100px";
- container.style.top = "-100px";
+ if (WebSocket.__isFlashLite()) {
+ container.style.left = "0px";
+ container.style.top = "0px";
+ } else {
+ container.style.left = "-100px";
+ container.style.top = "-100px";
+ }
var holder = document.createElement("div");
holder.id = "webSocketFlash";
container.appendChild(holder);
document.body.appendChild(container);
+ // See this article for hasPriority:
+ // http://help.adobe.com/en_US/as3/mobile/WS4bebcd66a74275c36cfb8137124318eebc6-7ffd.html
swfobject.embedSWF(
- WebSocket.__swfLocation, "webSocketFlash", "8", "8", "9.0.0",
- null, {bridgeName: "webSocket"}, null, null,
+ WEB_SOCKET_SWF_LOCATION, "webSocketFlash",
+ "1" /* width */, "1" /* height */, "9.0.0" /* SWF version */,
+ null, {bridgeName: "webSocket"}, {hasPriority: true, allowScriptAccess: "always"}, null,
function(e) {
if (!e.success) console.error("[WebSocket] swfobject.embedSWF failed");
}
@@ -274,6 +341,7 @@
//console.log("[WebSocket] FABridge initializad");
WebSocket.__flash = FABridge.webSocket.root();
WebSocket.__flash.setCallerUrl(location.href);
+ WebSocket.__flash.setDebug(!!window.WEB_SOCKET_DEBUG);
for (var i = 0; i < WebSocket.__tasks.length; ++i) {
WebSocket.__tasks[i]();
}
@@ -290,22 +358,31 @@
} else {
WebSocket.__tasks.push(task);
}
- }
+ };
+
+ WebSocket.__isFlashLite = function() {
+ if (!window.navigator || !window.navigator.mimeTypes) return false;
+ var mimeType = window.navigator.mimeTypes["application/x-shockwave-flash"];
+ if (!mimeType || !mimeType.enabledPlugin || !mimeType.enabledPlugin.filename) return false;
+ return mimeType.enabledPlugin.filename.match(/flashlite/i) ? true : false;
+ };
// called from Flash
- function webSocketLog(message) {
+ window.webSocketLog = function(message) {
console.log(decodeURIComponent(message));
- }
+ };
// called from Flash
- function webSocketError(message) {
+ window.webSocketError = function(message) {
console.error(decodeURIComponent(message));
- }
+ };
- if (window.addEventListener) {
- window.addEventListener("load", WebSocket.__initialize, false);
- } else {
- window.attachEvent("onload", WebSocket.__initialize);
+ if (!window.WEB_SOCKET_DISABLE_AUTO_INITIALIZATION) {
+ if (window.addEventListener) {
+ window.addEventListener("load", WebSocket.__initialize, false);
+ } else {
+ window.attachEvent("onload", WebSocket.__initialize);
+ }
}
})();
View
@@ -13,7 +13,7 @@
%h1 project sonia
#widgets
:javascript
- WebSocket.__swfLocation = "WebSocketMain.swf";
+ WEB_SOCKET_SWF_LOCATION = "WebSocketMain.swf";
$(document).observe("dom:loaded", function() {
if ("WebSocket" in window) {

0 comments on commit 6962b6d

Please sign in to comment.