var rootPath = "images/";
var navPath = rootPath + 'navigation/';
var navTrioImages =
[
	navPath + 'arrow-left.jpg',
	navPath + 'arrow-left-over.jpg',
	navPath + 'arrow-index.jpg',
	navPath + 'arrow-index-over.jpg',
	navPath + 'arrow-right.jpg',
	navPath + 'arrow-right-over.jpg'
];

var navLeftImages =
[
	navPath + 'more.png',
	navPath + 'more-over.png',
	navPath + 'video.png',
	navPath + 'video-over.png',
	navPath + 'options-cart.jpg',
	navPath + 'options-cart-over.jpg',
	navPath + 'cart.jpg',
	navPath + 'cart-over.jpg'
];

var CFMswitcher = new Class(
{
	options:
	{
		titleImage: null,
		leftContainer: null,
		indexContainer: null,
		miniContainer: null,
		fullsizeContainer: null,
		fullsizeImage: null,
		navIndexContainer: null,
		navLeft1Image: null,
		navLeft2Image: null,
		navShoppingContainer: null,
		navLeft3Image: null,
		navLeft4Image: null,
		navTrioContainer: null,
		navPrevImage: null,
		navIndexImage: null,
		navNextImage: null,
		duration: 250
	},
	
	initialize: function(options)
	{
		this.setOptions(options);

		this.mandalas = null;
		this.lastIndex = -1;
		this.curIndex = -1;
		this.maxIndex = 0;

		var request = new Json.Remote('js/mandalas-data.js', { method: 'get', onComplete: function(response)
		{
			this.mandalas = response.mandalas.copy();
			this.maxIndex = (this.mandalas.length - 1);

			this.bindHistory();
			this.bindLeftNav();
			this.bindTrioNav();
			this.bindMiniNav();
			this.preloadImages();
		}.bind(this) }).send();
	},
	
	bindHistory: function()
	{
		var historyKey = 'go';

		this.history = HistoryManager.register
		(
			historyKey,
			[0],
			function(values) { this.fadeTo(parseInt(values[0])); }.bind(this),
			function(values) { return [historyKey, '(', values[0], ')'].join(''); }.bind(this),
			historyKey + '\\((\\d+)\\)'
		);
		
		HistoryManager.start();
	},
	
	bindLeftNav: function()
	{
		this.options.navLeft1Image.setStyle('cursor', 'pointer').addEvents(
		{
			'click': function() { location.href = "about-mandalas.html"; },
			'mouseover': function() { this.options.navLeft1Image.setProperty('src', navLeftImages[1]); }.bind(this),
			'mouseout': function() { this.options.navLeft1Image.setProperty('src', navLeftImages[0]); }.bind(this)
		});
	
		this.options.navLeft2Image.setStyle('cursor', 'pointer').addEvents(
		{
			'mouseover': function() { this.options.navLeft2Image.setProperty('src', navLeftImages[3]); }.bind(this),
			'mouseout': function() { this.options.navLeft2Image.setProperty('src', navLeftImages[2]); }.bind(this)
		});
	
		this.options.navLeft3Image.setStyle('cursor', 'pointer').addEvents(
		{
			'click': function() { location.href = "store/index.php?main_page=product_info&cPath=0&products_id=" + this.mandalas[this.curIndex].id; }.bind(this),
			'mouseover': function() { this.options.navLeft3Image.setProperty('src', navLeftImages[5]); }.bind(this),
			'mouseout': function() { this.options.navLeft3Image.setProperty('src', navLeftImages[4]); }.bind(this)
		});
	
		this.options.navLeft4Image.setStyle('cursor', 'pointer').addEvents(
		{
			'click': function() { location.href = "store/index.php?main_page=shopping_cart"; },
			'mouseover': function() { this.options.navLeft4Image.setProperty('src', navLeftImages[7]); }.bind(this),
			'mouseout': function() { this.options.navLeft4Image.setProperty('src', navLeftImages[6]); }.bind(this)
		});
	},
	
	bindTrioNav: function()
	{
		this.options.navPrevImage.setStyle('cursor', 'pointer').addEvents(
		{
			'click': function() { this.fadePrev(); }.bind(this),
			'mouseout': function() { this.options.navPrevImage.setProperty('src', navTrioImages[0]); }.bind(this),
			'mouseover': function() { this.options.navPrevImage.setProperty('src', navTrioImages[1]); }.bind(this)
		});
	
		this.options.navIndexImage.setStyle('cursor', 'pointer').addEvents(
		{
			'click': function() { this.fadeTo(0); }.bind(this),
			'mouseout': function() { this.options.navIndexImage.setProperty('src', navTrioImages[2]); }.bind(this),
			'mouseover': function() { this.options.navIndexImage.setProperty('src', navTrioImages[3]); }.bind(this)
		});
	
		this.options.navNextImage.setStyle('cursor', 'pointer').addEvents(
		{
			'click': function() { this.fadeNext(); }.bind(this),
			'mouseout': function() { this.options.navNextImage.setProperty('src', navTrioImages[4]); }.bind(this),
			'mouseover': function() { this.options.navNextImage.setProperty('src', navTrioImages[5]); }.bind(this)
		});
	},
	
	bindMiniNav: function()
	{
		var	tips = new Tips($$('.thumb'),
		{
			className: 'miniContainer',
			offsets: { x: 15, y: 15 },
			initialize: function() { this.fx = new Fx.Style(this.toolTip, 'opacity', { duration: 250, wait: false }).set(0); },
			onShow: function(toolTip) { this.fx.start(0.85); },
			onHide: function(toolTip) { this.fx.start(0); }
		});
	
		var images = this.options.miniContainer.getElements('img');
			
		images.each(function(image)
		{
			image.setStyle('cursor', 'pointer').addEvents(
			{
				'click': function() { tips.hide(); this.fadeTo(images.indexOf(image) + 1); }.bind(this),
				'mouseover': function() { image.setStyle('border', '1px dotted #b4141a'); },
				'mouseout': function() { image.setStyle('border', '1px solid #fff'); }
			});
		}.bind(this));
	},
	
	preloadImages: function()
	{
		this.mandalas.each(function(obj)
		{
			Asset.image(obj.thumb);
		}.bind(this));

		this.mandalas.each(function(obj)
		{
			Asset.image(obj.title);
			Asset.image(obj.fullsize);
		}.bind(this));
	},
	
	idToIndex: function(id)
	{
		var i;
		var index = 0;
		
		for (i = 0; i <= this.maxIndex; i++)
		{
			if (this.mandalas[i].id == id)
			{
				index = i;
				break;
			}
		}
		
		return(index);
	},
	
	indexToId: function(index)
	{
		var id = 0;
		
		if (index == -1)
		{
			id = -1;	
		}
		else if ((index >= 0) && (index <= this.maxIndex))
		{
			id = this.mandalas[index].id;
		}
		
		return(id);
	},
	
	hideElement: function(element)
	{
		element.setStyle('display', 'none');
	},
	
	fadeInElement: function(element, type, value)
	{
		if (type != 'x')
		{
			element.setOpacity(0);
		}

		switch (type)
		{
			case 'c': /*fall through to next case */
			case 'x': element.setStyle('display', 'block'); break;
			case 'i': element.setProperty('src', value); break;
			case 'h': element.setHTML(value); break;
			default:  break;
		}
	
		if (type != 'x')
		{
			element.effect('opacity', { duration: this.options.duration, wait: false }).start(0,1);
		}
	},
	
	fadeOutElement: function(element)
	{
		return(element.effect('opacity', { duration: this.options.duration, wait: false }).start(1,0));
	},
	
	fadeInIndex: function()
	{
		this.hideElement(this.options.navShoppingContainer);
		this.hideElement(this.options.navTrioContainer);
		this.hideElement(this.options.fullsizeContainer);

		this.fadeInElement(this.options.titleImage, 'i', this.mandalas[0].title);
		this.fadeInElement(this.options.leftContainer, 'h', this.mandalas[0].narrative);
		this.fadeInElement(this.options.navIndexContainer, 'c', null);
		this.fadeInElement(this.options.indexContainer, 'c', null);
	},
		
	fadeToIndex: function()
	{
		var fadeSync = new Group
		(
			this.fadeOutElement(this.options.titleImage),
			this.fadeOutElement(this.options.leftContainer),
			this.fadeOutElement(this.options.navShoppingContainer),
			this.fadeOutElement(this.options.navTrioContainer),
			this.fadeOutElement(this.options.fullsizeImage)
		).addEvent('onComplete', function() { this.fadeInIndex(); }.bind(this));
	},

	fadeInGallery: function(id)
	{
		var index = this.idToIndex(id);

		this.hideElement(this.options.navIndexContainer);
		this.hideElement(this.options.indexContainer);

		this.fadeInElement(this.options.titleImage, 'i', this.mandalas[index].title);
		this.fadeInElement(this.options.leftContainer, 'h', this.mandalas[index].narrative);
//		this.fadeInElement(this.options.navShoppingContainer, 'c', null);
		this.fadeInElement(this.options.navTrioContainer, 'c', null);
		this.fadeInElement(this.options.fullsizeContainer, 'x', null);
		this.fadeInElement(this.options.fullsizeImage, 'i', this.mandalas[index].fullsize);
	},
	
	fadeToGallery: function(id)
	{
		var fadeSync = new Group
		(
			this.fadeOutElement(this.options.titleImage),
			this.fadeOutElement(this.options.leftContainer),
			this.fadeOutElement(this.options.navShoppingContainer),
			this.fadeOutElement(this.options.navIndexContainer),
			this.fadeOutElement(this.options.indexContainer)
		).addEvent('onComplete', function() { this.fadeInGallery(id); }.bind(this));
	},
	
	fadeInMandalas: function(id)
	{
		var index = this.idToIndex(id);

		this.fadeInElement(this.options.titleImage, 'i', this.mandalas[index].title);
		this.fadeInElement(this.options.leftContainer, 'h', this.mandalas[index].narrative);
		this.fadeInElement(this.options.fullsizeImage, 'i', this.mandalas[index].fullsize);
	},
	
	fadeMandala: function(id)
	{
		var fadeSync = new Group
		(
			this.fadeOutElement(this.options.titleImage),
			this.fadeOutElement(this.options.leftContainer),
			this.fadeOutElement(this.options.fullsizeImage)
		).addEvent('onComplete', function() { this.fadeInMandalas(id); }.bind(this));
	},
	
	determineTransition: function()
	{
		var curID = this.indexToId(this.curIndex);
		var lastID = this.indexToId(this.lastIndex);

		this.history.setValue(0, curID);

		if (curID == 0)
		{
			if (lastID > 0)
			{
				this.fadeToIndex();
			}
		}
		else
		{
			if (lastID > 0)
			{
				this.fadeMandala(curID);
			}
			else if (lastID == 0)
			{
				this.fadeToGallery(curID);
			}
			else
			{
				this.fadeInGallery(curID);
			}
		}
	},

	fadePrev: function()
	{
		this.lastIndex = this.curIndex;

		if (--this.curIndex < 1)
		{
			this.curIndex = this.maxIndex;
		}
		
		this.determineTransition();
	},

	fadeNext: function()
	{
		this.lastIndex = this.curIndex;

		if (++this.curIndex > this.maxIndex)
		{
			this.curIndex = 1;
		}

		this.determineTransition();
	},

	fadeTo: function(id)
	{
		var index = this.idToIndex(id);

		if ((index >= 0) && (index <= this.maxIndex))
		{
			this.lastIndex = this.curIndex;
			this.curIndex = index;
			this.determineTransition();
		}
	}
});

CFMswitcher.implement(new Options, new Events);


var switcher = null;

function CFMready()
{
	var box = new MultiBox('mb', { path: 'movies/', descClassName: 'multiBoxDesc' });

	switcher = new CFMswitcher
	(
		{
			titleImage: $('titleImage'), 
			leftContainer: $('leftContainer'),
			indexContainer: $('indexContainer'),
			miniContainer: $('miniContainer'),
			fullsizeContainer: $('fullsizeContainer'),
			fullsizeImage: $('fullsizeImage'),
			navIndexContainer: $('navIndexContainer'), 
			navLeft1Image: $('navLeft1Image'),
			navLeft2Image: $('navLeft2Image'),
			navShoppingContainer: $('navShoppingContainer'),
			navLeft3Image: $('navLeft3Image'),
			navLeft4Image: $('navLeft4Image'),
			navTrioContainer: $('navTrioContainer'),
			navPrevImage: $('navPrevImage'),
			navIndexImage: $('navIndexImage'),
			navNextImage: $('navNextImage')
		}
	);
}