Skip to content

S
solo
Commit 508eb8d2 authored by Vanessa's avatar Vanessa
Browse files
Options

timeline 自测

parent f2e1822a
Show whitespace changes
Inline Side-by-side
Showing with 286 additions and 32 deletions
war/src/main/webapp/skins/timeline/article-list.ftl
View file @ 508eb8d2
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
${article.articleCreateDate?string("yy-MM-dd HH:mm")} ${article.articleCreateDate?string("yy-MM-dd HH:mm")}
</span> </span>
</time> </time>
<h2 class="article-title"> <h3 class="article-title">
<a rel="bookmark" href="${servePath}${article.articlePermalink}"> <a rel="bookmark" href="${servePath}${article.articlePermalink}">
${article.articleTitle} ${article.articleTitle}
</a> </a>
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
${topArticleLabel} ${topArticleLabel}
</sup> </sup>
</#if> </#if>
</h2> </h3>
<p> <p>
${article.articleAbstract} ${article.articleAbstract}
</p> </p>
......
war/src/main/webapp/skins/timeline/author-articles.ftl
View file @ 508eb8d2
...@@ -10,11 +10,11 @@ ...@@ -10,11 +10,11 @@
<body> <body>
${topBarReplacement} ${topBarReplacement}
<#include "header.ftl"> <#include "header.ftl">
<h2 class="nav-abs"> <h3 class="nav-abs">
<img style="border-radius: 45px;" width="90" title="${authorName}" src="${authorThumbnailURL}"/> <img style="border-radius: 45px;" width="90" title="${authorName}" src="${authorThumbnailURL}"/>
<br/> <br/>
${authorName} ${authorName}
</h2> </h3>
<#include "article-list.ftl"> <#include "article-list.ftl">
<#include "footer.ftl"> <#include "footer.ftl">
</body> </body>
......
war/src/main/webapp/skins/timeline/js/timeline.js
View file @ 508eb8d2
...@@ -184,7 +184,7 @@ var timeline = { ...@@ -184,7 +184,7 @@ var timeline = {
articlesHTML += '<article><div class="module"><div class="dot"></div>' articlesHTML += '<article><div class="module"><div class="dot"></div>'
+ '<div class="arrow"></div><time class="article-time"><span>' + '<div class="arrow"></div><time class="article-time"><span>'
+ Util.toDate(article.articleCreateTime, 'yy-MM-dd HH:mm') + Util.toDate(article.articleCreateTime, 'yy-MM-dd HH:mm')
+ '</span></time><h2 class="article-title"><a rel="bookmark" href="' + '</span></time><h3 class="article-title"><a rel="bookmark" href="'
+ latkeConfig.servePath + article.articlePermalink + '">' + latkeConfig.servePath + article.articlePermalink + '">'
+article.articleTitle + '</a>'; +article.articleTitle + '</a>';
...@@ -196,7 +196,7 @@ var timeline = { ...@@ -196,7 +196,7 @@ var timeline = {
articlesHTML += '<sup>' + Label.topArticleLabel + '</sup>'; articlesHTML += '<sup>' + Label.topArticleLabel + '</sup>';
} }
articlesHTML += '</h2><p>' + article.articleAbstract + '</p>' articlesHTML += '</h3><p>' + article.articleAbstract + '</p>'
+ '<span class="ico-tags ico" title="' + Label.tagLabel + '">'; + '<span class="ico-tags ico" title="' + Label.tagLabel + '">';
var articleTags = article.articleTags.split(","); var articleTags = article.articleTags.split(",");
...@@ -219,8 +219,8 @@ var timeline = { ...@@ -219,8 +219,8 @@ var timeline = {
+ '</a></span></div></article>'; + '</a></span></div></article>';
} }
var colH = [parseInt($(".article-more").prev().css("top")) + $(".article-more").prev().css("top").outerHeight(true), var colH = [parseInt($(".article-more").prev().prev().css("top")) + $(".article-more").prev().prev().outerHeight(true),
parseInt($(".article-more").prev().prev().css("top")) + $(".article-more").prev().prev().css("top").outerHeight(true)]; parseInt($(".article-more").prev().css("top")) + $(".article-more").prev().outerHeight(true)];
$more.before(articlesHTML).data("page", currentPage); $more.before(articlesHTML).data("page", currentPage);
...@@ -231,7 +231,7 @@ var timeline = { ...@@ -231,7 +231,7 @@ var timeline = {
$more.css("background", "none #60829F").text(Label.moreLabel); $more.css("background", "none #60829F").text(Label.moreLabel);
} }
$("#" + archive.replace("/", "") + " article").each(function () { $((archive ? "#" + archive.replace("/", "") : ".articles") + " article").each(function () {
if (this.className !== "r" && this.className !== "l") { if (this.className !== "r" && this.className !== "l") {
var $it = $(this), var $it = $(this),
isLeft = colH[1] > colH[0], isLeft = colH[1] > colH[0],
...@@ -250,7 +250,7 @@ var timeline = { ...@@ -250,7 +250,7 @@ var timeline = {
colH[( isLeft ? '0' : '1' )] += parseInt($it.outerHeight(true)); colH[( isLeft ? '0' : '1' )] += parseInt($it.outerHeight(true));
} }
}); });
$("#" + archive.replace("/", "")).height(colH[0] > colH[1] ? colH[0] : colH[1]); $(archive ? "#" + archive.replace("/", "") : ".articles").height(colH[0] > colH[1] ? colH[0] : colH[1]);
} }
}); });
}, },
......
war/src/main/webapp/skins/timeline/js/timeline.min.js
View file @ 508eb8d2
...@@ -12,9 +12,263 @@ ...@@ -12,9 +12,263 @@
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*//** */
/**
* @fileoverview timeline js. * @fileoverview timeline js.
* *
* @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a> * @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
* @version 1.0.0.1, Jan 14, 2013 * @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 var timeline = {
_COLHA: 0,
_COLHB: 20,
_initArticleList: function () {
var $articles = $(".articles");
if ($articles.length === 0 || $(".articles > .fn-clear").length > 0) {
return;
}
$(window).resize(function () {
var colH = [timeline._COLHA, timeline._COLHB];
$articles.find("article").each(function () {
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));
});
$articles.height(colH[0] > colH[1] ? colH[0] : colH[1]);
});
$(window).resize();
},
_initIndexList: function () {
var $archives = $(".articles > .fn-clear");
if ($archives.length === 0) {
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];
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];
$it.css({
"top": top + "px",
"position": "absolute"
});
if (isLeft) {
$it.addClass("l");
} else {
$it.addClass("r");
}
colH[( isLeft ? '0' : '1' )] += parseInt($it.outerHeight(true));
});
$(this).height(colH[0] > colH[1] ? colH[0] : colH[1]);
}
});
});
$(window).resize();
},
_setNavCurrent: function () {
$(".header li a").each(function () {
if($(this).attr("href") === location.href.split("#")[0]) {
this.className = "current";
} else {
this.className = "";
}
})
},
init: function () {
$(window).scroll(function () {
if ($(window).scrollTop() > 60) {
$(".ico-top").show();
} else {
$(".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 (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/";
if(location.pathname.indexOf("tags") === 1) {
var pathnames = location.pathname.split("/tags/");
path = "/articles/tags/" + pathnames[1].split("/")[0] + "/";
} else if (location.pathname.indexOf("authors") === 1) {
var pathnames = location.pathname.split("/authors/");
path = "/articles/authors/" + pathnames[1].split("/")[0] + "/";
} else if (archive) {
path = "/articles/archives/" + archive + "/";
}
$.ajax({
url: latkeConfig.servePath + path + currentPage,
type: "GET",
beforeSend: function () {
$more.css("background",
"url(" + latkeConfig.staticServePath
+ "/skins/timeline/images/ajax-loader.gif) no-repeat scroll center center #60829F").text("");
},
success: function(result, textStatus){
if (!result.sc) {
return;
}
var articlesHTML = "",
pagination = result.rslts.pagination;
// append articles
for (var i = 0; i < result.rslts.articles.length; i++) {
var article = result.rslts.articles[i];
articlesHTML += '<article><div class="module"><div class="dot"></div>'
+ '<div class="arrow"></div><time class="article-time"><span>'
+ Util.toDate(article.articleCreateTime, 'yy-MM-dd HH:mm')
+ '</span></time><h3 class="article-title"><a rel="bookmark" href="'
+ latkeConfig.servePath + article.articlePermalink + '">'
+article.articleTitle + '</a>';
if (article.hasUpdated) {
articlesHTML += '<sup>' + Label.updatedLabel + '</sup>';
}
if (article.articlePutTop) {
articlesHTML += '<sup>' + Label.topArticleLabel + '</sup>';
}
articlesHTML += '</h3><p>' + article.articleAbstract + '</p>'
+ '<span class="ico-tags ico" title="' + Label.tagLabel + '">';
var articleTags = article.articleTags.split(",");
for (var j = 0; j < articleTags.length; j++) {
articlesHTML += '<a rel="category tag" href="' + latkeConfig.servePath
+ '/tags/' + encodeURIComponent(articleTags[j]) + '">' + articleTags[j] + '</a>';
if (j < articleTags.length - 1) {
articlesHTML += ",";
}
}
articlesHTML += '</span>&nbsp;<span class="ico-author ico" title="' + Label.authorLabel + '">'
+ '<a rel="author" href="' + latkeConfig.servePath + '/authors/' + article.authorId + '">'
+ article.authorName + '</a></span>&nbsp;<span class="ico-comment ico" title="'
+ Label.commentLabel + '"><a rel="nofollow" href="' + latkeConfig.servePath + article.articlePermalink
+ '#comments">' + (article.articleCommentCount === 0 ? Label.noCommentLabel : article.articleCommentCount)
+ '</a></span>&nbsp;<span class="ico-view ico" title="' + Label.viewLabel + '">'
+ '<a rel="nofollow" href="${servePath}${article.articlePermalink}">' + article.articleViewCount
+ '</a></span></div></article>';
}
var colH = [parseInt($(".article-more").prev().prev().css("top")) + $(".article-more").prev().prev().outerHeight(true),
parseInt($(".article-more").prev().css("top")) + $(".article-more").prev().outerHeight(true)];
$more.before(articlesHTML).data("page", currentPage);
// 最后一页处理
if (pagination.paginationPageCount === currentPage) {
$more.remove();
} else {
$more.css("background", "none #60829F").text(Label.moreLabel);
}
$((archive ? "#" + archive.replace("/", "") : ".articles") + " 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 ? "#" + archive.replace("/", "") : ".articles").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();
}
});
}
};
(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/tag-articles.ftl
View file @ 508eb8d2
...@@ -10,11 +10,11 @@ ...@@ -10,11 +10,11 @@
<body> <body>
${topBarReplacement} ${topBarReplacement}
<#include "header.ftl"> <#include "header.ftl">
<h2 style="cursor: pointer" class="nav-abs" onclick="window.location.href='${servePath}/tag-articles-feed.do?oId=${tag.oId}'"> <h3 style="cursor: pointer" class="nav-abs" onclick="window.location.href='${servePath}/tag-articles-feed.do?oId=${tag.oId}'">
${tag.tagTitle} ${tag.tagTitle}
(${tag.tagPublishedRefCount}) (${tag.tagPublishedRefCount})
<img src="${staticServePath}/images/feed.png" alt="Atom"/> <img src="${staticServePath}/images/feed.png" alt="Atom"/>
</h2> </h3>
<#include "article-list.ftl"> <#include "article-list.ftl">
<#include "footer.ftl"> <#include "footer.ftl">
</body> </body>
......
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