signal-desktop/js/views/settings_view.js

/* global storage: false */
/* global textsecure: false */
/* global i18n: false */
/* global Whisper: false */

/* eslint-disable */

(function () {
    'use strict';
    window.Whisper = window.Whisper || {};
    const { Database } = window.Whisper;
    const { OS, Logs } = window.Signal;
    const { Settings } = window.Signal.Types;

    var CheckboxView = Whisper.View.extend({
        initialize: function(options) {
            this.name = options.name;
            this.defaultValue = options.defaultValue;
            this.event = options.event;
            this.populate();
        },
        events: {
            'change': 'change'
        },
        change: function(e) {
            var value = e.target.checked;
            storage.put(this.name, value);
            console.log(this.name, 'changed to', value);
            if (this.event) {
                this.$el.trigger(this.event);
            }
        },
        populate: function() {
            var value = storage.get(this.name, this.defaultValue);
            this.$('input').prop('checked', !!value);
        },
    });
    var RadioButtonGroupView = Whisper.View.extend({
        initialize: function(options) {
            this.name = options.name;
            this.defaultValue = options.defaultValue;
            this.event = options.event;
            this.populate();
        },
        events: {
            'change': 'change'
        },
        change: function(e) {
            var value = this.$(e.target).val();
            storage.put(this.name, value);
            console.log(this.name, 'changed to', value);
            if (this.event) {
                this.$el.trigger(this.event);
            }
        },
        populate: function() {
            var value = storage.get(this.name, this.defaultValue);
            this.$('#' + this.name + '-' + value).attr('checked', 'checked');
        },
    });
    Whisper.SettingsView = Whisper.View.extend({
        className: 'settings modal expand',
        templateName: 'settings',
        initialize: function() {
            this.deviceName = textsecure.storage.user.getDeviceName();
            this.render();
            new RadioButtonGroupView({
                el: this.$('.notification-settings'),
                defaultValue: 'message',
                name: 'notification-setting'
            });
            new RadioButtonGroupView({
                el: this.$('.theme-settings'),
                defaultValue: 'android',
                name: 'theme-setting',
                event: 'change-theme'
            });
            if (Settings.isAudioNotificationSupported()) {
                new CheckboxView({
                    el: this.$('.audio-notification-setting'),
                    defaultValue: false,
                    name: 'audio-notification'
                });
            }
            new CheckboxView({
                el: this.$('.menu-bar-setting'),
                defaultValue: false,
                name: 'hide-menu-bar',
                event: 'change-hide-menu'
            });
            if (textsecure.storage.user.getDeviceId() != '1') {
                var syncView = new SyncView().render();
                this.$('.sync-setting').append(syncView.el);
            }
        },
        events: {
            'click .close': 'remove',
            'click .clear-data': 'onClearData',
        },
        render_attributes: function() {
            return {
              deviceNameLabel: i18n('deviceName'),
              deviceName: this.deviceName,
              theme: i18n('theme'),
              notifications: i18n('notifications'),
              notificationSettingsDialog: i18n('notificationSettingsDialog'),
              settings: i18n('settings'),
              disableNotifications: i18n('disableNotifications'),
              nameAndMessage: i18n('nameAndMessage'),
              noNameOrMessage: i18n('noNameOrMessage'),
              nameOnly: i18n('nameOnly'),
              audioNotificationDescription: i18n('audioNotificationDescription'),
              isAudioNotificationSupported: Settings.isAudioNotificationSupported(),
              themeAndroidDark: i18n('themeAndroidDark'),
              hideMenuBar: i18n('hideMenuBar'),
              clearDataHeader: i18n('clearDataHeader'),
              clearDataButton: i18n('clearDataButton'),
              clearDataExplanation: i18n('clearDataExplanation'),
            };
        },
        onClearData: function() {
            var clearDataView = new ClearDataView().render();
            $('body').append(clearDataView.el);
        },
    });

    /* jshint ignore:start */
    /* eslint-enable */

  const CLEAR_DATA_STEPS = {
    CHOICE: 1,
    DELETING: 2,
  };
  const ClearDataView = Whisper.View.extend({
    templateName: 'clear-data',
    className: 'full-screen-flow overlay',
    events: {
      'click .cancel': 'onCancel',
      'click .delete-all-data': 'onDeleteAllData',
    },
    initialize() {
      this.step = CLEAR_DATA_STEPS.CHOICE;
    },
    onCancel() {
      this.remove();
    },
    async onDeleteAllData() {
      console.log('Deleting everything!');
      this.step = CLEAR_DATA_STEPS.DELETING;
      this.render();

      try {
        await Database.close();
        console.log('All database connections closed. Starting delete.');
      } catch (error) {
        console.log('Something went wrong closing all database connections.');
      }

      this.clearAllData();
    },
    async clearAllData() {
      try {
        await Promise.all([
          Logs.deleteAll(),
          Database.drop(),
        ]);
      } catch (error) {
        console.log(
          'Something went wrong deleting all data:',
          error && error.stack ? error.stack : error
        );
      }
      window.restart();
    },
    render_attributes() {
      return {
        isStep1: this.step === CLEAR_DATA_STEPS.CHOICE,
        header: i18n('deleteAllDataHeader'),
        body: i18n('deleteAllDataBody'),
        cancelButton: i18n('cancel'),
        deleteButton: i18n('deleteAllDataButton'),

        isStep2: this.step === CLEAR_DATA_STEPS.DELETING,
        deleting: i18n('deleteAllDataProgress'),
      };
    },
  });

    /* eslint-disable */
    /* jshint ignore:end */

    var SyncView = Whisper.View.extend({
        templateName: 'syncSettings',
        className: 'syncSettings',
        events: {
            'click .sync': 'sync'
        },
        enable: function() {
            this.$('.sync').text(i18n('syncNow'));
            this.$('.sync').removeAttr('disabled');
        },
        disable: function() {
            this.$('.sync').attr('disabled', 'disabled');
            this.$('.sync').text(i18n('syncing'));
        },
        onsuccess: function() {
            storage.put('synced_at', Date.now());
            console.log('sync successful');
            this.enable();
            this.render();
        },
        ontimeout: function() {
            console.log('sync timed out');
            this.$('.synced_at').hide();
            this.$('.sync_failed').show();
            this.enable();
        },
        sync: function() {
            this.$('.sync_failed').hide();
            if (textsecure.storage.user.getDeviceId() != '1') {
                this.disable();
                var syncRequest = window.getSyncRequest();
                syncRequest.addEventListener('success', this.onsuccess.bind(this));
                syncRequest.addEventListener('timeout', this.ontimeout.bind(this));
            } else {
                console.log("Tried to sync from device 1");
            }
        },
        render_attributes: function() {
            var attrs = {
                sync: i18n('sync'),
                syncNow: i18n('syncNow'),
                syncExplanation: i18n('syncExplanation'),
                syncFailed: i18n('syncFailed')
            };
            var date = storage.get('synced_at');
            if (date) {
                date = new Date(date);
                attrs.lastSynced = i18n('lastSynced');
                attrs.syncDate = date.toLocaleDateString();
                attrs.syncTime = date.toLocaleTimeString();
            }
            return attrs;
        }
    });
})();