var BMConfig = {
	css_freeitems_id: "freeitems",
	
	mediaitem_split_str: "mediaitem_",	// id properties of <img> tags should be of the form id=mediaitem_id, 
	eltype_split_str: "canvas-"
};

var YD = YAHOO.util.Dom;
var YE = YAHOO.util.Event;
var YL = YAHOO.util.Element;
var YS = YAHOO.util.Selector;

var canvaselement = null;

var BungyMash = function() {
	var img = [];
	var i;
	
	return {
		init: function() {
			canvaselement = new Canvas.Element('maincanvas',  { width: 668, height: 600 });
			
			var layoutconfigurations = Array();
			
			// Configuration of media placement on canvas
			// Last one in each is for promotional
			layoutconfigurations[0] = [
				{left: 175, top: 100, right: 600, bottom: 550, width: 100}
			];
			layoutconfigurations[1] = [
   				{left: 175, top: 100, right: 500, bottom: 250, width: 100},
			    {left: 175, top: 400, right: 500, bottom: 500, width: 100}
   			];
			layoutconfigurations[2] = [
			    {left: 175, top: 100, right: 225, bottom: 250, width: 100},
			    {left: 450, top: 100, right: 600, bottom: 250, width: 100},
			    {left: 175, top: 400, right: 500, bottom: 500, width: 100}
			],
			layoutconfigurations[3] = [
   			    {left: 175, top: 100, right: 225, bottom: 200, width: 100},
			    {left: 450, top: 100, right: 600, bottom: 200, width: 100},
				{left: 175, top: 400, right: 225, bottom: 500, width: 100},
				{left: 450, top: 400, right: 500, bottom: 500, width: 100}
			];

			var personalmedia = YS.query('ul.mediaitems.personal img');
			var jumpcodes = Array();
			
			for(var i=0; i<personalmedia.length; i++) {
				if (personalmedia[i].getAttribute('rel'))
					jumpcodes.push(personalmedia[i].getAttribute('rel'));  
			}
			jumpcodes = jumpcodes.unique();

			var configindex = Math.min(jumpcodes.length, layoutconfigurations.length - 1);
			var configs = layoutconfigurations[configindex];
			
			// foreach set of jumpcodes, use one of the selected configs. 
			// "i % configs.length" will get it to start from the beginning again
			for(var i=0; i<jumpcodes.length; i++) {
				var media = YS.query('ul.mediaitems.personal img[rel=' + jumpcodes[i % configs.length] + ']');
				if (media.length > 0)
					this.renderFreeImages(media, configs[i]);
			}


			var promotionalmedia = YS.query('ul.mediaitems.promotional img');
			if(promotionalmedia.length > 0)
				this.renderFreeImages(promotionalmedia, configs[i % configs.length])
			
				
			// Select first image
			var firstImage = canvaselement._aImages[0];
			canvaselement.selected = firstImage;
			canvaselement.selected.highlighted = true;
			canvaselement._aImages.splice(0, 1);
			canvaselement._aImages.push(firstImage);
			IDidItInterface.updateTopMenu(canvaselement.selected, true);
			
				
			canvaselement.renderAll();
			IDidItInterface.initLoad();
		},
		
		renderFreeImages: function(images, conf) {
			var ID = 0;

			if(conf) {
				var params = {}; 
				var dtop = (conf.bottom - conf.top) / (images.length + 1);
			
				for(i=0; i<images.length; i++) {
					params =	{	left: conf.left + (conf.right - conf.left)/2 + (conf.right - conf.left)*(Math.random() - 0.5), 
									top: conf.top + dtop*i
					};
					
					if(conf.width) {
						params.scalex = conf.width / images[i].width;
						params.scaley = params.scalex;
					}
					
					img[img.length] = new Canvas.Img(images[i], images[i].id.split(BMConfig.mediaitem_split_str)[1], params, YD.hasClass(images[i], 'deletable'), YD.hasClass(images[i], 'promotional'));
					
					if(YD.hasClass(images[i], 'canvas-image'))
						canvaselement.addImage(img[img.length-1], 'image');
					else if(YD.hasClass(images[i], 'canvas-video'))
						canvaselement.addImage(img[img.length-1], 'video');
					else if(YD.hasClass(images[i], 'canvas-photoshow'))
						canvaselement.addImage(img[img.length-1], 'photoshow');
				}
			} else {				
				for(i=0; i<images.length; i++) {
					img[img.length] = new Canvas.Img(images[i], images[i].id.split(BMConfig.mediaitem_split_str)[1], {}, YD.hasClass(images[i], 'deletable'), YD.hasClass(images[i], 'promotional'));
					
					if(YD.hasClass(images[i], 'canvas-image'))
						canvaselement.addImage(img[img.length-1], 'image');
					else if(YD.hasClass(images[i], 'canvas-video'))
						canvaselement.addImage(img[img.length-1], 'video');
					else if(YD.hasClass(images[i], 'canvas-photoshow'))
						canvaselement.addImage(img[img.length-1], 'photoshow');
				}
			}
		}
	}
}();

var ImageClickHandler = function(e) {
	var oImg = {};
	var target = (e.srcElement) ? e.srcElement : e.target;

	if(canvaselement.selected) {
		IDidItInterface.updateTopMenu(canvaselement.selected, false);
		YD.removeClass(canvaselement.selected.target.parentNode, 'selected');
		canvaselement.selected.target = target;
		canvaselement.selected._ID = target.id.split(BMConfig.mediaitem_split_str)[1];
		YD.addClass(canvaselement.selected.target.parentNode, 'selected');
	} else {
		canvaselement.selected = {};
		canvaselement.selected.target = target;
		canvaselement.selected._ID = target.id.split(BMConfig.mediaitem_split_str)[1];
		YD.addClass(canvaselement.selected.target.parentNode, 'selected');
	}
	
	if(YD.hasClass(target, 'deletable'))
		canvaselement.selected.deletable = true;
	else
		canvaselement.selected.deletable = false;
		
	if(YD.hasClass(target, 'promotional'))
		canvaselement.selected.promotional = true;
	else
		canvaselement.selected.promotional = false;
		
	if(YD.hasClass(target, 'canvas-image'))
		canvaselement.selected.elementtype = 'image';
	else if(YD.hasClass(target, 'canvas-video'))
		canvaselement.selected.elementtype = 'video';
	else if(YD.hasClass(target, 'canvas-photoshow'))
		canvaselement.selected.elementtype = 'photoshow';
	
	IDidItInterface.updateTopMenu(canvaselement.selected, true);
}

var ImageDoubleClickHandler = function(e) {
	// select the image first 
	ImageClickHandler(e);
	IDidItInterface.loadContent('Media/view/' + canvaselement.selected._ID, true, IDidItInterface.photo_view_Callback);
}

if (YAHOO.env.ua.ie <= 0)
	YAHOO.util.Event.on(window, 'load', BungyMash.init, BungyMash, true);
else {
	YAHOO.util.Event.on(window, 'load', function() {
		var thediv = YD.get('canvas_c');
		var thecanvas = YD.get('maincanvas');
		
		if (thediv && thecanvas) {
			thediv.removeChild(thecanvas);
		}
		
		var imagesdiv = YD.get('hiddenimages');
		if (imagesdiv) {
			YD.removeClass(imagesdiv, 'hidden');
		}
		
		var imageelements = YS.query('ul.mediaitems li img');
		
		canvaselement = {};
		canvaselement.selected = null;
		canvaselement._aImages = [];
		
		canvaselement.delImage = function(imgEl){
			imgEl.target.parentNode.parentNode.removeChild(imgEl.target.parentNode);
		}
		
		for (var i = 0; i < imageelements.length; i++) {
			YE.addListener(imageelements[i], "click", ImageClickHandler);
			YE.addListener(imageelements[i], "dblclick", ImageDoubleClickHandler);
			
			canvaselement._aImages[canvaselement._aImages.length] = {};
			canvaselement._aImages[canvaselement._aImages.length - 1].target = imageelements[i];
			canvaselement._aImages[canvaselement._aImages.length - 1]._ID = imageelements[i].id.split(BMConfig.mediaitem_split_str)[1];
			
			if (YD.hasClass(imageelements[i], 'deletable')) 
				canvaselement._aImages[canvaselement._aImages.length - 1].deletable = true;
			else 
				canvaselement._aImages[canvaselement._aImages.length - 1].deletable = false;
			
			if (YD.hasClass(imageelements[i], 'promotional')) 
				canvaselement._aImages[canvaselement._aImages.length - 1].promotional = true;
			else 
				canvaselement._aImages[canvaselement._aImages.length - 1].promotional = false;
			
			if (YD.hasClass(imageelements[i], 'canvas-image')) 
				canvaselement._aImages[canvaselement._aImages.length - 1].elementtype = 'image';
			else 
				if (YD.hasClass(imageelements[i], 'canvas-video')) 
					canvaselement._aImages[canvaselement._aImages.length - 1].elementtype = 'video';
				else 
					if (YD.hasClass(imageelements[i], 'canvas-photoshow')) 
						canvaselement._aImages[canvaselement._aImages.length - 1].elementtype = 'photoshow';
			
			if (imageelements[i].height > imageelements[i].width) 
				YD.addClass(imageelements[i], 'portrait');
			else 
				YD.addClass(imageelements[i], 'landscape');
		}
		
		IDidItInterface.initLoad();
	});
}




Array.prototype.unique = function() {
	var a = [];
	var l = this.length;
	for(var i=0; i<l; i++) {
		for(var j=i+1; j<l; j++) {
			// If this[i] is found later in the array
			if (this[i] === this[j])
				j = ++i;
		}
		a.push(this[i]);
	}
	return a;
};