Merge pull request #6467 from vinothkannans/timezone

UX: Use local timezone for "Insert date" modal result

plugins/discourse-local-dates/assets/javascripts/discourse-local-dates.js

@@ -11,12 +11,17 @@
         clearTimeout(this.timeout);
       }
 
-      var relativeTime = moment.utc(
+      var relativeTime;
-        options.date + " " + options.time,
+      if (options.forceTimezone) {
-        "YYYY-MM-DD HH:mm:ss"
+        relativeTime = moment
-      );
+          .tz(options.date + " " + options.time, options.forceTimezone)
+          .utc();
+      } else {
+        relativeTime = moment.utc(options.date + " " + options.time);
+      }
 
-      if (options.recurring && relativeTime < moment().utc()) {
+      if (relativeTime < moment().utc()) {
+        if (options.recurring) {
           var parts = options.recurring.split(".");
           var count = parseInt(parts[0], 10);
           var type = parts[1];
@@ -24,6 +29,9 @@
           var add = Math.ceil(diff + count);
 
           relativeTime = relativeTime.add(add, type);
+        } else {
+          $element.addClass("past");
+        }
       }
 
       var previews = options.timezones.split("|").map(function(timezone) {

plugins/discourse-local-dates/assets/javascripts/discourse/components/discourse-local-dates-create-form.js.es6

@@ -98,26 +98,20 @@ export default Ember.Component.extend({
     const timezones = this.get("timezones");
     const timeInferred = time ? false : true;
     const toTimeInferred = toTime ? false : true;
+    const timezone = this.get("currentUserTimezone");
 
     let dateTime;
     if (!timeInferred) {
-      dateTime = moment
+      dateTime = moment.tz(`${date} ${time}`, timezone);
-        .tz(`${date} ${time}`, this.get("currentUserTimezone"))
-        .utc();
     } else {
-      dateTime = moment.tz(date, this.get("currentUserTimezone")).utc();
+      dateTime = moment.tz(date, timezone);
     }
 
     let toDateTime;
     if (!toTimeInferred) {
-      toDateTime = moment
+      toDateTime = moment.tz(`${toDate} ${toTime}`, timezone);
-        .tz(`${toDate} ${toTime}`, this.get("currentUserTimezone"))
-        .utc();
     } else {
-      toDateTime = moment
+      toDateTime = moment.tz(toDate, timezone).endOf("day");
-        .tz(toDate, this.get("currentUserTimezone"))
-        .endOf("day")
-        .utc();
     }
 
     let config = {
@@ -125,7 +119,8 @@ export default Ember.Component.extend({
       dateTime,
       recurring,
       format,
-      timezones
+      timezones,
+      timezone
     };
 
     config.time = dateTime.format(this.timeFormat);
@@ -168,6 +163,7 @@ export default Ember.Component.extend({
       text += `time=${config.time} `;
     }
 
+    text += `timezone="${config.timezone}" `;
     text += `format="${config.format}" `;
     text += `timezones="${config.timezones.join("|")}"`;
     text += `]`;
@@ -180,6 +176,7 @@ export default Ember.Component.extend({
         text += `time=${config.toTime} `;
       }
 
+      text += `timezone="${config.timezone}" `;
       text += `format="${config.format}" `;
       text += `timezones="${config.timezones.join("|")}"`;
       text += `]`;

plugins/discourse-local-dates/assets/javascripts/lib/discourse-markdown/discourse-local-dates.js.es6

@@ -6,6 +6,7 @@ function addLocalDate(buffer, matches, state) {
   let config = {
     date: null,
     time: null,
+    forceTimezone: null,
     format: "YYYY-MM-DD HH:mm:ss",
     timezones: ""
   };
@@ -18,7 +19,7 @@ function addLocalDate(buffer, matches, state) {
 
   config.date = parsed.attrs.date;
   config.time = parsed.attrs.time;
-  config.forceTimezone = parsed.attrs.forceTimezone;
+  config.forceTimezone = parsed.attrs.forceTimezone || parsed.attrs.timezone;
   config.recurring = parsed.attrs.recurring;
   config.format = parsed.attrs.format || config.format;
   config.timezones = parsed.attrs.timezones || config.timezones;
@@ -32,11 +33,15 @@ function addLocalDate(buffer, matches, state) {
     ["data-timezones", state.md.utils.escapeHtml(config.timezones)]
   ];
 
+  let dateTime;
   if (config.forceTimezone) {
     token.attrs.push([
       "data-force-timezone",
       state.md.utils.escapeHtml(config.forceTimezone)
     ]);
+    dateTime = moment.tz(`${config.date} ${config.time}`, config.forceTimezone);
+  } else {
+    dateTime = moment.utc(`${config.date} ${config.time}`);
   }
 
   if (config.recurring) {
@@ -51,17 +56,14 @@ function addLocalDate(buffer, matches, state) {
     .split("|")
     .filter(t => t)
     .map(timezone => {
-      const dateTime = moment
+      const formattedDateTime = dateTime.tz(timezone).format(config.format);
-        .utc(`${config.date} ${config.time}`, "YYYY-MM-DD HH:mm:ss")
-        .tz(timezone)
-        .format(config.format);
 
       const formattedTimezone = timezone.replace("/", ": ").replace("_", " ");
 
-      if (dateTime.match(/TZ/)) {
+      if (formattedDateTime.match(/TZ/)) {
-        return dateTime.replace("TZ", formattedTimezone);
+        return formattedDateTime.replace("TZ", formattedTimezone);
       } else {
-        return `${dateTime} (${formattedTimezone})`;
+        return `${formattedDateTime} (${formattedTimezone})`;
       }
     });
 

plugins/discourse-local-dates/assets/stylesheets/common/discourse-local-dates.scss

@@ -19,6 +19,10 @@
     &:hover .d-icon-globe {
       color: $primary-high;
     }
+
+    &.past {
+      font-weight: normal;
+    }
   }
 }
 

plugins/discourse-local-dates/spec/integration/local_dates_spec.rb

@@ -5,9 +5,9 @@ RSpec.describe "Local Dates" do
     freeze_time
   end
 
-  it "should work" do
+  it "should work without timezone" do
     post = Fabricate(:post, raw: <<~SQL)
-      [date=2018-05-08 time=22:00 format="L LTS" forceTimezone="UTC" timezones="Europe/Paris|America/Los_Angeles"]
+      [date=2018-05-08 time=22:00 format="L LTS" timezones="Europe/Paris|America/Los_Angeles"]
     SQL
 
     cooked = post.cooked
@@ -15,7 +15,7 @@ RSpec.describe "Local Dates" do
     expect(cooked).to include('class="discourse-local-date"')
     expect(cooked).to include('data-date="2018-05-08"')
     expect(cooked).to include('data-format="L LTS"')
-    expect(cooked).to include('data-force-timezone="UTC"')
+    expect(cooked).not_to include('data-force-timezone=')
 
     expect(cooked).to include(
       'data-timezones="Europe/Paris|America/Los_Angeles"'
@@ -25,6 +25,18 @@ RSpec.describe "Local Dates" do
     expect(cooked).to include('05/09/2018 12:00:00 AM (Europe: Paris)')
   end
 
+  it "should work with timezone" do
+    post = Fabricate(:post, raw: <<~SQL)
+      [date=2018-05-08 time=22:00 format="L LTS" timezone="Asia/Calcutta" timezones="Europe/Paris|America/Los_Angeles"]
+    SQL
+
+    cooked = post.cooked
+
+    expect(cooked).to include('data-force-timezone="Asia/Calcutta"')
+    expect(cooked).to include('05/08/2018 9:30:00 AM (America: Los Angeles)')
+    expect(cooked).to include('05/08/2018 6:30:00 PM (Europe: Paris)')
+  end
+
   it 'requires the right attributes to convert to a local date' do
     post = Fabricate(:post, raw: <<~SQL)
       [date]
@@ -33,6 +45,6 @@ RSpec.describe "Local Dates" do
     cooked = post.cooked
 
     expect(post.cooked).to include("<p>[date]</p>")
-    expect(cooked).to_not include('data-force-timezone=')
+    expect(cooked).to_not include('data-date=')
   end
 end