session-desktop/js/views/network_status_view.js

(function () {
    'use strict';

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

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

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

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

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

            window.addEventListener('online', this.update.bind(this));
            window.addEventListener('offline', this.update.bind(this));

            this.model = new Backbone.Model();
            this.listenTo(this.model, 'change', this.onChange);
        },
        onReconnectTimer: function() {
          this.setSocketReconnectInterval(60000);
        },
        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 action = null;
            var buttonClass = null;

            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');
            } else if (!Whisper.Registration.isDone()) {
                hasInterruption = true;
                message = i18n('Unlinked');
                instructions = i18n('unlinkedWarning');
                action = i18n('relink');
                buttonClass = 'openInstaller';
            }

            return {
                message: message,
                instructions: instructions,
                hasInterruption: hasInterruption,
                action: action,
                buttonClass: buttonClass
            };
        },
        update: function() {
            var status = this.getNetworkStatus();
            this.model.set(status);
        },
        render_attributes: function() {
            return this.model.attributes;
        },
        onChange: function() {
            this.render();
            if (this.model.attributes.hasInterruption) {
                this.$el.slideDown();
            }
            else {
                this.$el.hide();
            }
        }
    });



})();