var shown = false;

$(function() {

  var allHtml = '<div class="messagepop pop"><div id="ven_content"><form name="sendform" action=""><p>  <label for="ditnavn">Dit navn</label>  <input type="text" size="30" name="ditnavn" id="ditnavn" />  <label class="error" for="ditnavn" id="ditnavn_error">Dette felt skal udfyldes</label>  <br/>  <label for="vennavn">Din vens navn</label>  <input type="text" size="30" name="vennavn" id="vennavn" />  <label class="error" for="vennavn" id="vennavn_error">Dette felt skal udfyldes</label>  <br/>  <label for="venemail">Din vens email</label>  <input type="text" size="30" name="venemail" id="venemail" />  <label class="error" for="venemail" id="venemail_error">Dette felt skal udfyldes</label>  </p><p><input type="submit" value="Send" name="commit" class="button" id="submit_btn"/> eller <a class="close" href="/">Annuller</a></p></form></div></div>';
  var formHtml = '<form name="sendform" action=""><p>  <label for="ditnavn">Dit navn</label>  <input type="text" size="30" name="ditnavn" id="ditnavn" />  <label class="error" for="ditnavn" id="ditnavn_error">Dette felt skal udfyldes</label>  <br/>  <label for="vennavn">Din vens navn</label>  <input type="text" size="30" name="vennavn" id="vennavn" />  <label class="error" for="vennavn" id="vennavn_error">Dette felt skal udfyldes</label>  <br/>  <label for="venemail">Din vens email</label>  <input type="text" size="30" name="venemail" id="venemail" />  <label class="error" for="venemail" id="venemail_error">Dette felt skal udfyldes</label>  </p><p><input type="submit" value="Send" name="commit" class="button" id="submit_btn"/> eller <a class="close" href="#">Annuller</a></p></form>';

  // Vis og luk med "Send til en ven"-link.
  $("#sendven").live('click', function(event) {
    if (!shown) {
      $(this).addClass("selected").parent().append(allHtml);
        $(".pop").slideFadeToggle(function() {
          $("#ditnavn").focus();
        });
      shown = true;

      // Skjul fejl-labels
      $(".error").hide();

      // Ajax-send
      $(".button").click(function() {
        $('.error').hide();

    // Validate input
    var ditnavn = $("input#ditnavn").val();
        if (ditnavn == "") {
      $("label#ditnavn_error").show();
      $("input#ditnavn").focus();
      return false;
    }

        var vennavn = $("input#vennavn").val();
        if (vennavn == "") {
      $("label#vennavn_error").show();
      $("input#vennavn").focus();
      return false;
    }

        var venemail = $("input#venemail").val();
        if (venemail == "") {
      $("label#venemail_error").show();
      $("input#venemail").focus();
      return false;
    }

    // Send with ajax
    var dataString = 'ditnavn='+ ditnavn + '&vennavn=' + vennavn + '&venemail=' + venemail;

    $.ajax({
      type: "POST",
      url: "sendven.php",
      data: dataString,
      success: function(data) {
        $('#ven_content').html('<h3>Tak</h3>Tippet er sendt til ' + vennavn + '.<br><br><a href="#" id="ven_igen">Send til en ven mere</a> eller <a href="#" class="close">Luk</a>')
        .hide()
        .fadeIn(1500);
      }
    });
    return false;

      });

      return false;
    } else {
      $(".pop").slideFadeToggle(function() {
         $("#sendven").removeClass("selected");
      });
      return false;
    }
  });

  // Luk med Annuller-link.
  $(".close").live('click', function() {
      $(".pop").slideFadeToggle(function() {
         $("#sendven").removeClass("selected");
      });
      return false;
  });

  // Send til en ven mere
  $("#ven_igen").live('click', function() {
    $('#ven_content').html(formHtml);
    $('.error').hide();
    return false;
  });

});

$.fn.slideFadeToggle = function(easing, callback) {
  return this.animate({ opacity: 'toggle', height: 'toggle' }, "fast", easing, callback);
};