Icontem

File: example_game_movement.js

Recommend this page to a friend!
  Classes of JImmy Bo  >  Spritesheet Animation Manager  >  example_game_movement.js  >  Download  
File: example_game_movement.js
Role: Example script
Content type: text/plain
Description: example game movement
Class: Spritesheet Animation Manager
Animate graphics using CSS sprites
Author: By
Last change:
Date: 5 years ago
Size: 4,251 bytes
 

Contents

Class file image Download
	var player = function(divClass) {
	
		this.className = divClass;
		
		this.id 				= 'jP' + window.performance.now();
		this.id 				= this.id.replace(/\./g,''); // get rid of period
		
		this.that = this;
		
		this.cur = {
			direction 	: 'south',
			state		: 'stopped',
		};
		
		this.anim = [];
		
		this.anim['south'] = new spritesheet_animation_manager(this.className);
		this.anim['south'].add.row (   	0, 0, 			3, 			32, 32, 		0 );
		this.anim['south'].cur.frame = 1;
		this.anim['south'].speed = 125;
		this.anim['south'].pingpong = true;
		
		this.anim['north'] = new spritesheet_animation_manager(this.className);
		this.anim['north'].add.row (   	0, 32 * 3, 			3, 			32, 32, 		0 );
		this.anim['north'].cur.frame = 1;
		this.anim['north'].speed = 125;
		this.anim['north'].pingpong = true;
		
		this.anim['east'] = new spritesheet_animation_manager(this.className);
		this.anim['east'].add.row (   	0, 32 * 2, 			3, 			32, 32, 		0 );
		this.anim['east'].cur.frame = 1;
		this.anim['east'].speed = 125;
		this.anim['east'].pingpong = true;
		
		this.anim['west'] = new spritesheet_animation_manager(this.className);
		this.anim['west'].add.row (   	0, 32, 			3, 			32, 32, 		0 );
		this.anim['west'].cur.frame = 1;
		this.anim['west'].speed = 125;
		this.anim['west'].pingpong = true;
		
		this.change = {
			that:this,
			
			direction: function(new_direction) {
				var old_direction = this.that.cur.direction;
				
				// stop old direction //
				this.that.anim[old_direction].stop();
				
				// ... now hook it up with a bump //
				this.that.anim[new_direction].display.frame();
				this.that.anim[new_direction].control.play();
			},
			
		};
		
		this.control = {
			that:this,
			
			key_down : function(whichKey) {
			
				var old_direction = this.that.cur.direction;
				// console.log(old_direction);
				
				var new_direction = false;
				
				if(whichKey.keyCode == 87)
					new_direction = 'north';
				else if(whichKey.keyCode == 65)
					new_direction = 'west';
				else if(whichKey.keyCode == 83)
					new_direction = 'south';
				else if(whichKey.keyCode == 68)
					new_direction = 'east';
				
				// console.log(whichKey.keyCode);
				
				
				if(new_direction == old_direction && this.that.cur.state == 'walking') {		return false; 		}
				
				this.that.cur.direction = new_direction;
				
				if(new_direction)
				{

					this.that.anim[old_direction].control.stop();
					this.that.anim[new_direction].display.frame();
					this.that.anim[new_direction].control.stop();
					this.that.anim[new_direction].control.play();
					
					this.that.cur.state = 'walking';
				}
				
				
				/*
					cur = this.that.cur;
					// w=87, a=65, s=83, d=68 
				*/
				
				
				
			},
			
			key_up : function(whichKey) {
				// console.log('still keyup');
				
				var cur_direction = this.that.cur.direction;
				
				this.that.anim[cur_direction].control.stop(1); // stop on frame 1
				this.that.anim[cur_direction].display.frame(); // update player display
				
				this.that.cur.state = 'stopped';
			},
			
			
			stop : function () {
				this.that.anim[this.that.cur.direction].control.stop();
			},
			
			show : function () {
				var cur_direction = this.that.cur.direction;
				this.that.anim[cur_direction].display.frame(); // update player display
			}
			
		};
		

		this.init = function (that) {

			
				// Handler for .ready() called.
				// document.onkeydown 	= that.control.keydown;
				// document.onkeyup 	= that.control.keyup;
				var parentobj = that;
				
			
				document.body.onkeydown = function(event) {
				
					// console.log(that);
					
					event = event || window.event;
					var keycode = event.charCode || event.keyCode;
					
					that.control.key_down(event);
				};
				
				document.body.onkeyup = function(event) {
				
					// console.log('keyup');
					
					event = event || window.event;
					var keycode = event.charCode || event.keyCode;
					
					
					console.log(parentobj);
					parentobj.control.key_up(event);
				};
			
		} (this);
		
	};

	var player = new player(".player");
	player.control.show();