session-desktop/js/views/network_status_view.js

(function () {
    'use strict';

    window.Whisper = window.Whisper || {};

    Whisper.NetworkStatusView = Whisper.View.extend({
        className: 'network-status',
        initialize: function() {
            this.$el.hide();

            var renderIntervalHandle = setInterval(this.render.bind(this), 5000);
            extension.windows.onClosed(function () { clearInterval(renderIntervalHandle); });

            setTimeout(this.finishConnectingGracePeriod.bind(this), 5000);

            this.withinConnectingGracePeriod = true;
            this.setSocketReconnectInterval(null);

            window.addEventListener('online', this.render.bind(this));
            window.addEventListener('offline', this.render.bind(this));
        },
        finishConnectingGracePeriod: function() {
            this.withinConnectingGracePeriod = false;
        },
        setSocketReconnectInterval: function(millis) {
            this.socketReconnectWaitDuration = moment.duration(millis);
        },
        navigatorOnLine: function() { return navigator.onLine; },
        getSocketStatus: function() { return window.getSocketStatus(); },
        getNetworkStatus: function() {

            var message = '';
            var instructions = '';
            var hasInterruption = false;

            var socketStatus = this.getSocketStatus();
            switch(socketStatus) {
                case WebSocket.CONNECTING:
                    message = i18n('connecting');
                    this.setSocketReconnectInterval(null);
                    break;
                case WebSocket.OPEN:
                    this.setSocketReconnectInterval(null);
                    break;
                case WebSocket.CLOSING:
                    message = i18n('disconnected');
                    instructions = i18n('checkNetworkConnection');
                    hasInterruption = true;
                break;
                case WebSocket.CLOSED:
                    message = i18n('disconnected');
                    instructions = i18n('checkNetworkConnection');
                    hasInterruption = true;
                break;
            }

            if (socketStatus == WebSocket.CONNECTING && !this.withinConnectingGracePeriod) {
                hasInterruption = true;
            }
            if (this.socketReconnectWaitDuration.asSeconds() > 0) {
                instructions = i18n('attemptingReconnection', [this.socketReconnectWaitDuration.asSeconds()]);
            }
            if (!this.navigatorOnLine()) {
                hasInterruption = true;
                message = i18n('offline');
                instructions = i18n('checkNetworkConnection');
            }

            return {
                message: message,
                instructions: instructions,
                hasInterruption: hasInterruption
            };
        },
        render: function() {
            var status = this.getNetworkStatus();

            if (status.hasInterruption) {
                this.$el.slideDown();
            }
            else {
                this.$el.hide();
            }
            var template = Whisper.View.Templates['networkStatus'];
            this.$el.html(Mustache.render(template, status, Whisper.View.Templates));
            return this;
        }
    });



})();