$(document).ready(function() {
    // All input fields assigned with the class 'default' will
    // get their default values hidden when clicked, and reset again
    // if the user leaves the field empty or hasnt changed anything
    // The searchfields needs an accompanying hidden input with the
    // same id but suffixed "-default" that contains the default value.
    $("input.default, textarea.default").each(function() {
        var defaultVal = $(this).next(".defaultvalue").val();
        if (!$(this).val())
            $(this).val(defaultVal);
        $(this).focus(function() {
            if ($(this).val() == defaultVal)
                $(this).val("");
        });
        $(this).blur(function() {
            if ($(this).val() == "")
                $(this).val(defaultVal);
        });
    });

    $("#search-bar p.close a").click(function() {
        $("#search-area").hide();
        $("#top-search").removeClass("is-searching");
        return false;
    });

    // Show and hide the search tip when focusing the search field
    $("#top-search")
	.focus(function() {
	    $("#search-tip").show();
	})
	.blur(function() {
	    $("#search-tip").hide();
	})
	.keydown(function(e) {
	    if (e.keyCode == 13) {
	        // Fetch the values from the hidden fields and compose URL to the product quicksearch-page
	        var productQuicksearchPage = document.getElementById('top-search-lemoon-prod-search-page');
	        var finalUrl = productQuicksearchPage.value + '&query=' + encodeURIComponent($(this).val()) + '&otID=100000';
	        document.location = finalUrl;
	        return false;
	    }
	})
	.keyup(function() {
	    // Show the search area only if you have entered two characters or more.
	    if ($(this).val().length >= 3) {
	        $("#search-area").show();
	        $(this).addClass("is-searching");

	        // Fetch the values from the hidden fields
	        var lemoonLang = document.getElementById('top-search-lemoon-lang');
	        var currentURI = document.getElementById('top-search-lemoon-currenturi');
	        var searchServiceURL = document.getElementById('top-search-lemoon-search-service-url');

	        // Compose the AJAX-URL
	        var finalUrl = searchServiceURL.value + '/?cmd=cachedsearch&lemLang=' + lemoonLang.value + '&suri=' + currentURI.value;
	        finalUrl += '&q=' + encodeURIComponent($(this).val()) + '&callback=?';

	        // Perform search
	        $.getJSON(finalUrl, function(data) {
	            var templateArea = document.getElementById('template-area');
		    templateArea.innerHTML = utf8Decode(decodeBase64(data.content));
	        });
	    }
	    // Hide when empty
	    else {
	        $("#search-area").hide();
	        $(this).removeClass("is-searching");
	    }
	});

	function utf8Decode(utftext) {
	    var string = "";
	    var i = 0;
	    var c = c1 = c2 = 0;

	    while (i < utftext.length) {

	        c = utftext.charCodeAt(i);

	        if (c < 128) {
	            string += String.fromCharCode(c);
	            i++;
	        }
	        else if ((c > 191) && (c < 224)) {
	            c2 = utftext.charCodeAt(i + 1);
	            string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
	            i += 2;
	        }
	        else {
	            c2 = utftext.charCodeAt(i + 1);
	            c3 = utftext.charCodeAt(i + 2);
	            string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
	            i += 3;
	        }
	    }
	    return string;
	}

});