<?php
if($_REQUEST['initial_num']) {
for ($i=$_REQUEST['initial_num']; $i<=$_REQUEST['final_num']; $i++) {
$output = $output."<a href=\"#\" style=\"font-size: {$_REQUEST['size']}\" class=\"roll\" id=\"n{$i}\" onmouseover=\"magnify({$i})\" onmouseout=\"unmagnify({$i})\">{$i} </a>";
}
echo $output;
}
else { ?>
<!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=iso-8859-1" />
<title>JoeyJWC Labs :: Page Number Generator</title>
<style type="text/css">
a.roll { margin: 0px }
</style>
<script language="javascript">
function setvals() {
minnum = document.getElementById('initial_num').value;
maxnum = document.getElementById('final_num').value;
initialSize = document.getElementById('size').value;
increment = document.getElementById('increment').value;
}
function magnify(num) {
numaa = num-2;
numab = num+2;
numba = num-1;
numbb = num+1
if (numaa>=minnum) document.getElementById('n'+numaa).style.fontSize = parseInt(initialSize)+parseInt(increment)+"px";
if (numab<=maxnum) document.getElementById('n'+numab).style.fontSize = parseInt(initialSize)+parseInt(increment)+"px";
if (numba>=minnum) document.getElementById('n'+numba).style.fontSize = parseInt(initialSize)+2*parseInt(increment)+"px";
if (numbb<=maxnum) document.getElementById('n'+numbb).style.fontSize = parseInt(initialSize)+2*parseInt(increment)+"px";
document.getElementById('n'+num).style.fontSize = parseInt(initialSize)+3*parseInt(increment)+"px";
}
function unmagnify(num) {
numaa = num-2;
numab = num+2;
numba = num-1;
numbb = num+1
document.getElementById('n'+numaa).style.fontSize = initialSize+"px";
document.getElementById('n'+numab).style.fontSize = initialSize+"px";
document.getElementById('n'+numba).style.fontSize = initialSize+"px";
document.getElementById('n'+numbb).style.fontSize = initialSize+"px";
document.getElementById('n'+num).style.fontSize = initialSize+"px";
}
//////////////////////////
function createRequestObject() { //Shamelessly copied and modified from http://mikeoncode.blogspot.com/2006/02/ajax-project-to-get-you-going.html
var ro;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
ro = new ActiveXObject("Microsoft.XMLHTTP");
}
else{
ro = new XMLHttpRequest();
}
return ro;
}
var http = createRequestObject();
function sndReq() {
document.getElementById('output').innerHTML = '<img src="working.gif" alt="Working, please wait..." />';
http.open('GET', 'pagenum.roll.old.php?initial_num='+document.getElementById('initial_num').value+'&final_num='+document.getElementById('final_num').value+'&size='+document.getElementById('size').value+'&increment='+document.getElementById('increment').value);
http.onreadystatechange = handleResponse;
http.send(null);
}
function handleResponse() {
if(http.readyState == 4){
var response = http.responseText;
document.getElementById('output').innerHTML = response;
}
}
</script>
</head>
<body onload="setvals()">
<div id="output"> </div>
<form action="javascript:sndReq()" name="rollercfg" onsubmit="setvals()">
Initial Number: <input type="text" name="intial_num" id="initial_num" value="1" onfocus="document.rollercfg.initial_num.select()" /><br />
Final Number: <input type="text" name="final_num" id="final_num" value="9" onfocus="document.rollercfg.final_num.select()" /><br />
Initial Size: <input type="text" name="size" id="size" value="18" onfocus="document.rollercfg.size.select()" /><br />
Size Increment: <input type="text" name="increment" id="increment" value="3" onfocus="document.rollercfg.increment.select()" /><br />
<input type="submit" name="submit" value="Generate!" />
</form>
<p><br /><br /><a href="viewsrc.php?filename=pagenum.roll.old.php">View Source</a></p>
</body>
</html>
<?php } ?>