<?php
define("INCLUDE_CHECK",1);
require 'connect.php';
require 'functions.php';
// Including the files for the DB connection and our custom functions
// Removing comments that are older than an hour.
mysql_query("DELETE FROM wave_comments WHERE id>5 AND dt<SUBTIME(NOW(),'0 1:0:0')");
$comments_result = mysql_query("SELECT * FROM wave_comments ORDER BY id ASC");
// Selecting all the comments ordered by id in ascending order
$comments=array();
$js_history='';
while($row=mysql_fetch_assoc($comments_result))
{
if($row['parent']==0)
// If the comment is not a reply to a previous comment, put it into $comments directly
$comments[$row['id']] = $row;
else
{
if(!$comments[$row['parent']]) continue;
$comments[$row['parent']]['replies'][] = $row;
// If it is a reply, put it in the 'replies' property of its parent
}
$js_history.='addHistory({id:"'.$row['id'].'"});'.PHP_EOL;
// Adds JS history for each comment
}
$js_history='<script type="text/javascript">
'.$js_history.'
</script>';
// This is later put into the head and executed on page load
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Google Wave-like History Slider | Tutorialzine demo</title>
<link rel="stylesheet" type="text/css" href="demo.css" />
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="script.js"></script>
<?php echo $js_history; ?>
<!-- Outputting the addHistory functions -->
</head>
<body>
<div id="main">
<p id="orig">View the <a href="http://tutorialzine.com/2009/10/google-wave-history-slider-jquery/" target="_blank">original tutorial »</a></p>
<h1>Google Wave-like</h1>
<h2>History Slider</h2>
<div id="wave">
<div id="topBar">Your Demo Wave</div>
<div id="subBar">
<img src="img/tutorialzine.png" alt="Tutorialzine" /><img src="img/demo.png" alt="Demo" /><img src="img/curious.png" alt="Curious" />
</div>
<div id="sliderContainer">
<div id="slider"></div>
<div class="clear"></div>
</div>
<div id="commentArea">
<?php
foreach($comments as $c)
{
showComment($c);
// Showing each comment
}
?>
</div>
<input type="button" class="waveButtonMain" value="Add a comment" onclick="addComment()" />
<div id="bottomBar">
</div>
</div>
<div class="container tutorial-info">
This is a tutorialzine demo. View the <a href="http://tutorialzine.com/2009/10/google-wave-history-slider-jquery/" target="_blank">original tutorial</a>, or download the <a href="demo.zip">source files</a>. </div>
</div>
</body>
</html>