/***
 *** This file will hold the javascript functions all pages can use, for the sake of globalisation :P
 ***/

var newsTips = null;
var otherTips = null;
var menuCreated = false;

/**
 * This function will attach the moodal popups for links requiring then.
 * The attachment will use the rel attribute of links with the specific classes to open the pages.
 * Available classes are:
 * - songinfo > for the songinfo, rel format '<song-id>:<title>' (songinfo for <title>)
 * - request > for the requesting, rel format '<song-id>:<title>' (requesting <title>)
 * - ?
 */
function attachMoodal() {
//	$$('').each(function(elem, index, array) {
//		$try(function() {
//			if (elem.get("tag") == "form" && !elem.hasClass("ajaxform")) return;
//			if (elem.retrieve('noattach', false)) return;
//			elem.removeEvents();
//		});
//	});

	if (!menuCreated) {
		$$('.new_menu_wrap ul').each(function(ul, i, a) {
			// Pre-create the submenu:
			var submenudata = ul.getChildren();
			var elem = $$('div.new_mainmenu td.menu[rel="' + ul.get('rel') + '"]');
			if (elem.length < 1) return;
			if (elem.retrieve('submenu', -1) != -1)
				return;
				
			elem = elem[0];
			if (submenudata.length > 0) {
				// There is :D
				var menudiv = new Element('div', { 'class': 'newsubmenu' });
				//menudiv.setStyle('display', 'none');
				menudiv.setStyle('opacity', 0);
				menudiv.setStyle('width', (elem.getDimensions().width * 1.5));
				
				elem.adopt(menudiv);
				
				menudiv.position({
					relativeTo: elem,
					position: 'bottomleft',
					egde: 'topleft',
					offset: {x: -(elem.getDimensions().width * 0.25), y: 0}
					});
				
				menudiv.adopt(new Element('span', { 'class': 'topleft' }));
				menudiv.adopt(new Element('span', { 'class': 'top' }));
				menudiv.adopt(new Element('span', { 'class': 'topright' }));
				menudiv.adopt(new Element('span', { 'class': 'smright' }));
				menudiv.adopt(new Element('span', { 'class': 'bottomright' }));
				menudiv.adopt(new Element('span', { 'class': 'bottom' }));
				menudiv.adopt(new Element('span', { 'class': 'bottomleft' }));
				menudiv.adopt(new Element('span', { 'class': 'smleft' }));
				
				var contentdiv = new Element('div', { 'class': 'sm-content' });
				menudiv.adopt(contentdiv);
				
				var sep = new Element('span', {'class': 'sm-sep'});
				
				contentdiv.adopt(sep);
				sep.setStyle('top', 0);
				
				var maxWidth = 0;
				var height = 3;
				for (i = 0; i < submenudata.length; i++) {
					var el = new Element('span', { 'class': 'sm-link' });
										
					submenudata[i].getChildren().each(function(child, ind, arr) {
						el.adopt(child.clone());
					});
					contentdiv.adopt(el);
					el.setStyle('top', height);
										
					el.addEvent('click', function(event) {
						if (event.ctrl || event.shift) {
							return;
						}
					
						targets = event.target.getChildren('a');
						
						link = targets[0].get('href');
						window.location = link;
					});
					el.store('noattach', true); // do only once.
					
					menuleft = new Element('span');
					menuleft.set('html', '»');
					menuright = new Element('span');
					menuright.set('html', '«');
					
					menuleft.setStyle('position', 'absolute');
					menuleft.setStyle('left', -6);
					menuright.setStyle('position', 'absolute');
					menuright.setStyle('right', -6);
					
					el.measure(function() {				
						height += this.getSize().y;
					});
					
					el.adopt(menuright);
					el.adopt(menuleft);
					
					sep = sep.clone();
					contentdiv.adopt(sep);
					sep.setStyle('top', height);
					height += 3;
				}
				//alert (maxWidth + " , " + height);
				
				menudiv.setStyle('height', (height + 20) + 'px');
				
				elem.store('submenu', menudiv);
			}
		});
		
		$$('div.new_mainmenu td.menu').each(function(menu, i, a) {
			menu.removeEvents();
			menu.addEvent('mouseenter', function(event) {
				var elem = event.target;
				elem.setStyle('background-position', 'bottom');
				$$('div.new_mainmenu td.left', 'div.new_mainmenu td.right').each(function(el, ind, arr) {
					if (el.get('rel') == elem.get('rel')) el.setStyle('background-position', 'bottom');
				});
				
				menudiv = elem.retrieve('submenu', null);
				
				if (menudiv) {
					var fx = new Fx.Tween(menudiv, {property: 'opacity', link: 'cancel'});
					fx.start(0, 0.85);	
				}
			});
			
			menu.addEvent('mouseleave', function(event) {
				var elem = event.target;
				
				// We can be triggered from the child div that's our submenu, so this would bring us to the parent td.
				while (elem.get('tag') != 'td') elem = elem.getParent();
				
				elem.setStyle('background-position', 'top');
				$$('div.new_mainmenu td.left', 'div.new_mainmenu td.right').each(function(el, ind, arr) {
					if (el.get('rel') == elem.get('rel')) el.setStyle('background-position', 'top');
				});
				
				menudiv = elem.retrieve('submenu', null);
				
				if (menudiv && menudiv.getStyle('visibility') != 'hidden') {
					var fx = new Fx.Tween(menudiv, {property: 'opacity', link: 'cancel'});
					fx.start(0.85, 0);
					//Element.setStyle.delay(500, menudiv, [menudiv, 'display', 'none']);
				}
			});
		});
		menuCreated = true;
	}

	$$('a.songinfo').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('click',
		function(event) {
			if (event.control)
				return true; // On control, we want a new tab, not a popup window :)

			event.preventDefault();

			var elem = $(event.target);
			if (elem.get('tag') != 'a') // all should be links. (Sometimes a browser seems to give the child ID for the event, for some reason...)
				elem = $(elem.getParent());

			var data = elem.get("rel");
			var id = data.substring(0, data.indexOf(":"));
			var title = data.substring(data.indexOf(":") + 1);
			if ($('content_pane') != null)
				width = $('content_pane').getSize().x;
			else
				width = Math.floor($(document.body).getSize().x * 0.95);
				
			var qs = "id="+id;
			if (event.alt)
				qs += "&action=edit";

			if (event.shift)
				window.open("songinfo.php?"+qs, "", "width=800,height=600,scrollbars=yes,resizable=yes,location=no,toolbar=no");
			else
				MOOdalBox.open("songinfo.php?"+qs+"&moodalbox=true", "Song info for "+title+".", width+" 600");
		});
	});

	$$('a.request').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('click',
		function(event) {
			if (event.control)
				return true; // On control, we want a new tab, not a popup window :)

			event.preventDefault();

			var elem = $(event.target);
			if (elem.get('tag') != 'a') // all should be links. (Sometimes a browser seems to give the child ID for the event, for some reason...)
				elem = $(elem.getParent());

			var data = elem.get("rel");
			var id = data.substring(0, data.indexOf(":"));
			var title = data.substring(data.indexOf(":") + 1);
			if ($('content_pane') != null)
				width = $('content_pane').getSize().x;
			else
				width = Math.floor($(document.body).getSize().x * 0.95);

			if (event.shift)
				window.open("request.php?id="+id, "", "width=800,height=600,scrollbars=yes,resizable=yes,location=no,toolbar=no");
			else
				MOOdalBox.open("request.php?id="+id+"&moodalbox=true", "Attempting to request "+title+".", width+" 600");
		});
	});

	$$('form.ajaxform').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('submit', function(event) {
			event.preventDefault();

			var elem = event.target;
			var target = elem.get("rel");
			var theurl = elem.get("action");

			var querystring = elem.toQueryString();

            // Make sure it's now an ajax update (allows non-js browsers to normally submit the form)
            querystring += "&ajax=true";

			// Check for cross-referencing forms? Special feature tiemz?
			elem.getElements('input.crossref').each(function (child, cindex, carray) {
				querystring += "&"+$(child.get("rel")).toQueryString();
			});

			new Request.HTML({url: theurl, method: 'post', update: target, onComplete: function() {
				attachMoodal();
			}}).send(querystring);
		});
	});

	$$('input.enabledisable[type="checkbox"]').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('change', function(event) {
			var elem = event.target;
			var rel = elem.get("rel");
			var enable = elem.get("checked");

			$$('input.enabledisable[type!="checkbox"]').each(function(el, index, array) {
				if (el.get("rel") == rel) {
					if (enable) {
						el.removeProperty("disabled");
						el.removeClass("disabled");
						//el.setStyle("background-color", "#e1e6f5");
					} else {
						el.setProperty("disabled", "disabled");
						el.addClass("disabled");
						//el.setStyle("background-color", "#6f7589");
					}
				}
			});
			$$('select.enabledisable').each(function(el, index, array) {
				if (el.get("rel") == rel) {
					if (enable) {
						el.removeProperty("disabled");
						el.removeClass("disabled");
						//el.setStyle("background-color", "#e1e6f5");
					} else {
						el.setProperty("disabled", "disabled");
						el.addClass("disabled");
						//el.setStyle("background-color", "#6f7589");
					}
				}
			});
			$$('textarea.enabledisable').each(function(el, index, array) {
				if (el.get("rel") == rel) {
					if (enable) {
						el.removeProperty("disabled");
						//el.setStyle("background-color", "#e1e6f5");
						el.removeClass("disabled");
					} else {
						el.setProperty("disabled", "disabled");
						el.addClass("disabled");
						//el.setStyle("background-color", "#6f7589");
					}
				}
			});
		});
	});

	$$('input.massenabler[type="checkbox"]').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('change', function(event) {
			var elem = event.target;
			var rel = elem.get("rel");
			var enable = elem.get("checked");

			$$('input.massenable[type="checkbox"]').each(function(el, i, a) {
				if (el.get("rel") == rel) {
					if (enable)
						el.set("checked", "checked");
					else
						el.removeProperty("checked");
					event.target = el;
					el.fireEvent('change', event);
				}
			});
		});
	});

	// Check box multi toggle
	$$('input.parentbox[type="checkbox"]').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('click', function(event) {
			var elem = $(event.target);

			//alert('changing '+elem.get("rel"));

			if (elem.get("checked")) {
				elem.fireEvent('childenable', event);
			} else {
				elem.fireEvent('childdisable', event)
			}
		});
		elem.addEvent('childenable', function(event) {
			var elem = $(event.target);
			var rel = elem.get("rel");

			elem.set('checked', "checked");

			$$('input.child_'+rel+'[type="checkbox"]').each(function(target, index, array) {
				var targetevent = event;
				targetevent.target = target;
				target.fireEvent('childenable', targetevent);
			});
		});
		elem.addEvent('childdisable', function(event) {
			var elem = $(event.target);
			var rel = elem.get("rel");

			elem.erase('checked');

			$$('input.child_'+rel+'[type="checkbox"]').each(function(target, index, array) {
				var targetevent = event;
				targetevent.target = target;
				target.fireEvent('childdisable', targetevent);
			});
		});
	});
	$$('input.childbox[type="checkbox"]').each(function(elem, index, array) {
		if (!elem.hasClass("parentbox")) {
			//alert('adding childbox events to '+elem.get("name"));
			elem.removeEvents();

			elem.addEvent('childenable', function(event) {
				var elem = $(event.target);
				elem.set('checked', "checked");
			});
			elem.addEvent('childdisable', function(event) {
				var elem = $(event.target);
				elem.erase('checked');
			});
		}
	});

	$$('.draganddrop.selectedtags').each(function(elem, index, array) {
		if (elem.retrieve('insort', false))
			return;

		var sort = new Sortables('.draganddrop[rel="'+elem.get('rel')+'"]');
		$$('.draganddrop[rel="'+elem.get("rel")+'"]').each(function(elem2, index, array) {
			elem2.store('insort', true);
			sort.addLists(elem2);
			elem2.store('sort', sort);
		});
	});

	newsTips.detach('.newstooltip');
	newsTips.attach('.newstooltip');

	$$('span.tooltipspan').each(function(elem, index, array) {
		var rel = elem.get("rel");
		var title = rel.substring(0, rel.indexOf(":"));
		var text = rel.substring(rel.indexOf(":") + 1);
		elem.store('tip:title', title);
		elem.store('tip:text', text);
	});
	otherTips.detach('span.tooltipspan');
	otherTips.attach('span.tooltipspan');

	$$('.clearSelectionButton').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('click', function(event) {
			event.preventDefault();

			var rel = this.get("rel"); // target

			$$('.clearSelectionTarget[rel="'+rel+'"]').each(function(target, index, array) {
				var options = target.options;
				for (var i = 0; i < options.length; i++)
					options[i].selected = false;
			});
		});
	});
	
	$$('.fillform').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('click', function(event) {
			rel = event.target.get('rel');
			
			parts = rel.split(':');
			
			mainSelector = 'form[rel="' + parts[0] + '"]';
			target = $$(mainSelector)[0];
			if (target) {
				for (i = 1; i < parts.length; i ++) {
					fieldparts = parts[i].split('=');
					field = $$(mainSelector + ' [name=' + fieldparts[0] + ']')[0];
					if (field)
						field.set('value', fieldparts[1].replace("#DOTDOT#", ":").replace("#EQUALS#", "="));
				}
			}
		});
	});
	
	$$('a.artist_link').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('click', function(event) {
			event.preventDefault();
			
			if (event.alt) href = "tageditor.php?search=s_artist:\"" + event.target.get('rel') + "\"";
			else href = "playlist.php?search=s_artist:\"" + event.target.get('rel') + "\"";
			
			if (event.control || event.shift) target = '_blank';
			else target = '_top';
			
			popup = window.open(href, target);
			
			if (event.shift) popup.focus();
		});
	});
	$$('a.album_link').each(function(elem, index, array) {
		elem.removeEvents();
		elem.addEvent('click', function(event) {
			event.preventDefault();
			
			if (event.alt) href = "tageditor.php?search=s_album:\"" + event.target.get('rel') + "\"";
			else href = "playlist.php?search=s_album:\"" + event.target.get('rel') + "\"";
			
			if (event.control || event.shift) target = '_blank';
			else target = '_top';
			
			popup = window.open(href, target);
			
			if (event.shift) popup.focus();
		});
	});
}

window.addEvent('domready', function(event) {
	newsTips = new Tips('.newstooltip');
	otherTips = new Tips('span.tooltipspan');

	attachMoodal(); // After a full page load, already attach any info/request links we can see.
	AjaxQueue.initialize.bind(AjaxQueue).run(); // Initialize the multi-request queue :D
});

window.addEvent('resize', function(event) {
	// Actions to do on resize.
	$$('div.new_mainmenu td.menu').each(function(elem, i, a) {
		var menudiv = elem.retrieve('submenu');
		
		if (menudiv != null) {
			// Position to the element:
			menudiv.position({
					relativeTo: elem,
					position: 'bottomleft',
					egde: 'topleft',
					offset: {x: -(elem.getDimensions().width * 0.25), y: 0}
					});
			// Set the default width:
			menudiv.setStyle('width', (elem.getDimensions().width * 1.5));
			
			// Get all child span's of which we need to calculate the height/width:
			var maxWidth = 0;
			var height = 0;
			
			//height += menudiv.getChildren('hr').length * 3;
			
			menudiv.getChildren('div.sm-content span.sm-sep, div.sm-content span.sm-link').each(function(child, i, a) {
				child.setStyle('top', height);
				height += child.getDimensions().height;
				
				width = child.getDimensions().width;
				if (width > maxWidth)
					maxWidth = width;
			});
			
			if ((maxWidth + 20) > (elem.getDimensions().width * 1.5))
				menudiv.setStyle('width', maxWidth + 20);
			menudiv.setStyle('height', height + 20);
		}
	});
});