Ws fix

gamestarter.js

@@ -9,7 +9,10 @@ var connectMsg = "connected";
 
 var onOpenLogM = "Connected to " + WS_START + ip + ":" + port;
 
-var NUM_CONNECTED = 0;
+var NUM_CONNECTED = 0,
+    RETRY_TIME = 500,
+    RETRIES = 5,
+    RETRY_FAIL_MSG = "There is trouble connecting to the server, it might not be running or having other comunication errors.\nTry fixing the problem and pressing the message below to try again";
 
 
 
@@ -35,41 +38,77 @@ var checkIfPlayable = function(){
     }
 }
 
-var ws = new WebSocket(WS_START + ip + ":" + port);
-ws.addEventListener("open", function(event){
-    NUM_CONNECTED++
-    checkIfPlayable();
-    littleConsole.innerHTML = "Connected to websocket!";
-});
-
-ws.addEventListener("message", function(event){
-    console.log(event.data);
-    if(event.data == portP1 + " " + connectMsg){
-        p1Text.innerHTML = "P1 Connected!";
-        NUM_CONNECTED++;
-        checkIfPlayable();
-    }
-    else if(event.data == portP2 + " " + connectMsg){
-        p2Text.innerHTML = "P2 Connected!";
-        NUM_CONNECTED++;
-        checkIfPlayable();
-    }
-    else if((/\d{4} .\d*\.\d*/g).test(event.data)){
-        // First get first four digits
-        var inPort = parseInt(event.data.substring(0,4));
-        var angle = parseFloat(event.data.substring((inPort + " ").length));
-
-        var speedRad = 20/(90);
-
-        var speed = angle * speedRad;
-
-        switch(inPort){
-            case (portP1):
-                platformL.setVelocity(speed);
-                break;
-            case (portP2):
-                platformR.setVelocity(speed);
-                break;
+var wsFailed;
+var start = function(){
+    wsFailed=false;
+    littleConsole.textContent = "Connecting to websocket...";
+    littleConsole.classList.remove('fail');
+
+    var conectionError = function(){
+        var tries = 0;
+        return function(exeption){
+            console.warn("connection failed");
+            if(++tries>=RETRIES){
+                //well, this is not gonna work...
+                wsFailed=true;
+                littleConsole.textContent = "Failed to connect to websocket :(";
+                littleConsole.classList.add('fail');
+                alert(RETRY_FAIL_MSG);
+            }else{
+                //catch failed do the try again
+                window.setTimeout(openWS,RETRY_TIME);
+            }
         }
-    }
-});
+    }();
+    var openWS = function(){
+        var ws = new WebSocket(WS_START + ip + ":" + port);
+        ws.addEventListener("error", conectionError);
+        ws.addEventListener("open", function(event){
+            //prevent the conectionError function from running att websocet closing
+            this.removeEventListener("error", conectionError);
+            //clear memory
+            conectionError=null;
+
+            NUM_CONNECTED++
+            checkIfPlayable();
+            littleConsole.textContent = "Connected to websocket!";
+        });
+
+        ws.addEventListener("message", function(event){
+            console.log(event.data);
+            if(event.data == portP1 + " " + connectMsg){
+                p1Text.textContent = "P1 Connected!";
+                NUM_CONNECTED++;
+                checkIfPlayable();
+            }
+            else if(event.data == portP2 + " " + connectMsg){
+                p2Text.textContent = "P2 Connected!";
+                NUM_CONNECTED++;
+                checkIfPlayable();
+            }
+            else if((/\d{4} .\d*\.\d*/g).test(event.data)){
+                // First get first four digits
+                var inPort = parseInt(event.data.substring(0,4));
+                var angle = parseFloat(event.data.substring((inPort + " ").length));
+
+                var speedRad = 20/(90);
+
+                var speed = angle * speedRad;
+
+                switch(inPort){
+                    case (portP1):
+                        platformL.setVelocity(speed);
+                        break;
+                    case (portP2):
+                        platformR.setVelocity(speed);
+                        break;
+                }
+            }
+        });
+    };
+    openWS();
+};
+start();
+document.getElementById("littleConsole").addEventListener('click',function(){
+    if(wsFailed)start();
+});

index.html

@@ -20,7 +20,7 @@
                 <div id="qr2" class="qrCode"></div><br>
                 <span id="p2">Spelare 2</span>
             </div>
-            <p id="littleConsole">Connecting to websocket...</p>
+            <p id="littleConsole">Awaiting script execution...</p>
             <span id="notes">Gjord av aka.Proxy.<br><u>Github</u></span>
             <div id="startBtn">STARTA</div>
         </div>

style.css

@@ -61,6 +61,9 @@ body{
 #littleConsole {
     padding-top: 3em;
 }
+#littleConsole.fail {
+    cursor: pointer;
+}
 #notes {
     display: inline-block;
     text-align: right;