tomtsagk
/
ritle-javascript


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
							<html>
	<body>
		<canvas id="game" width="480" height="320"></canvas>
		
		<script type="text/JavaScript" src="menus.js"></script> 
		<script type='text/javascript'>
			
			//Input
			var input = false, touchX = 0, touchY = 0;
			
			//Initialize canvas
			var canvas = document.getElementById('game');
			canvas.onmousedown = function(e) 
				{
					input = true;
					touchX = e.pageX - canvas.offsetLeft;
					touchY = e.pageY - canvas.offsetTop;
				}
			var context = canvas.getContext('2d');
			var width = 480;
			var height = 320;
			
			//Font
			context.font = '20pt Arial';
			context.textAlign="center";
			var fontSize = 20;
			
			//Shadow
			context.shadowOffsetX = 2;
			context.shadowOffsetY = 2;
			context.shadowBlur = 5;
			
			//Draw loading state
			context.fillText('Loading...', width/2, height/2);
			
			//Menu
			var menu, background;
			var bFirstChar = true;
			var bSound = true;
			
			
			
			//Images
				//var n = 100;
				//var sample = new Array();
				//for (var i = 0; i < n; i++)
				//	sample.push(i);
				
				//var n = 41;
				//var image = new Array();
				//for (i = 0; i < n; i++)
				//	image[i] = new Image();
			
			var image = [new Image(), new Image(), new Image(), new Image(), new Image(), 
						 new Image(), new Image(), new Image(), new Image(), new Image(),
						 new Image(), new Image(), new Image(), new Image(), new Image(),
						 new Image(), new Image(), new Image(), new Image(), new Image(),
						 new Image(), new Image(), new Image(), new Image(), new Image(),
						 new Image(), new Image(), new Image(), new Image(), new Image(),
						 new Image(), new Image(), new Image(), new Image(), new Image(),
						 new Image(), new Image(), new Image(), new Image(), new Image(),
						 new Image()];
						 
			image[0].src = 'images/background_bottom_0.png';
			image[1].src = 'images/background_bottom_1.png';
			image[2].src = 'images/background_top.png';

			image[3].src = 'images/cloud_back.png';
			image[4].src = 'images/cloud_front.png';

			image[5].src = 'images/tree_0.png';
			image[6].src = 'images/tree_1.png';
			
			image[7].src = 'images/title.png';
			image[8].src = 'images/button.png';
			//image[9].src = 'images/tutorial.png';
			
			image[10].src = 'images/dark_dimension_logo.png';
			//image[11].src = 'images/facebook.png';
			//image[12].src = 'images/twitter.png';
			//image[13].src = 'images/tumblr.png';
			//image[14].src = 'images/google_play_store.png';
			
			image[15].src = 'images/ground_0_0.png';
			image[16].src = 'images/ground_1_0.png';
			image[17].src = 'images/ground_2_0.png';
			image[18].src = 'images/ground_damaged_0.png';
			image[19].src = 'images/ground_damaged_1.png';
			image[20].src = 'images/ground_damaged_2.png';
			
			image[21].src = 'images/crystal.png';
			image[22].src = 'images/magic_mana.png';
			image[23].src = 'images/shield.png';
			image[24].src = 'images/double_score.png';
			image[25].src = 'images/spikes.png';
			
			image[26].src = 'images/sound_yes.png';
			image[27].src = 'images/sound_no.png';
			
			image[28].src = 'images/darek_run_0.png';
			image[29].src = 'images/darek_run_1.png';
			image[30].src = 'images/darek_run_2.png';
			image[31].src = 'images/darek_run_3.png';
			image[32].src = 'images/darek_run_4.png';
			image[33].src = 'images/darek_run_5.png';
			image[34].src = 'images/darek_run_6.png';
			image[35].src = 'images/darek_run_7.png';
			
			image[36].src = 'images/darek_fall.png';
			image[37].src = 'images/darek_jump.png';
			
			image[38].src = 'images/shield_active_0.png';
			image[39].src = 'images/shield_active_1.png';
			
			image[40].src = 'images/air_jump_darek.png';
			
			var sound = new Audio('foot_step.wav');
			sound.play();
			
			var imagesLoaded = 0;
			
			for (i = 0; i < 41; i++)
				image[i].onload = function() 
				{
					if (++imagesLoaded == 36)
					{
						//Initialize Game state
						background = Background();
						menu = MainMenu(false);
			
						//Start loop
						setInterval(function() 
							{
								update(); 
								if (menu.bDraw) draw();
							}, 1000/30);
					}
				};
			
			//Basic Game Loop
			//Update
			function update()
			{
				var nextMenu = menu.update();
				
				switch (nextMenu)
				{
					case 0:
						menu = MainMenu(menu.hardReset);
						break;
					case 1:
						menu = ExtraMenu();
						break;
					case 2:
						menu = GameMenu(menu.hardReset);
						break;
				}
			}

			//Draw
			function draw() 
			{
				//Sky
				context.fillStyle="#FE9E70";
				context.fillRect(0, 0, width, height*3/4);
				
				//Sea
				context.fillStyle="#58B6DE";
				context.fillRect(0, height*3/4, width, height);
				
				//Reset for font
				context.fillStyle="white";
				
				//Draw Menu
				menu.draw();
			}
		</script>
	</body>
</html>