# HG changeset patch
# User Atul Varma <varmaa@toolness.com>
# Date 1241148981 25200
# Node ID a095f39117d9cbfda0b0d01d2cf9df8addfd9681
# Parent  4b3c051d60c3a7775348f06da308cde4adc4ec5a
date sent display is much better

diff -r 4b3c051d60c3 -r a095f39117d9 media/css/openwebchat.css
--- a/media/css/openwebchat.css	Thu Apr 30 20:05:31 2009 -0700
+++ b/media/css/openwebchat.css	Thu Apr 30 20:36:21 2009 -0700
@@ -72,7 +72,7 @@
     position: absolute;
     left: 0px;
     top: 0px;
-    z-index: -1;
+    z-index: 1;
     text-align: left;
 }
 
diff -r 4b3c051d60c3 -r a095f39117d9 media/js/jquery.timeago.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/media/js/jquery.timeago.js	Thu Apr 30 20:36:21 2009 -0700
@@ -0,0 +1,125 @@
+/*
+ * timeago: a jQuery plugin, version: 0.6.2 (10/14/2008)
+ * @requires jQuery v1.2 or later
+ *
+ * Timeago is a jQuery plugin that makes it easy to support automatically
+ * updating fuzzy timestamps (e.g. "4 minutes ago" or "about 1 day ago").
+ *
+ * For usage and examples, visit:
+ * http://timeago.yarp.com/
+ *
+ * Licensed under the MIT:
+ * http://www.opensource.org/licenses/mit-license.php
+ *
+ * Copyright (c) 2008-2009, Ryan McGeary (ryanonjavascript -[at]- mcgeary [*dot*] org)
+ */
+(function($) {
+  $.timeago = function(timestamp) {
+    if (timestamp instanceof Date) return inWords(timestamp);
+    else if (typeof timestamp == "string") return inWords($.timeago.parse(timestamp));
+    else return inWords($.timeago.parse($(timestamp).attr("title")));
+  };
+  var $t = $.timeago;
+
+  $.extend($.timeago, {
+    settings: {
+      refreshMillis: 60000,
+      allowFuture: false,
+      strings: {
+        prefixAgo: null,
+        prefixFromNow: null,
+        suffixAgo: "ago",
+        suffixFromNow: "from now",
+        ago: null, // DEPRECATED, use suffixAgo
+        fromNow: null, // DEPRECATED, use suffixFromNow
+        seconds: "less than a minute",
+        minute: "about a minute",
+        minutes: "%d minutes",
+        hour: "about an hour",
+        hours: "about %d hours",
+        day: "a day",
+        days: "%d days",
+        month: "about a month",
+        months: "%d months",
+        year: "about a year",
+        years: "%d years"
+      }
+    },
+    inWords: function(distanceMillis) {
+      var $l = this.settings.strings;
+      var prefix = $l.prefixAgo;
+      var suffix = $l.suffixAgo || $l.ago;
+      if (this.settings.allowFuture) {
+        if (distanceMillis < 0) {
+          prefix = $l.prefixFromNow;
+          suffix = $l.suffixFromNow || $l.fromNow;
+        }
+        distanceMillis = Math.abs(distanceMillis);
+      }
+
+      var seconds = distanceMillis / 1000;
+      var minutes = seconds / 60;
+      var hours = minutes / 60;
+      var days = hours / 24;
+      var years = days / 365;
+
+      var words = seconds < 45 && sprintf($l.seconds, Math.round(seconds)) ||
+        seconds < 90 && $l.minute ||
+        minutes < 45 && sprintf($l.minutes, Math.round(minutes)) ||
+        minutes < 90 && $l.hour ||
+        hours < 24 && sprintf($l.hours, Math.round(hours)) ||
+        hours < 48 && $l.day ||
+        days < 30 && sprintf($l.days, Math.floor(days)) ||
+        days < 60 && $l.month ||
+        days < 365 && sprintf($l.months, Math.floor(days / 30)) ||
+        years < 2 && $l.year ||
+        sprintf($l.years, Math.floor(years));
+
+      return $.trim([prefix, words, suffix].join(" "));
+    },
+    parse: function(iso8601) {
+      var s = $.trim(iso8601);
+      s = s.replace(/-/,"/").replace(/-/,"/");
+      s = s.replace(/T/," ").replace(/Z/," UTC");
+      s = s.replace(/([\+-]\d\d)\:?(\d\d)/," $1$2"); // -04:00 -> -0400
+      return new Date(s);
+    }
+  });
+
+  $.fn.timeago = function() {
+    var self = this;
+    self.each(refresh);
+
+    var $s = $t.settings;
+    if ($s.refreshMillis > 0) {
+      setInterval(function() { self.each(refresh); }, $s.refreshMillis);
+    }
+    return self;
+  };
+
+  function refresh() {
+    var date = $t.parse(this.title);
+    if (!isNaN(date)) {
+      $(this).text(inWords(date));
+    }
+    return this;
+  }
+
+  function inWords(date) {
+    return $t.inWords(distance(date));
+  }
+
+  function distance(date) {
+    return (new Date().getTime() - date.getTime());
+  }
+
+  // lame sprintf implementation
+  function sprintf(string, value) {
+    return string.replace(/%d/i, value);
+  }
+
+  // fix for IE6 suckage
+  if ($.browser.msie && $.browser.version < 7.0) {
+    document.createElement('abbr');
+  }
+})(jQuery);
diff -r 4b3c051d60c3 -r a095f39117d9 media/js/openwebchat.js
--- a/media/js/openwebchat.js	Thu Apr 30 20:05:31 2009 -0700
+++ b/media/js/openwebchat.js	Thu Apr 30 20:36:21 2009 -0700
@@ -1,20 +1,34 @@
+var Utils = {
+  deepCopy: function deepCopy(obj) {
+    return JSON.parse(JSON.stringify(obj));
+  },
+
+  parseJsonDate: function parseJsonDate(str) {
+    var regexp = /(\d+)-(\d+)-(\d+)T(\d+):(\d+):(\d+)(.*)/;
+    var match = str.match(regexp);
+    var year = Number(match[1]);
+    var month = Number(match[2]) - 1;
+    var date = Number(match[3]);
+    var hrs = Number(match[4]);
+    var min = Number(match[5]);
+    var sec = Number(match[6]);
+    return new Date(Date.UTC(year, month, date, hrs, min, sec));
+  }
+};
+
 var OpenWebStorage = {
   UnsupportedError: function UnsupportedError() {},
 
   FakeStorage: function FakeStorage() {
     var contents = {};
 
-    function deepCopy(obj) {
-      return JSON.parse(JSON.stringify(obj));
-    }
-
     this.set = function set(key, value) {
-      contents[key] = deepCopy(value);
+      contents[key] = Utils.deepCopy(value);
     };
 
     this.get = function get(key, defaultValue) {
       if (key in contents)
-        return deepCopy(contents[key]);
+        return Utils.deepCopy(contents[key]);
       return defaultValue;
     };
   },
@@ -206,13 +220,14 @@
       else
         lastAuthor = msg.author;
 
+      var date = Utils.parseJsonDate(msg.time);
       msg = null;
 
       message.mouseenter(
         function() {
           $(this).addClass('highlighted');
           $('.overlay').css({top: $(this).position().top});
-          $('.overlay .sent').text($('.timestamp', this).text());
+          $('.overlay .sent').text(jQuery.timeago(date));
           $('.overlay').show();
         });
 
diff -r 4b3c051d60c3 -r a095f39117d9 openwebchat.html
--- a/openwebchat.html	Thu Apr 30 20:05:31 2009 -0700
+++ b/openwebchat.html	Thu Apr 30 20:36:21 2009 -0700
@@ -17,7 +17,7 @@
   class="seconds-left"></span> second<span class="plural">s</span>.
 </div>
 <div class="overlay">
-  <div>Sent <span class="sent"></span></div>
+  <div>This was sent <span class="sent"></span>.</div>
 </div>
 <textarea id="outgoing-message"></textarea>
 <p>Your name is <input type="text" id="name"/>.</p>
@@ -27,6 +27,7 @@
   <div class="default-name">A Mysterious Stranger</div>
 </div>
 <script src="/media/js/jquery.js"></script>
+<script src="/media/js/jquery.timeago.js"></script>
 <script src="/media/js/json2.js"></script>
 <script src="/media/js/openwebchat.js"></script>
 </body>
diff -r 4b3c051d60c3 -r a095f39117d9 openwebchat.py
--- a/openwebchat.py	Thu Apr 30 20:05:31 2009 -0700
+++ b/openwebchat.py	Thu Apr 30 20:36:21 2009 -0700
@@ -235,6 +235,7 @@
                 yield self._until_http_response_sent('\r\n'.join(lines))
             elif conv_name == 'media':
                 if page in ['js/jquery.js',
+                            'js/jquery.timeago.js',
                             'js/openwebchat.js',
                             'js/json2.js',
                             'css/openwebchat.css']: