Pastable version of Beautify JS Date to how recently the event occured.

<div style="overflow:auto;border:solid 1px #ccc;background:#000;color:#F8F8F8">
          <div class="section">
            
            <pre style="float:left;margin:0 10px;border-right:0;color:#666;">1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48</pre>
            <pre class="sunburst"><span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">/**</span>*</span>
<span style="color:#AEAEAE;font-style:italic;">* Beautify date to how recent the event occurred compared to now.</span>
<span style="color:#AEAEAE;font-style:italic;">* Some examples:  1 second, 4 hours, 10 days, 1 year.</span>
<span style="color:#AEAEAE;font-style:italic;">*	Example:</span>
<span style="color:#AEAEAE;font-style:italic;">*   var oneFiftyMin = new Date(new Date().getTime() - 60000 * 150);</span>
<span style="color:#AEAEAE;font-style:italic;">*   alert(oneFiftyMin.when()); // will display &quot;2 hours&quot;</span>
<span style="color:#AEAEAE;font-style:italic;">*</span>
<span style="color:#AEAEAE;font-style:italic;">*  Handy for things like &quot;Item posted &quot; + someDate.when() + &quot; ago.&quot;</span>
<span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">*/</span></span>
<span style="color:#9B859D;">Date</span>.<span style="color:#CF6A4C;">prototype</span>.<span style="color:#89BDFF;">when</span> = <span style="color:#99CF50;">function</span>() {

<span style="color:#99CF50;">var</span> diff <span style="color:#E28964;">=</span> <span style="color:#E28964;">new</span> <span style="text-decoration:underline;">Date</span>().<span style="color:#DAD085;">getTime</span>() <span style="color:#E28964;">-</span> <span style="color:#3E87E3;">this</span>.<span style="color:#DAD085;">getTime</span>();
	<span style="color:#99CF50;">var</span> when; <span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">//</span> our return value</span>

<span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">//</span>TODO:  what if the time is in the future? </span>
	<span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">//</span>if (diff &lt; 0) throw new Error (&quot;Date is in future, check timezone?&quot;;</span>

<span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">//</span>one or more of these will be non-zero, but we only care about the biggest one (in scale of time)</span>
  <span style="color:#99CF50;">var</span> secondsOld <span style="color:#E28964;">=</span> <span style="color:#9B859D;">Math</span>.<span style="color:#DAD085;">floor</span>(diff / <span style="color:#3387CC;">1000</span>);
  <span style="color:#99CF50;">var</span> minutesOld <span style="color:#E28964;">=</span> <span style="color:#9B859D;">Math</span>.<span style="color:#DAD085;">floor</span>(diff / <span style="color:#3387CC;">60000</span>);
  <span style="color:#99CF50;">var</span> hoursOld   <span style="color:#E28964;">=</span> <span style="color:#9B859D;">Math</span>.<span style="color:#DAD085;">floor</span>(diff / <span style="color:#3387CC;">3600000</span>);
  <span style="color:#99CF50;">var</span> daysOld    <span style="color:#E28964;">=</span> <span style="color:#9B859D;">Math</span>.<span style="color:#DAD085;">floor</span>(diff / <span style="color:#3387CC;">86400000</span>);
	<span style="color:#99CF50;">var</span> monthsOld  <span style="color:#E28964;">=</span> <span style="color:#9B859D;">Math</span>.<span style="color:#DAD085;">floor</span>(diff / <span style="color:#3387CC;">2592000000</span>);
	<span style="color:#99CF50;">var</span> yearsOld   <span style="color:#E28964;">=</span> <span style="color:#9B859D;">Math</span>.<span style="color:#DAD085;">floor</span>(diff / (<span style="color:#3387CC;">2592000000</span> <span style="color:#E28964;">*</span> <span style="color:#3387CC;">12</span>));  <span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">//</span>your content is old!</span>

<span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">//</span>determine which value is non-zero and assign appropriate text</span>
  <span style="color:#E28964;">if</span> (yearsOld <span style="color:#E28964;">&gt;</span> <span style="color:#3387CC;">0</span>) {
		when <span style="color:#E28964;">=</span> yearsOld <span style="color:#E28964;">+</span> <span style="color:#65B042;"><span style="color:#65B042;">&quot;</span> year<span style="color:#65B042;">&quot;</span></span>;
  }
  <span style="color:#E28964;">else</span> <span style="color:#E28964;">if</span> (monthsOld <span style="color:#E28964;">&gt;</span> <span style="color:#3387CC;">0</span>) {
		when <span style="color:#E28964;">=</span> monthsOld <span style="color:#E28964;">+</span> <span style="color:#65B042;"><span style="color:#65B042;">&quot;</span> month<span style="color:#65B042;">&quot;</span></span>;
  }
  <span style="color:#E28964;">else</span> <span style="color:#E28964;">if</span> (daysOld <span style="color:#E28964;">&gt;</span> <span style="color:#3387CC;">0</span>) {
		when <span style="color:#E28964;">=</span> daysOld <span style="color:#E28964;">+</span> <span style="color:#65B042;"><span style="color:#65B042;">&quot;</span> day<span style="color:#65B042;">&quot;</span></span>;
  }
  <span style="color:#E28964;">else</span> <span style="color:#E28964;">if</span> (hoursOld <span style="color:#E28964;">&gt;</span> <span style="color:#3387CC;">0</span>) {
		when <span style="color:#E28964;">=</span> hoursOld <span style="color:#E28964;">+</span> <span style="color:#65B042;"><span style="color:#65B042;">&quot;</span> hour<span style="color:#65B042;">&quot;</span></span>;
  }
  <span style="color:#E28964;">else</span> <span style="color:#E28964;">if</span> (minutesOld <span style="color:#E28964;">&gt;</span> <span style="color:#3387CC;">0</span>) {
		when <span style="color:#E28964;">=</span> minutesOld <span style="color:#E28964;">+</span> <span style="color:#65B042;"><span style="color:#65B042;">&quot;</span> minute<span style="color:#65B042;">&quot;</span></span>;
  }
  <span style="color:#E28964;">else</span> {
		when <span style="color:#E28964;">=</span> <span style="color:#9B859D;">Math</span>.<span style="color:#DAD085;">round</span>(diff /<span style="color:#3387CC;">1000</span>) <span style="color:#E28964;">+</span> <span style="color:#65B042;"><span style="color:#65B042;">&quot;</span> second<span style="color:#65B042;">&quot;</span></span>;
	}

<span style="color:#AEAEAE;font-style:italic;"><span style="color:#AEAEAE;font-style:italic;">//</span>add plural if necessary</span>
	<span style="color:#E28964;">return</span> (<span style="color:#3387CC;">0</span> <span style="color:#E28964;">==</span> when.<span style="color:#DAD085;">indexOf</span>(<span style="color:#65B042;"><span style="color:#65B042;">&quot;</span>1 <span style="color:#65B042;">&quot;</span></span>)) ? when : when <span style="color:#E28964;">+</span> <span style="color:#65B042;"><span style="color:#65B042;">&quot;</span>s<span style="color:#65B042;">&quot;</span></span>;
} 
</pre>
          </div>
        </div>

<a href="http://refactormycode.com/codes/37-beautify-js-date-to-how-recently-the-event-occured" style="color:#fff" title="As seen on RefactorMyCode.com"><img alt="Small_logo" src="http://refactormycode.com/images/small_logo.gif" style="border:0" /></a>

counter free hit invisible