Disconnect handling and cleanup of unused code

src/static/js/broadcast.js

@@ -519,81 +519,6 @@ function loadBroadcastJS(socket, sendSocketMsg, fireWhenAllScriptsAreLoaded, Bro
     }
   };
 
-  function handleSocketClosed(params)
-  {
-    debugLog("socket closed!", params);
-    socket = null;
-
-    BroadcastSlider.showReconnectUI();
-    // var reason = appLevelDisconnectReason || params.reason;
-    // var shouldReconnect = params.reconnect;
-    // if (shouldReconnect) {
-    //   // determine if this is a tight reconnect loop due to weird connectivity problems
-    //   // reconnectTimes.push(+new Date());
-    //   var TOO_MANY_RECONNECTS = 8;
-    //   var TOO_SHORT_A_TIME_MS = 10000;
-    //   if (reconnectTimes.length >= TOO_MANY_RECONNECTS &&
-    //       ((+new Date()) - reconnectTimes[reconnectTimes.length-TOO_MANY_RECONNECTS]) <
-    //       TOO_SHORT_A_TIME_MS) {
-    //      setChannelState("DISCONNECTED", "looping");
-    //   }
-    //   else {
-    //      setChannelState("RECONNECTING", reason);
-    //      setUpSocket();
-    //   }
-    // }
-    // else {
-    //   BroadcastSlider.showReconnectUI();
-    //   setChannelState("DISCONNECTED", reason);
-    // }
-  }
-
-  function sendMessage(msg)
-  {
-    socket.postMessage(JSON.stringify(
-    {
-      type: "COLLABROOM",
-      data: msg
-    }));
-  }
-
-
-  function setChannelState(newChannelState, moreInfo)
-  {
-    if (newChannelState != channelState)
-    {
-      channelState = newChannelState;
-      // callbacks.onChannelStateChange(channelState, moreInfo);
-    }
-  }
-
-  function abandonConnection(reason)
-  {
-    if (socket)
-    {
-      socket.onclosed = function()
-      {};
-      socket.onhiccup = function()
-      {};
-      socket.disconnect();
-    }
-    socket = null;
-    setChannelState("DISCONNECTED", reason);
-  }
-
-    /// Since its not used, import 'forEach' has been dropped
-/*window['onloadFuncts'] = [];
-  window.onload = function ()
-  {
-    window['isloaded'] = true;
-    
-
-    forEach(window['onloadFuncts'],function (funct)
-    {
-      funct();
-    });
-  };*/
-
   // to start upon window load, just push a function onto this array
   //window['onloadFuncts'].push(setUpSocket);
   //window['onloadFuncts'].push(function ()
@@ -614,36 +539,19 @@ function loadBroadcastJS(socket, sendSocketMsg, fireWhenAllScriptsAreLoaded, Bro
   // this is necessary to keep infinite loops of events firing,
   // since goToRevision changes the slider position
   var goToRevisionIfEnabledCount = 0;
-  var goToRevisionIfEnabled = function()
+  var goToRevisionIfEnabled = function() {
+    if (goToRevisionIfEnabledCount > 0)
     {
-      if (goToRevisionIfEnabledCount > 0)
+      goToRevisionIfEnabledCount--;
-      {
+    }
-        goToRevisionIfEnabledCount--;
+    else
-      }
+    {
-      else
+      goToRevision.apply(goToRevision, arguments);
-      {
+    }
-        goToRevision.apply(goToRevision, arguments);
+  }
-      }
-      }
-      
-      
-      
-      
       
   BroadcastSlider.onSlider(goToRevisionIfEnabled);
 
-  (function()
-  {
-    for (var i = 0; i < clientVars.initialChangesets.length; i++)
-    {
-      var csgroup = clientVars.initialChangesets[i];
-      var start = clientVars.initialChangesets[i].start;
-      var granularity = clientVars.initialChangesets[i].granularity;
-      debugLog("loading changest on startup: ", start, granularity, csgroup);
-      changesetLoader.handleResponse(csgroup, start, granularity, null);
-    }
-  })();
-
   var dynamicCSS = makeCSSManager('dynamicsyntax');
   var authorData = {};
 

src/static/js/broadcast_slider.js

@@ -23,6 +23,7 @@
  // These parameters were global, now they are injected. A reference to the
  // Timeslider controller would probably be more appropriate.
 var _ = require('./underscore');
+var padmodals = require('./pad_modals').padmodals;
 
 function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded)
 {
@@ -54,11 +55,7 @@ function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded)
         {
           slidercallbacks[i](newval);
         }
-        }
+      }
-        
-        
-        
-        
         
     var updateSliderElements = function()
       {
@@ -68,12 +65,8 @@ function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded)
           savedRevisions[i].css('left', (position * ($("#ui-slider-bar").width() - 2) / (sliderLength * 1.0)) - 1);
         }
         $("#ui-slider-handle").css('left', sliderPos * ($("#ui-slider-bar").width() - 2) / (sliderLength * 1.0));
-        }
+      }  
-        
+
-        
-        
-        
-        
     var addSavedRevision = function(position, info)
       {
         var newSavedRevision = $('<div></div>');
@@ -88,7 +81,7 @@ function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded)
           BroadcastSlider.setSliderPosition(position);
         });
         savedRevisions.push(newSavedRevision);
-        };
+      };
 
     var removeSavedRevision = function(position)
       {
@@ -96,7 +89,7 @@ function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded)
         savedRevisions.remove(element);
         element.remove();
         return element;
-        };
+      };
 
     /* Begin small 'API' */
 
@@ -162,9 +155,9 @@ function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded)
 
     function showReconnectUI()
     {
-      $("#padmain, #rightbars").css('top', "130px");
+      var cls = 'modaldialog cboxdisconnected cboxdisconnected_unknown';
-      $("#timeslider").show();
+      $("#connectionbox").get(0).className = cls;
-      $('#error').show();
+      padmodals.showModal("#connectionbox", 500);
     }
 
     var fixPadHeight = _.throttle(function(){

src/static/js/timeslider.js

@@ -71,6 +71,11 @@ function init() {
       sendSocketMsg("CLIENT_READY", {});
     });
 
+    socket.on('disconnect', function()
+    {
+      BroadcastSlider.showReconnectUI();
+    });
+
     //route the incoming messages
     socket.on('message', function(message)
     {
@@ -96,6 +101,12 @@ function init() {
     } else {
       $("#returnbutton").attr("href", document.location.href.substring(0,document.location.href.lastIndexOf("/")));
     }
+
+    $('button#forcereconnect').click(function()
+    {
+      window.location.reload();
+    });
+
   });
 }
 

src/templates/timeslider.html

@@ -103,7 +103,48 @@
     </div>
   </div>
 
-  <div id="mainmodals"></div>
+  <div id="mainmodals">
+      <% e.begin_block("modals"); %>
+          <div id="connectionbox" class="modaldialog">
+              <div id="connectionboxinner" class="modaldialog-inner">
+                  <div class="connecting">Connecting...</div>
+                  <div class="reconnecting">Reestablishing connection...</div>
+                  <div class="disconnected">
+                      <h2 class="h2_disconnect">Disconnected.</h2>
+                      <h2 class="h2_userdup">Opened in another window.</h2>
+                      <h2 class="h2_unauth">No Authorization.</h2>
+                      <div id="disconnected_looping">
+                          <p><b>We're having trouble talking to the EtherPad lite synchronization server.</b> You may be connecting through an incompatible firewall or proxy server.</p>
+                      </div>
+                      <div id="disconnected_initsocketfail">
+                          <p><b>We were unable to connect to the EtherPad lite synchronization server.</b> This may be due to an incompatibility with your web browser or internet connection.</p>
+                      </div>
+                      <div id="disconnected_userdup">
+                          <p><b>You seem to have opened this pad in another browser window.</b> If you'd like to use this window instead, you can reconnect.</p>
+                      </div>
+                      <div id="disconnected_unknown">
+                          <p><b>Lost connection with the EtherPad lite synchronization server.</b> This may be due to a loss of network connectivity.</p>
+                      </div>
+                      <div id="disconnected_slowcommit">
+                          <p><b>Server not responding.</b> This may be due to network connectivity issues or high load on the server.</p>
+                      </div>
+                      <div id="disconnected_unauth">
+                          <p>Your browser's credentials or permissions have changed while viewing this pad. Try reconnecting.</p>
+                      </div>
+                      <div id="disconnected_deleted">
+                          <p>This pad was deleted.</p>
+                      </div>
+                      <div id="reconnect_advise">
+                          <p>If this continues to happen, please let us know</p>
+                      </div>
+                      <div id="reconnect_form">
+                          <button id="forcereconnect">Reconnect Now</button>
+                      </div>
+                  </div>
+              </div>
+          </div>
+      <% e.end_block(); %>
+  </div>
 
 <!-- export code -->
 <div id="importexport">