var zIndex = 10000;
var linkzIndex = 10;
var previousOffset;
var link = 2;
var blocked = false;
var seconds = 0;
var timer_enabled = false;
var timed = 0;
var linked = false;
var finalcheck = true;
var dragged = null;
var idx = 0;

$(document).ready(function(){
  /*
  $(":file").each(function(i){
    this.onchange = HandleChanges;
    this.onmouseover = MakeActive;
    this.onmouseout = UnMakeActive;
  })*/

  if($(".im_star").html() != null) {
    $(".im_star").tooltip({effect: 'slide', tip:'#tip', position: "top right"})
  }
  if($(".im_star_bottom").html() != null) {
    $(".im_star_bottom").tooltip({effect: 'slide', tip:'#bottom_tip', position: "top right"})
  }
  if($(".im_tooltip").html() != null) {
    $(".im_tooltip").tooltip({effect: 'slide', tip:'#tooltip', position: "top right"})
  }
});

/*
function HandleChanges() {
  file = $(this).val();
  reWin = /.*\\(.*)/;
  var fileTitle = file.replace(reWin, "$1"); //выдираем название файла
  reUnix = /.*\/(.*)/;
  fileTitle = fileTitle.replace(reUnix, "$1"); //выдираем название файла
  $("#FileName_"+$(this).attr("part")).html(fileTitle).css("display","block").css("background","url(/images/icons.png) no-repeat 0 -176px");
};

function MakeActive() {
  $("#activeBrowseButton_"+$(this).attr("part")).css("display","block");
};

function UnMakeActive() {
  $("#activeBrowseButton_"+$(this).attr("part")).css("display","none");
};
*/

function unlinkHideBlock() {
  $(".hideblock").remove();
}

function makeHideBlock(id) {
  hideLayer = $("<div class='hideblock' style='z-index:99999999999;left:0px; top:0px; width:100%; height:100%;'></div>");
  hideLayer.append("<table width='100%' height='100%'><tr><td align='center' style='vertical-align:center'><img src='/images/ajax-loader.gif'/></td></tr></table>");
  $('#'+id).append(hideLayer);
}

function startDrag(element) {
  zIndex = zIndex + 1;

  if(isNaN(parseInt($(element).attr("link")))) {

    $(element).css("z-index",zIndex);
    $("#pic_"+$(element).attr("y")+"_"+$(element).attr("x")).css("z-index", (zIndex-1))

  } else {
    $("element[link='"+$(element).attr("link")+"']").each(function(){

      $(this).css("z-index", zIndex);
      $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")).css("z-index", (zIndex-1))

    })
  }

  previousOffset = $(element).offset();
}

function checkPuzzle(element) {

  var element = element;

  var mainX = $(element).attr("x");
  var mainY = $(element).attr("y");
  var clammy = false;
  var clammyOffset;
  var clammyLink;
  var elementLink;
  var deltaX = 0;
  var deltaY = 0;
  var dx = 0;
  var dy = 0;
  var l = 2;
  var elementOffset = $(element).offset();
  var topOf = 50;
  var leftOf = 50;
  var clammyId = null;
  var clammyRawId = null;

  elementOffset.top=elementOffset.top+0;
  elementOffset.left=elementOffset.left+0;

  /* Обнуляем z-Index картинке */
  $("#pic_"+mainY+"_"+mainX).css("z-index","0");
  
  /* LEFT CLAMMY SIDE */
 
  switch(parseInt($("#element_"+mainY+"_"+mainX).attr("angle"))) {
    case 0: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)-1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)-1);
      break;
    }
    case 90: {
      clammyId = "#element_"+(parseInt(mainY)-1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)-1)+"_"+mainX;
      break;
    }
    case 180: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)+1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)+1);
      break;
    }
    case 270: {
      clammyId = "#element_"+(parseInt(mainY)+1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)+1)+"_"+mainX;
      break;
    }
  }
  
  /* console.log("ClammyId LEFT:"+clammyId); */

  if(clammy == false && document.getElementById(clammyRawId)) {
    clammyOffset = $(clammyId).offset();

    clammyLink = parseInt($(clammyId).attr("link"));
    elementLink = parseInt($("#element_"+mainY+"_"+mainX).attr("link"));

    if( elementOffset.top > clammyOffset.top-5 && elementOffset.top < clammyOffset.top+5 &&
        elementOffset.left-50 > clammyOffset.left-5 && elementOffset.left-50 < clammyOffset.left+5
        && ((isNaN(clammyLink) && isNaN(elementLink)) || (clammyLink!=elementLink))
        && $(element).attr("angle") == $(clammyId).attr("angle")) {

      clammy = true;
      elementOffset.top=clammyOffset.top-25;
      elementOffset.left=clammyOffset.left+50-25;

      deltaY = parseInt($("#element_"+mainY+"_"+mainX).css("top")) - elementOffset.top;
      deltaX = parseInt($("#element_"+mainY+"_"+mainX).css("left")) - elementOffset.left;

      $("#element_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);
      $("#pic_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);

      /* Linking for further movement by blocks */
      /* Если мы прилипаем к группе */
      if($(clammyId).attr("link")) {
        /* Если прилипаем группой к группе */
        if($("#element_"+mainY+"_"+mainX).attr("link")>0){
          var nlink = $(clammyId).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;

           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){

             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id){

               $(this)
                  .css("top",parseInt($(this).css("top"))-deltaY).css("left",parseInt($(this).css("left"))-deltaX);
               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
                  .css("top",parseInt($(this).css("top"))).css("left",parseInt($(this).css("left")));
             }
           });

        /* Если прилипаем кусочком к группе */
        } else {

          l = $(clammyId).attr("link");
          $("#element_"+mainY+"_"+mainX).attr({"link":l,"z-index":l});

          /* Назначаем прилипнувшей картинке z-index картинок в группе. В идеале он всегда должен быть нулевой. */
          $("#pic_"+mainY+"_"+mainX).css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
        }

      /* Слиплись 2 кусочка, каждый из которых - без группы */
      } else {

        if($("#element_"+mainY+"_"+mainX).attr("link")) {
          var nlink = $("#element_"+mainY+"_"+mainX).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;

           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){

             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id){
               $(this)
                  .css("top",parseInt($(this).css("top"))-deltaY).css("left",parseInt($(this).css("left"))-deltaX);
               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
                  .css("top",parseInt($(this).css("top"))).css("left",parseInt($(this).css("left")));
             }
           });

          $(clammyId).attr("link", nlink);
          $(clammyId).css("z-index", nlink);

        } else {
          $("#element_"+mainY+"_"+mainX).attr("link", link);
          $(clammyId).attr("link", link);
          $("#element_"+mainY+"_"+mainX).css("z-index", link);
          $(clammyId).css("z-index", link);

          /* Обнуляем z-index */
          $("#pic_"+mainY+"_"+mainX).css("z-index","0");
          $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index","0");
          $("#main_field").prepend($("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
          link++;
        }
      }
    }
  }

  /*TOP CLAMMY SIDE */

  switch(parseInt($("#element_"+mainY+"_"+mainX).attr("angle"))) {
    case 0: {
      clammyId = "#element_"+(parseInt(mainY)-1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)-1)+"_"+mainX;
      break;
    }
    case 90: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)+1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)+1);
      break;
    }
    case 180: {
      clammyId = "#element_"+(parseInt(mainY)+1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)+1)+"_"+mainX;
      break;
    }
    case 270: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)-1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)-1);
      break;
    }
  }
  /* console.log("ClammyId TOP:"+clammyId); */

  if(clammy == false && document.getElementById(clammyRawId)) {
    clammyOffset = $(clammyId).offset();
    clammyOffset.top=clammyOffset.top+0;
    clammyOffset.left=clammyOffset.left+0;

    clammyLink = parseInt($(clammyId).attr("link"));
    elementLink = parseInt($("#element_"+mainY+"_"+mainX).attr("link"));

    if( elementOffset.top-50 > clammyOffset.top-5 && elementOffset.top-50 < clammyOffset.top+5 &&
        elementOffset.left > clammyOffset.left-5 && elementOffset.left < clammyOffset.left+5
        && ((isNaN(clammyLink) && isNaN(elementLink)) || (clammyLink!=elementLink))
        && $(element).attr("angle") == $(clammyId).attr("angle")) {
      clammy = true;

      elementOffset.top=clammyOffset.top+50-25;

      elementOffset.left=clammyOffset.left-25;


      deltaY = parseInt($("#element_"+mainY+"_"+mainX).css("top")) - elementOffset.top;
      deltaX = parseInt($("#element_"+mainY+"_"+mainX).css("left")) - elementOffset.left;

      $("#element_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);
      $("#pic_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);

      /* Linking for further movement by blocks */

      if($(clammyId).attr("link")) {
        if($("#element_"+mainY+"_"+mainX).attr("link")>0){
          var nlink = $(clammyId).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;

           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){
             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id) {
               $(this).css("top",parseInt($(this).css("top"))-deltaY)
                 .css("left",parseInt($(this).css("left"))-deltaX);
               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
                  .css("top",parseInt($(this).css("top")))
                 .css("left",parseInt($(this).css("left")));
             }
           });
        } else {
          l = $(clammyId).attr("link");
          $("#element_"+mainY+"_"+mainX).attr("link", l).css("z-index", l);

          /* Назначаем прилипнувшей картинке z-index картинок в группе. В идеале он всегда должен быть нулевой. */
          $("#pic_"+mainY+"_"+mainX).css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
        }
      } else {
        if($("#element_"+mainY+"_"+mainX).attr("link")>0) {
          var nlink = $("#element_"+mainY+"_"+mainX).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;

           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){
             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id) {
               $(this).css("top",parseInt($(this).css("top"))-deltaY)
                 .css("left",parseInt($(this).css("left"))-deltaX);
               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
                  .css("top",parseInt($(this).css("top")))
                 .css("left",parseInt($(this).css("left")));
             }
           });

          $(clammyId).attr("link", nlink);
          $(clammyId).css("z-index", nlink);

        } else {
          $("#element_"+mainY+"_"+mainX).attr("link", link);
          $(clammyId).attr("link", link);
          $("#element_"+mainY+"_"+mainX).css("z-index", link);
          $(clammyId).css("z-index", link);

          /* Обнуляем z-index */
          $("#pic_"+mainY+"_"+mainX).css("z-index","0");
          $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index","0");
          $("#main_field").prepend($("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
        }
        link++;
      }
    }
  }

  /* RIGHT CLAMMY SIDE */

  switch(parseInt($("#element_"+mainY+"_"+mainX).attr("angle"))) {
    case 0: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)+1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)+1);
      break;
    }
    case 90: {
      clammyId = "#element_"+(parseInt(mainY)+1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)+1)+"_"+mainX;
      break;
    }
    case 180: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)-1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)-1);
      break;
    }
    case 270: {
      clammyId = "#element_"+(parseInt(mainY)-1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)-1)+"_"+mainX;
      break;
    }
  }
  /* console.log("ClammyId RIGHT:"+clammyId); */

  if(clammy == false && document.getElementById(clammyRawId)) {
    clammyOffset = $(clammyId).offset();
    clammyOffset.top=clammyOffset.top+0;
    clammyOffset.left=clammyOffset.left+0;

    clammyLink = parseInt($(clammyId).attr("link"));
    elementLink = parseInt($("#element_"+mainY+"_"+mainX).attr("link"));

    if( elementOffset.top > clammyOffset.top-5 && elementOffset.top < clammyOffset.top+5 &&
        elementOffset.left+50 > clammyOffset.left-5 && elementOffset.left+50 < clammyOffset.left+5
        && ((isNaN(clammyLink) && isNaN(elementLink)) || (clammyLink!=elementLink))
        && $(element).attr("angle") == $(clammyId).attr("angle")) {
      clammy = true;

        elementOffset.top=clammyOffset.top-25;
        elementOffset.left=clammyOffset.left-50-25;

      deltaY = parseInt($("#element_"+mainY+"_"+mainX).css("top")) - elementOffset.top;
      deltaX = parseInt($("#element_"+mainY+"_"+mainX).css("left")) - elementOffset.left;

      $("#element_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);
      $("#pic_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);

      /* Linking for further movement by blocks */

      if($(clammyId).attr("link")) {
        if($("#element_"+mainY+"_"+mainX).attr("link")>0){
          var nlink = $("#element_"+mainY+"_"+(parseInt(mainX)+1)).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;

           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){
             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id){

               $(this).css("top",parseInt($(this).css("top"))-deltaY)
                 .css("left",parseInt($(this).css("left"))-deltaX);

               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
      	         .css("top",parseInt($(this).css("top")))
                 .css("left",parseInt($(this).css("left")));
             }
           });
        } else {
          l = $(clammyId).attr("link");
          $("#element_"+mainY+"_"+mainX).attr("link", l).css("z-index", l);
          
          /* Назначаем прилипнувшей картинке z-index картинок в группе. В идеале он всегда должен быть нулевой. */
          $("#pic_"+mainY+"_"+mainX).css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
        }
      } else {
        if($("#element_"+mainY+"_"+mainX).attr("link")>0){
          var nlink = $("#element_"+mainY+"_"+mainX).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;

           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){
             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id){

               $(this).css("top",parseInt($(this).css("top"))-deltaY)
                 .css("left",parseInt($(this).css("left"))-deltaX);

               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
      	         .css("top",parseInt($(this).css("top")))
                 .css("left",parseInt($(this).css("left")));
             }
           });

          $(clammyId).attr("link", nlink);
          $(clammyId).css("z-index", nlink);
          
        } else {
          $("#element_"+mainY+"_"+mainX).attr("link", link);
          $(clammyId).attr("link", link);
          $("#element_"+mainY+"_"+mainX).css("z-index", link);
          $(clammyId).css("z-index", link);

          /* Обнуляем z-index */
          $("#pic_"+mainY+"_"+mainX).css("z-index","0");
          $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index","0");
          $("#main_field").prepend($("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
          link++;
        }
      }
    }
  }

  /* BOTTOM CLAMMY SIDE */

  switch(parseInt($("#element_"+mainY+"_"+mainX).attr("angle"))) {
    case 0: {
      clammyId = "#element_"+(parseInt(mainY)+1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)+1)+"_"+mainX;
      break;
    }
    case 90: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)-1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)-1);
      break;
    }
    case 180: {
      clammyId = "#element_"+(parseInt(mainY)-1)+"_"+mainX;
      clammyRawId = "element_"+(parseInt(mainY)-1)+"_"+mainX;
      break;
    }
    case 270: {
      clammyId = "#element_"+mainY+"_"+(parseInt(mainX)+1);
      clammyRawId = "element_"+mainY+"_"+(parseInt(mainX)+1);
      break;
    }
  }
  /* console.log("ClammyId BOTTOM:"+clammyId); */


  if(clammy == false && document.getElementById(clammyRawId)) {
    clammyOffset = $(clammyId).offset();
    clammyOffset.top=clammyOffset.top+0;
    clammyOffset.left=clammyOffset.left+0;


    clammyLink = parseInt($(clammyId).attr("link"));
    elementLink = parseInt($("#element_"+mainY+"_"+mainX).attr("link"));

    if( elementOffset.top+50 > clammyOffset.top-5 && elementOffset.top+50 < clammyOffset.top+5 &&
        elementOffset.left > clammyOffset.left-5 && elementOffset.left < clammyOffset.left+5
        && ((isNaN(clammyLink) && isNaN(elementLink)) || (clammyLink!=elementLink))
        && $(element).attr("angle") == $(clammyId).attr("angle")) {
      clammy = true;

      elementOffset.top=clammyOffset.top-50-25;
      elementOffset.left=clammyOffset.left-25;

      deltaY = parseInt($("#element_"+mainY+"_"+mainX).css("top")) - elementOffset.top;
      deltaX = parseInt($("#element_"+mainY+"_"+mainX).css("left")) - elementOffset.left;

      $("#element_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);
      $("#pic_"+mainY+"_"+mainX).css("top",elementOffset.top).css("left",elementOffset.left);

      /* Linking for further movement by blocks */


      if($(clammyId).attr("link")) {
        if($("#element_"+mainY+"_"+mainX).attr("link")>0){
          var nlink = $("#element_"+(parseInt(mainY)+1)+"_"+mainX).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;
           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){
             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id) {
               $(this).css("top",parseInt($(this).css("top"))-deltaY)
                 .css("left",parseInt($(this).css("left"))-deltaX);
               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
      	         .css("top",parseInt($(this).css("top")))
                 .css("left",parseInt($(this).css("left")));
             }
           });
        } else {
          l = $(clammyId).attr("link");
          $("#element_"+mainY+"_"+mainX).attr("link", l).css("z-index", l);
          
          /* Назначаем прилипнувшей картинке z-index картинок в группе. В идеале он всегда должен быть нулевой. */
          $("#pic_"+mainY+"_"+mainX).css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
        }
      } else {
        if($("#element_"+mainY+"_"+mainX).attr("link")>0){
          var nlink = $("#element_"+mainY+"_"+mainX).attr("link");
          var id = "element_"+mainY+"_"+mainX;
          linked = true;
           $("div[link='"+$("#element_"+mainY+"_"+mainX).attr("link")+"']").each(function(){
             $(this).attr("link",nlink);
             $(this).css("z-index",nlink);

             /* Назначаем z-index для картинок прилипающей группы. Такой же, как у той, к которой прилипают */
             $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
               .css("z-index", $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index"));
             $("#main_field").prepend($("#pic_"+$(this).attr("y")+"_"+$(this).attr("x")));

             if($(this).attr("id")!=id) {
               $(this).css("top",parseInt($(this).css("top"))-deltaY)
                 .css("left",parseInt($(this).css("left"))-deltaX);
               $("#pic_"+$(this).attr("y")+"_"+$(this).attr("x"))
      	         .css("top",parseInt($(this).css("top")))
                 .css("left",parseInt($(this).css("left")));
             }
           });
           
          $(clammyId).attr("link", nlink);
          $(clammyId).css("z-index", nlink);

        } else {
          $("#element_"+mainY+"_"+mainX).attr("link", link);
          $(clammyId).attr("link", link);
          $("#element_"+mainY+"_"+mainX).css("z-index", link);
          $(clammyId).css("z-index", link);

          /* Обнуляем z-index */
          $("#pic_"+mainY+"_"+mainX).css("z-index","0");
          $("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")).css("z-index","0");
          $("#main_field").prepend($("#pic_"+$(clammyId).attr("y")+"_"+$(clammyId).attr("x")));
          $("#main_field").prepend($("#pic_"+mainY+"_"+mainX));
          link++;
        }
      }
    }
  }

  /* Если перемещение - обычное перемещение, без прилипания - возвращаем кусочку картинки ее предыдущие значения */
  if(isNaN($(element).attr("link")) && clammy == false) {
    $("#main_field").append($("#pic_"+mainY+"_"+mainX));
  }
  
  if(parseInt($(element).attr("link")) > 0 && clammy == false && finalcheck == true) {
   finalcheck = false;
   $("div[link='"+$(element).attr("link")+"']").each(function(){
    if(linked == false) {
      checkPuzzle(this);
    }
   });
   finalcheck = true;
  }

  linked = false;
  if (finalcheck == true) {
    finalCheckPuzzle();
  }
}

  function finalCheckPuzzle() {
    var fieldOffset = $("#puzzle_field").offset();

    $("#element_0_0").offset();

    var error = false;
    var count = 0;
    var nulLink = document.getElementById("element_0_0").getAttribute("link");
    for(y=0; y<Y; y++) {
      for(x=0; x<X; x++) {
        lnk = parseInt(document.getElementById("element_"+y+"_"+x).getAttribute("link"));

        if(lnk > 0){
          if(lnk != nulLink) {
            error = true;
            break;
          } else {
            count++;
          }
        } else {
          error = true;
          break;
        }
      }

      if(error == true) {
        break;
      }
    }
    if (error == false) {
      $.post("/ajax/final/", {
        bind: $("#main_field").attr("bind"), 
        time: start_realtime},
        function(data){
          $("#main_field").css("padding","10px");
          $("#main_field").parent().html(data);
          $("#top_menu").remove();
          $("#bottom_menu").remove();
        });
    }
  }
    
    function SetBG(bgcolor,tablecolor,bordercolor) {
      $("body").css("background-color",bgcolor);
      $("#puzzle_field_table").css("background-color",tablecolor).css("border","1px solid "+bordercolor);
    }

    function startTimer() {
      timer_enabled = true;
      timed++
      $("#timer_button").html("<input type='button' value='Выключить таймер' style='width:180px;' onclick='stopTimer()' class='button'/>");
      time(timed);
    }

    function time(t) {
      if(timer_enabled == true && timed == t) {
        setTimeout("time("+t+")",1000);
        seconds++;
        var op_sec = seconds;
        var res_hours = parseInt(op_sec/3600);
        op_sec = op_sec - res_hours * 3600;
        var res_minutes = parseInt(op_sec/60);
        op_sec = op_sec - res_minutes * 60;
        if(res_hours < 10) {res_hours = "0"+res_hours;};
        if(res_minutes < 10) {res_minutes = "0"+res_minutes;};
        if(op_sec < 10) {op_sec = "0"+op_sec;};
        $("#timer").html(res_hours+":"+res_minutes+":"+op_sec);
      }
    }

    function stopTimer() {
      timer_enabled = false;
      timed++;
      $("#timer_button").html("<input type='button' value='Включить таймер' style='width:180px;' onclick='startTimer()' class='button'/>");
    }

    function ErrorBlock(error) {
        $("body").append("<div id='error' class='error'>"+error+"</div>");
        setTimeout("$('#error').remove()",4000);
    }

    function MessageBlock(message) {
        $("body").append("<div id='message' class='message'>"+message+"</div>");
        setTimeout("$('#message').remove()",4000);
    }

function save_cookie_name(pzl_id) {
    var n = '_s';
    n += enable_rotate ? 'r' : 'n';
    n += '_';
    n += pzl_id
    return n;
}
function savePuzzle(timer) {
    var idx = 0;
    var st = new Array();
    var pzl_id = parseInt($("#main_field").attr("uid"));
    if (! pzl_id) {
        // После завершения сборки - поля сборки уже нет.
        return;
    }
    $("div[id^='element']").each(function(){
        st[idx] = {
            top: $(this).css("top"),
            left: $(this).css("left"),
            x: $(this).attr("x"),
            y: $(this).attr("y"),
            link: $(this).attr("link") || 0,
            angle: parseInt($(this).attr("angle")),
            zIndex: parseInt($(this).css("z-index"))
        };
        idx++
    });
    var args = {
        id: pzl_id, 
        rotate: enable_rotate ? 'yes' : 'no',
        time:seconds, 
        cookie: '',
        data: $.toJSON(st)};
    if (is_nobody)
        args['cookie'] = $.cookie('saved_'+$("#main_field").attr("uid"));
    $.post("/ajax/save/", args, function(data){
        if(isNaN(parseInt(data))) {
            ErrorBlock("Не удалось сохранить ваш пазл.");
            return;
        } 
        data = parseInt(data);
        if (is_nobody) {
            var d = new Date();
            d.setTime(d.getTime() + (30 * 24 * 60 * 60 * 1000));
            d = {
                domain: HTTP_HOST, 
                path: '/', 
                expires: d};
            $.cookie('saved_'+ pzl_id, data, d); // deprecated
            $.cookie(save_cookie_name(pzl_id), data, d);
        }
        MessageBlock("Ваш пазл сохранен.");
        $("#load").html("<input type='button' value='Загрузить сохранение' style='width:260px;' onclick='loadSaved()' class='button'/>");
    });
    
    if (timer) {
        setTimeout("savePuzzle(1)", 600000);
    }
}

function loadSaved() {
    var pzl_id = parseInt($("#main_field").attr("uid")); 
    var args = {
        id: pzl_id,
        rotate: enable_rotate ? 'yes' : 'no',
        cookie: ''};
    if (is_nobody) {
        var cn, cv;
        cn = save_cookie_name(pzl_id);
        cv = $.cookie(cn);
        if (cv == null)
            cv = $.cookie('saved_'+ pzl_id); // deprecated
        args['cookie'] = cv;
    }

    $.post("/ajax/load/", args, function(data){
        var data = $.evalJSON(data);
        zIndex = data.zIndex;
        link = data.linkzIndex;

        if (data.time > 0) {
            seconds = data.time;
            timed++;
            stopTimer();
            var op_sec = seconds;
            $("#timer_button").html("<input type='button' value='Выключить таймер' style='width:180px' onclick='stopTimer()' class='button'/>");
            $("#timer").html(sec_to_hmsstr(seconds).join(':'));
            setTimeout("startTimer("+timed+")",1000);
        }
        $(data.data).each(function(){
            $("#element_"+this.data_y+"_"+this.data_x).css("top",this.data_top).css("left",this.data_left).css("z-index",this.data_zIndex).attr("angle", this.data_angle);
            $("#pic_"+this.data_y+"_"+this.data_x)
                .css("top",this.data_top)
                .css("left",this.data_left) // .css("z-index",this.data_zIndex) 
                .css('background','url('+chunk_prefix+this.data_y+"_"+this.data_x+"_"+this.data_angle+".png)");
            if(this.data_link > 0) {
                $("#element_"+this.data_y+"_"+this.data_x).attr("link",this.data_link);
                $("#main_field").prepend($("#pic_"+this.data_y+"_"+this.data_x));
            }
        });
        progress(0);
    });
    $("#load_button").blur();
    MessageBlock("Пазл успешно загружен.");
}

    function rotateBox(e) {
      if(e.keyCode==38 || e.keyCode==40 || e.keyCode==32){
        if(e.keyCode==38) {
          rotateClockWise(dragged);
        } else if(e.keyCode==32) {
          rotateClockWise(dragged);
        } else {
          rotateCounterClockWise(dragged);
        }
        return false;
      } else {
        return true;
      }
      return false;
    }

    function rotateClockWise(elem) {
      if(elem != null) {
        var angle = elem.getAttribute("angle");
        (angle == 270) ? angle = 0 : angle = parseInt(angle) + 90;
        var inX = elem.getAttribute("x");
        var inY = elem.getAttribute("y");
        var in_linkX = null;
        var in_linkY = null;
        var dX = null;
        var dY = null;

        // Changing source of rotated image under mouse poiner
        src = chunk_prefix+inY+"_"+inX+"_"+angle+".png";
        $("#pic_"+inY+"_"+inX)
          .css('background', 'url('+ src +')');

        // Changing source of rotated image in linked images;
        if($("#element_"+inY+"_"+inX).attr("link")) {
          $("div[link='"+$("#element_"+inY+"_"+inX).attr("link")+"']").each(function(){
            if(this.id != elem.id) {

              in_linkX = $(this).attr("x");
              in_linkY = $(this).attr("y");
              dX = inX - in_linkX;
              dY = inY - in_linkY;
              
              switch(angle){
                case 0: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dX*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dX*50) +"px");
                  break;
                }
                case 90: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dY*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dY*50) +"px");
                  break;
                }
                case 180: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dX*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dX*50) +"px");
                  break;
                }
                case 270: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dY*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dY*50) +"px");
                  break;
                }
              }

              src = chunk_prefix+in_linkY+"_"+in_linkX+"_"+angle+".png";
              $("#pic_"+in_linkY+"_"+in_linkX)
                .css('background','url('+ src +')');

              $(this).attr("angle", angle);

            }
          })
        }
        $(elem).attr("angle", angle);
      }
    }

    function rotateCounterClockWise(elem) {
      if(elem != null) {
        var angle = elem.getAttribute("angle");
        (angle == 0) ? angle = 270 : angle = parseInt(angle) - 90;
        var inX = elem.getAttribute("x");
        var inY = elem.getAttribute("y");
        var in_linkX = null;
        var in_linkY = null;
        var dX = null;
        var dY = null;

        // Changing source of rotated image under mouse poiner
        src = chunk_prefix+inY+"_"+inX+'_'+angle+'.png';
        $("#pic_"+inY+"_"+inX)
          .css('background','url('+ src +')');

        // Changing source of rotated image in linked images;
        if($("#element_"+inY+"_"+inX).attr("link")) {
          $("div[link='"+$("#element_"+inY+"_"+inX).attr("link")+"']").each(function(){
            if(this.id != elem.id) {

              in_linkX = $(this).attr("x");
              in_linkY = $(this).attr("y");
              dX = inX - in_linkX;
              dY = inY - in_linkY;
              
              switch(angle){
                case 0: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dX*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dX*50) +"px");
                  break;
                }
                case 90: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dY*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))-dY*50) +"px");
                  break;
                }
                case 180: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dX*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))+dY*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dX*50) +"px");
                  break;
                }
                case 270: {
                  $("#pic_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dY*50) +"px");
                  $("#element_"+in_linkY+"_"+in_linkX)
                    .css('top', (parseInt($("#pic_"+inY+"_"+inX).css("top"))-dX*50) +"px")
                    .css('left',(parseInt($("#pic_"+inY+"_"+inX).css("left"))+dY*50) +"px");
                  break;
                }
              }

              src = chunk_prefix+in_linkY+"_"+in_linkX+'_'+angle+'.png';
              $("#pic_"+in_linkY+"_"+in_linkX)
                .css('background','url(' + src +')');

              $(this).attr("angle", angle);

            }
          })
        }
        $(elem).attr("angle", angle);
      }
    }

function progress(timer) {
  var done = 0;
  if(parseInt($("#main_field").attr("uid")) > 0) {
    $("div[id^='element']").each(function(){

      if(parseInt($(this).attr("link"))>0) {
        k = parseInt($(this).attr("link"));
        v = parseInt($("#element_"+$(this).attr("y")+"_"+(parseInt($(this).attr("x"))-1)).attr("link"));
        if(v == k) {
            done++;
          }
        v = parseInt($("#element_"+$(this).attr("y")+"_"+(parseInt($(this).attr("x"))+1)).attr("link"));
        if(v == k) {
            done++;
          }
        v = parseInt($("#element_"+(parseInt($(this).attr("y"))+1)+"_"+$(this).attr("x")).attr("link"));
        if(v == k) {
            done++;
          }
        v = parseInt($("#element_"+(parseInt($(this).attr("y"))-1)+"_"+$(this).attr("x")).attr("link"));
        if(v == k) {
            done++;
          }
      };
      idx++
    });

    total = (X*Y*4)-(X*2+Y*2);
    perc = Math.round(100/total*done);
    $("#progressbar").progressBar(perc);
  }

  if(timer == 1) {
    setTimeout("progress(1)", 60000);
  }
}