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(); } };