$(document).ready(function() {
    
    $("#blog-top2").hide();
    
    $("#blog-top-back").click(function(){
        // CLOSE NAVIGATION
        $("#blog-top2").fadeOut(500, function(){
            $("#blog-top1").fadeIn(500);
        });
    });
    
    $("#wide").hover(function() {
        // OPEN NAVIGATION
        $("#blog-top1").fadeOut(500, function(){
            $("#blog-top2").fadeIn(500);
        });
    }, function() {});
    
    $("#blog-top1").click(function() {
        // OPEN NAVIGATION
        $("#blog-top1").fadeOut(500, function(){
            $("#blog-top2").fadeIn(500);
        });
    });
    
    $("#blog-top2 form").submit(function(ev){
        /*
         * AJAX SEARCH
         */
        ev.preventDefault();
        $("#blog-top2 form span.error").fadeOut(200).remove();
        if ($("#blog-top2 form input#suchen").val() == "") {
            $("#blog-top2 form input#suchen").val("Suchbegriff eingeben!");
            return false;
        }
        if ($("#blog-top2 form input#suchen").val() == "Suchbegriff eingeben!") {
            $("#blog-top2 form input#suchen").css({border: "1px solid #8c381a"});
            return false;
        }
        $("#blog-top2 form input[type='submit']").val("Loading...");
        $.ajax({
          url: "/", // todo: variable for the url, passed by the template
          type: "GET",
          dataType: "html",
          data: $("#blog-top2 form.searchform").serialize(),
          success: function(data) {
              $("#blog-top2 form input[type='submit']").val("Suchen");
              $("#blog-top2 form span.error").fadeOut(200).remove();
              $("#main").slideUp(500, function(){
                  $("#main").empty().append('<p class="message">Ihre Suche erbrachte leider keine Ergebnisse. :(</p>');
                  $("#main").empty().append($(data).find("#main")).slideDown(500);
              });
          },
          error: function() {
              $("#blog-top2 form span.error").fadeOut(200).remove();
              $("#blog-top2 form input[type='submit']").val("Suchen");
              $("#blog-top2 form input[type='submit']").after('<span class="error">Fehler :(</span>');
          },
        });
    });
    
    $("#blog-top2 form input#suchen").focus(function() {
        // CLEAR SEARCH FIELD
        if (this.value == "Suchbegriff eingeben!")
            this.value = '';
    });
});