Skip to content

S
solo
Commit 0b7613ce authored by Vanessa's avatar Vanessa
Browse files
Options

timeline index

parent 444d4e01
Expand all Show whitespace changes
Inline Side-by-side
Showing with 220 additions and 138 deletions
war/src/main/webapp/skins/timeline/css/timeline.css
View file @ 0b7613ce
......@@ -550,15 +550,16 @@ article .article-title a {
border-radius: 20em 20em 20em 20em;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset, 0 1px 0 rgba(255, 255, 255, 0.6);
color: #FFFFFF;
cursor: pointer;
font-weight: bold;
height: 19px;
left: 50%;
margin-left: -36px;
margin-left: -38px;
padding: 5px 20px;
position: absolute;
text-align: center;
top: 100%;
cursor: pointer;
height: 19px;
width: 26px;
width: 36px;
}
.article-archive {
......@@ -686,4 +687,32 @@ article .article-title a {
text-align: center;
white-space: nowrap;
}
.nav-abs li {
cursor: pointer;
height: 20px;
list-style-type: none;
min-width: 120px;
padding: 3px 10px;
text-align: left;
background-color: #DEDDDD;
color: #616161;
}
.nav-abs li.year {
color: #CCCCCC;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
background-color: #6B6B6B;
padding: 5px 10px;
}
.nav-abs li:hover {
background-color: #EFEEEE;
color: #000;
}
.nav-abs li.year:hover {
background-color: #353535;
color: #fff;
}
/* end others */
\ No newline at end of file
war/src/main/webapp/skins/timeline/index.ftl
View file @ 0b7613ce
......@@ -10,31 +10,34 @@
<body>
${topBarReplacement}
<#include "header.ftl">
<div class="nav-abs">
<ul class="nav-abs" style="padding: 0;">
<#list archiveDates as archiveDate>
<span data-year="${archiveDate.archiveDateYear}">
<li data-year="${archiveDate.archiveDateYear}"
onclick="timeline.getArchive('${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}')">
<#if "en" == localeString?substring(0, 2)>
<a href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}"
title="${archiveDate.monthName} ${archiveDate.archiveDateYear}(${archiveDate.archiveDatePublishedArticleCount})">
${archiveDate.monthName} ${archiveDate.archiveDateYear}(${archiveDate.archiveDatePublishedArticleCount})</a>
${archiveDate.monthName} ${archiveDate.archiveDateYear}(${archiveDate.archiveDatePublishedArticleCount})
<#else>
<a href="${servePath}/archives/${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}"
title="${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}(${archiveDate.archiveDatePublishedArticleCount})">
${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}(${archiveDate.archiveDatePublishedArticleCount})</a>
${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}(${archiveDate.archiveDatePublishedArticleCount})
</#if>
</span>
</li>
</#list>
</div>
</ul>
<div class="wrapper">
<div class="articles container">
<div class="vertical"></div>
<#list ["17:02", "17:01"] as date>
<div class="fn-clear">
<#list archiveDates as archiveDate>
<div class="fn-clear" id="${archiveDate.archiveDateYear}${archiveDate.archiveDateMonth}">
<h2>
<span class="article-archive">${date}</span>
<span class="article-archive">
<#if "en" == localeString?substring(0, 2)>
${archiveDate.monthName} ${archiveDate.archiveDateYear}
<#else>
${archiveDate.archiveDateYear} ${yearLabel} ${archiveDate.archiveDateMonth} ${monthLabel}
</#if>
</span>
</h2>
<#list articles as article>
<#if article.articleCreateDate?string("HH:mm") == date>
<#if article.articleCreateDate?string("yyyy/MM") == "${archiveDate.archiveDateYear}/${archiveDate.archiveDateMonth}">
<article>
<div class="module">
<div class="dot"></div>
......@@ -85,7 +88,7 @@
</div>
</article>
<#if paginationCurrentPageNum != paginationPageCount && 0 != paginationPageCount && !article_has_next>
<div class="article-more" onclick="timeline.getNextPage(this, '${date}')" data-page="${paginationCurrentPageNum}">${moreLabel}</div>
<div class="article-more" onclick="timeline.getNextPage(this, '${article.articleCreateDate?string("yyyy/MM")}')" data-page="${paginationCurrentPageNum}">${moreLabel}</div>
</#if>
</#if>
</#list>
......
war/src/main/webapp/skins/timeline/js/timeline.js
View file @ 0b7613ce
......@@ -34,10 +34,8 @@ var timeline = {
$articles.find("article").each(function () {
var $it = $(this),
isLeft = colH[1] > colH[0],
left = isLeft ? 0 : "inherit",
top = isLeft ? colH[0] : colH[1];
$it.css({
"left": left + "px",
"top": top + "px",
"position": "absolute"
});
......@@ -64,10 +62,27 @@ var timeline = {
return;
}
// 如果为 index 页面，重构 archives 结构，使其可收缩
var year = 0;
$(".nav-abs li").each(function (i) {
var $this = $(this);
$this.hide();
if (year !== $this.data("year")) {
year = $this.data("year");
$this.before("<li class='year' onclick='timeline.toggleArchives(" +
year + ")'>" + year + "</div></li>");
}
});
$(window).resize(function () {
$archives.each(function () {
var colH = [timeline._COLHA + 60, timeline._COLHB * 4];
$(this).find("article").each(function () {
var $articles = $(this).find("article");
if ($articles.length === 0) {
$(this).find("h2").remove();
} else {
$articles.each(function () {
var $it = $(this),
isLeft = colH[1] > colH[0],
top = isLeft ? colH[0] : colH[1];
......@@ -85,6 +100,7 @@ var timeline = {
colH[( isLeft ? '0' : '1' )] += parseInt($it.outerHeight(true));
});
$(this).height(colH[0] > colH[1] ? colH[0] : colH[1]);
}
});
});
......@@ -118,7 +134,21 @@ var timeline = {
window.open("http://translate.google.com/translate?sl=auto&tl=auto&u=" + location.href);
},
getNextPage: function (it, archives) {
getArchive: function (archive) {
var archiveDate = archive.replace("/", "");
if ($("#" + archiveDate + " > article").length > 0) {
window.location.hash = "#" + archiveDate;
} else {
var archiveHTML = '<h2><span class="article-archive">' + archiveDate + '</span></h2>'
+ '<div class="article-more" onclick="timeline.getNextPage(this, \''
+ archive + '\')" data-page="0">' + Label.moreLabel + '</div>';
$("#" + archiveDate).html(archiveHTML)
timeline.getNextPage($("#" + archiveDate).find(".article-more")[0], archive);
}
},
getNextPage: function (it, archive) {
var $more = $(it),
currentPage = $more.data("page") + 1,
path = "/articles/";
......@@ -128,8 +158,8 @@ var timeline = {
} else if (location.pathname.indexOf("authors") === 1) {
var pathnames = location.pathname.split("/authors/");
path = "/articles/authors/" + pathnames[1].split("/")[0] + "/";
} else if (archives) {
path = "/articles/archives/" + archives + "/";
} else if (archive) {
path = "/articles/archives/" + archive + "/";
}
$.ajax({
url: latkeConfig.servePath + path + currentPage,
......@@ -189,6 +219,9 @@ var timeline = {
+ '</a></span></div></article>';
}
var colH = [parseInt($(".article-more").prev().css("top")) + $(".article-more").prev().css("top").outerHeight(true),
parseInt($(".article-more").prev().prev().css("top")) + $(".article-more").prev().prev().css("top").outerHeight(true)];
$more.before(articlesHTML).data("page", currentPage);
// 最后一页处理
......@@ -198,7 +231,35 @@ var timeline = {
$more.css("background", "none #60829F").text(Label.moreLabel);
}
$(window).resize();
$("#" + archive.replace("/", "") + " article").each(function () {
if (this.className !== "r" && this.className !== "l") {
var $it = $(this),
isLeft = colH[1] > colH[0],
top = isLeft ? colH[0] : colH[1];
$it.css({
"top": top + "px",
"position": "absolute"
});
if (isLeft) {
$it.addClass("l");
} else {
$it.addClass("r");
}
colH[( isLeft ? '0' : '1' )] += parseInt($it.outerHeight(true));
}
});
$("#" + archive.replace("/", "")).height(colH[0] > colH[1] ? colH[0] : colH[1]);
}
});
},
toggleArchives: function (year) {
$(".nav-abs li").each(function (i) {
var $this = $(this);
if (year === $this.data("year")) {
$this.toggle();
}
});
}
......
war/src/main/webapp/skins/timeline/js/timeline.min.js
View file @ 0b7613ce
......@@ -13,8 +13,8 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*//**
* @fileoverview ease js.
* @fileoverview timeline js.
*
* @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
* @version 1.0.1.4, Aug 29, 2012
*/var goTranslate=function(){window.open("http://translate.google.com/translate?sl=auto&tl=auto&u="+location.href)},getNextPage=function(){var e=$(".article-next");currentPage+=1;var t="/articles/";if(location.pathname.indexOf("tags")>-1){var n=location.pathname.split("/tags/"),r=n[1].split("/");t="/articles/tags/"+r[0]+"/"}else if(location.pathname.indexOf("archives")>-1){var i=location.pathname.split("/archives/"),s=i[1].split("/");t="/articles/archives/"+s[0]+"/"+s[1]+"/"}$.ajax({url:latkeConfig.servePath+t+currentPage,type:"GET",beforeSend:function(){e.css("background","url("+latkeConfig.staticServePath+"/skins/ease/images/ajax-loader.gif) no-repeat scroll center center #fefefe")},success:function(t,n){if(!t.sc)return;var r="",i=t.rslts.pagination;for(var s=0;s<t.rslts.articles.length;s++){var o=t.rslts.articles[s],u="";t.rslts.articles.length-1===s&&(u=" article-last"),r+='<li class="article'+u+'">'+'<div class="article-title">'+"<h2>"+'<a rel="bookmark" class="ft-gray" href="'+latkeConfig.servePath+o.articlePermalink+'">'+o.articleTitle+"</a>",o.hasUpdated&&(r+="<sup>"+Label.updatedLabel+"</sup>"),o.articlePutTop&&(r+="<sup>"+Label.topArticleLabel+"</sup>"),r+='</h2><div class="right"><a rel="nofollow" class="ft-gray" href="'+latkeConfig.servePath+o.articlePermalink+'#comments">'+ +o.articleCommentCount+"&nbsp;&nbsp;"+Label.commentLabel+"</a>&nbsp;&nbsp;"+'<a rel="nofollow" class="ft-gray" href="'+latkeConfig.servePath+o.articlePermalink+'">'+o.articleViewCount+"&nbsp;&nbsp;"+Label.viewLabel+"</a>"+"</div>"+'<div class="clear"></div>'+"</div>"+'<div class="article-body">'+'<div id="abstract'+o.oId+'">'+o.articleAbstract+"</div>"+'<div id="content'+o.oId+'" class="none"></div>'+"</div>"+'<div class="right ft-gray">',o.hasUpdated?r+=Util.toDate(o.articleUpdateDate,"yy-MM-dd HH:mm"):r+=Util.toDate(o.articleCreateDate,"yy-MM-dd HH:mm"),r+=' <a href="'+latkeConfig.servePath+"/authors/"+o.authorId+'">'+o.authorName+"</a>"+"</div>"+'<div class="left ft-gray">'+Label.tag1Label+" ";var a=o.articleTags.split(",");for(var f=0;f<a.length;f++)r+='<a rel="tag" href="'+latkeConfig.servePath+"/tags/"+encodeURIComponent(a[f])+'">'+a[f]+"</a>",f<a.length-1&&(r+=", ");r+='</div><div class="clear"></div></li>'}$(".article-last").removeClass("article-last"),$(".main>.wrapper>ul").append(r),i.paginationPageCount===currentPage?e.remove():e.css("background","none")}})},ease={$header:$(".header"),headerH:103,$body:$(".main > .wrapper"),$nav:$(".nav"),getCurrentPage:function(){var e=$(".article-next");e.length>0&&(window.currentPage=e.data("page"))},setNavCurrent:function(){$(".nav ul a").each(function(){var e=$(this);e.attr("href")===latkeConfig.servePath+location.pathname?e.addClass("current"):/\/[0-9]+$/.test(location.pathname)&&($(".nav ul li")[0].className="current")})},initCommon:function(){Util.init(),Util.replaceSideEm($(".recent-comments-content")),Util.buildTags("tagsSide")},initArchives:function(){var e=$(".archives");if(e.length<1)return;$(".footer").css("marginTop","30px");var t=[],n=e.find("span").each(function(){var e=$(this).data("year"),n=!0;for(var r=0;r<t.length;r++)if(e===t[r]){n=!1;break}n&&t.push(e)}),r="";for(var i=0;i<t.length;i++){var s="";for(var o=0;o<n.length;o++){var u=$(n[o]);u.data("year")===t[i]&&(s+=u.html())}r+="<div><h3 class='ft-gray'>"+t[i]+"</h3>"+s+"</div>"}e.html(r);var a=$(".archives>div"),f=0,l=0,c=[];for(var h=0;h<a.length;h++){for(var p=0;p<3;p++){if(h>=a.length)break;a[h].style.left=p*310+"px",f>0?(a[h-3].style.top!==""&&(l=parseInt(a[h-3].style.top)),a[h].style.top=$(a[h-3]).height()+60+l+"px",c[p]=parseInt(a[h].style.top)+$(a[h]).height()+60):c[p]=$(a[h]).height()+60,p<2&&(h+=1)}f+=1}e.height(c.sort()[c.length-1])},scrollEvent:function(){var e=this;$(window).scroll(function(){var t=$(window).scrollTop(),n=0;$("#top").css("display")==="block"&&(n=$("#top").height()),t>=e.headerH+n?(e.$nav.css("position","fixed"),e.$body.css("marginTop","55px")):(e.$nav.css("position","inherit"),e.$body.css("marginTop","0"));if(t>e.headerH){var r=$(window).height(),i=t+r-21;$("body").height()-58<=t+r&&(i=$(".footer").offset().top-21),$("#goTop").fadeIn("slow").css("top",i)}else $("#goTop").hide()})},setDynamic:function(){var e=$(".dynamic");if($(".dynamic").length<1)return;var t=e.find(".side-comments"),n=e.find(".side-tags"),r=e.find(".side-most-comment"),i=e.find(".side-most-view");t.height()>n.height()?n.height(t.height()):t.height(n.height()),r.height()>i.height()?i.height(r.height()):r.height(i.height()),$(".article-body").each(function(){this.innerHTML=Util.replaceEmString($(this).html())})},scrollToCmt:function(){$(window.location.hash).length==1&&$(window).scrollTop($(window.location.hash).offset().top-60)}};(function(){ease.getCurrentPage(),ease.initCommon(),ease.scrollEvent(),ease.setNavCurrent(),ease.initArchives(),ease.setDynamic()})();
\ No newline at end of file
* @version 1.0.0.1, Jan 14, 2013
*/var timeline={_COLHA:0,_COLHB:20,_initArticleList:function(){var e=$(".articles");if(e.length===0||$(".articles > .fn-clear").length>0)return;$(window).resize(function(){var t=[timeline._COLHA,timeline._COLHB];e.find("article").each(function(){var e=$(this),n=t[1]>t[0],r=n?t[0]:t[1];e.css({top:r+"px",position:"absolute"}),n?e.addClass("l"):e.addClass("r"),t[n?"0":"1"]+=parseInt(e.outerHeight(!0))}),e.height(t[0]>t[1]?t[0]:t[1])}),$(window).resize()},_initIndexList:function(){var e=$(".articles > .fn-clear");if(e.length===0)return;var t=0;$(".nav-abs li").each(function(e){var n=$(this);n.hide(),t!==n.data("year")&&(t=n.data("year"),n.before("<li class='year' onclick='timeline.toggleArchives("+t+")'>"+t+"</div></li>"))}),$(window).resize(function(){e.each(function(){var e=[timeline._COLHA+60,timeline._COLHB*4],t=$(this).find("article");t.length===0?$(this).find("h2").remove():(t.each(function(){var t=$(this),n=e[1]>e[0],r=n?e[0]:e[1];t.css({top:r+"px",position:"absolute"}),n?t.addClass("l"):t.addClass("r"),e[n?"0":"1"]+=parseInt(t.outerHeight(!0))}),$(this).height(e[0]>e[1]?e[0]:e[1]))})}),$(window).resize()},_setNavCurrent:function(){$(".header li a").each(function(){$(this).attr("href")===location.href.split("#")[0]?this.className="current":this.className=""})},init:function(){$(window).scroll(function(){$(window).scrollTop()>60?$(".ico-top").show():$(".ico-top").hide()}),timeline._initIndexList(),timeline._initArticleList(),timeline._setNavCurrent()},translate:function(){window.open("http://translate.google.com/translate?sl=auto&tl=auto&u="+location.href)},getArchive:function(e){var t=e.replace("/","");if($("#"+t+" > article").length>0)window.location.hash="#"+t;else{var n='<h2><span class="article-archive">'+t+"</span></h2>"+'<div class="article-more" onclick="timeline.getNextPage(this, \''+e+'\')" data-page="0">'+Label.moreLabel+"</div>";$("#"+t).html(n),timeline.getNextPage($("#"+t).find(".article-more")[0],e)}},getNextPage:function(e,t){var n=$(e),r=n.data("page")+1,i="/articles/";if(location.pathname.indexOf("tags")===1){var s=location.pathname.split("/tags/");i="/articles/tags/"+s[1].split("/")[0]+"/"}else if(location.pathname.indexOf("authors")===1){var s=location.pathname.split("/authors/");i="/articles/authors/"+s[1].split("/")[0]+"/"}else t&&(i="/articles/archives/"+t+"/");$.ajax({url:latkeConfig.servePath+i+r,type:"GET",beforeSend:function(){n.css("background","url("+latkeConfig.staticServePath+"/skins/timeline/images/ajax-loader.gif) no-repeat scroll center center #60829F").text("")},success:function(e,i){if(!e.sc)return;var s="",o=e.rslts.pagination;for(var u=0;u<e.rslts.articles.length;u++){var a=e.rslts.articles[u];s+='<article><div class="module"><div class="dot"></div><div class="arrow"></div><time class="article-time"><span>'+Util.toDate(a.articleCreateTime,"yy-MM-dd HH:mm")+'</span></time><h2 class="article-title"><a rel="bookmark" href="'+latkeConfig.servePath+a.articlePermalink+'">'+a.articleTitle+"</a>",a.hasUpdated&&(s+="<sup>"+Label.updatedLabel+"</sup>"),a.articlePutTop&&(s+="<sup>"+Label.topArticleLabel+"</sup>"),s+="</h2><p>"+a.articleAbstract+"</p>"+'<span class="ico-tags ico" title="'+Label.tagLabel+'">';var f=a.articleTags.split(",");for(var l=0;l<f.length;l++)s+='<a rel="category tag" href="'+latkeConfig.servePath+"/tags/"+encodeURIComponent(f[l])+'">'+f[l]+"</a>",l<f.length-1&&(s+=",");s+='</span>&nbsp;<span class="ico-author ico" title="'+Label.authorLabel+'">'+'<a rel="author" href="'+latkeConfig.servePath+"/authors/"+a.authorId+'">'+a.authorName+'</a></span>&nbsp;<span class="ico-comment ico" title="'+Label.commentLabel+'"><a rel="nofollow" href="'+latkeConfig.servePath+a.articlePermalink+'#comments">'+(a.articleCommentCount===0?Label.noCommentLabel:a.articleCommentCount)+'</a></span>&nbsp;<span class="ico-view ico" title="'+Label.viewLabel+'">'+'<a rel="nofollow" href="${servePath}${article.articlePermalink}">'+a.articleViewCount+"</a></span></div></article>"}var c=[parseInt($(".article-more").prev().css("top"))+$(".article-more").prev().css("top").outerHeight(!0),parseInt($(".article-more").prev().prev().css("top"))+$(".article-more").prev().prev().css("top").outerHeight(!0)];n.before(s).data("page",r),o.paginationPageCount===r?n.remove():n.css("background","none #60829F").text(Label.moreLabel),$("#"+t.replace("/","")+" article").each(function(){if(this.className!=="r"&&this.className!=="l"){var e=$(this),t=c[1]>c[0],n=t?c[0]:c[1];e.css({top:n+"px",position:"absolute"}),t?e.addClass("l"):e.addClass("r"),c[t?"0":"1"]+=parseInt(e.outerHeight(!0))}}),$("#"+t.replace("/","")).height(c[0]>c[1]?c[0]:c[1])}})},toggleArchives:function(e){$(".nav-abs li").each(function(t){var n=$(this);e===n.data("year")&&n.toggle()})}};(function(){Util.init(),Util.replaceSideEm($(".recent-comments-content")),Util.buildTags("tagsSide"),timeline.init()})();
\ No newline at end of file
war/src/main/webapp/skins/timeline/lang/lang_en_US.properties
View file @ 0b7613ce
......@@ -70,7 +70,7 @@ firstPageLabel=First Page
lastPageLabel=Last Page
archive1Label=Archive:
author1Label=Author:
tag1Label=Tags:
tagLabel=Tags
sorryLabel=Sorry!
notFoundLabel=Not Found!
returnTo1Label=Return:
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment