Infinite scroll

astanway · May 24, 2012 · 8023013 · 8023013
1 parent 0b57d8d
commit 8023013
Show file tree

Hide file tree

Showing 4 changed files with 630 additions and 4 deletions.
diff --git a/index.php b/index.php
@@ -1,10 +1,56 @@
+<?php
+require('opendb.php');
+$per_page = 50;
+
+function get_num_pages($per_page){
+	$query = "SELECT COUNT(*) FROM new_commits ORDER BY id DESC";
+	$result = mysql_query($query);
+	$result_array = mysql_fetch_array($result);
+	$num_messages = $result_array[0];
+	return round($num_messages / $per_page);
+}
+
+$num_pages = get_num_pages($per_page);
+
+$page = 0;
+if(is_numeric($_GET['page'])){
+	$page = $_GET['page'];
+} 
+
+// Get commits
+$query = "SELECT * FROM new_commits ORDER BY date DESC LIMIT " . $page * $per_page . ", " . $per_page;
+$result = mysql_query($query);
+
+$prev_page = $page - 1;
+$next_page = $page + 1;
+if($prev_page < 0){
+	$prev_page = false;
+}
+if($next_page > $num_pages){
+	$next_page = false;
+}
+
+?>
 <!DOCTYPE html>
 <html>
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
   <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
   <link href='http://fonts.googleapis.com/css?family=Marvel:700italic' rel='stylesheet' type='text/css'>
   <link href='styles.css' rel='stylesheet' type='text/css'>
+  <script type="text/javascript" src="jquery.infinitescroll.min.js"></script>
+	<script type="text/javascript">
+	$(document).ready(function(){
+  $('#allPosts').infinitescroll({
+      navSelector  : "div.pagination",            
+                     // selector for the paged navigation (it will be hidden)
+      nextSelector : "div.pagination a:first",    
+                     // selector for the NEXT link (to page 2)
+      itemSelector : "#allPosts tr.post"          
+                     // selector for all items you'll retrieve
+    });
+	});
+	</script>
 </head>
 <body>
   <div id="header">Commit Logs From Last Night
@@ -23,8 +69,10 @@
           </form>
         </div>
     </div>
-  <table id="allPosts" cellspacing="0" cellpadding='15'>
-  <?php require('opendb.php');
+
+  <table class="allPostsClass" id="allPosts" cellspacing="0" cellpadding='15'>
+    <tbody>
+  <?php
   if (isset($_POST['username'])){
     $username = filter_that_shit($_POST['username']);
     $repo_url = "https://api.github.com/users/" . $username;
@@ -33,8 +81,8 @@
       $query = mysql_query("INSERT INTO users (username) VALUES ('$username')");
     }
   }
-  $query = mysql_query("SELECT * FROM new_commits ORDER BY date DESC");
-  while($row = mysql_fetch_array($query)){ ?>
+  // $query = mysql_query("SELECT * FROM new_commits ORDER BY date DESC");
+  while($row = mysql_fetch_array($result)){ ?>
       <tr class="post">
         <td>
         <?php echo '<a class="avatarlink" href='. $row['userurl'] . '>'?>
@@ -54,6 +102,14 @@
         </td>
       </tr> 
   <?php } ?>
+  </tbody>
 </table>
+<div class="pagination" style="display:none;">
+  <?php
+	if($next_page){
+		echo '<a class="first" href="?page=' . $next_page . '"> Next</a>';
+	}
+	?>
+</div>
 </body>
 </html>