Use nice editbar popups for connection status instead of srceen-blocking modals.

src/static/js/pad_connectionstatus.js

@@ -21,6 +21,7 @@
  */
 
 var padmodals = require('./pad_modals').padmodals;
+var padeditbar = require('./pad_editbar').padeditbar;
 
 var padconnectionstatus = (function()
 {
@@ -42,15 +43,18 @@ var padconnectionstatus = (function()
       status = {
         what: 'connected'
       };
-      padmodals.hideModal(500);
+      
+      padmodals.showModal('connected');
+      padmodals.hideOverlay(500);
     },
     reconnecting: function()
     {
       status = {
         what: 'reconnecting'
       };
-      $("#connectionbox").get(0).className = 'modaldialog cboxreconnecting';
-      padmodals.showModal("#connectionbox", 500);
+      
+      padmodals.showModal('reconnecting');
+      padmodals.showOverlay(500);
     },
     disconnected: function(msg)
     {
@@ -61,20 +65,15 @@ var padconnectionstatus = (function()
         what: 'disconnected',
         why: msg
       };
+      
       var k = String(msg).toLowerCase(); // known reason why
       if (!(k == 'userdup' || k == 'deleted' || k == 'looping' || k == 'slowcommit' || k == 'initsocketfail' || k == 'unauth'))
       {
-        k = 'unknown';
+        k = 'disconnected';
       }
       
-      var cls = 'modaldialog cboxdisconnected cboxdisconnected_' + k;
-      $("#connectionbox").get(0).className = cls;
-      padmodals.showModal("#connectionbox", 500);
-
-      $('button#forcereconnect').click(function()
-      {
-        window.location.reload();
-      });
+      padmodals.showModal(k);
+      padmodals.showOverlay(500);
     },
     isFullyConnected: function()
     {

src/static/js/pad_editbar.js

@@ -128,6 +128,10 @@ var padeditbar = (function()
         {
               self.toogleDropDown("settings");
         }
+        else if (cmd == 'connectivity')
+        {
+              self.toogleDropDown("connectivity");
+        }
         else if (cmd == 'embed')
         {
           self.setEmbedLinks();
@@ -182,13 +186,14 @@ var padeditbar = (function()
       }
       if(padeditor.ace) padeditor.ace.focus();
     },
-    toogleDropDown: function(moduleName)
+    toogleDropDown: function(moduleName, cb)
     {
-      var modules = ["settings", "importexport", "embed", "users"];
+      var modules = ["settings", "connectivity", "importexport", "embed", "users"];
       
       // hide all modules and remove highlighting of all buttons
       if(moduleName == "none")
       {
+        var returned = false
         for(var i=0;i<modules.length;i++)
         {
           //skip the userlist
@@ -200,9 +205,11 @@ var padeditbar = (function()
           if(module.css('display') != "none")
           {
             $("#" + modules[i] + "link").removeClass("selected");
-            module.slideUp("fast");
+            module.slideUp("fast", cb);
+            returned = true;
           }
         }
+        if(!returned) return cb();
       }
       else 
       {
@@ -220,7 +227,7 @@ var padeditbar = (function()
           else if(modules[i]==moduleName)
           {
             $("#" + modules[i] + "link").addClass("selected");
-            module.slideDown("fast");
+            module.slideDown("fast", cb);
           }
         }
       }

src/static/js/pad_modals.js

@@ -21,6 +21,7 @@
  */
  
 var padutils = require('./pad_utils').padutils;
+var padeditbar = require('./pad_editbar').padeditbar;
 
 var padmodals = (function()
 {
@@ -30,16 +31,15 @@ var padmodals = (function()
     {
       pad = _pad;
     },
-    showModal: function(modalId, duration)
+    showModal: function(messageId)
     {
-      $(".modaldialog").hide();
-      $(modalId).show().css(
-      {
-        'opacity': 0
-      }).animate(
-      {
-        'opacity': 1
-      }, duration);
+      $("#connectivity .visible").removeClass('visible');
+      $("#connectivity ."+messageId).addClass('visible');
+      padeditbar.toogleDropDown("none", function() {
+        padeditbar.toogleDropDown("connectivity");
+      });
+    },
+    showOverlay: function(duration) {
       $("#modaloverlay").show().css(
       {
         'opacity': 0
@@ -48,18 +48,7 @@ var padmodals = (function()
         'opacity': 1
       }, duration);
     },
-    hideModal: function(duration)
-    {
-      padutils.cancelActions('hide-feedbackbox');
-      padutils.cancelActions('hide-sharebox');
-      $("#sharebox-response").hide();
-      $(".modaldialog").animate(
-      {
-        'opacity': 0
-      }, duration, function()
-      {
-        $("#modaloverlay").hide();
-      });
+    hideOverlay: function(duration) {
       $("#modaloverlay").animate(
       {
         'opacity': 0