Page 1 of 1

Making a trivia game engine and I need help

Posted: Sun Aug 07, 2005 6:05 am
by pilau
Hi all.
I'm making a PHP-based trivia game.
My aim is the most basic features (maybe I'll add other things later), as follows:

To play you can choose either to register or play as a guest.
(If you register you can have the option to post your score online)

Each "quiz" you get a set of questions loaded up randomly from a DB table. You have 15 seconds to answer each question, and the maximum score for each question is 15 (as time flows you lose one point each second).

I'm now having a problem, which is with the timer thing.
I need to display a timer to the user, and when the user answers the questions (let's say he does that correctly) the page will refresh itself, meaning, it will send the time left on the timer, which will be the score for the previous question, and will display a new question, ALONG WITH THE TOTAL SCORE. (Ofcourse it will also need to stat a new timer for the new question.)

Is that thing possible with PHP?
Thanks in advance.

Posted: Sun Aug 07, 2005 6:49 am
by s.dot
You will need to use a JavaScript to display a timer.

I had done something similar to this in the past... here it is

Code: Select all

<script type="text/javascript">
<!--  
var timeout = 1000; var num = 0; var na = "00"; var secs = 15; 

function go()
{
   na = secs;
   if (secs < 10)
   {
      na= "0" + na;
   } 
   document.getElementById("countDownText").innerHTML = na;
   secs = secs - 1 
   if (secs+1 < 1)
   { 
      document.getElementById("countDownText").innerHTML = "Time Up, Sorry!";
   } 
   if (secs+1 > 0)
   {
      setTimeOut("go()",1000);
   } 
} 
//--> 
</script>
Then when your page loads, call this function onLoad

Code: Select all

<body onLoad="go()">
Then, you need a divide layer for your timer, so the javascript can append its contents to it.

Code: Select all

<div id="countDownText">
Hope that helps you out a bit.

Posted: Sun Aug 07, 2005 7:41 am
by feyd
I wouldn't rely on the client-side timer being a good reference.. too much cheating potential. Instead you can do a client speed test before they enter a test to see how long it takes their machine to fully load a page of known size. From that you can infer their network speed and machine capability (server side). This should result in a time offset value, add some wiggle room by increasing the number a bit. That is your time adjustment for all questions. Use the server to time them then where you store off the expected maximum length of time after serving their page (you need to know the size of this page to adjust the time alottment unless you make all the pages consistently the same size and processing requirements..)


Side note: 10,000 posts baby!

Posted: Sun Aug 07, 2005 8:05 am
by pilau
feyd wrote:I wouldn't rely on the client-side timer being a good reference.. too much cheating potential. Instead you can do a client speed test before they enter a test to see how long it takes their machine to fully load a page of known size. From that you can infer their network speed and machine capability (server side). This should result in a time offset value, add some wiggle room by increasing the number a bit. That is your time adjustment for all questions. Use the server to time them then where you store off the expected maximum length of time after serving their page (you need to know the size of this page to adjust the time alottment unless you make all the pages consistently the same size and processing requirements..)
8O


How on earth do you do that?

Oh and Scortaye, your function returns an error. "Object expected".

Posted: Sun Aug 07, 2005 8:11 am
by pilau
I still need though when the timer reaches zero to move on to the next question, i.e. to refresh the page.

How about this JavaScript function? I found it in some website:

Code: Select all

<Script Language="JavaScript">
<!-- Hiding

/*	Script By Lefteris Haritou
	http://www.geocities.com/~lef
	Please Keep The Credit Above
	No Copyrights but be fair
*/

function display(){
rtime=etime-ctime;
if (rtime>60)
m=parseInt(rtime/60);
else{
m=0;
}
s=parseInt(rtime-m*60);
if(s<10)
s="0"+s
window.status="Time Remaining :  "+m+":"+s
window.setTimeout("checktime()",1000)
}

function settimes(){
alert("You have 20 minutes time !")
var time= new Date();
hours= time.getHours();
mins= time.getMinutes();
secs= time.getSeconds();
etime=hours*3600+mins*60+secs;
etime+=1200; // Value of time in seconds
checktime();
}

function checktime(){
var time= new Date();
hours= time.getHours();
mins= time.getMinutes();
secs= time.getSeconds();
ctime=hours*3600+mins*60+secs
if(ctime>=etime){
expired();
}
else
display();
}

function expired(){
alert("Time expired");
location.href="Main.html";  //Put here the next page
}

// Done hiding -->
</Script>
However this will automatically transfer me to another page, means I won't be able to save the score (time) left. Can I send data through POST on JavaScript

Posted: Sun Aug 07, 2005 8:23 am
by feyd
generate a pre-page (like a "starting test style page") that's say.. 100K (102,400). Something this size helps minimize network burst "enhancements." You'll also need the no-cache type headers to make sure a proxy doesn't (normally) cache the data. The "garbage" in the file should be random enough that no benefit comes of compression. Record the time (microtime()) as the page leaves your server.

Placing an onload event in the page that immediately loads the next page will then give you the response time frame their machine will typically do (generally) .. record the time when this page loads. build the difference between the previous time record and this one, then divide 100K by it. You now have a floating point value which approximates the time required for their machine to get, process, and respond to 100K of data. Add 0.1 or 0.15 to this value. Let's call this value sigma. You now have a 10% or 15% margin of error stuck on there.


now, when building a question page you need to store off all the HTML so you can get an accurate size of the page. Once you have this size, multiply by sigma. Add this value, the time limit for this particular question, and the current time and you have will have an expected time to recieve a response to the question.

When the next page loads, compare that time to the expected time. If the time now is greater than the expected, they took too long. :)

Posted: Sun Aug 07, 2005 8:35 am
by pilau
However, with your idea, they would be able to look at the question longer than 15 seconds, which I don't want to happen. That function I got works, and works good, I changed it so it won't display too many messages.

Now you probably saw that JavaScript line:

Code: Select all

location.href="loadquestion.php";
Now, can I send any POST variables thorugh this? How will I be able to send the time left through this redirection to "loadquestion.php"?

Posted: Sun Aug 07, 2005 8:45 am
by feyd
uh.. I never said anything about them being able to look at the page longer.. you can still incorporate that stuff .. the thing is, they can actually look at the page all they want, you can't definitively control that aspect. A timer making the page advance to the next question is perfectly fine with my plan. The only major difference is my plan doesn't rely on the client's time at all.. it's totally on the server, which is a FAR more controllable place.

Posted: Sun Aug 07, 2005 8:54 am
by pilau
That's right, but it's far more advanced for me.
Now can you please help me with my second question?

Posted: Sun Aug 07, 2005 9:07 am
by feyd
you cannot post with document.location, you can however populate a "hidden" form that can post to your scripts.

Posted: Sun Aug 07, 2005 9:08 am
by pilau
Oh wait!
Sorry, I messed up - I don't need anything to be sent!
However, I do need to send in post the time that remained on the counter (as a hidden input on the form which it's value will be the time, i.e. the JavaScript variable.)

Posted: Sun Aug 07, 2005 9:10 am
by feyd
instead of redirection, you tell that form to submit()

Posted: Sun Aug 07, 2005 10:46 am
by pilau
And how is that done?
Document.form.Submit() ?

Posted: Sun Aug 07, 2005 10:57 am
by feyd
document.forms[formName].submit()

Posted: Sun Aug 07, 2005 11:15 am
by pilau
Alright. got that.
Do you happen to know how do you disable form elements with JavaScript? (i.e. make them "go grey")

I am searching for it on Google and W3Schools for an hour and I didn't find anything..