$(document).ready(function() {	 
  viewAttr("szerokoscButton" , "szerokoscContent", 4);
  viewAttr("profilButton" , "profilContent", 4);
  viewAttr("rozmiarFelgiButton" , "rozmiarFelgiContent", 4);
  viewAttr("predkoscButton" , "predkoscContent", 4);
  viewAttr("nosnoscButton" , "nosnoscContent", 4);
  viewAttr("markaButton" , "markaContent", 4);
  viewAttr("serieButton" , "serieContent", 4);
  viewAttr("popularneButton" , "popularneContent", 4);
});

function viewAttrSize(rootButtonId, rootContentId)
{
  var sizeGroup = new Array();
  var sizeGroupFind = "";
  $("#" + rootContentId).find("label").each(function ( i , v ) {
    sizeGroup[i] = [];
    sizeGroup[i]['html'] = v;
    sizeGroup[i]['group'] = $(v).text().match(/([0-9])+([^\/])/)[0];
    if (sizeGroupFind.search(sizeGroup[i]['group']) == -1) {
      sizeGroupFind += sizeGroup[i]['group'] + ";";
    }
  });

  var count = 0;
  for (count = 0; count < sizeGroupFind.split(";").length - 1; count++) {
    $("#" + rootContentId).append("<div id=\"group" + sizeGroupFind.split(";")[count] + "\">" + sizeGroupFind.split(";")[count] + "/...</div>");
    $("#group" + sizeGroupFind.split(";")[count]).append("<div class=\"groupMore\" id=\"buttonGroup" + sizeGroupFind.split(";")[count] + "\">więcej</div>");
    $("#" + rootContentId).find("label").each(function( i , v ) {
      if ($(v).text().match(/([0-9])+([^\/])/)[0] == sizeGroupFind.split(";")[count]) {
        $("#group" + sizeGroupFind.split(";")[count]).append(v);
      }
    });
    viewAttrSizeLayer("buttonGroup" + sizeGroupFind.split(";")[count], "group" + sizeGroupFind.split(";")[count], 10);
  }

}

/**
 * @param rootButtonId
 * @param rootContentId
 */
function viewAttr(rootButtonId, rootContentId, argColRange)
{
	if (argColRange < $("#" + rootContentId).find("input").size()) {
  // Zmienna przechowuje id warstwy;
  var frameId = "frame" + rootContentId;

  // checkboxy które będą na warstwie;
  var outherGroup = new Array();

  // checkboxy na głównej warstwie;
  var rootGroup = new Array();

  var moveGroup = new Array();

  var rootGroupRange = argColRange;

  var colRange = argColRange;
  // Tworzenie warstwy;
  $("#" + rootContentId).append("<div class=\"ui-frame\" id=\"" + frameId + "\"></div>");
  $("#" + frameId).append("<div class=\"ui-frame-content\"></div>");
  $("#" + frameId).append("<div class=\"ui-frame-close\">x</div>");
  $("#" + frameId).append("<div class=\"ui-frame-menu\"></div>");
  $("#" + frameId).find(".ui-frame-menu").append("<div class=\"ui-frame-menu-deselect\">Odznacz wszystko</div>");
  $("#" + frameId).find(".ui-frame-menu").append("<div class=\"ui-frame-menu-accept\">Akceptuj</div>");
  $("#" + frameId).hide();
  // Pokazuję warstę z checkboxami;
  $("#" + rootButtonId).click(function () {
    $(".ui-frame").hide();
    var count_i;
    var count_j;
    for (count_i = 0; count_i < rootGroup.length; count_i++) {
      for (count_j = 0; count_j < outherGroup.length; count_j++)
        if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
          if (rootGroup[count_i]['input'].attr("checked") == true) {
            outherGroup[count_j]['status'] = true;
            outherGroup[count_j]['input'].attr("checked", "true");
          } else {
            outherGroup[count_j]['status'] = false;
            outherGroup[count_j]['input'].attr("checked", "");
          }
        }
    }

    var checkedLength = 0;
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        checkedLength++;
      }
    }
    if (checkedLength > rootGroupRange) {
      for (var i = 0; i < outherGroup.length; i++) {
        if ($(outherGroup[i]["input"]).attr("checked") == false) {
          $(outherGroup[i]["input"]).attr("disabled", "disabled");
        }
      }
    } else {
      for (var i = 0; i < outherGroup.length; i++) {
        $(outherGroup[i]["input"]).attr("disabled", "");
      }
    }
    $("#" + frameId).show();
  });

  // Anuluje wybór, ukrywa warstwę
  $("#" + frameId).find(".ui-frame-close").click(function () {
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") != outherGroup[i]["status"]) {
        if ($(outherGroup[i]["input"]).attr("checked") == true) {
          $(outherGroup[i]["input"]).attr("checked", "");
        } else {
          $(outherGroup[i]["input"]).attr("checked", "true");
        }
      }
    }
    $("#" + frameId).hide();
  });

  // Odznacza wszystkie pola
  $("#" + frameId).find(".ui-frame-menu-deselect").click(function () {
    $("#" + frameId).find(".ui-frame-content").find("input").each(function ( i , v ) {
      $(v).attr("checked", "");
    });
    var checkedLength = 0;
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        checkedLength++;
      }
    }
    if (checkedLength > rootGroupRange) {
      for (var i = 0; i < outherGroup.length; i++) {
        if ($(outherGroup[i]["input"]).attr("checked") == false) {
          $(outherGroup[i]["input"]).attr("disabled", "disabled");
        }
      }
    } else {
      for (var i = 0; i < outherGroup.length; i++) {
        $(outherGroup[i]["input"]).attr("disabled", "");
      }
    }
  });

  // Akceptuje wybór, ukrywa warstwę
  $("#" + frameId).find(".ui-frame-menu-accept").click(function () {
    moveGroup = new Array();
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        $(outherGroup[i]["input"]).attr("checked", "true");
        outherGroup[i]["status"] = true;
      } else {
        $(outherGroup[i]["input"]).attr("checked", "");
        outherGroup[i]["status"] = false;
      }
    }

    var zmiana = false;
    for (var j = 0; j < outherGroup.length; j++) {
      if (outherGroup[j]['status'] == true) {
        zmiana = true;
      }
    }

    if (zmiana == true) {
      $("#" + rootContentId + " > label").remove();
      rootGroup = new Array();
      for (var i = 0; i < outherGroup.length; i++) {
        if (outherGroup[i]['status'] == true) {
          $(outherGroup[i]['label']).clone().appendTo("#" + rootContentId);
        }
      }

      // Przypisanie grupy checkboxow;
      $("#" + rootContentId + "> label").each(function ( i , v ) {
        rootGroup[i] = [];
        rootGroup[i]['label'] = $(v);
        rootGroup[i]['input'] = $(v).find("input");
        rootGroup[i]['status'] = $(v).find("input").attr("checked");
      });
    }

    var count_i;
    var count_j;
    for (var count_i = 0; count_i < rootGroup.length; count_i++) {
      for (var count_j = 0; count_j < outherGroup.length; count_j++) {
        if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
          if (outherGroup[count_j]['input'].attr("checked") == true) {
            rootGroup[count_i]['status'] = true;
            rootGroup[count_i]['input'].attr("checked", "true");
            moveGroup.push(outherGroup[count_j]['label']);
          } else {
            rootGroup[count_i]['status'] = false;
            rootGroup[count_i]['input'].attr("checked", "");
          }
        }
      }
    }
    var count;
    for (count = 0; i < moveGroup.length; count++) {
      $("#" + rootContentId).append($(moveGroup[count]));
    }
    
    $("#" + rootContentId + "> label").click(function () {
      var count_i;
      var count_j;
      for (count_i = 0; count_i < rootGroup.length; count_i++) {
        for (count_j = 0; count_j < outherGroup.length; count_j++)
          if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
            if (rootGroup[count_i]['input'].attr("checked") == true) {
              outherGroup[count_j]['status'] = true;
              outherGroup[count_j]['input'].attr("checked", "true");
              //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
            } else {
              outherGroup[count_j]['status'] = false;
              outherGroup[count_j]['input'].attr("checked", "");
              //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
            }
          }
      }
    });
    
    $("#" + frameId).hide();
  });

  // Ilość pozycjy w kolumnie;
  if ($("#" + rootContentId).find("label").size() > (colRange * 5)) {
    colRange = Math.round($("#" + rootContentId).find("label").size() / 5) + 1;
  }
  
  var colRangeLengt = colRange;
  var colLength = 1;
  // Przypisanie grupy checkboxow;
  $("#" + rootContentId).find("label").each(function ( i , v ) {
    var _text = $(v).text();
	var _html = $(v).html();
	var _length = new String($.trim($(v).text())).length;
	if (_length > 22) {
		$(v).html(new RegExp(/(\<.*?\>)/).exec($(v).html())[1] + $(v).text().replace(_text.substring(21, _length+1), '...'));
	}
	
    outherGroup[i] = [];
    outherGroup[i]['label'] = $(v);
    outherGroup[i]['input'] = $(v).find("input");
    outherGroup[i]['status'] = $(v).find("input").attr("checked");
    if (colRangeLengt == colRange) {
      colRangeLengt = 1;
      $("#" + frameId).find(".ui-frame-content").append("<div></div>");
      $("#" + frameId).find(".ui-frame-content").css({
        width: 200 * colLength++
      });
    } else {
      colRangeLengt++;
    }

    $("#" + frameId + " > .ui-frame-content > div:last-child").append($(outherGroup[i]['label']));

    if (i <= rootGroupRange) {
      $(outherGroup[i]['label']).clone().appendTo("#" + rootContentId);
    }
  });

  // Przypisanie grupy checkboxow;
  $("#" + rootContentId + "> label").each(function ( i , v ) {
    rootGroup[i] = [];
    rootGroup[i]['label'] = $(v);
    rootGroup[i]['input'] = $(v).find("input");
    rootGroup[i]['status'] = $(v).find("input").attr("checked");
  });

  $("#" + frameId).find("input").click(function () {
    var checkedLength = 0;
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        checkedLength++;
      }
    }
    if (checkedLength > rootGroupRange) {
      for (var i = 0; i < outherGroup.length; i++) {
        if ($(outherGroup[i]["input"]).attr("checked") == false) {
          $(outherGroup[i]["input"]).attr("disabled", "disabled");
        }
      }
    } else {
      for (var i = 0; i < outherGroup.length; i++) {
        $(outherGroup[i]["input"]).attr("disabled", "");
      }
    }
  });
  
  $("#" + rootContentId + "> label").click(function () {
    var count_i;
    var count_j;
    for (count_i = 0; count_i < rootGroup.length; count_i++) {
      for (count_j = 0; count_j < outherGroup.length; count_j++)
        if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
          if (rootGroup[count_i]['input'].attr("checked") == true) {
            outherGroup[count_j]['status'] = true;
            outherGroup[count_j]['input'].attr("checked", "true");
            //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
          } else {
            outherGroup[count_j]['status'] = false;
            outherGroup[count_j]['input'].attr("checked", "");
            //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
          }
        }
    }
  });
	} else {
    $("#" + rootButtonId).hide();	
	}
}

function viewAttrSizeLayer(rootButtonId, rootContentId, argColRange)
{
  
  // Zmienna przechowuje id warstwy;
  var frameId = "frame" + rootContentId;

  // checkboxy które będą na warstwie;
  var outherGroup = new Array();

  // checkboxy na głównej warstwie;
  var rootGroup = new Array();

  var moveGroup = new Array();

  var rootGroupRange = 5;

  var colRange = argColRange;
  // Tworzenie warstwy;
  $("#" + rootContentId).append("<div class=\"ui-frame\" id=\"" + frameId + "\"></div>");
  $("#" + frameId).append("<div class=\"ui-frame-content\"></div>");
  $("#" + frameId).append("<div class=\"ui-frame-close\">x</div>");
  $("#" + frameId).append("<div class=\"ui-frame-menu\"></div>");
  $("#" + frameId).find(".ui-frame-menu").append("<div class=\"ui-frame-menu-deselect\">Odznacz wszystko</div>");
  $("#" + frameId).find(".ui-frame-menu").append("<div class=\"ui-frame-menu-accept\">Akceptuj</div>");
  $("#" + frameId).hide();

  // Pokazuję warstę z checkboxami;
  $("#" + rootButtonId).click(function () {
    $(".ui-frame").hide();
    var count_i;
    var count_j;
    for (count_i = 0; count_i < rootGroup.length; count_i++) {
      for (count_j = 0; count_j < outherGroup.length; count_j++)
        if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
          if (rootGroup[count_i]['input'].attr("checked") == true) {
            outherGroup[count_j]['status'] = true;
            outherGroup[count_j]['input'].attr("checked", "true");
          } else {
            outherGroup[count_j]['status'] = false;
            outherGroup[count_j]['input'].attr("checked", "");
          }
        }
    }

    var checkedLength = 0;
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        checkedLength++;
      }
    }
    if (checkedLength > rootGroupRange) {
      for (var i = 0; i < outherGroup.length; i++) {
        if ($(outherGroup[i]["input"]).attr("checked") == false) {
          $(outherGroup[i]["input"]).attr("disabled", "disabled");
        }
      }
    } else {
      for (var i = 0; i < outherGroup.length; i++) {
        $(outherGroup[i]["input"]).attr("disabled", "");
      }
    }
    $("#" + frameId).show();
  });

  // Anuluje wybór, ukrywa warstwę
  $("#" + frameId).find(".ui-frame-close").click(function () {
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") != outherGroup[i]["status"]) {
        if ($(outherGroup[i]["input"]).attr("checked") == true) {
          $(outherGroup[i]["input"]).attr("checked", "");
        } else {
          $(outherGroup[i]["input"]).attr("checked", "true");
        }
      }
    }
    $("#" + frameId).hide();
  });

  // Odznacza wszystkie pola
  $("#" + frameId).find(".ui-frame-menu-deselect").click(function () {
    $("#" + frameId).find(".ui-frame-content").find("input").each(function ( i , v ) {
      $(v).attr("checked", "");
    });
    var checkedLength = 0;
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        checkedLength++;
      }
    }
    if (checkedLength > rootGroupRange) {
      for (var i = 0; i < outherGroup.length; i++) {
        if ($(outherGroup[i]["input"]).attr("checked") == false) {
          $(outherGroup[i]["input"]).attr("disabled", "disabled");
        }
      }
    } else {
      for (var i = 0; i < outherGroup.length; i++) {
        $(outherGroup[i]["input"]).attr("disabled", "");
      }
    }
  });

  // Akceptuje wybór, ukrywa warstwę
  $("#" + frameId).find(".ui-frame-menu-accept").click(function () {
    moveGroup = new Array();
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        $(outherGroup[i]["input"]).attr("checked", "true");
        outherGroup[i]["status"] = true;
      } else {
        $(outherGroup[i]["input"]).attr("checked", "");
        outherGroup[i]["status"] = false;
      }
    }

    var zmiana = false;
    for (var j = 0; j < outherGroup.length; j++) {
      if (outherGroup[j]['status'] == true) {
        zmiana = true;
      }
    }

    if (zmiana == true) {
      $("#" + rootContentId + " > label").remove();
      rootGroup = new Array();
      for (var i = 0; i < outherGroup.length; i++) {
        if (outherGroup[i]['status'] == true) {
          $(outherGroup[i]['label']).clone().appendTo("#" + rootContentId);
        }
      }

      // Przypisanie grupy checkboxow;
      $("#" + rootContentId + "> label").each(function ( i , v ) {
        rootGroup[i] = [];
        rootGroup[i]['label'] = $(v);
        rootGroup[i]['input'] = $(v).find("input");
        rootGroup[i]['status'] = $(v).find("input").attr("checked");
      });
    }

    var count_i;
    var count_j;
    for (var count_i = 0; count_i < rootGroup.length; count_i++) {
      for (var count_j = 0; count_j < outherGroup.length; count_j++) {
        if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
          if (outherGroup[count_j]['input'].attr("checked") == true) {
            rootGroup[count_i]['status'] = true;
            rootGroup[count_i]['input'].attr("checked", "true");
            moveGroup.push(outherGroup[count_j]['label']);
          } else {
            rootGroup[count_i]['status'] = false;
            rootGroup[count_i]['input'].attr("checked", "");
          }
        }
      }
    }
    var count;
    for (count = 0; i < moveGroup.length; count++) {
      $("#" + rootContentId).append($(moveGroup[count]));
    }
    
    $("#" + rootContentId + "> label").click(function () {
      var count_i;
      var count_j;
      for (count_i = 0; count_i < rootGroup.length; count_i++) {
        for (count_j = 0; count_j < outherGroup.length; count_j++)
          if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
            if (rootGroup[count_i]['input'].attr("checked") == true) {
              outherGroup[count_j]['status'] = true;
              outherGroup[count_j]['input'].attr("checked", "true");
              //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
            } else {
              outherGroup[count_j]['status'] = false;
              outherGroup[count_j]['input'].attr("checked", "");
              //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
            }
          }
      }
    });
    
    $("#" + frameId).hide();
  });

  
  var colRangeLengt = colRange;
  var colLength = 1;
  // Przypisanie grupy checkboxow;
  $("#" + rootContentId).find("label").each(function ( i , v ) {
    $(v).attr("title", $(v).text());
    if ($(v).text().length > 22) {
      var text = new String($(v).text());
      $(v).html($(v).html().replace(text.substring(22, $(v).text().length), "..."));
    }
    outherGroup[i] = [];
    outherGroup[i]['label'] = $(v);
    outherGroup[i]['input'] = $(v).find("input");
    outherGroup[i]['status'] = $(v).find("input").attr("checked");
    if (colRangeLengt == colRange) {
      colRangeLengt = 1;
      $("#" + frameId).find(".ui-frame-content").append("<div></div>");
      $("#" + frameId).find(".ui-frame-content").css({
        width: 200 * colLength++
      });
    } else {
      colRangeLengt++;
    }

    $("#" + frameId + " > .ui-frame-content > div:last-child").append($(outherGroup[i]['label']));

  });
  
  for (var i = 0; i < outherGroup.length; i++) {
    if (outherGroup[i]['status'] == true) {
      $(outherGroup[i]['label']).clone().appendTo("#" + rootContentId);
    }
  }


  // Przypisanie grupy checkboxow;
  $("#" + rootContentId + "> label").each(function ( i , v ) {
  rootGroup[i] = [];
  rootGroup[i]['label'] = $(v);
  rootGroup[i]['input'] = $(v).find("input");
  rootGroup[i]['status'] = $(v).find("input").attr("checked");
  });

  $("#" + frameId).find("input").click(function () {
    var checkedLength = 0;
    for (var i = 0; i < outherGroup.length; i++) {
      if ($(outherGroup[i]["input"]).attr("checked") == true) {
        checkedLength++;
      }
    }
    if (checkedLength > rootGroupRange) {
      for (var i = 0; i < outherGroup.length; i++) {
        if ($(outherGroup[i]["input"]).attr("checked") == false) {
          $(outherGroup[i]["input"]).attr("disabled", "disabled");
        }
      }
    } else {
      for (var i = 0; i < outherGroup.length; i++) {
        $(outherGroup[i]["input"]).attr("disabled", "");
      }
    }
  });
  
  $("#" + rootContentId + "> label").click(function () {
    var count_i;
    var count_j;
    for (count_i = 0; count_i < rootGroup.length; count_i++) {
      for (count_j = 0; count_j < outherGroup.length; count_j++)
        if ($(outherGroup[count_j]['label']).attr("title") == $(rootGroup[count_i]['label']).attr("title")) {
          if (rootGroup[count_i]['input'].attr("checked") == true) {
            outherGroup[count_j]['status'] = true;
            outherGroup[count_j]['input'].attr("checked", "true");
            //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
          } else {
            outherGroup[count_j]['status'] = false;
            outherGroup[count_j]['input'].attr("checked", "");
            //alert($(rootGroup[count_i]['label']).attr("title") + ": " + rootGroup[count_i]['input'].attr("checked") + " ... " + $(outherGroup[count_j]['label']).attr("title") +": "+ outherGroup[count_j]['input'].attr("checked"));
          }
        }
    }
  });
  
}

function clear(arg) {
	return arg.replace("\.", "_").replace("\/", "_").replace(" ", "");
}

function priceRange() {
	$("#price-range").slider({
		range: true,
		min: parseInt($("#priceMinHidden").val()),
		max: parseInt($("#priceMaxHidden").val()),
		values: [parseInt($("#priceMinShow").val()), parseInt($("#priceMaxShow").val())],
		animate: true,
		slide: function(event, ui) {
			$("#priceMinShow").val(ui.values[0]);
			$("#priceMaxShow").val(ui.values[1]);
		}
	});	
}