function IsPlaceholderSupported () {
  var testingInput = document.createElement("input");
  return ("placeholder" in testingInput);
}

function ManagePlaceholder (inputElement, event) {
  var isFocusin = (event.type == "focusin" || event.type == "focus");
  var placeholderElement = $(inputElement).prev(".placeholder");
  var isInputValueEmpty = $(inputElement).val().length == 0;
  if (typeof(inputElement.attr("placeholder")) != "undefined" && isInputValueEmpty) {
    if (isFocusin) {
      RemovePlaceholder(placeholderElement);
    } else {
      AddPlaceholder(inputElement);
    }
  }
}
function AddPlaceholder (element) {
  var placeholderValue = $(element).attr("placeholder");
  $(element).before("<span class='placeholder' style='position: absolute;'>" + placeholderValue + "</span>");
  PositionPlaceholder($(element).prev('.placeholder'));
}
function RemovePlaceholder (element) {
  $(element).remove();
}

function GeneratePlaceholdersIfNeeded () {
  if (!IsPlaceholderSupported()) {
    var formInputs = $("input, textarea");
    var formInputsCount = formInputs.length;
    for (var formInputIndex = 0; formInputIndex < formInputsCount; formInputIndex++) {
      var formInput = formInputs[formInputIndex];
      var placeholderValue = $(formInput).attr("placeholder");
      var isInputValueEmpty = $(formInput).val().length == 0;
      var isPlaceholderExists = $(formInput).prev('.placeholder').length > 0;
      if (typeof(placeholderValue) != "undefined" && isInputValueEmpty && !isPlaceholderExists) {
        AddPlaceholder($(formInput));
      }
    }
  }
}
function PositionPlaceholder (element) {
  var inputElement = $(element).next("input, textarea").first();
  var inputWidth = $(inputElement).width();

  var paddingLeft = parseInt($(inputElement).css("padding-left")) || 0;
  var marginLeft = parseInt($(inputElement).css("margin-left")) || 0;
  var borderLeft = parseInt($(inputElement).css("border-left-width")) || 0;
  var leftDifference = paddingLeft + borderLeft + marginLeft;
  var left = $(inputElement).position().left + leftDifference;

  var paddingTop = parseInt($(inputElement).css("padding-top")) || 0;
  var marginTop = parseInt($(inputElement).css("margin-top")) || 0;
  var borderTop = parseInt($(inputElement).css("border-top-width")) || 0;
  var topDifference = paddingTop + borderTop + marginTop;
  var top = $(inputElement).position().top + topDifference;

  $(element).css({
    left: left,
    top: top,
    width: inputWidth
  });
}

function FocusRelatedInput () {
  $(this).next('input, textarea').first().focus();
  RemovePlaceholder($(this));
}

$(document).ready(function(){
  GeneratePlaceholdersIfNeeded();

  if (!IsPlaceholderSupported()) {
    $("input, textarea").live("focus blur", function(event){
      ManagePlaceholder($(this), event);
    });

    $('.placeholder').live("click", FocusRelatedInput);

    $(window).resize(function(){
      $(".placeholder").each(function(){
        PositionPlaceholder($(this));
      });
    });
  }
});

