I am having an error, when I am trying to display the computer's dice rolled in my mini game, with a delay between each roll displayed.
$roll = rand(2, 7);
while($roll > 0){
//shows dice
showDice($cDi1, $cDi2);
sleep(2);
$roll = $roll - 1;
$cDi1 = rand(1, 6);
$cDi2 = rand(1, 6);
}
When I run that, it pauses the page for 2 seconds, and then runs the showDice function all at once, with no delay in-between.
Is there any way I could fix this?
The problem you have is that PHP code is executed on the server when the page is requested..
So what happens is the sleep() function is causing a pause before the HTML is sent to the user browser..
Does that make sense?
To get the page to output your values in increments you will need to use a client side script
such as JavaScript.
you could do something like this..
<?php
$roll=rand(1, 6);
$time=0;
echo'<script>';
for($i=0;$i<$roll;$i++){
echo'
setTimeout(function(){document.write("<div>'.rand(1,6).' & '.rand(1,6).'</div><br/>")},'.$time.');';
$time+=2000;}
echo '
</script>';
?>
(The newlines in the echo commands help your output JavaScript to be readable from the source)
if $roll was = 3 / It would look something like this
<script>
setTimeout(function(){document.write("<div>3 & 4</div><br/>")},0);
setTimeout(function(){document.write("<div>1 & 2</div><br/>")},2000);
setTimeout(function(){document.write("<div>4 & 1</div><br/>")},4000);
</script>
however if you need to remember your dice values you would need to put them in an array..
for($i=0;$i<$roll;$i++){
$dice[$i]=array(rand(1,6),rand(1,6));
echo'
setTimeout(function(){document.write("<div>'.$dice[$i][0].' & '.$dice[$i][1].'</div><br/>")},'.$time.');';
$time+=2000;}
You can also do it this way..
so that you can finish the structure of the page and then place the 'dice roll' information directly where you want it, in time increments.
(this has obvious benefits)
<html>
<head>
//function places dice roll values into already created divs
<script>
function showDice(dice,rollNumber){
setTimeout(function(){document.getElementById("roll"+rollNumber).innerHTML=dice[0] + " & " + dice[1]},rollNumber*2000);}
</script>
</head>
<body>
<?php
//create random number of dice rolls
$roll=rand(1, 6);
//tell user how many rolls will be made
echo '<div>'.$roll;
if($roll==1) echo ' roll';
else echo ' rolls';
echo ' of the dice</div><br/>
';
//create dice roll values and pre create the divs that the dice rolls will be shown in
for($i=0;$i<$roll;$i++){
$diceroll[$i]=array(rand(1,6),rand(1,6));
echo '<div id="roll'.$i.'"></div>
';}
?>
</body>
</html>
<script>
<?php
//store dice roll values in a javascript array
echo 'var diceRoll=new Array()
';
for($i=0;$i<$roll;$i++){
echo 'diceRoll['.$i.']=new Array('.$diceroll[$i][0].','.$diceroll[$i][1].')
';}
?>
//call function to place values into divs for each roll
for (var i=0;i<diceRoll.length;i++){
showDice(diceRoll[i],i);}
</script>
I think you need this:
for ($i = 0; $i != 30; $i++) {
echo $i . '<br/>';
flush(); //flush
ob_flush(); //flush output buffering
sleep(1);
}
Now, in your case,
$roll = rand(2, 7);
while($roll > 0){
//shows dice
showDice($cDi1, $cDi2);
flush(); //flush
ob_flush(); //flush output buffering
sleep(2);
$roll = $roll - 1;
$cDi1 = rand(1, 6);
$cDi2 = rand(1, 6);
}
Let me know if this solves your problem.
