benw2/wezm.net
1
0
Fork 0
forked from wezm/wezm.net
Code Pull requests Activity

Finish basic archive pagination implementation

Browse source
This commit is contained in:
Wesley Moore 2010-02-02 13:07:40 +11:00
parent a28195cb0e
commit d51512462d
3 changed files with 21 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
layouts/articles.html
View file

@ -3,7 +3,6 @@
<head> <head>
<%= render 'head_common' %> <%= render 'head_common' %>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" type="text/javascript"></script>
<script src="/js/jquery.mustache.js" type="text/javascript" charset="utf-8"></script>
<script src="/js/jquery.ba-bbq.min.js" type="text/javascript" charset="utf-8"></script> <script src="/js/jquery.ba-bbq.min.js" type="text/javascript" charset="utf-8"></script>
<script src="/js/mojo.js" type="text/javascript" charset="utf-8"></script> <script src="/js/mojo.js" type="text/javascript" charset="utf-8"></script>
<script src="/js/articles.js" type="text/javascript" charset="utf-8"></script> <script src="/js/articles.js" type="text/javascript" charset="utf-8"></script>

2
lib/articles.rb
View file

@ -15,7 +15,7 @@ module WezM
:title => article[:title], :title => article[:title],
:path => article.identifier, :path => article.identifier,
:date => Time.parse(article[:created_at]).rfc2822, :date => Time.parse(article[:created_at]).rfc2822,
:summary => 'Insert summary here' :summary => article[:summary]
} }
end end

28
output/js/articles.js
View file

@ -1,6 +1,7 @@
(function() { (function() {
// Load articles JSON ASAP
var articles = null; var articles = null;
var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
var per_page = 10;
function render_article(o) { function render_article(o) {
return '<li>\n\ return '<li>\n\
@ -16,6 +17,15 @@
</li>'; </li>';
}; };
function update_pagination_controls(page) {
var newer = $('.pagination .newer').attr('href', '#page-' + (page + 1));
var older = $('.pagination .older').attr('href', '#page-' + (page - 1));
// Hide if out of range
older.css('visibility', page <= 1 ? 'hidden' : 'visible');
newer.css('visibility', page * per_page >= articles.length ? 'hidden' : 'visible');
};
function articles_loaded(data) { function articles_loaded(data) {
articles = data; articles = data;
jQuery(function() { jQuery(function() {
@ -29,22 +39,22 @@
page = new Number(matches[1]); page = new Number(matches[1]);
} }
else { else {
update_pagination_controls(1);
return false; return false;
} }
// Generate the items // Generate the items
var per_page = 10;
var container = $('ul.articles'); var container = $('ul.articles');
container.empty(); container.empty();
var i = (page - 1) * per_page; var i = (page - 1) * per_page;
for(; i < page * per_page; i++) { for(; i < page * per_page && i < articles.length; i++) {
var article = articles[i]; var article = articles[i];
var date = new Date(Date.parse(article.date)); var date = new Date(Date.parse(article.date));
var article_view = { var article_view = {
date: article.date, date: article.date,
day: date.getDay(), day: date.getDate(),
month: date.getMonth(), month: months[date.getMonth()],
year: date.getYear(), year: date.getYear() + 1900,
path: article.path, path: article.path,
title: article.title, title: article.title,
summary: article.summary summary: article.summary
@ -53,14 +63,16 @@
container.append(li); container.append(li);
} }
update_pagination_controls(page);
}); });
$('.pagination').slideDown('fast');
// Since the event is only triggered when the hash changes, we need to trigger // Since the event is only triggered when the hash changes, we need to trigger
// the event now, to handle the hash the page may have loaded with. // the event now, to handle the hash the page may have loaded with.
$(window).trigger( 'hashchange' ); $(window).trigger( 'hashchange' );
$('.pagination').slideDown('fast');
}); });
}; };
// Load articles JSON ASAP
jQuery.getJSON('json/articles.json', {}, articles_loaded); jQuery.getJSON('json/articles.json', {}, articles_loaded);
})(); })();