veridian-wander/client/mobile.js

function Mobile() {
	this.id = 0;
	this.position = {x: 0, y: 0};
	this.targetPosition = {x: 0, y: 0};
	this.width = 32;
	this.height = 32;
	this.maxSpeed = 2;
	this.turnRate = Math.PI / 64;
	this.targetAngle = 0;
	this.angleRadians = 0;
	this.color = "cyan";
	this.name = "Mobile";
	this.spriteCanvas = null;
	this.spriteContext = null;
	this.isAccelerating = false;
	this.sprite = "human1";

	this.isDead = false;

	this.health = 5;
	this.maxHealth = 5;

	this.seen = [];

	this.init = function(mobileData) {
		for(var key in mobileData){
			if(!this.hasOwnProperty(key)) { continue; }
			this[key] = mobileData[key];
		}
	}

	this.update = function(delta) {
		this.angleRadians = system.angleTo(this.position, this.targetPosition);

		if(this.targetPosition.x != this.position.x) {
			if(Math.abs(this.position.x - this.targetPosition.x) < this.maxSpeed) {
				this.position.x = this.targetPosition.x;
				this.targetAngle = this.angleRadians;
			} else {
				this.targetAngle = this.angleRadians;
				this.position.x += this.maxSpeed * Math.cos(this.angleRadians) * delta;
			}
		}

		if(this.targetPosition.y != this.position.y) {
			if(Math.abs(this.position.y - this.targetPosition.y) < this.maxSpeed) {
				this.position.y = this.targetPosition.y;
				this.targetAngle = this.angleRadians;
			} else {
				this.targetAngle = this.angleRadians;
				this.position.y += (this.maxSpeed) * Math.sin(this.angleRadians) * delta;
			}
		}
	}

	this.preRender = function(context, angle) {
		if(angle == null) {
			angle = 0;
		}
		context.fillStyle = this.color;
		context.strokeStyle = this.color;
		context.lineWidth = 4;

		context.save();

		context.translate(0.5, 0.5);
		//context.rotate(angle);
		/*context.fillStyle = "rgba(0,0,0,0.1)";
		system.ellipse(context, 0, 8, 16, 4);
		context.fill();*/
		context.drawImage(system.assets.getSprite(this.sprite), 0, 0, 16, 16, 0, 0, this.width, this.height);
		/*context.beginPath();
		context.moveTo(this.width / 2, 0);
		context.lineTo(-(this.width / 2), -(this.height / 3));
		context.lineTo(-(this.width / 2), this.height / 3);
		context.lineTo(this.width / 2, 0);
		context.fill();*/

		context.restore();
	}

	this.draw = function(context) {

		if(this.spriteContext == null) {
			this.spriteCanvas = document.createElement("canvas");
			this.spriteCanvas.width = this.width;
			this.spriteCanvas.height = this.height;
			this.spriteContext = this.spriteCanvas.getContext("2d");

			this.preRender(this.spriteContext);
		}
		
		if(this.isDead) {
			return;
		}

		context.save();
		context.translate(this.position.x - (this.width / 2), this.position.y - (this.height / 2));
		//context.rotate(this.targetAngle);
		if(this.isAccelerating) {
			context.fillStyle = "#7777FF";
			
			context.beginPath();
			context.moveTo(-this.width - 5, 0);
			context.lineTo(-this.width / 2, 3);
			context.lineTo(-this.width / 2, -3);
			context.lineTo(-this.width - 5, 0);

			context.fill();
		}
		context.drawImage(this.spriteCanvas, 0, 0);

		//bounds box
		/*context.strokeStyle = "#FF7733";
		context.beginPath();
		context.moveTo(0, 0);
		context.lineTo(this.width, 0);
		context.lineTo(this.width, this.height);
		context.lineTo(0, this.height);
		context.lineTo(0, 0);
		context.stroke();*/

		context.strokeStyle = "#00FF00";
		if(this.isTakingDamage) {
			context.strokeStyle = "#FF0000";
			this.isTakingDamage = false;
		}
		context.restore();

		/*context.save();
		context.translate(this.position.x, this.position.y);
		context.font = "16px sans-serif";
		context.textAlign = "center";
		context.textBaseline = "middle";

		context.fillStyle = "#DDDDDD";
		context.strokeStyle = "#333333";
		context.lineWidth = 2;

		//var message = this.player.playerName + " " + this.player.id;
		//var textMetrics = context.measureText(message);
		//var textWidth = textMetrics.width;
		//context.fillText(message, 0, 0);

		var message = parseInt(this.position.x) + ", " + parseInt(this.position.y);
		var textMetrics = context.measureText(message);
		var textWidth = textMetrics.width;
		context.fillText(message, 0, 0);

		var message = parseInt(this.targetPosition.x) + ", " + parseInt(this.targetPosition.y);
		var textMetrics = context.measureText(message);
		var textWidth = textMetrics.width;
		context.fillText(message, 0, 16);

		context.restore();*/

		context.save();
		context.translate(this.position.x, this.position.y);

		context.font = "16px sans-serif";
		context.textAlign = "center";
		context.textBaseline = "middle";
		context.fillStyle = "#DDDDDD";
		context.strokeStyle = "#182208";
		context.lineWidth = 2;
		var textMetrics = context.measureText(this.name);
		var textWidth = textMetrics.width;
		context.strokeText(this.name, 0, -(this.height));
		context.fillText(this.name, 0, -(this.height));

		context.restore();
	}

};