MT confirm when turning email on/off to avoid accidental changes when…

… scrolling
Freegle · Jul 21, 2018 · 407d825 · 407d825
1 parent dfe7ad2
commit 407d825
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 26 deletions.
diff --git a/http/js/iznik/views/pages/user/settings.js b/http/js/iznik/views/pages/user/settings.js
@@ -128,7 +128,11 @@ define([
 
         onholidaytill: function(e) {
             var me = Iznik.Session.get('me');
+
+            // Set the hour else midnight and under DST goes back a day.
+            e.date.hour(5);
             var till = e.date.toISOString();
+
             this.$('.js-onholidaytill').datetimepicker('hide');
 
             Iznik.Session.save({

diff --git a/http/js/iznik/views/user/user.js b/http/js/iznik/views/user/user.js
@@ -941,8 +941,6 @@ define([
             'change .js-emailfrequency': 'changeFreq',
             'change .js-ourpostingstatus': 'changeOurPostingStatus',
             'change .js-role': 'changeRole',
-            'switchChange.bootstrapSwitch .js-onholiday': 'onholiday',
-            'changeDate .js-onholidaytill': 'saveHoliday',
         },
 
         changeFreq: function () {
@@ -991,12 +989,14 @@ define([
             })
         },
 
-        saveHoliday: function () {
+        saveHoliday: function (e) {
             var till = null
             var self = this
 
-            if (this.$('.js-holidayswitch').bootstrapSwitch('state')) {
-                till = this.$('.datepicker.js-onholidaytill').datetimepicker('date').toISOString();
+            if (this.$('.js-switch').bootstrapSwitch('state')) {
+                // Set the hour else midnight and under DST goes back a day.
+                e.date.hour(5);
+                till = e.date.toISOString();
             }
 
             this.$('.js-onholidaytill').datetimepicker('hide')
@@ -1012,18 +1012,32 @@ define([
             })
         },
 
-        onholiday: function (obj, state) {
-            if (state) {
-                this.$('.js-onholidaytill').show()
-                this.saveHoliday()
-                _.delay(_.bind(function () {
-                    this.$('.js-onholidaytill:visible').focus()
-                }, this), 500)
-            } else {
-                this.$('.js-onholidaytill').val(null)
-                this.$('.js-onholidaytill').hide()
-                this.saveHoliday()
-            }
+        onholiday: function (e, data) {
+            console.log("On holiday toggle", this, data);
+            var self = this;
+
+            self.$('.js-onholiday').bootstrapSwitch('state', !data, true)
+            var state = self.$('.js-onholiday').bootstrapSwitch('state');
+
+            var v = new Iznik.Views.Confirm({});
+
+            self.listenToOnce(v, 'confirmed', function () {
+                self.$('.js-onholiday').bootstrapSwitch('state', data, true)
+                if (!state) {
+                    // Turn on.  Changing the date value will actually save it.
+                    this.$('.js-onholidaytill').show()
+                    _.delay(_.bind(function () {
+                        this.$('.js-onholidaytill:visible').focus()
+                    }, this), 500)
+                } else {
+                    // Turn off and reset date.
+                    this.$('.js-onholidaytill').val(null)
+                    this.$('.js-onholidaytill').hide()
+                    this.saveHoliday()
+                }
+            });
+
+            v.render();
         },
 
         render: function () {
@@ -1066,26 +1080,29 @@ define([
                     onText: 'Paused',
                     offText: 'Mail&nbsp;On',
                     state: onholiday != undefined
-                })
+                });
+
+                // We override the default click handler because we want to add a prompt.
+                self.$('.js-switch').on('switchChange.bootstrapSwitch', _.bind(self.onholiday, self));
 
                 _.defer(function () {
                     self.$('select').selectpicker()
                 })
 
+                self.$('.js-onholidaytill').datetimepicker({
+                    format: 'ddd, DD MMMM',
+                    minDate: new moment(),
+                    maxDate: (new moment()).add(30, 'days')
+                }).on('dp.change', _.bind(self.saveHoliday, self));
+
                 if (onholiday && onholiday != undefined && onholiday != '1970-01-01T00:00:00Z') {
-                    self.$('.js-onholidaytill').val((new moment(onholiday).format('MMM Do YYYY')))
                     self.$('.js-onholidaytill').show()
                     self.$('.js-emailfrequency').hide()
+                    self.$('.js-onholidaytill').datetimepicker('date', new moment(onholiday));
                 } else {
                     self.$('.js-onholidaytill').hide()
                     self.$('.js-emailfrequency').show()
                 }
-
-                self.$('.js-onholidaytill').datetimepicker({
-                    format: 'ddd, DD MMMM',
-                    minDate: new moment(),
-                    maxDate: (new moment()).add(30, 'days')
-                })
             })
 
             return (p)

diff --git a/http/template/modtools/freegle/user.html b/http/template/modtools/freegle/user.html
@@ -39,7 +39,7 @@
         </div>
         <div class="col-xs-6 col-sm-12 col-lg-6 padsmall nopadleft nopadright yahooopt">
             <input type="checkbox" class="js-switch js-onholiday" />
-            <input type="text" class="datepicker js-onholidaytill" style="display: none"/>
+            <input type="text" class="datepicker js-onholidaytill" style="display: none" placeholder="Enter date"/>
         </div>
     </div>
 </div>