鲸鱼夫妇

function inherit(klass,parent){
	function F(){}
	F.prototype = parent.prototype;
	klass.prototype = new F();
	klass.prototype.constructor = klass;
	return klass;
}
function getRandInt(min, max) {
	return (Math.random() * (max - min) + min) >> 0;
}
var family = [];
function Whale(options){
	var self = this;
	(function(options) {
		self.option = {
			size : [240, 120],
			pos : [0, 0],
			speed : [6, 2],
			spritX : [10, -3360],
			spritY : 0
		};
		extendCopy(options || {}, self.options);
	})();
	this.gender = 'male'
	this.init();
}
Whale.prototype = {
	init : function(){
		this.create();
		this.play();
		this.swim();
		family.push(this);
	},
	create : function(){
		var that = this;
		var whaleBox = document.createElement("DIV");
			whaleBox.className = "whale";
			whaleBox.style.width = this.option.size[0] + "px";
			whaleBox.style.height = this.option.size[1] + "px";
		document.body.appendChild(whaleBox);
		events.addEvent(whaleBox, "mousedown", function(){
			var e = arguments[0] || window.event;
			that._drag(e);
		});
		this.whaleBox = whaleBox;
		return this;
	},
	_swimTimer : null,
	swim : function(){
		var that = this,
			pos = this.option.pos,
			speed = this.option.speed,
			step = [Math.abs(this.option.speed[0]), Math.abs(this.option.speed[1])],
			dir = [speed[0]/step[0], speed[1]/step[1]],
			size = this.option.size;
		var moveX = 0,
			moveY = 0;
		this._swimTimer = setInterval(function(){
			moveX = dir[0] * getRandInt(1,step[0]);
			moveY = dir[1] * getRandInt(1,step[1]);
			if(pos[0] + moveX > Whale.windowSize[0] - size[0] || pos[0] + moveX < 0 ){
				//边境时候掉头
				moveX = 0;
				speed[0] = - speed[0];
				dir[0] = - dir[0];
				that.option.spritY += dir[0] * size[1];
				that.play();
			}
			if(pos[1] + moveX > Whale.windowSize[1] - size[1] || pos[1] + moveY < 0 ){
				moveY = 0;
				speed[1] = - speed[1];
				dir[1] = - dir[1];
			}
			pos[0] += moveX;
			pos[1] += moveY;
			that.whaleBox.style.left = pos[0] + "px";
			that.whaleBox.style.top = pos[1] + "px";
		},200);
	},
	hook : function(){
		 clearInterval(this._swimTimer);
	},
	_playTimer : null,
	play : function(){
		var that = this,
			s = Math.abs(this.option.speed[0]),
			spritX = this.option.spritX,
			x = spritX[0], //sprite开始位置
			y = this.option.spritY;
		clearInterval(this._playTimer);
		this._playTimer = setInterval(function(){
			x = (x <= spritX[1]) ? spritX[0] : x;
			that.whaleBox.style.cssText += "background-position:"+x+"px "+ y +"px;";
			x -= that.option.size[0];
		},1000/s/1);
	},
	_drag : function(e){
		var that = this;
		var whaleBox = that.whaleBox;
		var sX = whaleBox.offsetLeft,
			sY = whaleBox.offsetTop,
			dx = e.clientX,
			dy = e.clientY;
		that.hook();
		whaleBox.style.zIndex = Whale.zIndex++;
		events.addEvent(document, 'mousemove', dragHandle);
		events.addEvent(document, 'mouseup', cancelDragHandle);
		var largeL = Whale.windowSize[0] -  this.option.size[0],
			largeT = Whale.windowSize[1] -  this.option.size[1];
		function dragHandle() {
			var e = arguments[0] || window.event;
			var oX = sX + (e.clientX - dx),
				oY = sY + (e.clientY - dy);
			if(oX > largeL || oX < 0){
				oX = (oX < 0) ? 0 : largeL
			}
			if(oY > largeT || oY < 0){
				oY = (oY < 0) ? 0 : largeT
			}
			that.option.pos[0] = oX;
			that.option.pos[1] = oY;
			whaleBox.style.left = oX + "px";
			whaleBox.style.top = oY + "px";
		};
		function cancelDragHandle() {
			events.removeEvent(document, 'mousemove', dragHandle);
			events.removeEvent(document, 'mouseup', cancelDragHandle);
			that.swim();
		}
	}
}
Whale.zIndex = 1000;
Whale.windowSize = [document.documentElement.offsetWidth, Math.max(document.documentElement.clientHeight, document.body.offsetHeight)];
Whale.mating = function(){
	for(var i= 0 ; i< family.length; i++){
		if(family[i].gender !== "male") continue;
		for(var j= 0; j< family.length; j++){
			if(family[j].gender !== "female") continue;
			if(Math.abs(family[i].option.pos[0] - family[j].option.pos[0]) < 10 && Math.abs(family[i].option.pos[1] - family[j].option.pos[1]) < 10 && !family[j].option.gestation){
				(function(j){
					family[j].option.gestation = true;
					setTimeout(function(){
						family[j].option.gestation = false;
					},5 * 60 * 1000);
					new WhaleBaby({pos:[family[j].option.pos[0] + 80, family[j].option.pos[1] + 30]});
				})(j);
			}
		}
	}
}
function WhaleLady(options){
	var self = this;
	(function(options) {
		self.option = {
			size : [210, 100],
			pos : [80, 200],
			speed : [4, -2],
			spritX : [10, -2940],
			spritY : -300
		};
		extendCopy(options || {}, self.options);
	})();
	this.gender = "female";
	this.gestation = false;
	this.init();
}
function WhaleBaby(options){
	var self = this;
	(function(options) {
		self.option = {
			size : [120, 60],
			pos : [0, 100],
			speed : [7, -3],
			spritX : [2, -1650],
			spritY : -600
		};
		extendCopy(options || {}, self.option);
	})(options);
	this.init();
}
inherit(WhaleLady, Whale);
inherit(WhaleBaby, WhaleLady);
var bb = new WhaleLady();
var aa = new Whale();
setInterval(Whale.mating,1000);