yexuejc/solo-third-skins
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

首页列表显示,单个作者页面列表显示

Browse Source
This commit is contained in:
oncereply 2012-12-14 15:20:15 +08:00
parent 849e4dd410
commit cbd582dea9
6 changed files with 171 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
bootstyle/article-list.ftl
View File

@ -1,57 +1,46 @@
<ul>
<#list articles as article> <#list articles as article>
<li class="article<#if !article_has_next> article-last</#if>"> <div class="page-header page-header-m">
<div class="article-title"> <h3><a href="${article.articlePermalink}">${article.articleTitle}</a></h3>
<h2> </div>
<a rel="bookmark" class="ft-gray" href="${servePath}${article.articlePermalink}"> <div class="page-header-bottom">
${article.articleTitle} <span>
</a> <li class="icon-time"></li>
<#if article.hasUpdated> <#if article.hasUpdated>
<sup> ${article.articleUpdateDate?string("yyyy-MM-dd HH:mm")}
${updatedLabel}
</sup>
</#if>
<#if article.articlePutTop>
<sup>
${topArticleLabel}
</sup>
</#if>
</h2>
<div class="right">
<a rel="nofollow" class="ft-gray" href="${servePath}${article.articlePermalink}#comments">
${article.articleCommentCount}&nbsp;&nbsp;${commentLabel}
</a>&nbsp;&nbsp;
<a rel="nofollow" class="ft-gray" href="${servePath}${article.articlePermalink}">
${article.articleViewCount}&nbsp;&nbsp;${viewLabel}
</a>
</div>
<div class="clear"></div>
</div>
<div class="article-body">
<div id="abstract${article.oId}">
${article.articleAbstract}
</div>
<div id="content${article.oId}" class="none"></div>
</div>
<div class="right ft-gray">
<#if article.hasUpdated>
${article.articleUpdateDate?string("yy-MM-dd HH:mm")}
<#else> <#else>
${article.articleCreateDate?string("yy-MM-dd HH:mm")} ${article.articleCreateDate?string("yyyy-MM-dd HH:mm")}
</#if> </#if>
<a rel="nofollow" href="${servePath}/authors/${article.authorId}">${article.authorName}</a> </span>
<span>
<li class="icon-user"></li>
<a href="/authors/${article.authorId}" title="${authorLabel}: ${article.authorName}">
${article.authorName}
</a>
</span>
<div class="pull-right">
<span>
<li class="icon-eye-open"></li>
<a href="${article.articlePermalink}">${article.articleViewCount} ${viewLabel}</a>
</span>
<span>
<li class="icon-comment"></li>
<a href="${article.articlePermalink}#comments">${article.articleCommentCount} ${commentLabel}</a>
</span>
</div> </div>
<div class="left ft-gray"> </div>
${tag1Label} ${article.articleAbstract}
<div class="article-tags">
<li class="icon-tags"></li>${tag1Label}
<#list article.articleTags?split(",") as articleTag> <#list article.articleTags?split(",") as articleTag>
<a rel="tag" href="${servePath}/tags/${articleTag?url('UTF-8')}"> <span>
${articleTag}</a><#if articleTag_has_next>, </#if> <a href="${servePath}/tags/${articleTag?url('UTF-8')}">
${articleTag}
</a>
<#if articleTag_has_next>,</#if>
</span>
</#list> </#list>
</div> </div>
<div class="clear"></div>
</li>
</#list> </#list>
</ul>
<#if paginationCurrentPageNum != paginationPageCount && 0 != paginationPageCount> <#if paginationCurrentPageNum != paginationPageCount && 0 != paginationPageCount>
<div class="article-next ft-gray" onclick="getNextPage()" data-page="${paginationCurrentPageNum}">${moreLabel}</div> <div class="btn btn-block pagination-btn" onclick="getNextPage()" data-page="${paginationCurrentPageNum}">${moreLabel}</div>
</#if> </#if>

17
bootstyle/author-articles.ftl
View File

@ -2,19 +2,22 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<@head title="${authorName} - ${blogTitle}"> <@head title="${blogTitle}">
<meta name="keywords" content="${metaKeywords},${authorName}"/> <meta name="keywords" content="${metaKeywords}"/>
<meta name="description" content="<#list articles as article>${article.articleTitle}<#if article_has_next>,</#if></#list>"/> <meta name="description" content="<#list articles as article>${article.articleTitle}<#if article_has_next>,</#if></#list>"/>
</@head> </@head>
</head> </head>
<body> <body class="home page top-navbar">
${topBarReplacement}
<#include "header.ftl"> <#include "header.ftl">
<div class="main"> <div id="wrap" class="container" role="document">
<div class="wrapper"> <div id="content" class="row">
<h2>${author1Label}${authorName}</h2> <div id="main" class="span8" role="main">
<#include "article-list.ftl"> <#include "article-list.ftl">
</div> </div>
<aside id="sidebar" class="span4">
<#include "side.ftl">
</aside>
</div>
</div> </div>
<#include "footer.ftl"> <#include "footer.ftl">
</body> </body>

21
bootstyle/css/bootstyle.css
View File

@ -2,8 +2,16 @@ body.top-navbar {
padding-top: 60px; padding-top: 60px;
} }
#sidebar a:hover{ a:hover{
text-decoration:none; text-decoration:none;
color: #00B;
}
.page-header a{
color: #000000;
}
.page-header a:hover{
color: #9A9A9A;
} }
.page-header-m{ .page-header-m{
@ -16,10 +24,6 @@ body.top-navbar {
color: #585858; color: #585858;
} }
.page-header-bottom a:hover{
text-decoration: none;
}
.article-tags{ .article-tags{
color: #676767; color: #676767;
font-size: 12px; font-size: 12px;
@ -29,6 +33,13 @@ body.top-navbar {
text-decoration: none; text-decoration: none;
} }
#footer{
margin-top: 20px;
}
#footer .container{ #footer .container{
padding: 10px 15px 10px; padding: 10px 15px 10px;
} }
.pagination-btn{
margin-top: 20px;
}

2
bootstyle/footer.ftl
View File

@ -1,4 +1,4 @@
<footer id="footer" role="banner"> <footer id="footer">
<div class="navbar-inner"> <div class="navbar-inner">
<div class="container"> <div class="container">
<div class="pull-left"> <div class="pull-left">

8
bootstyle/index.ftl
View File

@ -12,13 +12,9 @@
<div id="wrap" class="container" role="document"> <div id="wrap" class="container" role="document">
<div id="content" class="row"> <div id="content" class="row">
<div id="main" class="span8" role="main"> <div id="main" class="span8" role="main">
<div class="page-header"> <#include "article-list.ftl">
<h1>
Home </h1>
</div> <div class="alert alert-info"><a href="http://www.rootstheme.com/">Back to Roots</a></div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum consequat, orci ac laoreet cursus, dolor sem luctus lorem, eget consequat magna felis a magna. Aliquam scelerisque condimentum ante, eget facilisis tortor lobortis in. In interdum venenatis justo eget consequat. Morbi commodo rhoncus mi nec pharetra. Aliquam erat volutpat. Mauris non lorem eu dolor hendrerit dapibus. Mauris mollis nisl quis sapien posuere consectetur. Nullam in sapien at nisi ornare bibendum at ut lectus. Pellentesque ut magna mauris. Nam viverra suscipit ligula, sed accumsan enim placerat nec. Cras vitae metus vel dolor ultrices sagittis. Duis venenatis augue sed risus laoreet congue ac ac leo. Donec fermentum accumsan libero sit amet iaculis. Duis tristique dictum enim, ac fringilla risus bibendum in. Nunc ornare, quam sit amet ultricies gravida, tortor mi malesuada urna, quis commodo dui nibh in lacus. Nunc vel tortor mi. Pellentesque vel urna a arcu adipiscing imperdiet vitae sit amet neque. Integer eu lectus et nunc dictum sagittis. Curabitur commodo vulputate fringilla. Sed eleifend, arcu convallis adipiscing congue, dui turpis commodo magna, et vehicula sapien turpis sit amet nisi.</p>
</div> </div>
<aside id="sidebar" class="span4" role="complementary"> <aside id="sidebar" class="span4">
<#include "side.ftl"> <#include "side.ftl">
</aside> </aside>
</div> </div>

83
bootstyle/js/bootstyle.js
View File

@ -1,4 +1,10 @@
var bootstyle = { var bootstyle = {
getCurrentPage: function () {
var $next = $(".pagination-btn");
if ($next.length > 0) {
window.currentPage = $next.data("page");
}
},
setNavCurrent: function () { setNavCurrent: function () {
$(".nav li a").each(function () { $(".nav li a").each(function () {
var $this = $(this); var $this = $(this);
@ -18,6 +24,7 @@ var bootstyle = {
}); });
}, },
init: function () { init: function () {
this.getCurrentPage();
this.setNavCurrent(); this.setNavCurrent();
this.setCommentEmotions(); this.setCommentEmotions();
} }
@ -25,3 +32,79 @@ var bootstyle = {
$(function () { $(function () {
bootstyle.init(); bootstyle.init();
}) })
var getNextPage = function () {
var $more = $(".pagination-btn");
currentPage += 1;
var path = "/articles/";
if (location.pathname.indexOf("tags") > -1) {
var tagsPathnaem = location.pathname.split("/tags/");
var tags = tagsPathnaem[1].split("/");
path = "/articles/tags/" + tags[0] + "/";
} else if (location.pathname.indexOf("archives") > -1) {
var archivesPathname = location.pathname.split("/archives/");
var archives = archivesPathname[1].split("/");
path = "/articles/archives/" + archives[0] + "/" + archives[1] + "/";
}
var nextLabel = '',btn_background = '';
$.ajax({
url: latkeConfig.servePath + path + currentPage,
type: "GET",
beforeSend: function () {
nextLabel = $more.text();
btn_background = $more.css('background');
$more.text('　').css("background",
"url(" + latkeConfig.staticServePath + "/skins/ease/images/ajax-loader.gif) no-repeat scroll center center #fefefe");
},
success: function (result, textStatus) {
var pagination = result.rslts.pagination;
for (var i = 0; i < result.rslts.articles.length; i++) {
var article = result.rslts.articles[i];
var articleHTML = new Array();
articleHTML.push('<div class="page-header page-header-m">');
articleHTML.push('<h3><a href="'+article.articlePermalink+'">'+article.articleTitle+'</a></h3>');
articleHTML.push('</div>');
articleHTML.push('<div class="page-header-bottom"><span>');
articleHTML.push('<li class="icon-time"></li>');
if (article.hasUpdated) {
articleHTML.push(Util.toDate(article.articleUpdateDate, ' yyyy-MM-dd HH:mm '));
}else{
articleHTML.push(Util.toDate(article.articleCreateDate, ' yyyy-MM-dd HH:mm '));
}
articleHTML.push('</span><span><li class="icon-user"></li>');
articleHTML.push('<a href="/authors/'+article.authorId+'" title="'+Label.authorLabel+': '+article.authorName+'"> ');
articleHTML.push(article.authorName);
articleHTML.push(' </a>');
articleHTML.push('</span><div class="pull-right"><span>');
articleHTML.push('<li class="icon-eye-open"></li>');
articleHTML.push('<a href="'+article.articlePermalink+'"> ');
articleHTML.push(article.articleViewCount+' '+Label.viewLabel);
articleHTML.push(' </a>');
articleHTML.push('</span><span><li class="icon-comment"></li>');
articleHTML.push('<a href="'+article.articlePermalink+'#comments"> '+article.articleCommentCount+' '+Label.commentLabel+' </a>');
articleHTML.push('</span></div></div>');
articleHTML.push(article.articleAbstract);
articleHTML.push('<div class="article-tags">');
articleHTML.push('<li class="icon-tags"></li>'+Label.tag1Label);
var articleTags = article.articleTags.split(',');
for(var j = 0;j < articleTags.length;j++){
var articleTag = articleTags[j];
articleHTML.push('<span>');
articleHTML.push('<a href="'+latkeConfig.servePath+'/tags/'+articleTag+'">');
articleHTML.push(articleTag);
articleHTML.push('</a></span>');
}
articleHTML.push('</div>');
$more.before(articleHTML.join(''));
}
if (pagination.paginationPageCount === currentPage) {
$more.remove();
} else {
$more.text(nextLabel).css("background", '');
}
}
});
};