add sync and async preconnect

KERRY.md

@@ -3,7 +3,7 @@
 ## Linux 编译
 
 ```
-https://github.com/emscripten-core/emsdk.git
+git clone https://github.com/emscripten-core/emsdk.git
 cd emsdk
 # 下面的版本查看 build.sh 中的注释查看
 ./emsdk install 1.38.47
@@ -27,9 +27,11 @@ npm install uglify-js -g
 
 #### 添加函数
 
-- onWsPreConnection: function(wsId, oldUrl) { return oldUrl ; } 在websocket 连接之前调用,返回return oldUrl ; } 在websocket 连接之前调用,返回计算后的新 `URL`
+- onWsPreConnectionAsync: function(wsId, oldUrl, callback) { callback(newUrl); } 在websocket 连接之前调用, 在websocket 连接之前调用,回调计算后的新 `URL` ,异步方式 
   - wsId: 手动指定的.
   - oldUrl: 旧的URL
+  - callback(newUrl): 原型: function(newUrl){},在websocket 连接之前调用,回调计算后的新 `URL`
+- onWsPreConnection: function(wsId, oldUrl) { return newUrl; } 在websocket 连接之前调用,返回return oldUrl ; } 在websocket 连接之前调用,返回计算后的新 `URL` ,同步方式 
 - onWsOpen: function(){}  websocket连接成功后,调用
 - onWsClose: function (isReconnect) : websocket 断开后调用,
   - isReconnect: 为是否会重新连接

src/websocket.js

@@ -25,14 +25,16 @@ JSMpeg.Source.WebSocket = (function () {
 
     // by kerry
     this.wsId = options.wsId;
-    this.onWsPreConnection =
-      options.onWsPreConnection !== undefined
-        ? options.onWsPreConnection
-        : function (wsId, url) {
-            return url;
-          };
+    this.onWsPreConnection = options.onWsPreConnection;
+    if (options.onWsPreConnection === undefined) {
+      this.onWsPreConnectionAsync = options.onWsPreConnectionAsync;
+    }
     this.onWsOpen =
       options.onWsOpen === undefined ? function () {} : options.onWsOpen;
+    this.onWsError =
+      options.onWsError === undefined
+        ? function (isReconnect) {}
+        : options.onWsError;
     this.onWsClose =
       options.onWsClose !== undefined
         ? options.onWsClose
@@ -51,21 +53,38 @@ JSMpeg.Source.WebSocket = (function () {
 
   WSSource.prototype.start = function () {
     // update kerry
-    var temp = this.onWsPreConnection(this.wsId, this.url);
-    if (temp !== undefined) {
-      this.url = temp;
+    if (this.onWsPreConnectionAsync !== undefined) {
+      // this.url = this.onWsPreConnection(this.wsId, this.url);
+      var that = this;
+      that.onWsPreConnectionAsync(that.wsId, that.url, function (newUrl) {
+        that.url = newUrl;
+
+        that.shouldAttemptReconnect = !!that.reconnectInterval;
+        that.progress = 0;
+        that.established = false;
+
+        that.socket = new WebSocket(that.url, that.options.protocols || null);
+        that.socket.binaryType = "arraybuffer";
+        that.socket.onmessage = that.onMessage.bind(that);
+        that.socket.onopen = that.onOpen.bind(that);
+        that.socket.onerror = that.onError.bind(that);
+        that.socket.onclose = that.onClose.bind(that);
+      });
+    } else {
+      if (this.onWsPreConnection !== undefined) {
+        this.url = this.onWsPreConnection(this.wsId, this.url);
+      }
+      this.shouldAttemptReconnect = !!this.reconnectInterval;
+      this.progress = 0;
+      this.established = false;
+
+      this.socket = new WebSocket(this.url, this.options.protocols || null);
+      this.socket.binaryType = "arraybuffer";
+      this.socket.onmessage = this.onMessage.bind(this);
+      this.socket.onopen = this.onOpen.bind(this);
+      this.socket.onerror = this.onError.bind(this);
+      this.socket.onclose = this.onClose.bind(this);
     }
-
-    this.shouldAttemptReconnect = !!this.reconnectInterval;
-    this.progress = 0;
-    this.established = false;
-
-    this.socket = new WebSocket(this.url, this.options.protocols || null);
-    this.socket.binaryType = "arraybuffer";
-    this.socket.onmessage = this.onMessage.bind(this);
-    this.socket.onopen = this.onOpen.bind(this);
-    this.socket.onerror = this.onClose.bind(this);
-    this.socket.onclose = this.onClose.bind(this);
   };
 
   WSSource.prototype.resume = function (secondsHeadroom) {
@@ -93,6 +112,21 @@ JSMpeg.Source.WebSocket = (function () {
     }
   };
 
+  WSSource.prototype.onError = function () {
+    // update kerry
+    this.onWsError(this.shouldAttemptReconnect);
+
+    if (this.shouldAttemptReconnect) {
+      clearTimeout(this.reconnectTimeoutId);
+      this.reconnectTimeoutId = setTimeout(
+        function () {
+          this.start();
+        }.bind(this),
+        this.reconnectInterval * 1000
+      );
+    }
+  };
+
   WSSource.prototype.onMessage = function (ev) {
     var isFirstChunk = !this.established;
     this.established = true;

view-stream.html

@@ -19,10 +19,11 @@
       var player = new JSMpeg.Player("DynamicWebsocketUrl", {
         canvas: canvas,
         wsId: "websocketID",
-        onWsPreConnection: function (wsId, url) {
+        reconnectInterval: 10,
+        onWsPreConnection: function (wsId, url, callback) {
           console.log(wsId);
           console.log(url);
-          return "ws://127.0.0.1:8082/live/test";
+          callback("ws://127.0.0.1:8082/live/test");
         },
         onWsOpen: function () {
           console.log("connection success!!");