var init_index;
var final_index;
var current_tab=0;

$(document).ready(function() {

	$(".clickable").unbind("click");
	$(".clickable").click(function(){ load_page(this.hash); });

	if (location.hash=='') location.hash="#!";

	// load location

	load_page(location.hash);

	// set initial cookie

	if ($.cookie("cookieid")==null){

		$.cookie("cookieid",Math.floor(Math.random() * 100000000000000));

	}

	// read shortlist

	init_tabs();

	read_shortlist(1);

	// tab links

	$(".tablink").unbind("click");
	$(".tablink").click(function(){

		$(".tablink").removeClass("active");

		$(this).addClass("active");


	});

	registerLoginButtons();

	registerLikeDislike();

	registerPrint();

	registerSettings();

});

function updateaccount(){

	$.cookie("email",$("#email").val());

	$.post("index.php?p=list&action=updatesettings", {
        email: $("#email").val(),
        password:$("#password").val()
        },
        function(data) {

        	alert('Account updated succesfully.');

        }

    );

	Boxy2.hide();
	return false;

}

function registerUpdateSettings(){



}

function registerSettings(){

	$("#deregister").unbind("click");

	$("#deregister").click(function(){

		if (confirm("Are you sure that you want to deregister ? No backup will be kept of your current account .")){

			$.post("index.php?p=list&action=deregister", {
		        none: ''
		        },
		        function(data) {

		        	alert('Account deregistered succesfully.');

		        	$("#link").html("Retrieve your saved shortlist <a href=\"#!login\" class=\"login\">LOGIN</a>");

		        	$.cookie("cookieid",null, { path: '/', expires: -10 });

		        	if($("#shortlist-girls").length>0){

		        		window.location="#!";

		        	} else {

		        		read_shortlist(1);

		        	}

		        	$("#login_content_buttons").html('<input type="button" class="save" id="save" value="save" /> <input type="button" id="view_voting" class="view_voting disabled" value="view voting" /> <input type="button" id="print" class="print" value="print" />');

		        	registerPrint();

		        	$("#share").html('<div class="button1"><img id="facebook" src="/images/facebook-button-disabled.gif" onclick="alert(\'Please save your shortlist first\')" alt="Share on Facebook" /></div> <div class="button2"><img id="twitter" src="/images/tweet-button-disabled.png" onclick="alert(\'Please save your shortlist first\')"  alt="Share on Twitter" /></div> <div class="button3"><img id="email_button"  onclick="alert(\'Please save your shortlist first\')"  src="/images/email-button-disabled.png" alt="Share via Email" /></div>');

		        }

		    );

		}

		return false;

	});

	$("#settings").unbind("click");
	$("#settings").click(function(){



		Boxy2 = new Boxy("<div><form onsubmit='return updateaccount();'><div class='row'><div class='label2'>Email Address</div><div class='field2'><input type='text' name='email' id='email' value='"+$.cookie('email')+"' /></div></div><div class='row'><div class='label2'>New Password</div><div class='field2'><input type='password' id='password' name='password' /></div></div><div class='row'><input type=submit class=save id='updatesettings' value='Update Settings'  /></form></div>",{unloadOnHide:true,modal: true,title:'Settings',afterShow:function(){ registerUpdateSettings() }});

		return false;

	});


}

function registerPrint(){

	$("#print").unbind("click");
	$("#print").click(function(){

		window.open("/index.php?p=print");
		return false;

	});

}

function send_vote(attr,vote){

	$("#vote_"+attr).fadeOut();

	$.post("index.php?p=list&action=vote", {
        entry_id: attr,
        my_vote:vote
        },
        function(data) {

        	$("#vote_"+attr).html(data);
        	$("#vote_"+attr).fadeIn();

        }

    );

}

function registerLikeDislike(){


	$(".like").unbind("click");
	$(".like").click(function(){

		send_vote($(this).attr("ref"),'1');
		return false;

	});

	$(".dislike").unbind("click");
	$(".dislike").click(function(){

		send_vote($(this).attr("ref"),'2');
		return false;

	});

	$(".skip").unbind("click");
	$(".skip").click(function(){

		send_vote($(this).attr("ref"),'0');
		return false;

	});
}

function removeHTMLTags(strInputCode){
 		var strTagStrippedText = strInputCode.replace(/<\/?[^>]+(>|$)/g, "");
 		return strTagStrippedText;
}

function search(){

	if ($("#keyword").val()==""){

		alert("Please insert a keyword. Thank you.");

		return false;

	}

	location.hash="#!a-z-names?keyword="+removeHTMLTags($("#keyword").val());

	load_page(location.hash);

	return false;

}

function _add_name_to_list(tab){

	//alert($("#add-firstname").val()+" "+$("#add-middlename").val()+" "+$("#add-lastname").val()+" "+$("#add-meaning").val()+" ");

	$.cookie("lastname",$("#add-lastname").val());

	if ($("#remember-middlename:checked").val()==1){

		$.cookie("middlename",$("#add-middlename").val());

	} else {

		$.cookie("middlename","");

	}

	$.post("index.php?p=shortlist&action=add&id="+$.cookie("cookieid"), {
        firstname: $("#add-firstname").val(),
        middlename: $("#add-middlename").val(),
        lastname: $("#add-lastname").val(),
        meaning: $("#add-meaning").val(),
        gender:tab
        },
        function(data) {
        	if(data!=''){ alert(data); };
            read_shortlist(tab);
        }
    );

}

function activate_save(){
	$("#save_changes").unbind("click");
	$("#save_changes").click(function(){


		$.post("index.php?p=shortlist&action=update&id="+$.cookie("cookieid"), {
	        firstname: $("#add-firstname").val(),
	        middlename: $("#add-middlename").val(),
	        lastname: $("#add-lastname").val(),
	        meaning: $("#add-meaning").val(),
	        entry_id:$("#add-entry").val(),
	        gender:current_tab
	        },
	        function(data) {
	            read_shortlist(current_tab);
	        }
	    );

		Boxy.get(this).hide();

		return false;

	});
}


function activate_save2(){
	$("#save_changes2").unbind("click");
	$("#save_changes2").click(function(){


		$.post("index.php?p=shortlist&action=update&id="+$.cookie("cookieid"), {
	        firstname: $("#add-firstname").val(),
	        middlename: $("#add-middlename").val(),
	        lastname: $("#add-lastname").val(),
	        meaning: $("#add-meaning").val(),
	        entry_id:$("#add-entry").val(),
	        gender:2
	        },
	        function(data) {
	            read_shortlist(current_tab);
	        }
	    );

		Boxy.get(this).hide();

		return false;

	});
}

function init_add_buttons(){

	$("#addtogirl").unbind("click");
	$("#addtoboy").unbind("click");

	$("#addtogirl").click(function(){

		_add_name_to_list(1);
		Boxy.get(this).hide();
		return false;

	});

	$("#addtoboy").click(function(){

		_add_name_to_list(2);
		Boxy.get(this).hide();
		return false;

	});


}

function init_tabs(){


	$("#tab1").click(function () {

		$("#tab2").removeClass("active");
		$("#tab1").addClass("active");

		read_shortlist(1);

		return false; });

	$("#tab2").click(function () {

		$("#tab1").removeClass("active");
		$("#tab2").addClass("active");

		read_shortlist(2);

		return false; });

}

function moveOnList_mylist(oldordernr, newordernr,mygender) {

    if (oldordernr == newordernr) {

        return;

    }
    $.post("index.php?p=shortlist&action=update_order&id="+$.cookie("cookieid"), {
        switcha: oldordernr,
        switchb: newordernr,
        gender:mygender
        },
        function(data) {
        	//alert(data);
        }
    );

}

function moveOnList(oldordernr, newordernr) {

    if (oldordernr == newordernr) {

        return;

    }
    $.post("index.php?p=shortlist&action=update_order&id="+$.cookie("cookieid"), {
        switcha: oldordernr,
        switchb: newordernr,
        gender:current_tab
        },
        function(data) {
        	//alert(data);
        }
    );

}



function init_sortable(){

	$(".clearicon").unbind("click");
	$(".clearicon").click(function(){

		if ((window.confirm('Are you sure you want to clear the votes for this name ?'))) {

			$.post("index.php?p=shortlist&action=clearvotes&id="+$.cookie("cookieid"), {
		        order: $(this).attr("ref"),
		        gender:$(this).attr("href")
		        },
		        function(data) {

					read_shortlist(current_tab);

		        }
		    );


		}
		return false;

	});

	$(".deleteicon").unbind("click");
	$(".deleteicon").click(function(){

		if ((window.confirm('Are you sure you want to delete this name from your shortlist ?'))) {

		$.post("index.php?p=shortlist&action=delete_order&id="+$.cookie("cookieid"), {
	        order: $(this).attr("ref"),
	        gender:current_tab
	        },
	        function(data) {

				read_shortlist(current_tab);

	        }
	    );

		}

		return false;

	});

	$(".deleteicon2").unbind("click");
	$(".deleteicon2").click(function(){

		if ((window.confirm('Are you sure you want to delete this name from your shortlist ?'))) {

		$.post("index.php?p=shortlist&action=delete_order&id="+$.cookie("cookieid"), {
	        order: $(this).attr("ref"),
	        gender:2
	        },
	        function(data) {

				read_shortlist(current_tab);

	        }
	    );

		}

		return false;

	});

	$(".editicon3").unbind("click");
	$(".editicon3").click(function(){

		$.getJSON('index.php?p=shortlist&action=get_values&id='+$.cookie("cookieid")+'&gender=2&entry_id='+$(this).attr("ref"), function(data) {

		  var x1='';
		  var x2='';
		  var x3='';
		  var x4='';

		  $.each(data, function(key, val) {

			   switch (key){

			   	case 'x1':

			   		x1=val;

			   	break;
			   	case 'x2':

			   		x2=val;

			   	break;
			   	case 'x3':

			   		x3=val;

			   	break;
			   	case 'x4':

			   		x4=val;

			   	break;
			   		case 'x5':

			   		x5=val;

			   	break;


			   }

		  });

		  // got the data , parse the info into the table

		  new Boxy("<div class=\"add-to-list-inner\" id=\"add-to-list\"><div class=\"label\">First Name <span class=\"requiredasterix\">*</span></div><div class=\"label\">Middle Name</div><div class=\"label\">Last Name</div><div class=\"label\">Meaning</div><div style='clear:both'>&nbsp;</div><input id=\"add-firstname\" maxlength=\"25\" value=\""+x1+"\" type=\"text\"><input id=\"add-middlename\" maxlength=\"255\" value=\""+x2+"\" type=\"text\"><input type=\"hidden\" id=\"add-entry\" maxlength=\"255\" value=\""+x5+"\" type=\"text\"><input id=\"add-lastname\" maxlength=\"255\" value=\""+x3+"\" type=\"text\"><input id=\"add-meaning\" maxlength=\"255\" value=\""+x4+"\" type=\"text\"><div style='clear:both'>&nbsp;</div>&nbsp;&nbsp;<a href=\"#\" id=\"save_changes2\" class=\"save_changes\" onclick=\"return false;\">Save Changes</a> </div>",{unloadOnHide:true,modal: true,title:'Update item',afterShow:function(){activate_save2()}});

		});

		return false;

	});

	$(".editicon, .editicon2").unbind("click");
	$(".editicon, .editicon2").click(function(){

		$.getJSON('index.php?p=shortlist&action=get_values&id='+$.cookie("cookieid")+'&gender='+current_tab+'&entry_id='+$(this).attr("ref"), function(data) {

		  var x1='';
		  var x2='';
		  var x3='';
		  var x4='';

		  $.each(data, function(key, val) {

			   switch (key){

			   	case 'x1':

			   		x1=val;

			   	break;
			   	case 'x2':

			   		x2=val;

			   	break;
			   	case 'x3':

			   		x3=val;

			   	break;
			   	case 'x4':

			   		x4=val;

			   	break;
			   		case 'x5':

			   		x5=val;

			   	break;


			   }

		  });

		  // got the data , parse the info into the table

		  new Boxy("<div class=\"add-to-list-inner\" id=\"add-to-list\"><div class=\"label\">First Name <span class=\"requiredasterix\">*</span></div><div class=\"label\">Middle Name</div><div class=\"label\">Last Name</div><div class=\"label\">Meaning</div><div style='clear:both'>&nbsp;</div><input id=\"add-firstname\" maxlength=\"25\" value=\""+x1+"\" type=\"text\"><input id=\"add-middlename\" maxlength=\"255\" value=\""+x2+"\" type=\"text\"><input type=\"hidden\" id=\"add-entry\" maxlength=\"255\" value=\""+x5+"\" type=\"text\"><input id=\"add-lastname\" maxlength=\"255\" value=\""+x3+"\" type=\"text\"><input id=\"add-meaning\" maxlength=\"255\" value=\""+x4+"\" type=\"text\"><div style='clear:both'>&nbsp;</div>&nbsp;&nbsp;<a href=\"#\" id=\"save_changes\" class=\"save_changes\" onclick=\"return false;\">Save Changes</a> </div>",{unloadOnHide:true,modal: true,title:'Update item',afterShow:function(){activate_save()}});

		});

		return false;

	});



	$(".sortable").sortable({
		 	disabled: true,
            axis: 'y',
            cursor:  'move',
            scrollSpeed: 15,
            update: function(event, ui) {
                /* update */
                //var new_nr = ui.item.index() + 1;
                //var old_nr = ui.item.find('span.nr').html().replace('.', '');
                //ui.item.find('span.nr').html(new_nr + '.');
                //var this_id = ui.item.find('span.lid').html();
                //var this_list = $(this).parent().attr('class').replace('nameslist-', '').replace(' nameslist-list', '');
                //moveOnList(this_id, this_list, old_nr, new_nr);
                final_index=ui.item.index()+1;
                moveOnList(init_index,final_index);
                ui.item.removeClass('ondrag');
            },
            start: function(event, ui) {
				init_index=ui.item.index()+1;
                //ui.item.find('span.nr').css("visibility", "hidden");
                ui.item.addClass('ondrag');
            },
            stop: function(event, ui) {
                ui.item.removeClass('ondrag');
               // ui.item.find('span.nr').css("visibility", "visible");
            }
        });

		$(".sortable").disableSelection();

        /*$("ul.sortable > li").each(function() {
            $(this).bind('mouseover', function() {
                $(this).find('span.nr').html('&nbsp;');
            });
            $(this).bind('mouseout', function() {
                var nr = $(this).index() + 1;
                $(this).find('span.nr').html(nr + '.');
            });
        });*/



	$(".sortable_girls").sortable({
		 	disabled: true,
            axis: 'y',
            cursor:  'move',
            scrollSpeed: 15,
            update: function(event, ui) {
                /* update */
                //var new_nr = ui.item.index() + 1;
                //var old_nr = ui.item.find('span.nr').html().replace('.', '');
                //ui.item.find('span.nr').html(new_nr + '.');
                //var this_id = ui.item.find('span.lid').html();
                //var this_list = $(this).parent().attr('class').replace('nameslist-', '').replace(' nameslist-list', '');
                //moveOnList(this_id, this_list, old_nr, new_nr);
                final_index=ui.item.index()+1;
                moveOnList_mylist(init_index,final_index,1);
                ui.item.removeClass('ondrag');
            },
            start: function(event, ui) {
				init_index=ui.item.index()+1;
                //ui.item.find('span.nr').css("visibility", "hidden");
                ui.item.addClass('ondrag');
            },
            stop: function(event, ui) {
                ui.item.removeClass('ondrag');
               // ui.item.find('span.nr').css("visibility", "visible");
            }
        });

		$(".sortable_girls").disableSelection();

		$(".sortable_boys").sortable({
		 	disabled: true,
            axis: 'y',
            cursor:  'move',
            scrollSpeed: 15,
            update: function(event, ui) {
                /* update */
                //var new_nr = ui.item.index() + 1;
                //var old_nr = ui.item.find('span.nr').html().replace('.', '');
                //ui.item.find('span.nr').html(new_nr + '.');
                //var this_id = ui.item.find('span.lid').html();
                //var this_list = $(this).parent().attr('class').replace('nameslist-', '').replace(' nameslist-list', '');
                //moveOnList(this_id, this_list, old_nr, new_nr);
                final_index=ui.item.index()+1;
                moveOnList_mylist(init_index,final_index,2);
                ui.item.removeClass('ondrag');
            },
            start: function(event, ui) {
				init_index=ui.item.index()+1;
                //ui.item.find('span.nr').css("visibility", "hidden");
                ui.item.addClass('ondrag');
            },
            stop: function(event, ui) {
                ui.item.removeClass('ondrag');
               // ui.item.find('span.nr').css("visibility", "visible");
            }
        });

		$(".sortable_boys").disableSelection();

        $(".dragicon").bind('mouseover', function() {

	        $(".sortable , .sortable_girls, .sortable_boys").sortable("enable");


	    });
	    $(".dragicon").bind('mouseout', function() {
	        $(".sortable , .sortable_girls, .sortable_boys").sortable("disable");
	    });

}

var Boxy2;

function registerLoginButtons(){

	$("#logout").unbind("click");

	$("#logout").click(function(){

		$("#link").html("Retrieve your saved shortlist <a href=\"#!login\" class=\"login\">LOGIN</a>");

		$.post("index.php?p=login&action=logout", {},

	        function(data) {

	        	new Boxy("<div>You have been logged out. Thank you.</div>",{unloadOnHide:true,modal: true,title:'Logout',afterShow:function(){  }});

	        	$.cookie("cookieid",null, { path: '/', expires: -10 });

	        	if($("#shortlist-girls").length>0){

	        		window.location="#!";

	        	} else {

	        		read_shortlist(1);

	        	}

	        	$("#login_content_buttons").html('<input type="button" class="save" id="save" value="save" /> <input type="button" id="view_voting" class="view_voting disabled" value="view voting" /> <input type="button" id="print" class="print" value="print" />');

	        	registerPrint();

	        	$("#share").html('<div class="button1"><img id="facebook" src="/images/facebook-button-disabled.gif" onclick="alert(\'Please save your shortlist first\')" alt="Share on Facebook" /></div> <div class="button2"><img id="twitter" src="/images/tweet-button-disabled.png" onclick="alert(\'Please save your shortlist first\')"  alt="Share on Twitter" /></div> <div class="button3"><img id="email_button"  onclick="alert(\'Please save your shortlist first\')"  src="/images/email-button-disabled.png" alt="Share via Email" /></div>');

	        }
	    );

		return false;

	});


}

function checklogin(){

	$.getJSON('index.php?p=login&id='+$.cookie("cookieid")+"&email="+$("#email").val()+"&password="+$("#password").val(), function(data) {

		  $.each(data, function(key, val) {

			   switch (key){

			   	case 'message':

			   	new Boxy("<div>"+val+"</div>",{unloadOnHide:true,modal: true,title:'Login successful',afterShow:function(){  }});


			   break;

			   	case 'loggedin':

					Boxy2.hide();

					// change what needs to be changed for login users


					$.cookie("cookieid",val);

					$("#link").html("<a href=\"#!settings\" id=\"settings\" class=\"settings\">Account settings</a> | <a href=\"#!deregister\" id=\"deregister\" class=\"deregister\">Deregister</a> | <a href=\"#!logout\" id=\"logout\" class=\"logout\">LOGOUT</a>");

					registerSettings();

					registerLoginButtons();

					// show login content

					$("#login_content_buttons").html('<input type="button" onclick="window.location=\'list/'+val+'#!view\'" id="view_voting" class="view_voting " value="view voting" /> <input type="button" id="print" class="print" value="print" />');

					registerPrint();

					$("#share").html('<div class="button1"><img style="cursor:pointer" onclick="window.location=\'http://www.facebook.com/sharer/sharer.php?u=http%3a%2f%2fwww.butterfly.co.uk%2flist%2f'+val+'%23!view&t=What+baby+names+from+my+list+do+you+like+most%3F+Vote+and+help+me+pick+the+best+name!\'"  id="facebook" src="/images/facebook-button.gif" alt="Share on Facebook" /></div> <div class="button2"><img style="cursor:pointer" id="twitter" onclick="window.location=\'https://twitter.com/share?text=Which+baby+names+do+you+like+most+on+my+list%3f+Please+vote+now+at&url=http%3a%2f%2fwww.butterfly.co.uk%2flist%2f'+val+'%23!view\'" src="/images/tweet-button.png" alt="Share on Twitter" /></div> <div class="button3"><a href="mailto:?body='+message_.replace("{$link}","http://www.butterfly.co.uk/list/"+$.cookie("cookieid")+"#!")+'"><img border=0 style="cursor:pointer" id="email_button"  src="/images/email-button.png" alt="Share via Email" /></a></div>');

					// re register buttons

					read_shortlist(1);



			   	break;

			   	case 'email':

			   		$.cookie("email",val);

			   	break;

			   	case 'error':

			   		alert(val);

			   	break;

			   }

		  });

		});

		return false;
}

function registerLogin(){

	$(".forgot").unbind("click");

	$(".forgot").click(function(){

		if ($("#email").val()==""){

			alert("Please enter your email address in order to send you a reset password email message. Thank you.");

		} else {

			$.getJSON('index.php?p=list&task=recoverpass&email='+$("#email").val(), function(data) {

			$.each(data, function(key, val) {

				   switch (key){

				   	case 'html':

						alert(val);

				   	break;

				   }

			 });

		});

		}

		return false;

	});

	$("#loginregister").unbind("click");

	$("#loginregister").click(function(){

	});


}

function read_shortlist(tab){

	// init save

	$("#save , .login").unbind("click");
	$("#save , .login").click(function(){

		Boxy2 = new Boxy("<div><form onsubmit='return checklogin();'><h1 style='padding-top:10px;padding-bottom:10px'>Log in / Register</h1><div class='row'><div class='label2'>Email Address</div><div class='field2'><input type='text' name='email' id='email' /></div></div><div class='row'><div class='label2'>Password</div><div class='field2'><input type='password' id='password' name='password' /></div></div><div class='row'><input type=submit class=save id='loginregister' value='Login/Register'  /> <a href='#' class='forgot' onclick='return false;'>Forgot password ?</a></form></div>",{unloadOnHide:true,modal: true,title:'Login/Register',afterShow:function(){ registerLogin() }});

		return false;


	});

	//////////////

	current_tab=tab;

	if (tab==1){
		$("#tab2").removeClass("active");
		$("#tab1").addClass("active");
	} else {
		$("#tab1").removeClass("active");
		$("#tab2").addClass("active");
	}

	$("#shortlist").html('<div style="margin:10px">loading...</div>');

	// read for my list 2 page

	if($("#shortlist-girls").length>0){

		$("#shortlist-girls").html('<div style="margin:10px">loading...</div>');

		$("#shortlist-boys").html('<div style="margin:10px">loading...</div>');

		$.getJSON('index.php?p=list&return=true&id='+$.cookie("cookieid"), function(data) {

		  $.each(data, function(key, val) {

			   switch (key){

			   	case 'girls':

			   		$("#shortlist-girls").html(val);


			   	break;

			   	case 'boys':

			   		$("#shortlist-boys").html(val);



			   	break;

			   }

		  });

		  init_sortable();

		  //$("#shortlist").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);

		});

	} else {

	//////////////////////////////////////////

	$.getJSON('index.php?p=shortlist&id='+$.cookie("cookieid")+'&tab='+tab, function(data) {

	  $.each(data, function(key, val) {

		   switch (key){

		   	case 'id':

		   		$("#shortlist").html(val);

		   		init_sortable();

		   	break;

		   }

	  });

	  //$("#shortlist").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);

	});

	}


}

function add_name(name){

	if (name===undefined){

		name='name=&meaning=';

	}

	name=name.split("&");

	var my_name = name[0].split("=");

	var my_meaning = name[1].split("=");

    new Boxy("<div class=\"add-to-list-inner\" id=\"add-to-list\"><div class=\"label\" style='width:170px'>First Name <span class=\"requiredasterix\">*</span></div><div class=\"label\" style='width:175px'>Middle Name</div><div class=\"label\" style='width:180px'>Last Name</div><div style='clear:both'>&nbsp;</div><input  style='width:160px' id=\"add-firstname\" maxlength=\"25\" value=\""+my_name[1]+"\" type=\"text\"><input  style='width:160px' id=\"add-middlename\" maxlength=\"255\" value=\""+($.cookie("middlename")!=null?$.cookie("middlename"):"")+"\" type=\"text\"><input  style='width:160px' id=\"add-lastname\" maxlength=\"255\" value=\""+($.cookie("lastname")!=null?$.cookie("lastname"):"")+"\" type=\"text\"><div class='clear' style='clear:both;width:400px;overflow:hidden;height:3px;'>&nbsp;</div><div class=\"label\" style='margin-bottom:10px'>Meaning</div><div class='clear' style='clear:both;width:400px;overflow:hidden;height:3px;'>&nbsp;</div><input style='width:528px' id=\"add-meaning\" maxlength=\"255\" value=\""+my_meaning[1]+"\" type=\"text\"><div style='clear:both'>&nbsp;</div>&nbsp;&nbsp;<input id=\"remember-middlename\" id=\"remember-middlename\" "+($.cookie("middlename")!=null && $.cookie("middlename")!=""?"checked":"")+" value=1 type=\"checkbox\"> <label for=\"remember-middlename\">Remember middle name(s) for the next name I add</label><div style='clear:both'>&nbsp;</div>&nbsp;&nbsp;<a href=\"#\" id=\"addtogirl\" class=\"addtogirl\" onclick=\"return false;\">Add to Girls List</a> <a href=\"#\" id=\"addtoboy\" class=\"addtoboy\" onclick=\"return false;\">Add to Boys List</a><div class='clear' style='margin-bottom:10px'>&nbsp;</div></div>",{unloadOnHide:true,modal: true,title:'Add to my short list',afterShow:function(){init_add_buttons()}});

}

var shid=1;
var shtab=1;

var topid=1;
var toptab=1;


function load_page(url){

	// load correct page

	var page=url.replace("#!","");

	var split_page=page.split("?");

	switch (split_page[0]){

		case "shortlist-search":

			$("#filter , #current_names , #current_filter_container , #pagination").html("");

			$("#heading_babies").html("shortlist search");

			$(".tablink").removeClass("active");

			$("#tab2_link").addClass("active");

			$("#current_names").html("loading...");

			$("#current_names").css("padding-top","0");

			$("#current_filter_container").css("display","none");

			$("#filter").css("display","none");


			// load the shortlist

			$.getJSON('index.php?p=sh&'+split_page[1], function(data) {

			  var items = [];

			  $.each(data, function(key, val) {

				   switch (key){

				   	case 'pagination_html':
				   		$("#pagination").html(val);
				   	break;

				   	case 'html':

				   		$("#current_names").html(val);



				   	break;

				   }

			  });

			  $(".clickable").unbind('click');

			  $(".clickable").click(function(){ load_page(this.hash); });

			});

			load_footer("shortlist-search");

		break;

		case "view":



			load_footer("view");

		break;

		case "top-rated-names":

			$("#filter , #current_names , #current_filter_container , #pagination").html("");

			$("#heading_babies").html("top rated names");

			$(".tablink").removeClass("active");

			$("#tab3_link").addClass("active");

			$("#current_names").html("loading...");

			$("#current_names").css("padding-top","0");

			$("#current_filter_container").css("display","none");

			$("#filter").css("display","none");

			// load the top rated names



			$.getJSON('index.php?p=top&'+split_page[1], function(data) {

			  var items = [];

			  $.each(data, function(key, val) {

				   switch (key){

				   	case 'pagination_html':
				   		$("#pagination").html(val);
				   	break;

				   	case 'html':

				   		$("#current_names").html(val);



				   	break;

				   }

			  });

			  $(".clickable").unbind('click');

			  $(".clickable").click(function(){ load_page(this.hash); });

			});

			load_footer("top-rated-names");

		break;

		case "add-name":

			add_name(split_page[1]);

		break;

		case "":

			$("#heading_babies").html("baby names");

			$(".tablink").removeClass("active");

			$("#tab1_link").addClass("active");

			$("#current_names").html("loading...");

			$("#current_names").css("padding-top","15px");

			$("#current_filter_container").css("display","block");

			$("#filter").css("display","block");

			a_z_names("");

			load_footer("a-z-names");

		break;

		case "a-z-names":

			$(".tablink").removeClass("active");

			$("#tab1_link").addClass("active");

			$("#current_names").html("loading...");

			$("#current_names").css("padding-top","15px");

			$("#current_filter_container").css("display","block");

			$("#filter").css("display","block");

			a_z_names(split_page[1]);

			load_footer("a-z-names");

		break;

	}



}

function load_promotion(url){

	$.getJSON('index.php?p=promotion&url='+url, function(data) {

	  var items = [];

	  $.each(data, function(key, val) {

		   switch (key){

		   	case 'html':

		   		$("#promotion-box").html(val);
		   	break;

		   }

	  });

	});

}

function load_footer(url){

	$.getJSON('index.php?p=footer&url='+url, function(data) {



	  var items = [];

	  $.each(data, function(key, val) {

		   switch (key){

		   	case 'html':

		   		$("#footer_content").html(val);
		   	break;

		   }

	  });

	});

	load_promotion(url);

}

function a_z_names(params){

	if ($("#heading_babies").length==0){return false; }

	$("#keyword").val("");

	var my_keyword="";

	params_array = params.split("&");

	for (var param_ in params_array){

		param_split = params_array[param_].split("=");

		if (param_split[0]=="keyword"){

			my_keyword=param_split[1];

		}

	}

	if (my_keyword!=''){

		$("#keyword").val(my_keyword);
		$("#heading_babies").html("search results");
		$("#filter").html("&nbsp;&nbsp;&nbsp;&nbsp;<a href='#!' class='clickable'>Click here to clear the search query</a> ");
		$("#current_filter_container").html("Results for "+removeHTMLTags($("#keyword").val())+" :");

	} else {
		;
		if (($("#filter").html().search(/Click here to clear/))!=-1 || $("#filter").html()==""){

		$("#heading_babies").html("baby names");

		$("#filter").html('<a href="#!a-z-names?letter=A" class="clickable active letterA">A</a>  <a href="#!a-z-names?letter=B" class="clickable letterB">B</a>  <a href="#!a-z-names?letter=C" class="clickable letterC">C</a> <a href="#!a-z-names?letter=D" class="clickable letterD">D</a> <a href="#!a-z-names?letter=E" class="clickable letterE">E</a> <a href="#!a-z-names?letter=F" class="clickable letterF">F</a> <a href="#!a-z-names?letter=G" class="clickable letterG">G</a> <a href="#!a-z-names?letter=H" class="clickable letterH">H</a> <a href="#!a-z-names?letter=I" class="clickable letterI">I</a> <a href="#!a-z-names?letter=J" class="clickable letterJ">J</a> <a href="#!a-z-names?letter=K" class="clickable letterK">K</a> <a href="#!a-z-names?letter=L" class="clickable letterL">L</a> <a href="#!a-z-names?letter=M" class="clickable letterM">M</a> <a href="#!a-z-names?letter=N" class="clickable letterN">N</a> <a href="#!a-z-names?letter=O" class="clickable letterO">O</a> <a href="#!a-z-names?letter=P" class="clickable letterP">P</a> <a href="#!a-z-names?letter=Q" class="clickable letterQ">Q</a> <a href="#!a-z-names?letter=R" class="clickable letterR">R</a> <a href="#!a-z-names?letter=S" class="clickable letterS">S</a> <a href="#!a-z-names?letter=T" class="clickable letterT">T</a> <a href="#!a-z-names?letter=U" class="clickable letterU">U</a> <a href="#!a-z-names?letter=V" class="clickable letterV">V</a> <a href="#!a-z-names?letter=W" class="clickable letterW">W</a> <a href="#!a-z-names?letter=X" class="clickable letterX">X</a> <a href="#!a-z-names?letter=Y" class="clickable etterY">Y</a> <a href="#!a-z-names?letter=Z" class="clickable letterZ">Z</a>');
		$("#current_filter_container").html('Names starting with <span id="current_filter">A</span>');

		}

	}

	$("#current_names").html('loading...');

	$.getJSON('index.php?p=a_z_names&'+params, function(data) {

	  var items = [];

	  $.each(data, function(key, val) {

		   switch (key){

		   	case 'pagination_html':
		   		$("#pagination").html(val);
		   	break;

		   	case 'names_html':

		   		$("#current_names").html(val);
		   	break;

		   	case 'letter_html':
				$(".filter A").removeClass('active');
				$(".filter .letter"+val).addClass('active');
		   		$("#current_filter").html(val);

		   	break;

		   }

	  });

	  $(".clickable").unbind('click');
	  $(".clickable").click(function(){ load_page(this.hash); });

	});

}