100 ROUNDS, a Flash game with Php/MySql hiscore table and explained source code

I want you all to play 100 ROUNDS, a game created for didactic pourpose.

The game is simple: just enter your name, press “Play” and start moving your mouse clockwise trying to make 100 rounds as fast as you can to enter the highscore table.

I took some ideas from a script found on actionscript.org… but I cannot find it.

For this game I provide the entire source code.

September 24, 2006 | Filed Under Flash, Php, Tutorials | 43 Comments

XML driven Flash slideshow

May, 13th 2007 update: improved gallery with linkable images here

I found this very interesting script on Sephiroth’s site at
http://www.sephiroth.it/file_detail.php?id=124.

It’s a XML driven flash slideshow where the pause between images transition and the transition type, with nine defined transitions.

Great script, but you can only define one pause value… it means that if you set the pause to 10 seconds, all images will stay 10 seconds before changing.

I wanted a slideshow where you can set the pause between EVERY transition, so I added some simple code to Alessandro’s file.

I am going to add some new transitions too, but in a latter time.

This is the movie

In the complete example you can download, you will find all necessary comments in the XML file.

Enjoy.

ps: seem the script has an issue with some transition effects if played at different fps.
Will be fixed soon.

September 6, 2006 | Filed Under Flash | 17 Comments

Click image and get coordinates with Javascript

I had to display several photos where the user can click over an interesting point and have its coordinates passed through a form.
Of course, it was a bit more complicated, but this is the code i want to share with you.

Let’s assume we have a photo like this:

If you continue to click on the photo, you will see pointer changing its position, same thing with x and y coordinates

How can it be done?

You can try this script, obviously changing path and styles according to your needs

<html>
<head>
<script language="JavaScript">
function point_it(event){
	pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("pointer_div").offsetLeft;
	pos_y = event.offsetY?(event.offsetY):event.pageY-document.getElementById("pointer_div").offsetTop;
	document.getElementById("cross").style.left = (pos_x-1) ;
	document.getElementById("cross").style.top = (pos_y-15) ;
	document.getElementById("cross").style.visibility = "visible" ;
	document.pointform.form_x.value = pos_x;
	document.pointform.form_y.value = pos_y;
}
</script>
</head>
<body>
<form name="pointform" method="post">
<div id="pointer_div" onclick="point_it(event)" style = "background-image:url('sun.jpg');width:500px;height:333px;">
<img src="point.gif" id="cross" style="position:relative;visibility:hidden;z-index:2;"></div>
You pointed on x = <input type="text" name="form_x" size="4" /> - y = <input type="text" name="form_y" size="4" />
</form> 
</body>
</html>

Tested both on Firefox and Explorer, it seems to work well.

Enjoy and give me feedback.

September 2, 2006 | Filed Under Javascript | 66 Comments