
function showProgressBar(form) {
  var form = $(form);
  if (form.hasProgressBar) {
    return;
  }
  
  // detect whether there is file to upload
  var hasUpload = false;
  form.find("input[type='file']").each(function(i, el) {
    if (el.value) {
      hasUpload = true;
    }
  });
  
  if (!hasUpload) { return; }

  form.find("input[type='submit']").each(function(i, el) {
    $(el).css("disabled", "disabled");
  });

  var shutter = $(document.createElement('div'));
  var loader = $(document.createElement('div'));

  shutter.css({
    background: "#999999",
    opacity: 0.7,
    position: "absolute",
    "z-index": 98
  });
  shutter.width(form.outerWidth());
  shutter.height(form.outerHeight());
  shutter.css(form.offset());
  shutter.addClass("progressBar-shutter");
  shutter.hide();

  loader.css({
    color: "#000000",
    position: "absolute",
    "font-size": "0.9em",
    "text-align": "center",
    "z-index": 99
  });
  loader.width(form.outerWidth());
  loader.height(form.outerHeight());
  loader.css(form.offset());
  loader.addClass("progressBar-loader");
  loader.hide();

  var label = $(document.createElement('span'));
  label.text(fileUploadConfig.label);
  label.css("position", "absolute");
  label.addClass("progressBar-label");

  var image = $(document.createElement('img'));
  image.attr("src", fileUploadConfig.pathToImage);
  image.css("position", "absolute");
  image.css("vertical-align: middle");
  image.css("margin-left", "5px");
  image.addClass("progressBar-image");

  $("body").append(shutter);
  $("body").append(loader);
  loader.append(image);
  loader.append(label);
  shutter.fadeIn();
  loader.fadeIn();

  label.css("top", (loader.outerHeight() - label.outerHeight()) / 2);
  image.css("top", (loader.outerHeight() - image.outerHeight()) / 2);
  label.css("left", (loader.outerWidth() - label.outerWidth() - image.outerWidth()) / 2);
  image.css("left", (loader.outerWidth() + label.outerWidth() - image.outerWidth()) / 2);

  form.hasProgressBar = true;
}


$(document).ready(function() {
  $("form input[type='file']").closest("form").submit(function() {
    showProgressBar(this);
  });

  // tyhle inputy nevyvolají form.submit
  $("form input[type='image']").click(function() {
    var form = $(this).closest("form");
    if ($(form).find("input[type='file']").size() > 0) {
      showProgressBar(form);
    }
  });
});
