get past time from date
by skydivematy
HTML
<div id="ajaxComments">
<div class="mdl-list-Comments">
<ul class="mdl-list mdl-list-comments">
<li class="mdl-list__item mdl-list__item--three-line"><span class="mdl-list__item-primary-content"><i class="material-icons mdl-list__item-avatar">person</i><input type="text" name="hidden" class="show" value="2013-08-11"> <time class="dateFromDate icon-time"></time><span class="author">Antonio Santana Hernández</span>
<span class="mdl-list__item-text-body">El pasado 5 de agosto fuimos mi hijo Joel, mi mujer Eugenia...</span>
</span><span class="mdl-list__item-secondary-content"><a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a></span></li>
<li class="mdl-list__item mdl-list__item--three-line"><span class="mdl-list__item-primary-content"><i class="material-icons mdl-list__item-avatar">person</i><input type="text" name="hidden" class="show" value="2013-08-31"> <time class="dateFromDate icon-time"></time><span class="author">Anja Richstein</span>
<span class="mdl-list__item-text-body">Tolles Team!!!! Meine Tochter war begeistert!!!Weiter so!!!...</span>
</span><span class="mdl-list__item-secondary-content"><a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a></span></li>
<li class="mdl-list__item mdl-list__item--three-line"><span class="mdl-list__item-primary-content"><i class="material-icons mdl-list__item-avatar">person</i><input type="text" name="hidden" class="show" value="2013-09-03"> <time class="dateFromDate icon-time"></time><span class="author">Lukas From Dortmund</span>
<span class="mdl-list__item-text-body">super toll hat richtig spaß gemacht muss man mal gemacht...</span>
</span><span class="mdl-list__item-secondary-content"><a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a></span></li>
<li class="mdl-list__item mdl-list__item--three-line"><span...
CSS
.mdl-list {
display: block;
padding: 8px 0;
list-style: none;
}
.mdl-list__item {
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 24px;
letter-spacing: 0.04em;
line-height: 1;
display: flex;
min-height: 48px;
box-sizing: border-box;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
padding: 16px;
cursor: default;
color: rgba(0, 0, 0, 0.87);
overflow: hidden;
}
.mdl-list__item--three-line {
height: 88px;
}
.mdl-list__item--three-line .mdl-list__item-primary-content {
height: 52px;
line-height: 20px;
display: block;
}
.mdl-list__item--three-line .mdl-list__item-primary-content {
height: 52px;
line-height: 20px;
display: block;
}
.mdl-list__item--three-line .mdl-list__item-secondary-content {
height: 52px;
}
.mdl-list__item--three-line .mdl-list__item-secondary-content {
height: 52px;
}
JavaScript
//$('li .dateFromDate').each(function (index, value){
var calculateAge = function(birthday) {
var now = new Date();
var past = new Date(birthday);
var nowYear = now.getFullYear();
var pastYear = past.getFullYear();
var age = nowYear - pastYear;
return age;
};
var $birthday = $('.show').val();
//console.log('Your age is ' + calculateAge($birthday) + ' years');
//$('.dateFromDate').html(calculateAge($birthday));
//});
! function(i) {
i.fn.simpleSpy = function(t, e) {
return t = t || 2, e = e || 8e3, this.each(function() {
function n() {
var t = i(h[s]).css({
height: 0,
opacity: 0
}).prependTo(a);
a.find("> li:last").animate({
opacity: 0
}, 1e3, function() {
t.animate({
height: o
}, 1e3).animate({
opacity: 1
}, 1e3), i(this).animate({
height: 0
}, 1e3, function() {
i(this).remove()
})
}), s++, s >= c && (s = 0), setTimeout(n, e)
}
var a = i(this),
h = [],
s = t,
c = 0,
o = a.find("> li:first").height();
a.find("> li").each(function() {
h.push("<li>" + i(this).html() + "</li>")
}), c = h.length, a.wrap('<div class="ajaxComments" />').parent().css({
height: o * t
}), a.find("> li").filter(":gt(" + (t - 1) + ")").remove(), n()
})
}
}(jQuery);
// VERSION 1
//
//$(function () {
// $('ul.spy').simpleSpy();
//});
//
(function($) {
$.fn.simpleSpy = function(limit, interval) {
limit = limit || 3;
interval = interval || 8000;
return this.each(function() {
var $list = $(this),
items = [], // uninitialised
currentItem = limit,
total = 0; // initialise later on
// height = $list.find('> li:first').height();
// capture the cache
$list.find('> li').each(function() {
items.push('<li class="mdl-list__item...