Revert "Created new offline indicator loosely based on slack"

node_modules/kaefer/lib/client.js

@@ -86,29 +86,27 @@ var connectClient = module.exports = function(connectEio, options) {
         });
     }
 
-    var timer;
+    function reconnect() {
-    function reconnect(delay) {
+        if (isReconnecting)
-        if (isReconnecting && typeof delay !== "number")
             return;
         
         reconnectSocket.setSocket(null);
         connectAttempts += 1;
 
-        if (typeof delay !== "number") {
+        var delay = 250;
-            if (connectAttempts < 10) {
+        if (connectAttempts > 10) {
-                delay = 250;
+            delay = 10 * 1000;
-            }
+        }
-            else {
+        else if (connectAttempts > 5) {
-                delay = Math.min(60000, 250 * Math.pow(2, connectAttempts - 10));
+            delay = 5 * 1000;
-            }
+        }
+        else if (connectAttempts > 3) {
+            delay = 1 * 1000;
         }
 
         isReconnecting = true;
         console.log("Schedule re-connect in: " + delay);
-        socket.emit("reconnectDelay", { delay: delay });
+        setTimeout(function() {
-        
-        clearTimeout(timer);
-        timer = setTimeout(function() {
             isReconnecting = false;
             connect();
         }, delay);

plugins/c9.core/c9.js

@@ -57,7 +57,7 @@ define(function(require, module, exports) {
             }, plugin);
             
             vfs.on("disconnect", function(reason) {
-                setStatus(state & ~STORAGE & ~PROCESS & ~NETWORK);
+                setStatus(status & ~STORAGE & ~PROCESS & ~NETWORK);
                 emit("disconnect");
             }, plugin);
         
@@ -67,7 +67,7 @@ define(function(require, module, exports) {
             }, plugin);
             
             vfs.on("error", function(message) {
-                setStatus(state & ~STORAGE & ~PROCESS);
+                setStatus(status & ~STORAGE & ~PROCESS);
                 // TODO: Don't display all errors?
                 if (emit("showerrormessage", message) !== false) {
                     console.error(

plugins/c9.ide.dialog.common/error.css

@@ -1,23 +1,18 @@
-.errorlabel, .disconnectlabel{
+.errorlabel{
     position: absolute;
     left: 0;
     right: 0;
     top: 0;
     z-index: 10000000;
-    /*text-align: center;*/
+    text-align: center;
     pointer-events: none;
     .font-smoothing(@error-font-smoothing);
 }
-.errorlabel.anim, .disconnectlabel.anim{
+.errorlabel.anim{
     transition: top 0.2s;
     -moz-transition: top 0.2s; /* Gecko */
     -webkit-transition: top 0.2s; /* Safari */
 }
-.errorlabel.fade-in{
-    transition: opacity 0.2s;
-    -moz-transition: opacity 0.2s; /* Gecko */
-    -webkit-transition: opacity 0.2s; /* Safari */
-}
 .errorlabel div{
     background: @error-background;
     padding: @error-padding;
@@ -31,9 +26,6 @@
     max-width: 100%;
     pointer-events: auto;
 }
-.errorlabel.fade-in div{
-    border-radius: 3px;
-}
 .errorlabel u.close{
     .image-2x("@{image-path}/@{error-close-image}", 42px, 28px);
     background-position: @error-close-idle-position;
@@ -41,7 +33,7 @@
     height: 14px;
     position: absolute;
     right: 8px;
-    top: 6px;
+    top: 8px;
     cursor: pointer;
 }
 .errorlabel u.close:hover{
@@ -53,25 +45,4 @@
 .errorlabel div span{
     border-bottom: 1px dotted rgb(255, 174, 174);
     cursor: help;
-}
-
-.disconnectlabel{
-    z-index: 10000001;
-}
-.disconnectlabel div{
-    background: @disconnect-background;
-    padding: @disconnect-padding;
-    color: @disconnect-color;
-    border-radius: 0 0 3px 3px;
-    box-shadow: @disconnect-box-shadow;
-    line-height: 1.4;
-    display: inline-block;
-    position: relative;
-    word-wrap: break-word;
-    text-align: center;
-    width: 300px;
-    pointer-events: auto;
-}
-.disconnectlabel u{
-    cursor: pointer;
 }

plugins/c9.ide.dialog.common/error.js

@@ -12,72 +12,22 @@ define(function(require, exports, module) {
         /***** Initialization *****/
         
         var plugin = new Plugin("Ajax.org", main.consumes);
-        var emit = plugin.getEmitter();
         
         var topPx = 0;
+        var error, hideTimeout;
         var lastCookie = 0;
-        var offset = 0;
-        var error, hideTimeout, disconnect;
-        
-        var DISCONNECTDELAY = 1000;
         
+        var loaded = false;
         function load() {
+            if (loaded) return false;
+            loaded = true;
+            
             ui.insertCss(require("text!./error.css"), 
                 options.staticPrefix, plugin);
         }
         
-        function initDisconnectEvents(vfs){
-            var timer;
-            
-            vfs.once("connect", function(){
-                vfs.connection.on("reconnectDelay", function(e){
-                    clearInterval(timer);
-                    
-                    var delay = e.delay;
-                    if (delay > 999) {
-                        timer = setInterval(function(){
-                            if (vfs.connected)
-                                return clearInterval(timer);
-                            
-                            delay -= 1000;
-                            showDisconnect({ delay: delay });
-                            
-                            if (delay <= 0)
-                                clearInterval(timer);
-                        }, 1000);
-                    }
-                    
-                    showDisconnect(e);
-                });
-            });
-            vfs.on("connect", function(){
-                hideDisconnect();
-            });
-            vfs.on("disconnect", function(){
-                // setTimeout(function(){
-                //     showDisconnect();
-                // }, DISCONNECTDELAY);
-            });
-            vfs.on("connecting", function(){
-                showDisconnect({ connecting: true });
-            });
-            plugin.on("retryConnect", function(){
-                vfs.connection.reconnect(0);
-            });
-        }
-        
         /***** Methods *****/
 
-        function getCenterX(){
-            var bartools = document.querySelector(".bartools");
-            if (!bartools) return 0; // For testing
-            
-            var b1 = bartools.getBoundingClientRect();
-            var b2 = bartools.nextSibling.getBoundingClientRect();
-            
-            return b1.left + b1.width + ((b2.left - b1.left - b1.width)/2);
-        }
-
         function show(message, timeout) {
             // Error message container
             if (!error) {
@@ -113,21 +63,18 @@ define(function(require, exports, module) {
                 error.innerHTML = "<div><u class='close'></u>" 
                     + messageString + "</div>";
                     
-                error.style.opacity = 0;
                 error.style.display = "block";
-                error.style.top = (offset - (error.offsetHeight - 10 + topPx)) + "px";
+                error.style.top = (-1 * error.offsetHeight - 10 + topPx) + "px";
-                error.firstChild.style.marginLeft = Math.max(0, (getCenterX() - (error.firstChild.offsetWidth / 2))) + "px";
                 
                 // Start anim
                 setTimeout(function() {
-                    error.className = "errorlabel anim " + (offset > 0 ? "fade-in" : "");
+                    error.className = "errorlabel anim";
-                    error.style.top = (offset + topPx) + "px";
+                    error.style.top = topPx + "px";
-                    error.style.opacity = 1;
                 }, 10);
                 
                 clearTimeout(hideTimeout);
                 if (!(timeout < 0))
-                    hideTimeout = setTimeout(hide, timeout || 15000);
+                    setTimeout(hide, timeout || 15000);
             });
             
             return ++lastCookie;
@@ -142,96 +89,19 @@ define(function(require, exports, module) {
             if (!error || error.style.display === "none")
                 return callback && callback();
             
-            error.className = "errorlabel anim " + (offset > 0 ? "fade-in" : "");
+            error.className = "errorlabel anim";
-            if (offset > 0)
+            error.style.top = (-1 * error.offsetHeight - 10 + topPx) + "px";
-                error.style.opacity = 0;
-            else
-                error.style.top = (-1 * error.offsetHeight - 10 + topPx) + "px";
-            
             setTimeout(function() {
                 error.style.display = "none";
                 callback && callback();
             }, 220);
         }
         
-        function showDisconnect(options){
-            // Error message container
-            if (!disconnect) {
-                disconnect = document.body.appendChild(document.createElement("div"));
-                disconnect.className = "disconnectlabel";
-                disconnect.addEventListener("mouseup", function(e) {
-                    if (e.target.tagName == "U")
-                        emit("retryConnect");
-                });
-            }
-                
-            var message;
-            if (!options || options.delay < 1000 || options.connecting)
-                message = "Reconnecting...";
-            else if (options.delay)
-                message = "Reconnecting in " + Math.ceil(options.delay/1000) 
-                    + " seconds." 
-                    + (options.delay < 2001 ? "" : " <u>Retry Now.</u>");
-            else
-                message = "Reconnecting...";
-            
-            disconnect.innerHTML = "<div>" + message + "</div>";
-            disconnect.firstChild.style.marginLeft 
-                = Math.max(0, (getCenterX() - 150)) + "px";
-            
-            if (disconnect.style.display == "block")
-                return;
-                
-            disconnect.style.display = "block";
-            disconnect.style.top = (-1 * disconnect.offsetHeight - 10 + topPx) + "px";
-            
-            // Start anim
-            setTimeout(function() {
-                disconnect.className = "disconnectlabel anim";
-                disconnect.style.top = (topPx) + "px";
-            }, 10);
-            
-            offset = 28;
-            
-            // document.querySelector(".c9-offline").addEventListener("click", function(){
-            //     alert("Offline Notication", "You are currently offline.", 
-            //       "This indicator notifies you that Cloud9 is unable to reach "
-            //       + "the server. This usually happens because you are offline. "
-            //       + "Some features will be disabled until the "
-            //       + "network connection becomes available again. "
-            //       + "This notication could also show when the server is "
-            //       + "unreachable due to other reasons. Sometimes a refresh of "
-            //       + "the tab will fix an issue. Please e-mail "
-            //       + "support@c9.io for further problem resolution.");
-            // }, false);
-        }
-        
-        function hideDisconnect(cookie, callback) {
-            if (!disconnect || disconnect.style.display === "none")
-                return callback && callback();
-            
-            disconnect.className = "disconnectlabel anim";
-            disconnect.style.top = (-1 * disconnect.offsetHeight - 10 + topPx) + "px";
-            setTimeout(function() {
-                disconnect.style.display = "none";
-                callback && callback();
-            }, 220);
-            
-            offset = 0;
-        }
-        
         /***** Lifecycle *****/
         
         plugin.on("load", function() {
             load();
         });
-        plugin.on("unload", function() {
-            topPx = 0;
-            lastCookie = 0;
-            offset = 0;
-            error = null;
-            hideTimeout = null;
-        });
         
         /***** Register and define API *****/
         
@@ -246,19 +116,6 @@ define(function(require, exports, module) {
             get top(){ return topPx; },
             set top(value){ topPx = value; },
             
-            get vfs(){ throw new Error("Permission Denied"); },
-            set vfs(v){ initDisconnectEvents(v); },
-            
-            /**
-             * 
-             */
-            showDisconnect: showDisconnect,
-            
-            /**
-             * 
-             */
-            hideDisconnect: hideDisconnect,
-            
             /**
              * Displays an error message in the main error reporting UI.
              * @param {String} message  The message to display.

plugins/c9.ide.layout.classic/layout.js

@@ -8,11 +8,11 @@ define(function(require, exports, module) {
 
     function main(options, imports, register) {
         var c9 = imports.c9;
+        var alert = imports["dialog.alert"].show;
         var Plugin = imports.Plugin;
+        var question = imports["dialog.question"];
         var settings = imports.settings;
         var commands = imports.commands;
-        var alert = imports["dialog.alert"].show;
-        var question = imports["dialog.question"];
         var preload = imports["layout.preload"];
         var anims = imports.anims;
         var ui = imports.ui;
@@ -126,6 +126,33 @@ define(function(require, exports, module) {
                 img.src = options.staticPrefix + "/images/" + p;
             });
             
+            var hideOffline;
+            c9.on("stateChange", function(e) {
+                // Online
+                if (e.state & c9.NETWORK && e.state & c9.STORAGE) {
+                    hideOffline && hideOffline();
+                }
+                // Offline
+                else if (!hideOffline || hideOffline.hasClosed()) {
+                    hideOffline = notify("<div class='c9-offline'>No internet "
+                        + "connection detected. Cloud9 will automatically try to "
+                        + "reconnect when it detects an internet connection."
+                        + "</div>", true, 1000);
+                    
+                    document.querySelector(".c9-offline").addEventListener("click", function(){
+                        alert("Offline Notication", "You are currently offline.", 
+                          "This indicator notifies you that Cloud9 is unable to reach "
+                          + "the server. This usually happens because you are offline. "
+                          + "Some features will be disabled until the "
+                          + "network connection becomes available again. "
+                          + "This notication could also show when the server is "
+                          + "unreachable due to other reasons. Sometimes a refresh of "
+                          + "the tab will fix an issue. Please e-mail "
+                          + "support@c9.io for further problem resolution.");
+                    }, false);
+                }
+            });
+            
             window.addEventListener("resize", resize, false);
             window.addEventListener("focus", resize, false);
             
@@ -515,21 +542,6 @@ define(function(require, exports, module) {
             window.removeEventListener("resize", resize);
             
             if (removeTheme) removeTheme();
-            
-            logobar = null;
-            removeTheme = null;
-            theme = null;
-            c9console = null;
-            menus = null;
-            tabManager = null;
-            panels = null;
-            userLayout = null;
-            ignoreTheme = null;
-            notify = null;
-            hideFlagUpdate = null;
-            activeFindArea = null;
-            defaultFindArea = null;
-            activating = null;
         });
         
         /***** Register and define API *****/

plugins/c9.ide.layout.classic/themes/default-dark-gray.less

@@ -632,12 +632,6 @@
 @error-close-hover-position: -14px -14px;
 @error-close-active-position: -28px -14px;
 
-// Disconnect Dialog
-@disconnect-background: #D8B112;
-@disconnect-color: @error-color;
-@disconnect-padding: @error-padding;
-@disconnect-box-shadow: @error-box-shadow;
-
 // Offline Dialog
 @offline-gradient: linear-gradient(top, rgb(60, 112, 153) 0%, rgb(61, 97, 126) 100%);
 @offline-border-bottom: 1px solid rgba(0, 0, 0, 0.61);

plugins/c9.ide.layout.classic/themes/default-dark.less

@@ -632,12 +632,6 @@
 @error-close-hover-position: -14px -14px;
 @error-close-active-position: -28px -14px;
 
-// Disconnect Dialog
-@disconnect-background: #D8B112;
-@disconnect-color: @error-color;
-@disconnect-padding: @error-padding;
-@disconnect-box-shadow: @error-box-shadow;
-
 // Offline Dialog
 @offline-gradient: linear-gradient(top, rgb(60, 112, 153) 0%, rgb(61, 97, 126) 100%);
 @offline-border-bottom: 1px solid rgba(0, 0, 0, 0.61);

plugins/c9.ide.layout.classic/themes/default-flat-light.less

@@ -632,12 +632,6 @@
 @error-close-hover-position: -14px -14px;
 @error-close-active-position: -28px -14px;
 
-// Disconnect Dialog
-@disconnect-background: #D8B112;
-@disconnect-color: @error-color;
-@disconnect-padding: @error-padding;
-@disconnect-box-shadow: @error-box-shadow;
-
 // Offline Dialog
 @offline-gradient: linear-gradient(top, #3d9ac4 0%, #3d9ac4 100%);
 @offline-border-bottom: 0;

plugins/c9.ide.layout.classic/themes/default-light-gray.less

@@ -632,12 +632,6 @@
 @error-close-hover-position: -14px -14px;
 @error-close-active-position: -28px -14px;
 
-// Disconnect Dialog
-@disconnect-background: #D8B112;
-@disconnect-color: @error-color;
-@disconnect-padding: @error-padding;
-@disconnect-box-shadow: @error-box-shadow;
-
 // Offline Dialog
 @offline-gradient: linear-gradient(top, rgb(60, 112, 153) 0%, rgb(61, 97, 126) 100%);
 @offline-border-bottom: 1px solid rgba(0, 0, 0, 0.61);

plugins/c9.ide.layout.classic/themes/default-light.less

@@ -632,12 +632,6 @@
 @error-close-hover-position: -14px -14px;
 @error-close-active-position: -28px -14px;
 
-// Disconnect Dialog
-@disconnect-background: #D8B112;
-@disconnect-color: @error-color;
-@disconnect-padding: @error-padding;
-@disconnect-box-shadow: @error-box-shadow;
-
 // Offline Dialog
 @offline-gradient: linear-gradient(top, rgb(60, 112, 153) 0%, rgb(61, 97, 126) 100%);
 @offline-border-bottom: 1px solid rgba(0, 0, 0, 0.61);

plugins/c9.vfs.client/vfs_client.js

@@ -30,9 +30,8 @@ define(function(require, exports, module) {
         var Plugin = imports.Plugin;
         var auth = imports.auth;
         var vfsEndpoint = imports["vfs.endpoint"];
-        var errorDialog = imports["dialog.error"];
+        var showError = imports["dialog.error"].show;
-        var showError = errorDialog.show;
+        var hideError = imports["dialog.error"].hide;
-        var hideError = errorDialog.hide;
         var showAlert = imports["dialog.alert"].show;
         
         var eio = require("engine.io");
@@ -50,9 +49,6 @@ define(function(require, exports, module) {
         var plugin = new Plugin("Ajax.org", main.consumes);
         var emit = plugin.getEmitter();
         
-        // Give reference to vfs to plugin
-        errorDialog.vfs = plugin;
-        
         var buffer = [];
         var installChecked = false;
         var withInstall = options.withInstall;
@@ -334,22 +330,6 @@ define(function(require, exports, module) {
         });
         plugin.on("unload", function(){
             loaded = false;
-            
-            id = null;
-            buffer = [];
-            installChecked = false;
-            region = null;
-            vfsBaseUrl = null;
-            homeUrl = null;
-            projectUrl = null;
-            pingUrl = null;
-            serviceUrl = null;
-            eioOptions = null;
-            consumer = null;
-            vfs = null;
-            showErrorTimer = null;
-            showErrorTimerMessage = null;
-            lastError = null;
         });
         
         /***** Register and define API *****/