<?php
require_once "../class.pAjax.php";
if (isset($_GET['mode']))
$mode = strtoupper($_GET['mode']);
else
$mode = "ASYNC";
function bkgColor() {
$hexa = array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F");
srand(time());
$color = "";
for ($i = 0; $i < 6; $i++) {
$rand = rand(0, count($hexa) - 1);
// Could not start with 0, otherwise I'll loose the char while converting the number to JS
if ($color == "" && $hexa[$rand] == 0)
$i--;
else
$color .= $hexa[$rand];
}
return $color;
}
$AJAX = new pAjax;
$AJAX->disableDomainProtection();
$AJAX->enableExportProtection();
$AJAX->export("bkgColor");
$AJAX->handleRequest();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Background Color changer</title>
<?php pAjax::showJavaScript(".."); ?>
<script type="text/javascript">
function BackgroundColorChanger() {
pAjax.call(this);
pAjax.setDebugMode(false);
this.timer = null;
this.executions = 0;
this.okay = 0;
}
var _p = BackgroundColorChanger.prototype = new pAjax;
_p.tick = function () {
this.executions++;
var oRequest = this.prepare("bkgColor", pAjaxRequest.GET);
oRequest.execute(pAjaxRequest.<?php echo $mode; ?>);
}
_p.onLoad = function () {
var data = this.getResponse();
document.getElementById("recieved").innerHTML = "#" + data;
if ((String(data)).length == 6 || (String(data)).length == 3) {
document.body.style.backgroundColor = "#" + data;
this.okay++;
document.getElementById('states').innerHTML += " [Success: " + this.okay + "]";
}
document.getElementById('states').innerHTML += "<br />";
var oThis = this;
if (!this.timer)
this.timer = window.setInterval(function () { oThis.tick(); }, 3000);
}
_p.onChange = function () {
document.getElementById('states').innerHTML += "Called " + this.executions + " times => readyState value: " + this.getReadyState();
if (this.readyState != 4)
document.getElementById('states').innerHTML += "<br />";
}
var bkg = new BackgroundColorChanger;
</script>
</head>
<body onload="bkg.tick();">
Background Color is changed each 3000 miliseconds, via <?=$mode?> mode.<br />
Data recieved: <span id="recieved"></span><br />
<br />
You can run the same page using Synchronized or Assynchronized mode. Use ?mode=sync or ?mode=async to test.<br />
<br />
<div id="states" style="width: auto; height: 300px; overflow: auto; background-color: #fff; border: 1px solid #000"></span>
</body>
</html>
|
Download
