work in progress migrate to moment

app/assets/javascripts/discourse/components/formatter.js

@@ -1,5 +1,5 @@
 Discourse.Formatter = (function(){
-  var updateRelativeAge, autoUpdatingRelativeAge, relativeAge;
+  var updateRelativeAge, autoUpdatingRelativeAge, relativeAge, relativeAgeTiny, relativeAgeMedium;
 
   updateRelativeAge = function(elems) {
     elems.each(function(){
@@ -15,11 +15,9 @@ Discourse.Formatter = (function(){
     return "<span class='relative-date' data-time='" + date.getTime() + "' data-format='" + format +  "'>" + relativeAge(date, options)  + "</span>";
   };
 
-  // mostly lifted from rails with a few amendments
-  relativeAge = function(date, options) {
-    options = options || {};
-    var format = options.format || "tiny";
 
+  relativeAgeTiny = function(date, options){
+    var format = "tiny";
     var distance = Math.round((new Date() - date) / 1000);
     var distance_in_minutes = Math.round(distance / 60.0);
 
@@ -64,5 +62,54 @@ Discourse.Formatter = (function(){
     return formatted;
   };
 
+  relativeAgeMedium = function(date, options){
+    var displayDate, fiveDaysAgo, oneMinuteAgo, fullReadable, humanized, leaveAgo, val;
+
+    leaveAgo = options.leaveAgo;
+
+    if (!date) {
+      return "&mdash;";
+    }
+
+    fullReadable = date.format("long");
+    displayDate = "";
+    fiveDaysAgo = (new Date()) - 432000000;
+    oneMinuteAgo = (new Date()) - 60000;
+
+    if (oneMinuteAgo <= date.getTime() && date.getTime() <= (new Date())) {
+      displayDate = Em.String.i18n("now");
+    } else if (fiveDaysAgo > (date.getTime())) {
+      if ((new Date()).getFullYear() !== date.getFullYear()) {
+        displayDate = date.format("short");
+      } else {
+        displayDate = date.format("short_no_year");
+      }
+    } else {
+      humanized = date.relative();
+      if (!humanized) {
+        return "";
+      }
+      displayDate = humanized;
+      if (!leaveAgo) {
+        displayDate = (date.millisecondsAgo()).duration();
+      }
+    }
+    return "<span class='date' title='" + fullReadable + "'>" + displayDate + "</span>";
+  };
+
+  // mostly lifted from rails with a few amendments
+  relativeAge = function(date, options) {
+    options = options || {};
+    var format = options.format || "tiny";
+
+    if(format === "tiny") {
+      return relativeAgeTiny(date, options);
+    } else if (format === "medium") {
+      return relativeAgeMedium(date, options);
+    }
+
+    return "UNKNOWN FORMAT";
+  };
+
   return {relativeAge: relativeAge, autoUpdatingRelativeAge: autoUpdatingRelativeAge, updateRelativeAge: updateRelativeAge};
 })();

config/initializers/secret_token.rb

@@ -9,7 +9,6 @@
 #
 # Discourse::Application.config.secret_token = "SET_SECRET_HERE"
 
-# delete all lines below in production
 if Rails.env.test? || Rails.env.development? || Rails.env == "profile"
   Discourse::Application.config.secret_token = "47f5390004bf6d25bb97083fb98e7cc133ab450ba814dd19638a78282b4ca291"
 else

config/jshint.yml

@@ -74,6 +74,7 @@ predef:
   - Handlebars
   - I18n
   - bootbox
+  - moment
 
 browser:  true      # true if the standard browser globals should be predefined
 rhino:    false     # true if the Rhino environment globals should be predefined

spec/javascripts/components/formatter_spec.js

@@ -1,30 +1,76 @@
 /*global expect:true describe:true it:true beforeEach:true afterEach:true spyOn:true */
 
 describe("Discourse.Formatter", function() {
+  var format = "tiny";
+  var leaveAgo = false;
+  var mins_ago = function(mins){
+    return new Date((new Date()) - mins * 60 * 1000);
+  };
+
+  var formatMins = function(mins) {
+    return Discourse.Formatter.relativeAge(mins_ago(mins), {format: format, leaveAgo: leaveAgo});
+  };
+
+  var formatHours = function(hours) {
+    return formatMins(hours * 60);
+  };
+
+  var formatDays = function(days) {
+    return formatHours(days * 24);
+  };
+
+  var formatMonths = function(months) {
+    return formatDays(months * 30);
+  };
 
   describe("relativeTime", function() {
 
+    it("can format medium length dates", function() {
+      format = "medium";
+      var strip = function(html){
+        return $(html).text();
+      }
+
+      var shortDate = function(days){
+        return moment().subtract('days', days).format('D MMM');
+      }
+
+      var shortDateYear = function(days){
+        return moment().subtract('days', days).format('D MMM, YYYY');
+      }
+
+      leaveAgo = true;
+      expect(strip(formatMins(1.5))).toBe("1 minute ago");
+      expect(strip(formatMins(2))).toBe("2 minutes ago");
+      expect(strip(formatMins(56))).toBe("56 minutes ago");
+      expect(strip(formatMins(57))).toBe("1 hour ago");
+      expect(strip(formatHours(4))).toBe("4 hours ago");
+      expect(strip(formatHours(22))).toBe("22 hours ago");
+      expect(strip(formatHours(23))).toBe("1 day ago");
+      expect(strip(formatDays(4.85))).toBe("4 days ago");
+
+      leaveAgo = false;
+      expect(strip(formatMins(0))).toBe("just now");
+      expect(strip(formatMins(1.5))).toBe("1 minute");
+      expect(strip(formatMins(2))).toBe("2 minutes");
+      expect(strip(formatMins(56))).toBe("56 minutes");
+      expect(strip(formatMins(57))).toBe("1 hour");
+      expect(strip(formatHours(4))).toBe("4 hours");
+      expect(strip(formatHours(22))).toBe("22 hours");
+      expect(strip(formatHours(23))).toBe("1 day");
+      expect(strip(formatDays(4.85))).toBe("4 days");
+
+      expect(strip(formatDays(6))).toBe(shortDate(6));
+      expect(strip(formatDays(100))).toBe(shortDate(100)); // eg: 23 Jan
+      // expect(strip(formatDays(500))).toBe(shortDateYear(500)); # this is currently broken
+
+      expect($(formatDays(0)).attr("title")).toBe(moment().format('MMMM D, YYYY h:mma'));
+      expect($(formatDays(0)).attr("class")).toBe("date");
+
+    });
+
     it("can format dates", function() {
-      var mins_ago = function(mins){
-        return new Date((new Date()) - mins * 60 * 1000);
-      };
-
-      var formatMins = function(mins) {
-        return Discourse.Formatter.relativeAge(mins_ago(mins));
-      };
-
-      var formatHours = function(hours) {
-        return formatMins(hours * 60);
-      };
-
-      var formatDays = function(days) {
-        return formatHours(days * 24);
-      };
-
-      var formatMonths = function(months) {
-        return formatDays(months * 30);
-      };
-
+      format = "tiny";
       expect(formatMins(0)).toBe("< 1m");
       expect(formatMins(2)).toBe("2m");
       expect(formatMins(60)).toBe("1h");
@@ -47,6 +93,7 @@ describe("Discourse.Formatter", function() {
       expect($elem.data('time')).toBe(d.getTime());
     });
   });
+
   describe("updateRelativeAge", function(){
     it("can update relative dates", function(){
 

spec/javascripts/spec.js

@@ -21,6 +21,7 @@
 //= require_tree ../../app/assets/javascripts/external
 
 //= require ../../app/assets/javascripts/locales/i18n
+//= require ../../app/assets/javascripts/locales/date_locales.js
 //= require ../../app/assets/javascripts/discourse/helpers/i18n_helpers
 //= require ../../app/assets/javascripts/locales/en
 //= require ../../app/assets/javascripts/discourse