Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

New feature suggestion: Add callback on refresh to be able to modify element #60

Open
wants to merge 2 commits into from

2 participants

@blmstr

Just added a simple callback function to be able to modify the time element on refresh. I use it to be able to style the date depending on the time. For example adding a class old if the time passed 10 minutes and such...

@delfuego

Wow, this would be awesome. I was coming here to request an event that got fired whenever an element was modified; either way, it'd be great to be able to monitor modifications of the timeago element so that actions can be fired off when the modification meets whatever criteria you're looking for.

(For me, I'm using timeago to show times in the future and in the past, and am looking for a way to know when one of them crosses from the future to the past. Right now, I'm using setInterval to run a script every 500ms that looks at all the timeago elements that contain 'ago' in them, and then making sure I handle those I haven't already discovered... but there HAS to be an easier way!)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Mar 5, 2012
  1. @blmstr
  2. @blmstr

    Add example usage in readme

    blmstr authored
This page is out of date. Refresh to see the latest.
Showing with 33 additions and 6 deletions.
  1. +19 −0 README.markdown
  2. +14 −6 jquery.timeago.js
View
19 README.markdown
@@ -37,6 +37,25 @@ into something like this:
As time passes, the timestamps will automatically update.
+### Usage with callback on refresh
+
+If you want to have an callback to modify the specific element on refresh, just pass a function as a callback.
+
+```html
+<script type="text/javascript">
+ jQuery(document).ready(function() {
+ $("abbr.timeago").timeago(function(distance) {
+ // my callback function where 'this' is the element and the parameter 'distance' is the difference between the current time and the elements time
+ var minutes = (distance / 60) / 1000; // get distance in minutes
+ // add old class if the time passes 10 minutes
+ if (minutes > 10) {
+ $(this).addClass("old");
+ }
+ });
+ });
+</script>
+```
+
**For more usage and examples**: [http://timeago.yarp.com/](http://timeago.yarp.com/)
**For different language configurations**: [http://gist.github.com/6251](http://gist.github.com/6251)
View
20 jquery.timeago.js 100644 → 100755
@@ -101,22 +101,30 @@
return $t.parse(iso8601);
}
});
-
- $.fn.timeago = function() {
+
+ // callback function param that gets called on each refresh
+ $.fn.timeago = function(callback) {
var self = this;
- self.each(refresh);
+
+ self.each(function() {
+ refresh.call(this, callback);
+ });
var $s = $t.settings;
if ($s.refreshMillis > 0) {
- setInterval(function() { self.each(refresh); }, $s.refreshMillis);
+ setInterval(function() { self.each(function() {refresh.call(this, callback)}); }, $s.refreshMillis);
}
return self;
};
-
- function refresh() {
+
+ function refresh(callback) {
var data = prepareData(this);
if (!isNaN(data.datetime)) {
$(this).text(inWords(data.datetime));
+ // make a call to the callback function if it exists
+ if (callback) {
+ callback.call(this, distance(data.datetime));
+ }
}
return this;
}
Something went wrong with that request. Please try again.