Get the full commented source code of

HTML5 Suika Watermelon Game

Talking about Actionscript 3, Flash and Game development.

Do you know Scoreoid?

Scoreoid is a non-restrictive, reliable and easy to use Gaming Backend-as-a-Service.

The main reason you should use Scoreoid is there isn’t any SDK. Yes, you’re right, you don’t have to include and learn any kind of library, you just have an agnostic solution, so no matter what type of game you’re developing, you need only one backend – Scoreoid – for all versions of your game. Even more exciting, you can offer players the ability to compare scores across different platforms. The Scoreoid Open Web API is based on the standard RESTful HTTP/HTTPS protocol.

Ok, no more boring theory and let’s jump straight to the point: in this first tutorial we are going to include the top score feature in the AS3 Metro Siberia UnderGround Prototype.

Here is the game:

Mouse button to turn on engines, avoid the squares, collect the circles. That’s it.

It’s the same one button game as seen in the original version, but it will keep showing the best score overall score.

This is the easiest feature allowed by Scoreoid, but obviously there’s a lot more we will discover during next posts.

Have a look at the source code, I highlighted the lines added to make it work:

package {
	import flash.display.Sprite;
	import flash.filters.GlowFilter;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.net.URLRequest;
	import flash.net.URLVariables;
	import flash.net.URLLoader;
	import flash.net.URLRequestMethod;
	import flash.net.URLLoaderDataFormat;
	public class Main extends Sprite {
		private var shipFilter:GlowFilter=new GlowFilter(0x00ff00,0.8,4,4,2,3,false,false);
		private var smokeFilter:GlowFilter=new GlowFilter(0xff0000,0.8,4,4,2,3,false,false);
		private var fuelFilter:GlowFilter=new GlowFilter(0x00ffff,0.8,4,4,2,3,false,false);
		private var rockFilter:GlowFilter=new GlowFilter(0xffffff,0.8,4,4,2,3,false,false);
		private var scoreFilter:GlowFilter=new GlowFilter(0xff00ff,0.8,2,4,2,3,false,false);
		private var gravity:Number=0.1;
		private var thrust:Number=0.25;
		private var yspeed:Number=0;
		private var xspeed:Number=5;
		private var distance:Number=0;
		private var smokeInterval:Number=10;
		private var framesPassed:Number=0;
		private var fuelFrequency:Number=10;
		private var gasoline:Number=500;
		private var rockFrequency:Number=50;
		private var engines:Boolean=false;
		private var ship:Ship=new Ship();
		private var score:Score=new Score();
		private var rockCanvas:Sprite=new Sprite();
		private var fuelCanvas:Sprite=new Sprite();
		private var smokeCanvas:Sprite=new Sprite();
		private var fuelVector:Vector.<Fuel>=new Vector.<Fuel>();
		private var rockVector:Vector.<Rock>=new Vector.<Rock>();
		private var smokeVector:Vector.<Smoke>=new Vector.<Smoke>();
		private var topScore:Number=0;
		public function Main() {
			getBest();
			addChild(ship);
			ship.x=120;
			ship.y=240;
			ship.filters=new Array(shipFilter);
			addChild(score);
			addChild(rockCanvas);
			addChild(fuelCanvas);
			addChild(smokeCanvas);
			score.filters=new Array(scoreFilter);
			addEventListener(Event.ENTER_FRAME,update);
			stage.addEventListener(MouseEvent.MOUSE_DOWN,engineOn);
			stage.addEventListener(MouseEvent.MOUSE_UP,engineOff);
		}
		private function engineOn(e:MouseEvent):void {
			engines=true;
			framesPassed=smokeInterval;
		}
		private function engineOff(e:MouseEvent):void {
			engines=false;
			smokeInterval=10;
		}
		private function update(e:Event):void {
			if (Math.random()*1000<fuelFrequency) {
				var fuel:Fuel=new Fuel();
				fuel.y=Math.random()*400+40;
				fuel.x=650;
				fuel.filters=new Array(fuelFilter);
				fuelCanvas.addChild(fuel);
				fuelVector.push(fuel);
			}
			if (Math.random()*1000<rockFrequency) {
				var rock:Rock=new Rock();
				rock.y=Math.random()*400+40;
				rock.x=670;
				rock.rotation=Math.random()*360;
				rock.filters=new Array(rockFilter);
				rockCanvas.addChild(rock);
				rockVector.push(rock);
			}
			distance+=xspeed;
			score.scoreText.text="Distance: "+distance+" - Fuel: "+gasoline+" - Best distance: "+topScore;
			if ((gasoline>0)&&(engines)) {
				yspeed-=thrust;
				smokeInterval-=0.25;
				gasoline-=1;
				framesPassed++;
				if (smokeInterval<framesPassed) {
					var smoke:Smoke=new Smoke();
					smoke.x=ship.x;
					smoke.y=ship.y;
					smoke.filters=new Array(smokeFilter);
					smokeCanvas.addChild(smoke);
					smokeVector.push(smoke);
					framesPassed=0;
					smokeInterval-=0.01;
				}
			}
			yspeed+=gravity;
			ship.y+=yspeed;
			angle=Math.atan2(yspeed,xspeed);
			ship.rotation=angle*180/Math.PI;
			for (var i:int=fuelVector.length-1; i>=0; i--) {
				fuelVector[i].x-=xspeed*1.2;
				var dist_x:Number=ship.x+28*Math.cos(angle)-fuelVector[i].x;
				var dist_y:Number=ship.y+28*Math.sin(angle)-fuelVector[i].y;
				var dist:Number = Math.sqrt(dist_x*dist_x+dist_y*dist_y);
				if (dist<10) {
					gasoline+=100;
					fuelCanvas.removeChild(fuelVector[i]);
					fuelVector.splice(i,1);
				}
				else {
					if (fuelVector[i].x<-10) {
						fuelCanvas.removeChild(fuelVector[i]);
						fuelVector.splice(i,1);
					}
				}
			}
			for (i=rockVector.length-1; i>=0; i--) {
				rockVector[i].x-=xspeed;
				if (rockVector[i].x<-20) {
					rockCanvas.removeChild(rockVector[i]);
					rockVector.splice(i,1);
				}
			}
			for (i=smokeVector.length-1; i>=0; i--) {
				smokeVector[i].x-=xspeed;
				smokeVector[i].width+=0.2;
				smokeVector[i].height+=0.2;
				smokeVector[i].alpha-=0.04;
				if (smokeVector[i].alpha<0) {
					smokeCanvas.removeChild(smokeVector[i]);
					smokeVector.splice(i,1);
				}
			}
			if (ship.y>480 || ship.y<0 || rockCanvas.hitTestPoint(ship.x+28*Math.cos(angle), ship.y+28*Math.sin(angle), true) || rockCanvas.hitTestPoint(ship.x+8*Math.cos(angle+Math.PI/2), ship.y+8*Math.sin(angle+Math.PI/2), true) || rockCanvas.hitTestPoint(ship.x+8*Math.cos(angle-Math.PI/2), ship.y+8*Math.sin(angle-Math.PI/2), true)) {
				postScore();
				yspeed=0;
				ship.y=200;
				gasoline=500;
				distance=0;
				rockVector=new Vector.<Rock>();
				removeChild(rockCanvas);
				rockCanvas=new Sprite();
				addChild(rockCanvas);
				fuelVector=new Vector.<Fuel>();
				removeChild(fuelCanvas);
				fuelCanvas=new Sprite();
				addChild(fuelCanvas);
				smokeVector=new Vector.<Smoke>();
				removeChild(smokeCanvas);
				smokeCanvas=new Sprite();
				addChild(smokeCanvas);
			}
		}
		private function postScore():void {
			var url:String="https://www.scoreoid.com/api/createScore";
			var request:URLRequest=new URLRequest(url);
			var requestVars:URLVariables = new URLVariables();
			request.data=requestVars;
			requestVars.api_key="xxx";
			requestVars.game_id="yyy";
			requestVars.response="XML";
			requestVars.username="Demo Name";
			requestVars.score=distance;
			request.method=URLRequestMethod.POST;
			var urlLoader:URLLoader = new URLLoader();
			urlLoader = new URLLoader();
			urlLoader.dataFormat=URLLoaderDataFormat.TEXT;
			urlLoader.addEventListener(Event.COMPLETE, scorePosted);
			urlLoader.load(request);
		}
		private function scorePosted(event:Event):void {
			getBest();
		}
		private function loaderCompleteHandler(event:Event):void {
			var score:XML=new XML(event.target.data);
			if (score>topScore) {
				topScore=score;
			}
		}
		function getBest():void {
			var url:String="https://www.scoreoid.com/api/getGameTop";
			var request:URLRequest=new URLRequest(url);
			var requestVars:URLVariables = new URLVariables();
			request.data=requestVars;
			requestVars.api_key="xxx";
			requestVars.game_id="yyy";
			requestVars.response="XML";
			requestVars.field="best_score";
			request.method=URLRequestMethod.POST;
			var urlLoader:URLLoader = new URLLoader();
			urlLoader = new URLLoader();
			urlLoader.dataFormat=URLLoaderDataFormat.TEXT;
			urlLoader.addEventListener(Event.COMPLETE, loaderCompleteHandler);
			urlLoader.load(request);
		}
	}
}

As you can see it’s just a matter of posting to some URLs Scoreoid provides, along with some data such as the developer and game id which have been obscured in the code shown (lines 159-160 and 185-186).

createScore() method lets you insert a game score, the parameters I used are:

api_key: your developer ID you get once you register
game_id: the game ID you get once you create a game
response: the type of response, can be XML or JSON
username: the player name
score: the score you are submitting

getGameTop() method lets you retrieve the top value of your game, you can also specify a range of dates, which I didn’t in this case. The parameters I used are:

api_key: your developer ID you get once you register
game_id: the game ID you get once you create a game
response: the type of response, can be XML or JSON
field: the field I want to retrieve the top value, best_score in this case

No need to download anything since you can just copy/paste this script into the original one, just remember to use your own api key and game id.

Give a try at Scoreoid because it’s really interesting, next time I’ll show you how to create a complete leaderboard.

Never miss an update! Subscribe, and I will bother you by email only when a new game or full source code comes out.