//---------------------------------------
// WindowSlider class
//---------------------------------------
	
function WindowSlider(slider, intPaddingTop, intPaddingLeft, intPaddingRight, intPaddingBottom, intRows, intCols) {
	this.objSlider = slider;
	this.intPaddingTop = intPaddingTop;
	this.intPaddingLeft = intPaddingLeft;
	this.intPaddingRight = intPaddingRight;
	this.intPaddingBottom = intPaddingBottom;
	this.intWidth = 0;
	this.intHeight = 0;
	this.intTotalRows = intRows;
	this.intTotalColumns = intCols;
	this.intCurrentRow = 3;
	this.intCurrentColumn = 12;
	this.intTotalPanes = this.TotalRows * this.TotalColumns;
	this.hshPanes = new Object();
	this.hshCatPanes = new Object();
	this.hshIDPanes = new Object();
	this.blnMapMove = 0;
		
	//create a series of nested hashes with references to 
	//each pane, organized by column then row
	for (var i = 0; i < this.intTotalColumns; ++i) {
		this.hshPanes[i] = new Object();
		for (var j = 0; j < this.intTotalRows; ++j) {
			this.hshPanes[i][j] = null;
		}
	}
	
	// setup categories for panes
	this.hshCatPanes['project'] = new Array;
	this.hshCatPanes['home'] = new Array;
	this.hshCatPanes['about'] = new Array;
	this.hshCatPanes['contact'] = new Array;
	this.hshCatPanes['job'] = new Array;
	
	//link methods	
	this.getSizes = ws_getSizes;
	this.moveRight = ws_moveRight;
	this.moveLeft = ws_moveLeft;
	this.moveUp = ws_moveUp;
	this.moveDown = ws_moveDown;
	this.adjustSizes = ws_adjustSizes;
	this.goTo = ws_goTo;
	this.highlightNav = ws_highlightNav;
	this.unlightNav = ws_unlightNav;	
	this.catlightNav = ws_catlightNav;
	this.uncatlightNav = ws_uncatlightNav;	
	this.highlightCat = ws_highlightCat;
	this.unlightCat = ws_unlightCat;	
	this.openArrows = ws_openArrows;
	this.closeArrows = ws_closeArrows;
	this.activateArrows = ws_activateArrows;
	this.checkDirection = ws_checkDirection;
	this.checkCoords = ws_checkCoords;
	this.gotoTileByID = ws_gotoTileByID;
	this.resetAll = ws_resetAll;
}

//gets the browser width and height	
function ws_getSizes() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else {
    if( document.documentElement &&
        ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
      //IE 6+ in 'standards compliant mode'
      myWidth = document.documentElement.clientWidth;
      myHeight = document.documentElement.clientHeight;
    } else {
      if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
        //IE 4 compatible
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
      }
    }
  }
  //compensate here for scrollbar, status bar
  if (myWidth < 750) {
  	myWidth = 750;
  }
  if (myHeight < 400) {
  	myHeight = 400;
  }
  this.intWidth = myWidth;
  this.intHeight = myHeight;
}

//move right a pane
function ws_moveRight() {
	if (this.objSlider.blnSliding == 0 && this.checkDirection('right')) {
		this.closeArrows();
		this.unlightNav(this.intCurrentColumn, this.intCurrentRow);	
		this.objSlider.slideRelative(-1 * this.intWidth, 0);
		++this.intCurrentColumn;
		this.highlightNav(this.intCurrentColumn, this.intCurrentRow);		
	}
}

//move up a pane
function ws_moveUp() {
	if (this.objSlider.blnSliding == 0 && this.checkDirection('up')) {
		this.closeArrows();
		this.unlightNav(this.intCurrentColumn, this.intCurrentRow);	
		this.objSlider.slideRelative(0, this.intHeight);
		--this.intCurrentRow;
		this.highlightNav(this.intCurrentColumn, this.intCurrentRow);			
	}
}

//move left a pane
function ws_moveLeft() {
	if (this.objSlider.blnSliding == 0 && this.checkDirection('left')) {
		this.closeArrows();
		this.unlightNav(this.intCurrentColumn, this.intCurrentRow);	
		this.objSlider.slideRelative(this.intWidth, 0);
		--this.intCurrentColumn;	
		this.highlightNav(this.intCurrentColumn, this.intCurrentRow);
	}
}

//move down a pane
function ws_moveDown() {
	if (this.objSlider.blnSliding == 0 && this.checkDirection('down')) {
		this.closeArrows();
		this.unlightNav(this.intCurrentColumn, this.intCurrentRow);	
		this.objSlider.slideRelative(0, -1 * this.intHeight);
		++this.intCurrentRow;
		this.highlightNav(this.intCurrentColumn, this.intCurrentRow);	
	}
}

//adjust div widths, heights, and positions, for a browser resize
function ws_adjustSizes() {

	//update main slider size
	this.objSlider.width = (this.intWidth + this.intPaddingLeft + this.intPaddingRight) * this.intTotalColumns;
	this.objSlider.height = (this.intHeight + this.intPaddingTop + this.intPaddingBottom) * this.intTotalRows;
	this.objSlider.updateSize();

	//update main slider location
	this.objSlider.x = this.intCurrentColumn * this.intWidth * -1;
	this.objSlider.y = this.intCurrentRow * this.intHeight * -1;
	this.objSlider.updateLayer();

	//update mask sizes
	//update mask locations
	objMaskBottom.style.top = this.intHeight - this.intPaddingBottom;
	objMaskBottom.style.left = 0;	
	objMaskBottom.style.width = this.intWidth;
	
	objMaskLeft.style.top = this.intPaddingTop - 1;
	objMaskLeft.style.left = 0;	
	objMaskLeft.style.height = this.intHeight - this.intPaddingTop - this.intPaddingBottom + 2;
	
	objMaskRight.style.top = this.intPaddingTop - 1;
	objMaskRight.style.left = this.intWidth - this.intPaddingLeft;	
	objMaskRight.style.height = this.intHeight - this.intPaddingTop - this.intPaddingBottom + 2;
	
	objMaskTop.style.top = 0;
	objMaskTop.style.left = 0;	
	objMaskTop.style.width = this.intWidth;

	objMaskMain.style.width = this.intWidth - this.intPaddingRight - this.intPaddingLeft;
	objMaskMain.style.height = this.intHeight - this.intPaddingTop - this.intPaddingBottom;
	objMaskMain.style.left = this.intPaddingLeft;
	objMaskMain.style.top = this.intPaddingTop;
	
	//loop through the panes, update each one's size and location	
	for (var i = 0; i < this.intTotalColumns; ++i) {
		for (var j = 0; j < this.intTotalRows; ++j) {
			if (this.hshPanes[i] != null && this.hshPanes[i][j] != null) {
				this.hshPanes[i][j].style.width = this.intWidth - this.intPaddingRight - this.intPaddingLeft;
				this.hshPanes[i][j].style.height = this.intHeight - this.intPaddingTop - this.intPaddingBottom - 24;
				this.hshPanes[i][j].style.left = (i * this.intWidth) + this.intPaddingLeft;
				this.hshPanes[i][j].style.top = (j * this.intHeight) + this.intPaddingTop + 24;
			}
		}
	}
	
}

//go to a specific pane
function ws_goTo(x, y) {
	if (this.objSlider.blnSliding != 1 && this.checkCoords(x,y)) {

		this.blnMapMove = 1;
		this.closeArrows();
									
		//columns and rows to move
		var cols = this.intCurrentColumn - x;
		var rows = this.intCurrentRow - y;
		//new x-y coords
		var newX = this.objSlider.x + (cols * this.intWidth);
		var newY = this.objSlider.y + (rows * this.intHeight);
		//existing x-y coords
		var curX = this.objSlider.x;
		var curY = this.objSlider.y;
		
		this.unlightNav(this.intCurrentColumn, this.intCurrentRow);		

		if (x != this.intCurrentColumn) {
			this.objSlider.slideTo(newX, curY);
		}
		if (y != this.intCurrentRow) {
			//here we queue up the next slide, just in case
			//we're already sliding on the x axis
			this.objSlider.queue(newX, newY);
		}
		this.intCurrentColumn = x;
		this.intCurrentRow = y;
		this.highlightNav(x,y);
	}
}

//highlight the nav option of the pane we're on
function ws_highlightNav(x, y) {
	getLayerLabel("nav_" + x + "_" + y).className = 'navOver';
}

//turn off the nav option of the pane we're leaving
function ws_unlightNav(x, y) {
	getLayerLabel("nav_" + x + "_" + y).className = 'navVisited';
}

// back to off state
function ws_uncatlightNav(x, y) {
	if (getLayerLabel("nav_" + x + "_" + y).className == 'navOverVisited') {
		getLayerLabel("nav_" + x + "_" + y).className = 'navVisited';
	} 
	else if (getLayerLabel("nav_" + x + "_" + y).className == 'navOverCat') {
		getLayerLabel("nav_" + x + "_" + y).className = 'nav';
	}
}

// temporary highlight over state
function ws_catlightNav(x, y) {
	if (getLayerLabel("nav_" + x + "_" + y).className == 'navVisited') {
		getLayerLabel("nav_" + x + "_" + y).className = 'navOverVisited';
	} 	
	else if (getLayerLabel("nav_" + x + "_" + y).className == 'nav') {
		getLayerLabel("nav_" + x + "_" + y).className = 'navOverCat';
	}
}


//highlight the nav options of the category
function ws_highlightCat(strCat) {
	for (var i = 0; i < this.hshCatPanes[strCat].length; i++) {
		this.catlightNav(this.hshCatPanes[strCat][i]['x'],this.hshCatPanes[strCat][i]['y']);
	}
}

//turn off the nav options of the category
function ws_unlightCat(strCat) {
	for (var i = 0; i < this.hshCatPanes[strCat].length; i++) {
		this.uncatlightNav(this.hshCatPanes[strCat][i]['x'],this.hshCatPanes[strCat][i]['y']);
	}
}


// slide out the arrow tabs
function ws_openArrows () {
	objLeftArrow.slideTo(0,0);
	objUpArrow.slideTo(0,0);
	objDownArrow.slideTo(0,-25);
	objRightArrow.slideTo(-24,0);
}

// slide the arrow tabs back in
function ws_closeArrows () {
	objLeftArrow.slideTo(-16,0);
	objUpArrow.slideTo(0,-16);
	objDownArrow.slideTo(0,-9);
	objRightArrow.slideTo(-9,0);
}

// turn arrows on/off based on surrounding tiles
function ws_activateArrows () {

	// up
	if (this.checkDirection('up')) {
		getLayerLabel("arrowUp").style.visibility = 'visible';
	} else {
		objUpArrow.slideTo(0,-27);
		getLayerLabel("arrowUp").style.visibility = 'hidden';
	}
				
	// down
	if (this.checkDirection('down')) {
		getLayerLabel("arrowDown").style.visibility = 'visible';
	} else {
		objDownArrow.slideTo(0,26);
		getLayerLabel("arrowDown").style.visibility = 'hidden';
	}
	
	// left
	if (this.checkDirection('left')) {
		getLayerLabel("arrowLeft").style.visibility = 'visible';
	} else {
		objLeftArrow.slideTo(-27,0);
		getLayerLabel("arrowLeft").style.visibility = 'hidden';
	}
	
	// right
	if (this.checkDirection('right')) {
		getLayerLabel("arrowRight").style.visibility = 'visible';
	} else {
		objRightArrow.slideTo(28,0);
		getLayerLabel("arrowRight").style.visibility = 'hidden';
	}

}

// checking for a tile using direction from currnet coords
function ws_checkDirection (strDirection) {

	switch (strDirection) {
		case "up" :
			if (this.hshPanes[this.intCurrentColumn][this.intCurrentRow - 1] == null) { return false; } else { return true; }
			break;
		case "down" :
			if ((this.intCurrentRow + 1) == this.intTotalRows || this.hshPanes[this.intCurrentColumn][this.intCurrentRow + 1] == null) { return false; } else { return true; }
			break;
		case "left" :
			if (this.hshPanes[this.intCurrentColumn - 1][this.intCurrentRow] == null) { return false; } else { return true; }
			break;
		case "right" :
			if ((this.intCurrentColumn + 1) == this.intTotalColumns || this.hshPanes[this.intCurrentColumn + 1][this.intCurrentRow] == null) { return false; } else { return true; }		
			break;
	}
}

// check for a tile using coords
function ws_checkCoords (x,y) {
	if (this.hshPanes[x] == null || this.hshPanes[x][y] == null) { return false; } else { return true; }
}

// link to table by id
function ws_gotoTileByID (intTileID) {
	this.goTo(this.hshIDPanes[intTileID]['x'],this.hshIDPanes[intTileID]['y']);
}

function ws_resetAll () {
	this.gotoTileByID(intDefaultTile);
	for (intID in this.hshIDPanes) {
		getLayerLabel("nav_" + this.hshIDPanes[intID]['x'] + "_" + this.hshIDPanes[intID]['y']).className = 'nav';
	}
	this.highlightNav(this.hshIDPanes[intDefaultTile]['x'],this.hshIDPanes[intDefaultTile]['y']);
}

//---------------------------------------

// handler functions

//adjust sizes and positions on a window resize
function windowResize() {
	if (objSlider.blnSliding != 1) {
		objWindowSlider.getSizes();
		objWindowSlider.adjustSizes();
	}		
}

// callback handler for a tile sliding into it's final position
function slideHandlerFinish () {
	initTileArrows();
}

// turns arrows on/off & opens them too
function initTileArrows () {
	objWindowSlider.activateArrows();
	if (objWindowSlider.blnMapMove) {
		objWindowSlider.openArrows();
		setTimeout("objWindowSlider.closeArrows()",1000);
	}
	objWindowSlider.blnMapMove = 0;
}

// arrow navigation mechanism
document.onkeydown = myKeypressHandler;
function myKeypressHandler (e) {
    if (document.layers) {
        intKey = e.which;
    } else {
        intKey = window.event.keyCode;
	}
	switch (intKey) {
		case 37 :
			objWindowSlider.blnMapMove = 1;
			objWindowSlider.moveLeft();
			break;
		case 38 :
			objWindowSlider.blnMapMove = 1;
			objWindowSlider.moveUp();
			break;
		case 39 :
			objWindowSlider.blnMapMove = 1;
			objWindowSlider.moveRight();
			break;
		case 40 :
			objWindowSlider.blnMapMove = 1;
			objWindowSlider.moveDown();
			break;
		case 32 :
			objWindowSlider.openArrows();
			setTimeout("objWindowSlider.closeArrows()",1000);
			break;
	}
}