Commit 0b7613ce authored by Vanessa's avatar Vanessa

timeline index

parent 444d4e01
......@@ -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
html,body,div,ul,li{margin:0;padding:0;}
body{font-family:Verdana,arial,'\5fae\8f6f\96c5\9ed1';font-size:12px;background-color:#FCFCFC;}
html,body{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;margin:0;padding:0;height:100%;}
body{font:0.81em Verdana,arial,'\5fae\8f6f\96c5\9ed1';color:#666666;background-color:#363A3D;}
button,input,select,textarea{margin:0;font-size:100%;vertical-align:middle;font-family:Verdana,arial,'\5fae\8f6f\96c5\9ed1';outline:none;}
a{color:#6599C6;outline:medium none;text-decoration:none;transition:color 1s ease 0s;}
a:hover{color:#000;}
img{max-width:100%;border:0;vertical-align:middle;}
::selection{background-color:#D5D5D5;color:#FCFCFC;}
::-moz-selection{background-color:#D5D5D5;color:#FCFCFC;}
a{outline:none;color:#009EB8;text-decoration:none;}
a:visited{color:#00b4d2;}
a:hover{text-decoration:underline;}
a:active{color:#00889f;}
img{vertical-align:middle;border:0;}
textarea,input{outline:none;}
sup{font-size:10px;font-weight:normal;-webkit-text-size-adjust:none;}
.left{float:left;}
.right{float:right;}
.clear{background-color:transparent;border:0;clear:both;display:block;font-size:0;height:0;line-height:0;overflow:hidden;}
.none{display:none;}
.ft-gray{color:#808080;}
.ft-gray:visited{color:#9a9a9a;}
.ft-gray:hover{color:#676767;text-decoration:none;}
.fn-mgtb10{margin:10px 0;}
.logo{padding:0 5px;text-shadow:0 0 1px #D5D5D5;}
.fn-clear:before,.fn-clear:after{display:table;content:"";}
.fn-clear:after{clear:both;}
.em00,.em01,.em02,.em03,.em04,.em05,.em06,.em07,.em08,.em09,.em10,.em11,.em12,.em13,.em14{cursor:pointer;background-image:url("../../ease/images/emotions/emotions-ease.png");float:left;height:24px;margin-right:5px;width:24px;transition:all 0.2s ease-out;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;}
#emotions span:hover{transform:scale(1.2) rotate(360deg);-webkit-transform:scale(1.2) rotate(360deg);-moz-transform:scale(1.2) rotate(360deg);}
.em01{background-position:-24px 0;}
......@@ -34,88 +28,83 @@ sup{font-size:10px;font-weight:normal;-webkit-text-size-adjust:none;}
.em12{background-position:-48px -48px;}
.em13{background-position:-72px -48px;}
.em14{background-position:-96px -48px;}
#search,.translate-ico{background-image:url("/skins/ease/images/icons.png");}
.translate-ico{background-position:1px -125px;background-repeat:no-repeat;border:1px solid #D5D5D5;border-radius:3px;cursor:pointer;float:right;height:16px;margin:-3px 0 0 15px;padding:1px;width:16px;}
.translate-ico:hover{border-color:#9a9a9a;box-shadow:0 0 1px #808080;background-color:#FCFCFC;}
.wrapper{margin:0 auto;width:990px;}
.main{background-color:#FFF;padding-bottom:50px;}
.header{width:100%;z-index:1;}
.header .title{border-bottom:1px solid #808080;font-size:26px;font-weight:normal;}
.header .sub-title{font-size:11px;}
#search{background-position:7px -99px;background-repeat:no-repeat;background-color:#FFF;border:1px solid #D5D5D5;border-radius:2px 2px 2px 2px;box-shadow:0 1px 1px rgba(0, 0, 0, 0.1) inset;color:#808080;float:right;font-size:14px;height:19px;line-height:145%;padding:4px 10px 4px 28px;width:24px;-moz-transition:width 0.4s ease, background 0.4s ease;-webkit-transition:width 0.4s ease, background 0.4s ease;transition:width 0.4s ease, background 0.4s ease;}
#search:focus{width:150px;}
.banner{margin-bottom:20px;}
.banner .notice{float:left;margin:20px 0 0 50px;}
.nav{background-color:#2C2C2C;box-shadow:0 2px 2px #d5d5d5,0 3px 3px -3px #d5d5d5 inset;height:29px;top:0;width:100%;z-index:1;}
.nav ul{list-style:none;float:left;}
.nav li{float:left;}
.nav a{color:#C9C9C9;display:block;float:left;font-size:14px;font-weight:700;line-height:29px;margin-right:20px;padding:0 10px;text-decoration:none;transition:color 0.4s ease,background-color 0.8s ease;-webkit-transition:color 0.4s ease,background-color 0.8s ease;-moz-transition:color 0.4s ease,background-color 0.8s ease;}
.nav a:hover{color:#FFF;background-color:#535353;}
.nav a.current{background-color:#FFF;box-shadow:0 -1px 1px rgba(0, 0, 0, 0.1) inset,0 1px 1px rgba(0, 0, 0, 0.1) inset;color:#808080;}
.nav img{margin-left:3px;}
.footer{border-top:1px solid #D5D5D5;box-shadow:0 -1px 1px #d5d5d5;font-size:11px;padding:12px 0;-webkit-text-size-adjust:none;}
#goTop{background:url("/skins/ease/images/icons.png") no-repeat scroll 5px -51px #d5d5d5;border-radius:2px 2px 0 0;box-shadow:0 0 3px #D5D5D5;cursor:pointer;font-size:11px;height:21px;line-height:21px;padding:0 10px 0 23px;position:absolute;right:50px;display:none;}
#goTop:hover{background-color:#c8c8c8;box-shadow:0 0 3px #c8c8c8;}
.wrapper>ul{list-style:none;}
.main>.wrapper>h2{margin:0;padding:14px 0;}
.article{border-bottom:1px solid #f6f6f6;padding:30px 50px;}
.article:hover{border-bottom-color:#ddd;box-shadow:0 0 1px #f6f6f6 inset;background-color:#FCFCFC;}
.article-body{line-height:145%;overflow:hidden;word-wrap:break-word;margin-bottom:10px;font-size:14px;}
.article-body ol,.article-body ul{margin-left:40px;}
.article-body a{color:#808080;text-decoration:underline;}
.article-body a:vidited{color:#9a9a9a;}
.article-body a:hover{color:#676767;}
.article-body>div{min-height:32px;}
.article-title h2{display:inline;}
.article-title span{cursor:pointer;}
.article-last:hover{border-bottom:1px solid #f6f6f6;}
.article-next{background-color:#FCFCFC;box-shadow:0 0 3px #D5D5D5 inset;cursor:pointer;font-size:14px;line-height:36px;text-align:center;}
.article-next:hover{box-shadow:0 0 3px #D5D5D5, 0 0 3px #D5D5D5 inset;}
.article-relative{background-color:#FCFCFC;box-shadow:0 0 2px #D5D5D5;float:left;margin:10px 0;padding:0 20px 10px;width:385px;}
.article-relative:hover{background-color:#fff;box-shadow:0 0 4px #D5D5D5;}
.article-relative ul{list-style:none;}
#relevantArticles{margin-right:40px;}
#externalRelevantArticles{width:357px;margin-top:0;}
#comments{padding:20px 50px;position:relative;}
.comment-header{float:left;background-color:#FFF;border:1px solid #DEDEDE;padding:2px;height:60px;width:60px;}
.comment-panel{float:left;line-height:16px;margin:0 0 20px 10px;min-height:64px;overflow:hidden;width:814px;}
.comment-body-ref{background-color:#FCFCFC;box-shadow:0 0 2px #D5D5D5;display:block;left:127px;padding:10px;opacity:0.9;filter:alpha(opacity=90);position:absolute;}
.comment-body-ref>.comment-header{border:0 none;float:right;height:48px;width:48px;padding:0;}
.comment-body-ref>.comment-panel{margin:0 20px 0 0;min-height:48px;width:725px;}
.comment-body-ref>.comment-panel>.right{display:none;}
#replyForm{margin-left:25px;}
.form{padding:0 50px 20px;}
.wrapper>.form{float:left;}
.form th{text-align:right;white-space:nowrap;}
.form input[type="text"],.form input[type="password"],.form textarea{background-color:#FCFCFC;border-width:0;box-shadow:0 0 2px #BCBCBC;font-family:Verdana,arial,\5fae\8f6f\96c5\9ed1;font-size:12px;margin:0 5px 10px 0;outline:medium none;padding:0 3px;height:28px;line-height:28px;width:260px;}
.form input:focus,.form textarea:focus{box-shadow:0 0 4px #D5D5D5;}
.form textarea{height:120px;overflow:auto;width:426px;line-height:16px;}
.form button{background-color:#F6F6F6;border:0 none;box-shadow:0 0 2px #D5D5D5;height:28px;line-height:28px;padding:0 12px;color:#808080;}
.form button:hover{box-shadow:0 0 4px #D5D5D5;text-shadow:0 0 2px;}
.form img{background-color:#FCFCFC;box-shadow:0 0 2px #D5D5D5;cursor:pointer;height:24px;padding:1px;}
#tags.other-main{margin:47px 44px 0;width:902px;}
#tags li{float:left;height:38px;}
#tags a{margin:3px 6px;padding:3px 12px;background-color:#FCFCFC;box-shadow:0 0 2px #D5D5D5;float:left;}
#tags{margin:0;}
#tags li{float:left;list-style-type:none;}
#tags a{background-color:#FCFCFC;box-shadow:0 0 2px #D5D5D5;display:block;margin:5px 10px;padding:5px 10px;}
#tags a:hover{text-shadow:0 0 2px;text-decoration:none;box-shadow:0 0 4px #D5D5D5;}
#tags b{font-size:70%;opacity:0.6;}
.tags1,.tags1:visited{font-size:12px;color:#a7a7a7;}
.tags2,.tags2:visited{font-size:14px;color:#808080;}
.tags3,.tags3:visited{font-size:16px;color:#595959;}
.tags4,.tags4:visited{font-size:18px;color:#323232;}
.tags5,.tags5:visited{font-size:20px;color:#0a0a0a;}
.archives{position:relative;}
.archives>div{background-color:#FCFCFC;box-shadow:0 0 2px #D5D5D5;padding-bottom:20px;line-height:20px;margin:20px;width:270px;position:absolute;top:0;}
.archives h3{text-align:center;}
.archives>div:hover{box-shadow:0 0 4px #D5D5D5;}
.archives a{display:block;margin-left:77px;}
.dynamic ul{list-style:none;}
.dynamic h3{text-align:center;}
.dynamic .module{background-color:#FCFCFC;box-shadow:0 0 2px #D5D5D5;float:left;line-height:20px;margin:20px;padding:10px 20px 20px;width:385px;}
.dynamic .module:hover{box-shadow:0 0 4px #D5D5D5;}
.dynamic .side-comments{width:600px;}
.dynamic .side-comments .comment-panel{width:510px;}
.dynamic .side-tags{width:170px;}
.dynamic .side-tags li{float:left;margin:0 5px;}
.dynamic .side-most-comment,.dynamic .side-most-view{margin-bottom:0;}
.other-main.links{margin-top:45px;}
.links li{float:left;line-height:22px;margin:0 20px;width:270px;}
.other-main{display:inline-block;margin:30px 30px 0;width:930px;}
.module{background-color:#FFFFFF;border:1px solid #BEC3C7;border-radius:5px 5px 5px 5px;box-shadow:0 1px 1px rgba(0, 0, 0, 0.1);margin-bottom:30px;padding:15px;word-wrap:break-word;position:relative;}
.module>h3{margin:0 0 10px 0;color:#444;}
.module>ul{list-style-type:none;padding-left:0;margin:0;overflow:hidden;}
.module>ul>li{border-top:1px solid #EEEEEE;padding:6px 0;}
.articles .arrow,.ico-author,.ico-tags,.ico-comment,.ico-top,.ico-view,.ico-reply,.ico-translate,#search{background-repeat:no-repeat;background-image:url("../../timeline/images/icons.png");}
.ico-author,.ico-tags,.ico-comment,.ico-view,.ico-reply{padding-left:20px;background-position:-1px -63px;margin-right:10px;}
.ico-tags{background-position:-1px -83px;}
.ico-comment{background-position:-1px -41px;}
.ico-view{background-position:0 -122px;}
.ico-reply{background-position:0 -162px;}
.ico-translate{background-position:0 -186px;cursor:pointer;float:right;height:16px;margin-left:10px;width:16px;}
#search{background-position:5px -138px;border:medium none;border-radius:12px 12px 12px 12px;box-shadow:0 1px 0 rgba(0, 0, 0, 0.4) inset,0 1px 0 rgba(255, 255, 255, 0.1);color:#A5A099;height:22px;margin-top:13px;padding-left:25px;transition:width 0.7s ease 0s;width:60px;}
#search:focus{color:#333;width:140px;}
.ico-top{background-color:#363A3D;background-position:4px -100px;border-radius:20em 20em 20em 20em;bottom:60px;box-shadow:0 -1px 2px rgba(0, 0, 0, 0.3) inset,0 1px 0 rgba(255, 255, 255, 0.15);height:25px;position:fixed;left:90%;width:25px;cursor:pointer;}
.ico-next,.ico-pre{background:none repeat scroll 0 0 #6599C6;border-radius:10em 10em 10em 10em;color:#FFFFFF;display:block;float:left;font:20px/100% "Times New Roman",Times,serif;height:28px;margin:-8px 10px 0 0;padding:4px 0 0;text-align:center;transition:background 1s ease 0s;width:32px;}
.ico-next{float:right;margin:-8px 0 0 10px;}
a:hover>.ico-next,a:hover>.ico-pre{background-color:#000;}
.wrapper{min-width:500px;padding:50px 0;background:url("../../timeline/images/bg.png") repeat scroll 0 0 #dee4ea;}
.header{background-color:#BFBFBF;background-image:url("../../timeline/images/nav-bg.png"),linear-gradient(to bottom, #cccccc 0%, #a9a9a9 100%);border-bottom:1px solid #898989;box-shadow:0 -1px 0 rgba(255, 255, 255, 0.3) inset,0 1px 1px rgba(0, 0, 0, 0.2);height:50px;overflow:hidden;}
.container{width:80%;margin:0 auto;}
.footer{border-top:1px solid #232323;padding:20px 0;color:#ddd;font-size:80%;}
.footer a{color:#9CC0DE;}
.footer a:hover{text-decoration:underline;}
.header .title{font-size:150%;margin:3px 0 0;}
.header .title a{color:#414141;text-shadow:0 1px 0 rgba(255, 255, 255, 0.7);}
.header li a{color:#444;padding:19px;text-shadow:0 1px 0 rgba(255, 255, 255, 0.7);white-space:nowrap;}
.header li a.current{border-bottom:2px solid #D26911;}
.header a:hover{color:#000;}
.header li{float:left;list-style-type:none;}
.articles{position:relative;margin-top:11px;}
.articles>div.fn-clear{position:relative;margin-bottom:20px;}
.articles>div.fn-clear>h2{margin:0;text-align:center;height:28px;}
.articles>.vertical{background-color:#9EB5C6;border-radius:20em 20em 20em 20em;box-shadow:0 0 1px 0 rgba(0, 0, 0, 0.5) inset,0 0 1px 0 rgba(255, 255, 255, 0.6);height:100%;left:50%;margin-left:-3px;position:absolute;top:0;width:6px;}
.articles article{width:50%;}
.articles article.l>div.module{margin-right:30px;left:0;}
.articles article.r{left:50%;}
.articles article.r>div{margin-left:30px;position:relative;}
.articles .dot{background-color:#FFFFFF;border:3px solid #60829F;border-radius:20em 20em 20em 20em;height:6px;position:absolute;right:-37px;top:22px;width:6px;}
.articles .r .dot{left:-37px;right:inherit;}
.articles .arrow{height:15px;position:absolute;right:-9px;top:21px;width:9px;}
.articles .r .arrow{background-position:0 -22px;left:-9px;right:inherit;}
time.article-time{top:-8px;left:50%;position:absolute;}
time.article-time>span{background-color:#FFFFFF;border:1px solid #A8A9A9;border-radius:20em 20em 20em 20em;font-size:80%;margin-left:-56px;padding:5px 10px;}
article .article-title{margin:0;}
article .article-title>sup{color:#6599C6;font-size:70%;}
article .article-title a{color:#000;text-decoration:none;}
.ico>a{color:#999999;font-size:80%;text-decoration:none;}
.ico>a:hover{color:#000;}
.article-more{background-color:#60829F;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:-38px;padding:5px 20px;position:absolute;text-align:center;top:100%;width:36px;}
.article-archive{background-color:#60829F;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;font-size:80%;font-weight:normal;padding:5px 20px;}
.dynamic-l{float:left;width:70%;}
.dynamic-l>div{margin-right:30px;}
.dynamic-r{float:right;width:30%;}
.dynamic-r .tags a,.links a{line-height:24px;}
#comments{margin:30px 0 50px;position:relative;}
.comments>li>img{height:60px;width:60px;border-radius:30px;float:left;margin-right:15px;}
.comments .author{font-size:130%;font-style:italic;}
.module>ul>li.comment-body-ref{background-color:#FFFFFF;border:1px solid #ddd;left:76px;opacity:0.8;padding:10px;position:absolute;width:74%;border-radius:10px;}
.comment-body-ref .ico-reply{display:none;}
.comment-form{width:100%;margin:30px 0;}
#commentForm{margin-top:0;}
.comment-form input[type='text'],.comment-form textarea{background:url("../../timeline/images/bg.png") repeat scroll 0 0 #e5e8ea;border:1px solid #BCBDBE;border-radius:5px 5px 5px 5px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1) inset;margin:5px 5px 5px 0;padding:6px;}
.comment-form input[type='text']:focus,.comment-form textarea:focus{background-color:#EFEFEF;outline:medium none;}
#submitCommentButton,#submitCommentButtonReply{background:none repeat scroll 0 0 #868889;border:1px solid #5D6265;border-radius:10em 10em 10em 10em;box-shadow:0 1px 0 rgba(255, 255, 255, 0.3) inset,0 1px 1px rgba(0, 0, 0, 0.3);color:#FFFFFF;cursor:pointer;padding:5px 20px;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.3);}
#submitCommentButton:hover,#submitCommentButtonReply:hover{color:#fff;background-color:#444;}
.nav-abs{background-color:#6B6B6B;border:1px solid #898989;border-radius:5px 5px 5px 5px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.4) inset,0 1px 0 rgba(255, 255, 255, 0.7),0 -1px 0 rgba(255, 255, 255, 0.6);color:#CCCCCC;padding:5px 10px;position:absolute;right:30px;top:61px;z-index:1;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;}
......@@ -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>
......
......@@ -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"
});
......@@ -63,28 +61,46 @@ var timeline = {
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];
$(this).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");
}
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"
});
colH[( isLeft ? '0' : '1' )] += parseInt($it.outerHeight(true));
});
$(this).height(colH[0] > colH[1] ? colH[0] : colH[1]);
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]);
}
});
});
......@@ -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,
......@@ -188,6 +218,9 @@ var timeline = {
+ '<a rel="nofollow" href="${servePath}${article.articlePermalink}">' + article.articleViewCount
+ '</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();
}
});
}
......
......@@ -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
......@@ -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