/**
 * Shows sub menu
 *
 * @param string menu Defines what to show
 */
original_focus_menu = false;
function submenu(elm) {
	// finds what menu we are to show
	menu = $(elm).attr('href');
	menu = menu.substr(1);

	// if we haven't cached the jquery object of the original focused menu yet we'll do that
	if(!original_focus_menu) {
		original_focus_menu = $("#mainmenu a.active");
	}
	$("#mainmenu a").removeClass('active');

	if($("#submenu_content").is(":visible") && $("#submenu").attr('menu') == menu) {
		$("#submenu_content").slideUp();
		// Put focus on original focused menu again
		original_focus_menu.addClass('active');
		return false;
	} else {
		// Put focus to this menu
		$(elm).addClass('active');

		// if this menu is already loaded, we don't need to do more then show it
		if(menu == $("#submenu").attr('menu')) {
			$("#submenu_content").slideDown();
			return false;
		}

		// if the existing menu is the search menu, we'll need to unbind the autofocus event
		if($("#submenu").attr('menu') == 'search') {
			$("#siteSearch").removeData("autocomplete").autocomplete("destroy");
		}


		// else we'll loop through the possible cases
		callback = undefined;
		switch(menu) {
			case 'categories':
				html = '<p class="links">';

				// Span tags in menu will right align
				html += '<span>';
				html += '<a href="/newontv">New on TV</a>';
				html += '<a href="/archive">TV archive</a>';
				html += '</span>';

				// Rest should just be printed left
				html += '<a href="/movies">Film</a>';
				html += '<a href="/entertainment">Entertainment</a>';
				html += '<a href="/series">TV series</a>';
				html += '<a href="/sports">Sport</a>';
				html += '<a href="/documentaries">Documentaries</a>';
				html += '<a href="/science">Science</a>';
				html += '<a href="/news">News</a>';
				html += '<a href="/kids">Kids</a>';

				// closing links container
				html += '</p>';

				break;
			case 'search':
				html = '<table class="block"><tr style="vertical-align:middle;"><td>';

				html += '<form action="/search/" method="get" style="margin:0px 10px;"><table class="block"><tr style="vertical-align:top;">';
				html += '<td style="padding-right:10px;"><p><strong>Search word</strong></p><input type="text" name="q" id="siteSearch" ';
				html += 'value="Search TimeFor.TV" style="width:80%; padding:5px;"';
				html += ' onfocus="if(this.value == \'Search TimeFor.TV\') {this.value=\'\'; this.style.color=\'black\';}"';
				html += ' onblur="if(this.value == \'\') {this.value=\'Search TimeFor.TV\'; this.style.color=\'#b7b7b7\';}">';
				html += '<br><input type="submit" style="margin-top:5px;" value="Search" class="menu-button"></td>';

				html += '<td style="padding-right:10px;"><p><strong>Channels</strong><br>';
				html += '<input style="margin-left:0px;" type="radio" name="channels" value="favorites" checked> My channels<br>';
				html += '<input style="margin-left:0px;" type="radio" name="channels" value="all"> All channels';
				html += '</p></td>';

				html += '<td style="padding-right:10px;"><p><strong>Search in</strong><br>';
				html += '<input style="margin-left:0px;" type="checkbox" name="title" checked> Title<br>';
				html += '<input style="margin-left:0px;" type="checkbox" name="teaser"> Short description<br>';
				html += '<input style="margin-left:0px;" type="checkbox" name="about"> Summary';
				html += '</p></td>';

				html += '<td><p><strong>Period</strong><br>';
				html += '<input style="margin-left:0px;" type="radio" name="period" value="86400"> One day<br>';
				html += '<input style="margin-left:0px;" type="radio" name="period" value="604800"> One week ahead<br>';
				html += '<input style="margin-left:0px;" type="radio" name="period" value="1209600" checked> Two weeks ahead';
				html += '</p></td>';

				html += '</tr></table></form></td>';

				html += '<td style="width:2px; padding:0px 40px 0px 0px;"><img src="/imgs/design/menu_bottom_splitter.png" alt="" style="width:2px; height:80%;"></td>';

				html += '<td style="width:35%;"><h3>Create search agent</h3>';
				html += '<p style="margin:5px 0px; padding-right:10px;" class="small">With a search agent, TimeFor.TV will automatically run the search for you each day, and send you a reminder when there is new search results.</p>';
				html += '<input type="button" class="menu-button" onclick="__createSearchAgent($(\'#siteSearch\').val());" value="Create search agent">';
				html += '</td>';

				html += '</tr></table>';

				callback = function() {
					$("#siteSearch").autocomplete({
						source: "/ajax/search.php",
						minLength: 2,
						select: function(event, ui) {
							document.location.href=ui.item.uri;
						}
					})
					.data( "autocomplete" )._renderItem = function( ul, item ) {
						//return $( "<li"+ ((item.headline==1)?" class=\'ui-widget-header\'":"") +"></li>" ).data( "item.autocomplete", item ).append( "<a>" + item.value + "</a>" ).appendTo( ul );
						if(item.type=='headline') {
							return $( "<li class=\'ui-widget-header\'></li>" ).data( "item.autocomplete", item ).append('<a>'+ item.title +'</a>').appendTo( ul );
						} else {
							return $( "<li></li>" ).data( "item.autocomplete", item ).append('<a>'+ item.title +'<br><em>'+ item.description +'</a>').appendTo( ul );
						}

					};

					$("#submenu button").button();
					$("#siteSearch").focus();
				}
				break;
			case 'profile':
								html = '<form action="/scripts/users.php?action=login" method="post"><table class="block">';
				html += '<tr>';
				html += '<td style="width:300px; padding-right:20px;">';
				html += 	'<h3>No profile on TimeFor.TV?</h3>';
				html += 	'<p class="small">With a TimeFor.TV profile you can personalize TimeFor.TV to suit your needs, plan programs and much more. <a href="/profile/possibilities">Read more</a></p>';
				html += '</td>';
				html += '<td rowspan="2" style="width:2px; vertical-align:middle; border-left:1px solid #730f37;"></td>';
				html += '<td style="padding:0 20px;">';
				html += 	'<h3>Quick connect</h3>';
				html += 	'<p class="small">Login with a click on a button using your Facebook profile.</p>';
				html += '</td>';
				html += '<td rowspan="2" style="width:2px; vertical-align:middle; border-left:1px solid #730f37;"></td>';
				html += '<td style="width:335px; padding-left:20px;">';
				html += 	'<h3>Log on TimeFor.TV</h3>';
				html += 	'<input type="text" name="email" style="width:150px; margin-right:10px;" value="Email" onfocus="if($(this).val() == \'Email\') $(this).val(\'\');" onblur="if($(this).val() == \'\') $(this).val(\'Email\');" id="submenu_login_email" />';
				html += 	'<input type="text" style="width:150px;" value="Password" onfocus="$(this).hide(); $(\'#_submenuUserLoginPassword\').show().focus();" />';
				html += 	'<input type="password" name="password" id="_submenuUserLoginPassword" style="display:none; width:150px;" />';
				html += '</td></tr>';

				// buttons
				html += '<tr>';
				html += '<td style="width:300px; padding-right:20px; padding-top:10px; text-align:center;">';
				html += 	'<a class="menu-button create-profile" href="/profile/create">Create new profile</a>';
				html += '</td>';
				html += '<td style="padding:0 20px; padding-top:10px; text-align:center;">';
				html += 	'<a href="https://www.facebook.com/dialog/oauth?client_id=353462041403780&redirect_uri=http%3A//timefor.tv/scripts/profile/fboauth.php&scope=email" class="menu-button facebook">Connect with Facebook</a>';
				html += '</td>';
				html += '<td style="width:335px; padding-left:20px; padding-top:10px;">';
				html += 	'<p style="display:inline-block;" class="small"><input type="checkbox" value="1" checked name="autologin" id="_menu_profileAutologin" /> <label for="_menu_profileAutologin">Remember me</label></p>';
				html += 	'<p style="margin-left:20px; display:inline-block;" class="small"><a href="/profile/send-password">Forgot your password?</a></p>';
				html += 	'<input type="submit" style="float:right;" class="menu-button" value="Login">';
				html += '</td></tr>';

				html += '</table>';
				html += '</form>';

				callback = function() {
					$("#submenu button, #submenu a.button").button();
					$("#submenu_login_email").focus();
				};
								break;
				/*
			case 'plan':
								*/
			default:
				return true;
		}

		$("#submenu").attr('menu',menu);


		// If already visible, then collapse first and expand again
		if($("#submenu_content").is(":visible")) {
			$("#submenu_content").slideUp("fast", function(){
				$("#submenu_content").html(html).slideDown();
				// If we have a callback
				if(typeof(callback) == 'function') {
					callback.apply();
				}
			});
		} else {
			$("#submenu_content").html(html).slideDown();

			// If we have a callback
			if(typeof(callback) == 'function') {
				callback.apply(this);
			}
		}
	}

	return false;
}

function __createSearchAgent(q) {
	if($("#agentSettings").length == 0) {
		$("body").append('<div title="Edit search agent" id="agentSettings" />');
	}
	$("#agentSettings").html('<center><img src="/imgs/icons/loading.gif" alt=""></center>').load("/ajax/plan/agent.php",{q:(typeof(q) == 'undefined') ? '' : q}).dialog({modal:true});
}