Added display of message ttl in settings.

Fixed setting message ttl.

_locales/en/messages.json

@@ -1079,6 +1079,14 @@
     "message": "Enable the sending and receiving of read receipts",
     "description": "Description of the read receipts setting"
   },
+  "messageTTL": {
+    "message": "Message TTL",
+    "description": "Title of the Message TTL setting"
+  },
+  "messageTTLSettingDescription": {
+    "message": "Time to live in hours (min: 12, max: 96)",
+    "description": "Description of the time to live setting"
+  },
   "notificationSettingsDialog": {
     "message": "When messages arrive, display notifications that reveal:",
     "description": "Explain the purpose of the notification settings"

js/background.js

@@ -248,7 +248,8 @@
       },
       setMessageTTL: value => {
         // Make sure the ttl is between a given range and is valid
-        const ttl = (typeof value !== 'number') ? 24 : value;
+        const intValue = parseInt(value, 10);
+        const ttl = Number.isNaN(intValue) ? 24 :  intValue;
         const current = Math.max(MIN_MESSAGE_TTL, Math.min(ttl, MAX_MESSAGE_TTL));
         storage.put('message-ttl', current);
       },

js/views/settings_view.js

@@ -50,6 +50,25 @@
     },
   });
 
+  const MessageTTLSettingView = Whisper.View.extend({
+    initialize(options) {
+      this.value = options.value;
+      this.setFn = options.setFn;
+      this.populate();
+    },
+    events: {
+      change: 'change',
+    },
+    change(e) {
+      this.value = e.target.value;
+      this.setFn(this.value);
+      window.log.info('message-ttl-setting changed to', this.value);
+    },
+    populate() {
+      this.$('input').val(this.value);
+    },
+  });
+
   const ReadReceiptSettingView = Whisper.View.extend({
     initialize(options) {
       this.value = options.value;
@@ -141,6 +160,11 @@
         value: window.initialData.readReceiptSetting,
         setFn: window.setReadReceiptSetting,
       });
+      new MessageTTLSettingView({
+        el: this.$('.message-ttl-setting'),
+        value: window.initialData.messageTTL,
+        setFn: window.setMessageTTL,
+      });
       const blockedNumberView = new Whisper.BlockedNumberView().render();
       this.$('.blocked-user-setting').append(blockedNumberView.el);
 
@@ -176,6 +200,8 @@
         permissions: i18n('permissions'),
         mediaPermissionsDescription: i18n('mediaPermissionsDescription'),
         readReceiptSettingDescription: i18n('readReceiptSettingDescription'),
+        messageTTL: i18n('messageTTL'),
+        messageTTLSettingDescription: i18n('messageTTLSettingDescription'),
         spellCheckHeader: i18n('spellCheck'),
         spellCheckDescription: i18n('spellCheckDescription'),
         blockedHeader: 'Blocked Users',

settings.html

@@ -112,6 +112,12 @@
     </div>
     <div class='sync-setting'></div>
     <hr>
+    <div class='message-ttl-setting'>
+      <h3>{{ messageTTL }}</h3>
+      <input name='message-ttl-setting' id='message-ttl-setting' type="number" min="12" max="96">
+      <label for='message-ttl-setting'>{{ messageTTLSettingDescription }}</label>
+    </div>
+    <hr>
     <div class='clear-data-settings'>
       <h3>{{ clearDataHeader }}</h3>
       <div>