Permalink
Browse files

Use human time diff instead of absolute timestamps

When viewing a liveblog the absolute time isn't
so important, we mostly care how old is an entry.

Here we introduced moment.js, which takes care of
that.

When a liveblog is archived, the users will see the
absolute timestamps. Since the difference will be
huge, it doesn't make so much sense to show the
difference in this case. Also, this behaviour comes
for free, because we don't show the relative
timestamps before we initialise the liveblog, which
never happens if it's archived.

Fixes #33.
  • Loading branch information...
1 parent d742ea8 commit ef3a225eba737dae936f6995c76be88b499adcbf @nb nb committed Jan 7, 2013
Showing with 1,266 additions and 2 deletions.
  1. +2 −0 classes/class-wpcom-liveblog-entry.php
  2. +23 −0 js/liveblog.js
  3. +1,213 −0 js/moment.js
  4. +6 −0 js/moment.min.js
  5. +21 −1 liveblog.php
  6. +1 −1 templates/liveblog-single-entry.php
@@ -84,6 +84,7 @@ public function render() {
$author_link = get_comment_author_link( $entry_id );
$entry_date = get_comment_date( get_option('date_format'), $entry_id );
$entry_time = get_comment_date( get_option('time_format'), $entry_id );
+ $timestamp = get_comment_date( 'U', $entry_id );
$can_edit_liveblog = WPCOM_Liveblog::current_user_can_edit_liveblog();
return WPCOM_Liveblog::get_template_part( 'liveblog-single-entry.php', compact(
@@ -95,6 +96,7 @@ public function render() {
'author_link',
'entry_date',
'entry_time',
+ 'timestamp',
'can_edit_liveblog'
) );
}
View
@@ -15,6 +15,14 @@ window.liveblog = {};
if (liveblog.is_at_the_top()) {
liveblog.queue.flush();
}
+ },
+ updateTimes: function() {
+ this.$('.liveblog-entry').each(function() {
+ var $entry = $(this),
+ timestamp = $entry.data('timestamp'),
+ human = moment.unix(timestamp).fromNow();
+ $('.liveblog-meta-time a', $entry).text(human);
+ });
}
});
@@ -121,13 +129,20 @@ window.liveblog = {};
liveblog.entriesContainer = new liveblog.EntriesView();
liveblog.titleBarCount = new liveblog.TitleBarCountView();
+ liveblog.init_moment_js();
+
liveblog.cast_settings_numbers();
liveblog.reset_timer();
liveblog.set_initial_timestamps();
+ liveblog.start_human_time_diff_timer();
liveblog.$events.trigger( 'after-init' );
};
+ liveblog.init_moment_js = function() {
+ moment.lang(momentLang.locale, momentLang);
+ }
+
liveblog.set_initial_timestamps = function() {
var now = liveblog.current_timestamp();
liveblog.latest_entry_timestamp = liveblog_settings.latest_entry_timestamp || 0;
@@ -171,6 +186,12 @@ window.liveblog = {};
};
+ liveblog.start_human_time_diff_timer = function() {
+ var tick = function(){ liveblog.entriesContainer.updateTimes(); };
+ tick();
+ setInterval(tick, 60 * 1000);
+ }
+
liveblog.get_recent_entries = function() {
var url = liveblog_settings.endpoint_url;
var from = liveblog.latest_entry_timestamp + 1;
@@ -276,13 +297,15 @@ window.liveblog = {};
liveblog.add_entry = function( new_entry, duration ) {
var $new_entry = $( new_entry.html );
$new_entry.addClass('highlight').prependTo( liveblog.$entry_container ).animate({backgroundColor: 'white'}, {duration: duration});
+ liveblog.entriesContainer.updateTimes();
};
liveblog.update_entry = function( $entry, updated_entry ) {
var $updated_entry = $( updated_entry.html );
var updated_text = $( '.liveblog-entry-text', $updated_entry ).html();
$( '.liveblog-entry-text', $entry ).html( updated_text );
+ liveblog.entriesContainer.updateTimes();
};
liveblog.delete_entry = function( $entry ) {
Oops, something went wrong.

0 comments on commit ef3a225

Please sign in to comment.