<div id="topic_list">
	<%- partial('topic/abstract', {collection:topics, as:'topic'}) %>
</div>
<div class='pagination' current_page='<%= current_page %>'>
	<ul>
		<% var base_url = base + (base.indexOf('?') < 0 ? '?' : '&') + 'page='; %>
		<% if (current_page == 1) { %>
			<li class='disabled'><a>«</a></li>
		<% } else { %>
			<li><a href="<%= base_url %>1">«</a></li>
		<% } %>

		<%
			var page_start = current_page - 2 > 0 ? current_page - 2 : 1;
			var page_end = page_start + 4 >= pages ? pages : page_start + 4;
		%> 

		<% if (page_start > 1) { %>
			<li><a>...</a></li>
		<% } %>

		<% for(var i = page_start; i <= page_end; i++) { %>
			<% if (i === current_page) { %>
				<li class='disabled'><a><%= i %></a></li>
			<% } else { %>
				<li><a href='<%= base_url + i %>'><%= i %></a></li>
			<% } %>
		<% } %>

		<% if (page_end < pages ) { %>
			<li><a>...</a></li>
		<% } %>

		<% if (current_page == pages) { %>
			<li class='disabled'><a>»</a></li>
		<% } else { %>
			<li><a href='<%= base_url + pages %>'>»</a></li>
		<% } %>
	</ul>
</div>
<script>
	$(document).ready(function () {
		var $nav = $('.pagination');
		var current_page = $nav.attr('current_page');	
		if (current_page) {
			$nav.find('li').each(function(){
				var $li = $(this);
				var $a = $li.find('a');
				if($a.html() == current_page){
					$li.addClass('active');
					$a.removeAttr('href');
				}
			});
		}
	});
</script>
