From 02c000530ccbc3829c6ca07ce104a9c2a0ce003a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9my=20GAULIN?= <jeremy@bnb.re>
Date: Sat, 14 May 2016 04:07:38 +0200
Subject: [PATCH] Display dates with backend timezone. Manipulate date with app
 timezone.

---
 modules/backend/widgets/Filter.php            | 43 ++++++++++++---
 .../widgets/filter/partials/_scope_date.htm   |  6 +-
 .../filter/partials/_scope_daterange.htm      |  6 +-
 modules/system/assets/ui/js/filter.dates.js   | 55 +++++++++++--------
 4 files changed, 72 insertions(+), 38 deletions(-)

diff --git a/modules/backend/widgets/Filter.php b/modules/backend/widgets/Filter.php
index 3f01ae2f3..e108caf90 100644
--- a/modules/backend/widgets/Filter.php
+++ b/modules/backend/widgets/Filter.php
@@ -1,5 +1,6 @@
 <?php namespace Backend\Widgets;
 
+use Backend;
 use Backend\Classes\FormField;
 use Backend\FormWidgets\DatePicker;
 use Carbon\Carbon;
@@ -100,15 +101,41 @@ class Filter extends WidgetBase
      */
     public function renderScopeElement($scope)
     {
+        $params = ['scope' => $scope];
+        $loadDatePicker = false;
+
         switch ($scope->type) {
             case 'date':
+                $loadDatePicker = true;
+
+                if ($scope->value && $scope->value instanceof Carbon) {
+                    $params['dateStr'] = Backend::dateTime($scope->value, ['formatAlias' => 'dateMin']);
+                    $params['date']    = $scope->value->format('Y-m-d H:i:s');
+                }
+
+                break;
             case 'daterange':
-                // Load datepicker assets
-                new DatePicker($this->controller, new FormField('dummy', 'dummy'));
+                $loadDatePicker = true;
+
+                if ($scope->value && is_array($scope->value) && count($scope->value) === 2 &&
+                    $scope->value[0] && $scope->value[0] instanceof Carbon &&
+                    $scope->value[1] && $scope->value[1] instanceof Carbon
+                ) {
+                    $params['afterStr']  = Backend::dateTime($scope->value[0], ['formatAlias' => 'dateMin']);
+                    $params['beforeStr'] = Backend::dateTime($scope->value[1], ['formatAlias' => 'dateMin']);
+                    $params['after']  = $scope->value[0]->format('Y-m-d H:i:s');
+                    $params['before'] = $scope->value[1]->format('Y-m-d H:i:s');
+                }
+
                 break;
         }
 
-        return $this->makePartial('scope_'.$scope->type, ['scope' => $scope]);
+        if($loadDatePicker) {
+            // Load datepicker assets
+            new DatePicker($this->controller, new FormField('dummy', 'dummy'));
+        }
+
+        return $this->makePartial('scope_'.$scope->type, $params);
     }
 
     //
@@ -501,7 +528,7 @@ class Filter extends WidgetBase
         switch ($scope->type) {
             case 'date':
                 if ($scope->value instanceof Carbon) {
-                    $value = $scope->value->setTime(0, 0, 0);
+                    $value = $scope->value;
 
                     /*
                      * Condition
@@ -510,7 +537,7 @@ class Filter extends WidgetBase
                         $query->whereRaw(DbDongle::parse(strtr($scopeConditions, [
                             ':filtered' => $value->format('Y-m-d'),
                             ':after'    => $value->format('Y-m-d H:i:s'),
-                            ':before'   => $value->copy()->setTime(23, 59, 59)->format('Y-m-d H:i:s')
+                            ':before'   => $value->copy()->addDay()->addMinutes(-1)->format('Y-m-d H:i:s')
                         ])));
                     }
 
@@ -528,8 +555,6 @@ class Filter extends WidgetBase
                     list($after, $before) = array_values($scope->value);
 
                     if($after && $after instanceof Carbon && $before && $before instanceof Carbon) {
-                        $after->setTime(0, 0, 0);
-                        $before->setTime(23, 59, 59);
 
                         /*
                          * Condition
@@ -728,8 +753,8 @@ class Filter extends WidgetBase
             }
 
             foreach ($ajaxDates as $date) {
-                if(preg_match('/\d{4}-\d{2}-\d{2}/', $date)) {
-                    $dates[] = Carbon::createFromFormat('Y-m-d', $date);
+                if(preg_match('/\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}/', $date)) {
+                    $dates[] = Carbon::createFromFormat('Y-m-d H:i:s', $date);
                 } else {
                     $dates = [];
                     break;
diff --git a/modules/backend/widgets/filter/partials/_scope_date.htm b/modules/backend/widgets/filter/partials/_scope_date.htm
index 79ec5ffd4..6b3286d23 100644
--- a/modules/backend/widgets/filter/partials/_scope_date.htm
+++ b/modules/backend/widgets/filter/partials/_scope_date.htm
@@ -1,14 +1,14 @@
 <!-- Date scope -->
 <a
-    class="filter-scope-date <?= $scope->value ? 'active' : '' ?>"
+    class="filter-scope-date <?= isset($date) ? 'active' : '' ?>"
     href="javascript:;"
     data-scope-name="<?= $scope->scopeName ?>"
     data-scope-data="<?= e(json_encode([
-        'date' => $scope->value && $scope->value instanceof \Carbon\Carbon ? $scope->value->format('Y-m-d') : null,
+        'date' => $date,
         'minDate' => $scope->minDate ? $scope->minDate : '2000-01-01' ,
         'maxDate' => $scope->maxDate ? $scope->maxDate : '2099-12-31',
     ]))
     ?>">
     <span class="filter-label"><?= e(trans($scope->label)) ?>:</span>
-    <span class="filter-setting"><?= $scope->value && $scope->value instanceof \Carbon\Carbon ? $scope->value->format('Y-m-d') : e(trans('backend::lang.filter.date_all')) ?></span>
+    <span class="filter-setting"><?= isset($dateStr) ? $dateStr : e(trans('backend::lang.filter.date_all')) ?></span>
 </a>
diff --git a/modules/backend/widgets/filter/partials/_scope_daterange.htm b/modules/backend/widgets/filter/partials/_scope_daterange.htm
index 46e20d2ab..40d78fa63 100644
--- a/modules/backend/widgets/filter/partials/_scope_daterange.htm
+++ b/modules/backend/widgets/filter/partials/_scope_daterange.htm
@@ -1,14 +1,14 @@
 <!-- Date Range scope -->
 <a
-    class="filter-scope-date range <?= $scope->value ? 'active' : '' ?>"
+    class="filter-scope-date range <?= isset($after) && isset($before) ? 'active' : '' ?>"
     href="javascript:;"
     data-scope-name="<?= $scope->scopeName ?>"
     data-scope-data="<?= e(json_encode([
-        'dates' => $scope->value && is_array($scope->value) ? array_map(function($value) { return $value && $value instanceof \Carbon\Carbon ? $value->format('Y-m-d') : null; }, $scope->value) : null,
+        'dates' => isset($after) && isset($before) ? [$after, $before] : null,
         'minDate' => $scope->minDate ? $scope->minDate : '2000-01-01',
         'maxDate' => $scope->maxDate ? $scope->maxDate : '2099-12-31',
     ]))
     ?>">
     <span class="filter-label"><?= e(trans($scope->label)) ?>:</span>
-    <span class="filter-setting"><?= $scope->value && is_array($scope->value) ? join(' → ', array_map(function($value) { return $value && $value instanceof \Carbon\Carbon ? $value->format('Y-m-d') : null; }, $scope->value)) : e(trans('backend::lang.filter.date_all')) ?></span>
+    <span class="filter-setting"><?= isset($afterStr) && isset($beforeStr) ? ($afterStr . ' → ' . $beforeStr) : e(trans('backend::lang.filter.date_all')) ?></span>
 </a>
diff --git a/modules/system/assets/ui/js/filter.dates.js b/modules/system/assets/ui/js/filter.dates.js
index 2e02ca76a..073035388 100644
--- a/modules/system/assets/ui/js/filter.dates.js
+++ b/modules/system/assets/ui/js/filter.dates.js
@@ -165,7 +165,7 @@
                                 </div>                                                                                  \
                             </div>                                                                                      \
                             <div class="filter-buttons">                                                                \
-                                <button class="btn btn-block btn-primary oc-icon-search" data-trigger="filter">         \
+                                <button class="btn btn-block btn-primary" data-trigger="filter">                        \
                                     {{ filter_button_text }}                                                            \
                                 </button>                                                                               \
                                 <button class="btn btn-block btn-secondary" data-trigger="clear">                       \
@@ -184,8 +184,8 @@
             data = this.scopeValues[scopeName]
 
         data = $.extend({}, data, {
-            filter_button_text: $.oc.lang.get('filter.dates.filter_button_text'),
-            reset_button_text: $.oc.lang.get('filter.dates.reset_button_text'),
+            filter_button_text: this.getLang('filter.dates.filter_button_text'),
+            reset_button_text: this.getLang('filter.dates.reset_button_text'),
             date_placeholder: this.getLang('filter.dates.date_placeholder', 'Date')
         })
 
@@ -195,7 +195,7 @@
         $scope.data('oc.popover', null)
 
         $scope.ocPopover({
-            content: Mustache.render(self.getPopoverDateTemplate(), data),
+            content: Mustache.render(this.getPopoverDateTemplate(), data),
             modal: false,
             highlightModalTarget: true,
             closeOnPageClick: true,
@@ -212,8 +212,8 @@
             data = this.scopeValues[scopeName]
 
         data = $.extend({}, data, {
-            filter_button_text: $.oc.lang.get('filter.dates.filter_button_text'),
-            reset_button_text: $.oc.lang.get('filter.dates.reset_button_text'),
+            filter_button_text: this.getLang('filter.dates.filter_button_text'),
+            reset_button_text: this.getLang('filter.dates.reset_button_text'),
             after_placeholder: this.getLang('filter.dates.after_placeholder', 'After'),
             before_placeholder: this.getLang('filter.dates.before_placeholder', 'Before')
         })
@@ -224,7 +224,7 @@
         $scope.data('oc.popover', null)
 
         $scope.ocPopover({
-            content: Mustache.render(self.getPopoverRangeTemplate(), data),
+            content: Mustache.render(this.getPopoverRangeTemplate(), data),
             modal: false,
             highlightModalTarget: true,
             closeOnPageClick: true,
@@ -237,9 +237,9 @@
 
     FilterWidget.prototype.initDatePickers = function (isRange) {
         var self = this,
-            scopeData = self.$activeScope.data('scope-data'),
+            scopeData = this.$activeScope.data('scope-data'),
             $inputs = $('.field-datepicker input', '#controlFilterPopover'),
-            data = self.scopeValues[self.activeScopeName]
+            data = this.scopeValues[this.activeScopeName]
 
         if (!data) {
             data = {
@@ -256,11 +256,11 @@
                     yearRange: 10,
                     setDefaultDate: '' !== defaultValue ? defaultValue.toDate() : '',
                     format: self.getDateFormat(),
-                    i18n: $.oc.lang.get('datepicker')
+                    i18n: self.getLang('datepicker')
                 }
 
             if (0 <= index && index < data.dates.length) {
-                defaultValue = moment(data.dates[index], 'YYYY-MM-DD')
+                defaultValue = moment.tz(data.dates[index], self.appTimezone).tz(self.timezone)
             }
 
             if (!isRange) {
@@ -286,17 +286,16 @@
     }
 
     FilterWidget.prototype.updateScopeDateSetting = function ($scope, dates) {
-        var self = this,
-            $setting = $scope.find('.filter-setting'),
-            dateFormat = self.getDateFormat(),
-            dateRegex =/\d{4}-\d{2}-\d{2}/,
+        var $setting = $scope.find('.filter-setting'),
+            dateFormat = this.getDateFormat(),
+            dateRegex =/\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}/,
             reset = false
 
         if (dates && dates.length && dates[0].match(dateRegex)) {
             if (dates.length > 1) {
                 if(dates[1].match(dateRegex)) {
-                    var after = moment(dates[0], 'YYYY-MM-DD').format(dateFormat),
-                        before = moment(dates[1], 'YYYY-MM-DD').format(dateFormat);
+                    var after = moment.tz(dates[0], this.appTimezone).tz(this.timezone).format(dateFormat),
+                        before = moment.tz(dates[1], this.appTimezone).tz(this.timezone).format(dateFormat);
 
                     $setting.text(after + ' → ' + before)
                 } else {
@@ -304,7 +303,7 @@
                 }
             }
             else {
-                $setting.text(moment(dates[0], 'YYYY-MM-DD').format(dateFormat))
+                $setting.text(moment.tz(dates[0], this.appTimezone).tz(this.timezone).format(dateFormat))
             }
 
             $scope.addClass('active')
@@ -325,16 +324,26 @@
 
         if (!isReset) {
             $('.field-datepicker input', '#controlFilterPopover').each(function (index, datepicker) {
-                dates.push($(datepicker).data('pikaday').toString('YYYY-MM-DD'))
+                var date = $(datepicker).data('pikaday').toString('YYYY-MM-DD');
+
+                if (index === 0) {
+                    date += '00:00:00'
+                } else if (index === 1) {
+                    date += '23:59:59'
+                }
+
+                dates.push(moment.tz(date, self.timezone)
+                    .tz(self.appTimezone)
+                    .format('YYYY-MM-DD HH:mm:ss'))
             })
         }
 
-        self.updateScopeDateSetting(self.$activeScope, dates);
-        self.scopeValues[self.activeScopeName] = {
+        this.updateScopeDateSetting(this.$activeScope, dates);
+        this.scopeValues[this.activeScopeName] = {
             dates: dates
         }
-        self.isActiveScopeDirty = true;
-        self.$activeScope.data('oc.popover').hide()
+        this.isActiveScopeDirty = true;
+        this.$activeScope.data('oc.popover').hide()
     }
 
     FilterWidget.prototype.getDateFormat = function () {