From bf05a8da9650cec85e6e77091e76907abd7b5862 Mon Sep 17 00:00:00 2001
From: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Date: Sat, 24 Aug 2019 11:39:20 -0500
Subject: [PATCH] FEATURE: adds countdown attribute to [date] (#8037)

When used, dates will be displayed as a countdown in a human friendly way.
---
 .../discourse-local-dates.js.no-module.es6            | 10 ++++++++++
 .../discourse-markdown/discourse-local-dates.js.es6   | 11 ++++++++++-
 .../stylesheets/common/discourse-local-dates.scss     |  4 ++++
 .../config/locales/client.en.yml                      |  2 ++
 .../spec/integration/local_dates_spec.rb              |  7 +++++++
 5 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/plugins/discourse-local-dates/assets/javascripts/discourse-local-dates.js.no-module.es6 b/plugins/discourse-local-dates/assets/javascripts/discourse-local-dates.js.no-module.es6
index adac85455c2..8e87d886819 100644
--- a/plugins/discourse-local-dates/assets/javascripts/discourse-local-dates.js.no-module.es6
+++ b/plugins/discourse-local-dates/assets/javascripts/discourse-local-dates.js.no-module.es6
@@ -128,6 +128,15 @@
   }
 
   function _applyFormatting(dateTime, displayedTimezone, options) {
+    if (options.countdown) {
+      const diffTime = dateTime.diff(moment());
+      if (diffTime < 0) {
+        return I18n.t("discourse_local_dates.relative_dates.countdown.passed");
+      } else {
+        return moment.duration(diffTime).humanize();
+      }
+    }
+
     const sameTimezone = _isEqualZones(displayedTimezone, moment.tz.guess());
     const inCalendarRange = dateTime.isBetween(
       moment().subtract(2, "days"),
@@ -313,6 +322,7 @@
       options.displayedTimezone = $element.attr("data-displayed-timezone");
       options.format =
         $element.attr("data-format") || (options.time ? "LLL" : "LL");
+      options.countdown = $element.attr("data-countdown");
 
       processElement($element, options);
     });
diff --git a/plugins/discourse-local-dates/assets/javascripts/lib/discourse-markdown/discourse-local-dates.js.es6 b/plugins/discourse-local-dates/assets/javascripts/lib/discourse-markdown/discourse-local-dates.js.es6
index 1a174b22885..083794bd9c8 100644
--- a/plugins/discourse-local-dates/assets/javascripts/lib/discourse-markdown/discourse-local-dates.js.es6
+++ b/plugins/discourse-local-dates/assets/javascripts/lib/discourse-markdown/discourse-local-dates.js.es6
@@ -9,7 +9,8 @@ function addLocalDate(buffer, matches, state) {
     timezone: null,
     format: null,
     timezones: null,
-    displayedTimezone: null
+    displayedTimezone: null,
+    countdown: null
   };
 
   let parsed = parseBBCodeTag(
@@ -26,6 +27,7 @@ function addLocalDate(buffer, matches, state) {
   config.recurring = parsed.attrs.recurring;
   config.timezones = parsed.attrs.timezones;
   config.displayedTimezone = parsed.attrs.displayedTimezone;
+  config.countdown = parsed.attrs.countdown;
 
   token = new state.Token("span_open", "span", 1);
   token.attrs = [["data-date", state.md.utils.escapeHtml(config.date)]];
@@ -57,6 +59,13 @@ function addLocalDate(buffer, matches, state) {
     token.attrs.push(["data-format", state.md.utils.escapeHtml(config.format)]);
   }
 
+  if (config.countdown) {
+    token.attrs.push([
+      "data-countdown",
+      state.md.utils.escapeHtml(config.countdown)
+    ]);
+  }
+
   if (config.calendar) {
     token.attrs.push([
       "data-calendar",
diff --git a/plugins/discourse-local-dates/assets/stylesheets/common/discourse-local-dates.scss b/plugins/discourse-local-dates/assets/stylesheets/common/discourse-local-dates.scss
index dcd35b37697..c4edbf91a90 100644
--- a/plugins/discourse-local-dates/assets/stylesheets/common/discourse-local-dates.scss
+++ b/plugins/discourse-local-dates/assets/stylesheets/common/discourse-local-dates.scss
@@ -12,6 +12,10 @@
     &.past {
       border-bottom-color: $primary-low-mid;
     }
+
+    &.past[data-countdown] {
+      color: $primary-medium;
+    }
   }
 }
 
diff --git a/plugins/discourse-local-dates/config/locales/client.en.yml b/plugins/discourse-local-dates/config/locales/client.en.yml
index 224414b75e2..35d27729945 100644
--- a/plugins/discourse-local-dates/config/locales/client.en.yml
+++ b/plugins/discourse-local-dates/config/locales/client.en.yml
@@ -5,6 +5,8 @@ en:
         today: Today %{time}
         tomorrow: Tomorrow %{time}
         yesterday: Yesterday %{time}
+        countdown:
+          passed: date has passed
       title: Insert date / time
       create:
         form:
diff --git a/plugins/discourse-local-dates/spec/integration/local_dates_spec.rb b/plugins/discourse-local-dates/spec/integration/local_dates_spec.rb
index 6e1c76a4285..e59b695d235 100644
--- a/plugins/discourse-local-dates/spec/integration/local_dates_spec.rb
+++ b/plugins/discourse-local-dates/spec/integration/local_dates_spec.rb
@@ -79,4 +79,11 @@ RSpec.describe "Local Dates" do
 
     expect(cooked).not_to include("data-timezone=")
   end
+
+  it 'supports countdowns' do
+    raw = "[date=2018-11-01 time=12:00 countdown=true]"
+    cooked = Fabricate(:post, raw: raw).cooked
+
+    expect(cooked).to include("data-countdown=")
+  end
 end