Hi There,
I know next to nothing about PHP and Javascript but I have been plugging away at this bit of code for a while now and I have it working, but I want to change the functionality a bit I was hoping someone here could help be figure that out.
let me post the code first then I'll explain it and tell you what I'd like to change:
<HTML>
<HEAD>
<title>200,000 to 1</title>
<script language=javascript>
<!--
function get_mouse_coord(ev)
{
var e = ev ? ev:window.event;
document.forms.myForm.guess_x.value = e.clientX
document.forms.myForm.guess_y.value = e.clientY
}
//-->
</script>
</HEAD>
<body>
<?php
if (!$_POST['submit'])
{
?>
<img STYLE="position:absolute; TOP:0px; LEFT:0px; CLEAR:left; FLOAT:left;" src="picture.gif" onclick="get_mouse_coord(event)"; name="picture">
<form STYLE="position:absolute; TOP:410px; LEFT:25px;" name="myForm" action="compare2.php" method="post">
<input type="text" name="guess_x">
<input type="text" name="guess_y">
<input type="submit" value="submit" name="submit" >
</form>
<?php
}
else
{
$inputx = $_POST['guess_x'];
$inputy = $_POST['guess_y'];
if (($inputx == null) || ($inputy == null))
{
$message = 'You must pick your co-ordniates first, go to <a href="compare2.php">this page</a> to start';
}
elseif (($inputx == '123') && ($inputy == '123'))
{
$message = 'Congratulations, you have found the right pixel';
}
else
{
$message = 'Sorry, your guess wasn\'t correct. <a href="compare2.php">Try Again!</a>';
}
echo "$message";
}
?>
</body>
</HTML>
The code is simple enough, I have a 400 x 400 pixel picture, click anywhere on the picture and the co-ords of your mouse click are sent to two text boxes. Click the submit button and the co-ords are compared to the "correct" co-ords. If it's a match you get a congrats message, if it's not a match you get the try again message. it all works but it's not very user friendly.
I'd like for the user to be able to have more than one guess before they have to click the submit button, I was thinking of having 10 sets of text boxes and each click the user makes fills the next set of co-ord boxes with their guess. Then clicking the submit button would compare them all at once. I can't seem to get my head around how to do that.
Also, ideally I'd like to have a real-time depiction of the mouse co-ords in another box, I tried using onmousemotion but I couldn't get that to work either.
It would be a great help to me if someone could guide me through this,
A person over at phpfreaks said that I should use an array, but the exaplaination he gave confused me even more 😕. I think I am looking for someone to basically lead me through this so I can understand how to add what I need to add.
Thanks in advance.
