//State Class
/*
aaron's ideas
in get point  == wojan
run mid point on each state on init to radius of state

point that i'm over - how far from biggest state - if bigger the radius than not near state
*/

var ACTIVESTATES = [];
var State = Class.extend({
	init: function(Name,abbreviation,drawCords){
		this.Name = Name;
		this.abbrev = abbreviation;
		this.strokeStyle = "#38598d";
		this.fillStyleOff = "#6cbbdd";
		this.fillStyleOn = "#ffffff";
		this.drawCords = drawCords;
		this.xPoints = [];
		this.yPoints = [];
		this.canvas;
		this.timer;
		this.delay = 500;
		this.clickTimer;
		this.xAvg;
		this.yAvg;
		this.isOn = false;
		this.activated = false;
	},
	draw: function(ctx){
		/*is now activated */
		this.activated = true;
		ACTIVESTATES.push(this);
		
		
		/*draw to canvas*/
		this.canvas = ctx;
		this.canvas.fillStyle = this.fillStyleOff;
		this.canvas.strokeStyle = this.strokeStyle;
		this.canvas.beginPath();
		this.canvas.moveTo(this.drawCords[0][0],this.drawCords[0][1]);
		for (var i = 1; i < this.drawCords.length; i++) {
			switch (this.drawCords[i].length){
				case 2:   
					this.canvas.lineTo(this.drawCords[i][0],this.drawCords[i][1]);
					this.xPoints.push(this.drawCords[i][0]);
					this.yPoints.push(this.drawCords[i][1]);
					break;
				case 3:
					this.canvas.moveTo(this.drawCords[i][1],this.drawCords[i][2]);
					this.xPoints.push(this.drawCords[i][1]);
					this.yPoints.push(this.drawCords[i][2]);
					break;
				case 4:   
					this.canvas.quadraticCurveTo(this.drawCords[i][0],this.drawCords[i][1],this.drawCords[i][2],this.drawCords[i][3]);
					this.xPoints.push(this.drawCords[i][2]);
					this.yPoints.push(this.drawCords[i][3]);
					break;
				case 6:
					this.canvas.bezierCurveTo(this.drawCords[i][0],this.drawCords[i][1],this.drawCords[i][2],this.drawCords[i][3],this.drawCords[i][4],this.drawCords[i][5]);  
					this.xPoints.push(this.drawCords[i][4]);
					this.yPoints.push(this.drawCords[i][5]);
					break;
				default:  
					//
					alert('error in drawing coordinates')
			}
		}
		this.canvas.closePath();
		this.canvas.stroke();
		this.canvas.fill();
		
		//get middle point for popup
		this.xAvg = this.xPoints.sum() / this.xPoints.length;
		this.yAvg = this.yPoints.sum() / this.yPoints.length;
	},
	square: function(){
		
		return [this.squareX,this.squareY]
	},
	getPoint: function(e, x, y){
		var polySides = this.xPoints.length;
		var polyX = this.xPoints;
		var polyY = this.yPoints;

		var i = polySides-1
		var j = polySides-1;
		var oddNodes = false;

		//check if point is in polygon
		for (i=0; i<polySides; i++){
			if (polyY[i]<y && polyY[j]>=y ||  polyY[j]<y && polyY[i]>=y){
				if (polyX[i]+(y-polyY[i])/(polyY[j]-polyY[i])*(polyX[j]-polyX[i])<x) {
					oddNodes=!oddNodes;
				}
			}
			j=i;
		}
		
		if(oddNodes === true){
			if(this.isOn === false){
				this.over();
			}
			this.isOn = true;
		} else if(this.isOn === true){
			var self = this;
			function checkOver(){
				if(self.isOn === false){
					self.out();
				}else{
					//console.log('still on');
				}
				clearTimeout(self.timer);
			}
			this.isOn = false;
			this.timer = setTimeout(checkOver, self.delay)
		}
		if(e == 'mousedown' && oddNodes === true){
			this.click();
			this.isOn = true;
		}
	},
	over: function(){
		//shut off all other states
		for(var i = 0; i<ACTIVESTATES.length; i++){
			ACTIVESTATES[i].out()
		}
		//draw over state
		this.canvas.fillStyle = this.fillStyleOn;
		this.canvas.strokeStyle = this.strokeStyle;
		this.canvas.beginPath();
		this.canvas.moveTo(this.drawCords[0][0],this.drawCords[0][1]);
		for (var i = 1; i < this.drawCords.length; i++) {
			switch (this.drawCords[i].length){
				case 2:   
					this.canvas.lineTo(this.drawCords[i][0],this.drawCords[i][1]);
					break;
				case 3:
					this.canvas.moveTo(this.drawCords[i][1],this.drawCords[i][2]);
					break;
				case 4:   
					this.canvas.quadraticCurveTo(this.drawCords[i][0],this.drawCords[i][1],this.drawCords[i][2],this.drawCords[i][3]);
					break;
				case 6:
					this.canvas.bezierCurveTo(this.drawCords[i][0],this.drawCords[i][1],this.drawCords[i][2],this.drawCords[i][3],this.drawCords[i][4],this.drawCords[i][5]);  
					break;
				default:  
					//
					alert('error in drawing coordinates')
			}
		}
		this.canvas.closePath();
		this.canvas.stroke();
		this.canvas.fill();
	},
	out: function(){
		this.canvas.fillStyle = this.fillStyleOff;
		this.canvas.strokeStyle = this.strokeStyle;
		this.canvas.beginPath();
		this.canvas.moveTo(this.drawCords[0][0],this.drawCords[0][1]);
		for (var i = 1; i < this.drawCords.length; i++) {
			switch (this.drawCords[i].length){
				case 2:   
					this.canvas.lineTo(this.drawCords[i][0],this.drawCords[i][1]);
					break;
				case 3:
					this.canvas.moveTo(this.drawCords[i][1],this.drawCords[i][2]);
					break;
				case 4:   
					this.canvas.quadraticCurveTo(this.drawCords[i][0],this.drawCords[i][1],this.drawCords[i][2],this.drawCords[i][3]);
					break;
				case 6:
					this.canvas.bezierCurveTo(this.drawCords[i][0],this.drawCords[i][1],this.drawCords[i][2],this.drawCords[i][3],this.drawCords[i][4],this.drawCords[i][5]);  
					break;
				default:  
					alert('error in drawing coordinates')
			}
		}
		this.canvas.closePath();
		this.canvas.stroke();
		this.canvas.fill();
	},
	click: function(){
		var markup;
		var markupfoot;
		var schoolList = [];
		for(var i = 0; i < $('#schoolSelect option').length; i++){
			if($('#schoolSelect option:eq('+i+')').hasClass(this.abbrev)){
				if($('#schoolSelect option:eq('+i+')').html() != this.abbrev){
					var thisHtml = $('#schoolSelect option:eq('+i+')').html();
					var school = thisHtml.split('-')[1].split(',')[0];
					var city = thisHtml.substring(thisHtml.lastIndexOf(',')+1,thisHtml.length);
					city = (city).replace(/^\s*|\s*$/g,'');
					schoolList.push('<li class="city">'+city+'</li>');
					schoolList.push('<li class="school"><a href="'+$('#schoolSelect option:eq('+i+')').attr('value')+'">'+school+'</a></li>');
				}
				
			}
		}
		markupfoot = '<ul>'+schoolList.pop() +'</ul>';
		var unique = schoolList.unique();
		markup = '<ul><li class="name"><a href="#">'+this.Name+'</a></li>'+unique.join('') +'</ul>';
		$('.mappop .con').html(markup);
		$('.mappop .bottom').html(markupfoot);
		
		for(var j = 0; j<$('.mappop ul li.school').length; j++){
			if(j % 2 == 0){
				$('.mappop ul li.school:eq('+j+')').addClass('color');
			}
		}
		//placement
		$('.mappop').css({
			left: this.xAvg,
			top: this.yAvg
		});
		$('.mappop').show();
		
		var self = this;
		$('.mappop').mouseover(function(){
			self.isOn = true;
		}).mouseout(function(){
			function checkOver(){
				if(self.isOn === false){
					//console.log('pop off');
					if(BROWSER === 'ie'){
						$('.mappop').fadeOut('fast');
					}else{
						$('.mappop').fadeOut('slow');
					}
				}
				clearTimeout(self.clickTimer);
			}
			self.clickTimer = setTimeout(checkOver, self.delay);
		});
	}
});