【ife】任务二十六：行星与飞船（一）

function addEventHandler(element, event, hanlder) {
    if (element.addEventListener)
        element.addEventListener(event, hanlder, false);
    else if (element.attachEvent)
        element.attachEvent("on" + event, hanlder);
    else
        element["on" + event] = hanlder;
}


var speed = 20; 
var discharge = 5; 
var charge = 2;
var error = 0.3; 
var spaceships = [];


window.onload = function() {
	var command = document.getElementById('command');
	var order = document.getElementById('order');
	var universe = document.getElementById('universe');
	addEventHandler(command, 'click', function() {
		event.target.disable = 'true';
		switch(event.target.innerHTML) {
			case '新的飞船起飞':
				Commander.newSpaceship(event.target);
				break;
			case '开始飞行':
				Commander.beginToFly(event.target);
				break;
			case '停止飞行':
				Commander.stopToFly(event.target);
				break;
			case '销毁':
				Commander.destroy(event.target);
				break;
		}
	});
}

var Spaceship = function(id) {
	this.id = id,
	this.state = 'stop',
	this.deg = 45,
	this.energy = 100,
	this.interval = null,
	this.energy_interval = null
};

Spaceship.prototype.powerSystem = function() {
	if (this.state == 'fly') {
		var that = this;
		if (this.interval == null) {
			this.interval = setInterval(function() {
				that.energy -= discharge;
				if (that.energy < 0) { 
					that.state = 'stop';
					clearInterval(that.interval);
					that.interval = null;
				}
				document.getElementById("spaceship" + that.id).getElementsByTagName('span')[0].innerHTML = that.energy + '%';
				that.deg = (that.deg + speed) % 360;
				document.getElementById("spaceship" + that.id).style.transform = 'rotate(' + that.deg + 'deg)';
			}, 1000);
		}
	}
	if (this.state == 'stop') {
		clearInterval(this.interval);
		this.interval = null;
	}
};

Spaceship.prototype.energySystem = function() {
	this.energy += charge; 
	if (this.energy > 100) 
		this.energy = 100;
	document.getElementById("spaceship" + this.id).getElementsByTagName('span')[0].innerHTML = this.energy + '%';
};

Spaceship.prototype.distroySystem = function() {
	for (var i = 0; i < universe.getElementsByTagName('div').length; i++) {
		if (universe.getElementsByTagName('div')[i].innerHTML.toString()[0] == this.id) 
			universe.removeChild(universe.getElementsByTagName('div')[i]);
	}
	for (var i = 0; i < spaceships.length; i++) { 
		if (spaceships[i].id == this.id) {
			clearInterval(spaceships[i].interval); 
			clearInterval(spaceships[i].energy_interval); 
			spaceships.splice(i, 1); 
			break;
		}
	}
};

Spaceship.prototype.signalSystem = function(id, cmd) {
	if (this.id == id) {
		switch(cmd) {
			case 'fly':
				this.state ='fly';
				this.powerSystem();
				this.energySystem();
				console.log(this.id + '号飞船接收到开始飞行命令');
				break;
			case 'stop':
				this.state = 'stop';
				this.powerSystem();
				this.energySystem();
				console.log(this.id + '号飞船接收到停止飞行命令');
				break;
			case 'destroy':
				this.distroySystem();
				console.log(this.id + '号飞船接收到销毁命令');
				break;
		}
	}
};

var Commander = {
	newSpaceship: function() {
		var divs = universe.getElementsByTagName('div');
		var commands = command.getElementsByTagName('div');
		if (commands.length < 4 ) {
			var newSpaceship = document.createElement('div');
			var newCommand = document.createElement('div');
			for (var i = 1; i <= 4; i++) { 
				if (document.getElementById("spaceship" + i) == undefined)
					break;
			}
			var id = i;
			newSpaceship.innerHTML = id + '号-<span>100%</span>';
			newSpaceship.className = 'spaceship';
			universe.appendChild(newSpaceship);
			newSpaceship.setAttribute("id", "spaceship" + id);
			newSpaceship.style.top = 135 - (id - 1) * 50 + 'px';
			newSpaceship.style.transformOrigin = 'center' + ' ' + (170 + (id - 1) * 50) + 'px';
			newCommand.innerHTML = '<span>对' + id + '号飞船下达命令：</span><button>开始飞行</button><button>停止飞行</button><button>销毁</button>';
			command.insertBefore(newCommand,command.lastElementChild);
			display('指挥官：创建' + id + '号飞船成功<br>');
			var spaceship = new Spaceship(id);
	    	spaceships.push(spaceship);
			spaceship.energy_interval = esetInterval(function() {
				spaceship.energySystem();
			}, 1000);
		} 
		else 
			display('指挥官：创建失败，飞船数量已达上限4');
	},
	beginToFly: function(e) { 
		var id = e.parentNode.firstChild.innerHTML.toString()[1];
		display('指挥官：命令' + id + '号飞船开始飞行');
		mediator('{"id":"' + id +'", "command": "fly"}');
	},
	stopToFly: function(e) { 
		var id = e.parentNode.firstChild.innerHTML.toString()[1];
		display('指挥官：命令' + id + '号飞船停止飞行');
		mediator('{"id":"' + id +'", "command": "stop"}');
	},
	destroy: function(e) { 
		var id = e.parentNode.firstChild.innerHTML.toString()[1];
		display('指挥官：命令' + id + '号飞船销毁');
		for (var i = 0; i < command.getElementsByTagName('div').length; i++) {
			if (command.getElementsByTagName('span')[i].innerHTML.toString()[1] == id) 
				command.removeChild(command.getElementsByTagName('div')[i]);
		}
		mediator('{"id":"' + id +'", "command": "destroy"}');
	}
}


function display(signal) {
	var order = document.getElementById('order');
	order.innerHTML += signal;
}

function mediator (jsonStr) { 
	var jsonObj = JSON.parse(jsonStr); 
	if (Math.random() <= error) 
		display('，信息传送失败<br>');
	else {
		setTimeout(function() {
			display('，信息传送成功<br>');
			var spaceship = [];
			for (var i = 0; i < spaceships.length; i++) 
		        spaceship.push(spaceships[i]);
		    for (var i = 0; i < spaceship.length; i++) {
		        if (typeof spaceship[i].signalSystem === 'function') 
		            spaceship[i].signalSystem(jsonObj.id, jsonObj.command); 
		    }
		}, 1000);
	}
}