/*
	nav-overlay.js

	Created by murat on 2008-07-04.
	Copyright (c) 2008 murat n konar. All rights reserved.
*/


// Note: IE barfs if 'const' is used instead of 'var'
var kDuration = 500

var kMaxOverlayOpacity = 0.9 // this has to be 0.9 or IE will mess up.


var NavOverlayController = new Class({

	// ------------------------------------------------------------
	isVisible: function (){
		return this.navOverlayContentNode.getCoordinates().top == 0
	},

	// ------------------------------------------------------------
	animateIn: function (event) {
		if (!this.morpher.to || this.morpher.to.opacity[0].value.toFloat() != kMaxOverlayOpacity) {	

			this.navOverlayNode.setStyle('z-index', this.onDutyZIndex) // make sure it's above the entry stuff


			var startingOpacity = this.navOverlayContentNode.getStyle('opacity')
			var startingTop 	= this.navOverlayContentNode.getStyle('top')


			this.morpher.start({	'opacity': [startingOpacity, kMaxOverlayOpacity],
									'top': [startingTop, 0]})
		
			this.morpher.onComplete = function(){}
		}
	},
	
	// ------------------------------------------------------------
	animateOut: function (event) {
		
		if (!this.morpher.to || this.morpher.to.opacity[0].value.toFloat() != 0) {
			
			var startingOpacity = this.navOverlayContentNode.getStyle('opacity')
			var startingTop 	= this.navOverlayContentNode.getStyle('top')

			this.morpher.start({	'opacity': [startingOpacity, 0],
								 	'top': [startingTop, window.getSize().y]})


			var navOverlayController = this
			this.morpher.onComplete = function(){
				navOverlayController.navOverlayNode.setStyle('z-index', navOverlayController.offDutyZIndex) // make sure it's below the entry caption
			}
		}
	},

	// ------------------------------------------------------------
	calculateHotBox:function(){
		// first we need to find the first node of class 'gallery-list'
		var subNodes = this.navOverlayContentNode.getElements('ul')
		var galleryListNodes = subNodes.filter(function(item, index, array){return item.hasClass('gallery-list')})
		var aGalleryListNode = galleryListNodes[0]
		
		// now figure out where its bottom would be if showing
		var navOverlayContentCoords = this.navOverlayContentNode.getCoordinates()
		var galleryListCoords = aGalleryListNode.getCoordinates()
				
		return {'top': 0, 'bottom':(galleryListCoords.bottom - navOverlayContentCoords.top + 40), 'left':navOverlayContentCoords.left, 'right':navOverlayContentCoords.right }
	},
	
	// ------------------------------------------------------------
	resizeHandler:function(){
		this.hotbox = this.calculateHotBox()
	},
	
	// ------------------------------------------------------------
	buildNavigation:function(){
	
		// find the section list
		var subNodes = this.navOverlayContentNode.getElements('ul')
		var sectionListNodes = subNodes.filter(function(item, index, array){return item.hasClass('section-list')})
		var sectionListNode = sectionListNodes[0]
	
		// delete the place holders 
		var placeholders = sectionListNode.getChildren()
		placeholders.each(function(item, index, array){item.dispose()})
		
		
		// Walk through the sections, building up nodes as we go
		var self = this
		var sectionItemNodes = new Array()

		this.sections.each(function (section, sIndex, aArray) {
			
			var galleryItemNodes = new Array()
			
			section.galleries.each(function (gallery, gIndex, gArray){
				
				var clickHandler = function() {
					goToGalleryWithName(gallery.name.unEncodeHTML())
					self.animateOut.delay(500, self)
					return false // returning false terminates event handling
				}	
				
				galleryItemNodes.push(self.newGalleryItemNode(gallery.galleryName, clickHandler, gallery.originalIndex))
			})
			sectionItemNodes.push(self.newSectionItemNode(section.name, galleryItemNodes))
		})


		// Sometimes we want to include some other links along with the gallery links.
		if (this.extraLinks) {
	
			/* extraLinks should be an array of dictionaries like this:
			
				[	
					{	linkText:'Contact', 	linkClickHandler: function(){showOverlay("contact")}},
					{	linkText:'Bio', 		linkClickHandler: function(){showOverlay("bio")}}
				]
			*/

			var extraLinkItemNodes = new Array()
			this.extraLinks.each(function(extraLink, elIndex, elArray){				
				extraLinkItemNodes.push(self.newExtraLinkItemNode(extraLink.linkText, extraLink.linkClickHandler))
			})
			
			var extraLinksSectionItem = self.newSectionItemNode('About', extraLinkItemNodes)
			
			sectionItemNodes.push(extraLinksSectionItem)
		}

		sectionListNode.adopt(sectionItemNodes)
		
		var sectionListItems = sectionListNode.getChildren()
		
		// tag the last section item so we can style it
		sectionListItems.getLast().addClass('section-item-last')

		// adjust the width of the section list wrapper
		var sectionListWrapper = this.navOverlayContentNode.getChildren().filter(function(item,index, array){return item.hasClass('section-list-wrapper')})
		var sectionCount = sectionListItems.length
		sectionListWrapper.setStyle('width', sectionCount*sectionListItems[0].getWidth() + 1)
	},


	// ------------------------------------------------------------
	newGalleryItemNode: function(inGalleryTitle, clickFunction, originalIndex)
	{
		var galleryItemNode = new Element('li', {'class': 	'gallery-item'});
		
		var anchor = new Element('a', {	'href':'', 'id': 'gallery-link.' + originalIndex.toString(), 'html': inGalleryTitle, 'class':'gallery-link'});
	
		anchor.addEvent('click', clickFunction)

		galleryItemNode.adopt(anchor)

		return galleryItemNode
	},
	
	// ------------------------------------------------------------
	newExtraLinkItemNode: function(inLinkTitle, clickFunction)
	{		
		var extraLinkItemNode = new Element('li', {'class': 'gallery-item'});
		
		var anchor = new Element('a', {'href': '', 'html': inLinkTitle});
	
		anchor.addEvent('click', clickFunction)

		extraLinkItemNode.adopt(anchor)

		return extraLinkItemNode
	},
	
	
	// ------------------------------------------------------------
	newSectionItemNode: function(inSectionTitle, inGalleryListItemNodes)
	{
		var galleryListNode = new Element('ul', {'class': 'gallery-list'})
		galleryListNode.adopt(inGalleryListItemNodes)
		
		var galleryListWrapper = new Element('div', {'class': 'gallery-list-wrapper'})
		galleryListWrapper.adopt(galleryListNode)

		var sectionTitleNode = new Element('p', {'class': 'section-title', 'html': inSectionTitle})

		var sectionItemNode = new Element('li', {'class': 	'section-item'});
		sectionItemNode.adopt(sectionTitleNode)
		sectionItemNode.adopt(galleryListWrapper)
		
		return sectionItemNode;
	},
	
	// ------------------------------------------------------------
    initialize: function(navOverlayNode, sections, extraLinks, zIndexes) {

		this.sections = sections
        this.navOverlayNode = navOverlayNode;
        this.navOverlayContentNode = navOverlayNode.getChildren()[0];

		this.morpher = new Fx.Morph(this.navOverlayContentNode, {duration: kDuration, transition: Fx.Transitions.Expo.easeInOut, link:'cancel'});
		this.morpher.set({'opacity': 0, 'top': window.getSize().y})
	
		// add a click handler to nav-overlay-content to prevent 
		// clicks on it from getting to nav-overlay, and to dismiss the overlay when clicked
		var self = this
		this.navOverlayContentNode.addEvent('click', function (event){self.animateOut.delay(250, self);return false})
	
		this.navOverlayNode.addEvent('click', function (event){/* debugLog('this.navOverlayNode.click'); */ return true})
	

		this.extraLinks = extraLinks

		if ($defined(zIndexes)){
			this.onDutyZIndex 	= zIndexes['onDutyZIndex']
			this.offDutyZIndex 	= zIndexes['offDutyZIndex']
		}
		else {
			this.onDutyZIndex 	= 7000
			this.offDutyZIndex 	= 5000
		}
		
		this.buildNavigation()
   }
});






