// benodigde variabelen
var dursySettings = {
  canvas: null,
  jTabelId: null,
  tblPrefix: "tbl_",
  xmlHttp: false
};

///
/// selecteren product
///
function selecteerProduct(strFrm, iProductID) {
  //window.location = window.location + iProductID + "/";
  var oFrm = document.getElementById(strFrm);
  if (oFrm != undefined) {
      if (oFrm['intProductID'] != undefined) {
          oFrm['intProductID'].value = iProductID;
          oFrm.submit();
      }
      else {
          alert("oFrm['intProductID'] is undefined!");
      }
  }
  else {
      alert(strFrm + ' is undefined!');
  }
}

///
/// Print een product
///
function printProduct(strProductDetailUrl, iProductID) {

  alert(strProductDetailUrl);
  var popup = window.open(strProductDetailUrl + "?print=true", "Product printen", "width=800,height=600,resizable=yes,scrollbars=yes,toolbar=no,menubar=no").focus();

  debugger;  
  return false;

}

///
/// bestel product 
///
function bestelProduct(strFrm, iProductID, blnMeebestellen) {
    var oFrm = document.getElementById(strFrm);
    if (oFrm != undefined) {
      
      if (blnMeebestellen) {
        $(oFrm).append("<input type=\"hidden\" name=\"meebestellen\" value=\"" + blnMeebestellen + "\" />");
      }
      
      oFrm['intProductID'].value = iProductID;
      oFrm['strActie'].value = 'winkelwagen-toevoegen';
      
      oFrm.submit();
      
    }
    else {
        alert(strFrm + ' is undefined!');
    }
    return false;
}

///
/// check checkbox + submit form
function checkCheckbox(strFrm, strCheckbox) {
	var oChkbox = document.getElementById(strCheckbox);
	if (oChkbox != undefined) {
		if (oChkbox.checked == true) {
			oChkbox.checked = false;
			return false;
		}
		else {
			oChkbox.checked = true;
			return verstuurFormulier(strFrm);
		}
	}
}

///
/// versturen formulier
///
function verstuurFormulier(strFrm) {
    var oFrm = document.getElementById(strFrm);
    if (oFrm != undefined) {
        oFrm.submit();
    }
    else {
        alert(strFrm + ' is undefined!');
    }
    return false;
  }

///
/// productomschrijving op kaartjes
///
function initProductDescriptions() {

  var productkaartjes = $(".productkaart, .productkaart-medicijnen");
  productkaartjes.each(function (index) {

  	var kaartje = $(this);

  	if (kaartje.hasClass("productkaart-medicijnen")) {
  		var descriptionContainer = $(".productkaart-medicijnen-omschrijving", kaartje);
  	}
  	else {
  		var descriptionContainer = $(".productkaart-omschrijving", kaartje);
  	}

  	var headerLink = $("a[id$='linkProductNaamKort']", kaartje);
  	var descriptionLink = $("a[id$='linkProductOmschrijving']", descriptionContainer);

  	var descriptionOverlay = $("<div style=\"display:none;\" class=\"productkaart-omschrijving-overlay\"></div>");
  	descriptionOverlay.append(headerLink.clone());

  	var description = $("<a>" + descriptionLink.attr("title") + "</a>");
  	description.attr("href", descriptionLink.attr("href"));

  	//console.log(descriptionOverlay.html());

  	descriptionOverlay.append(description);
  	//console.log(description.html());
  	description.wrap("<p></p>");

  	descriptionOverlay.wrap("<a href=''></a>")

  	//console.log(descriptionOverlay.html());

  	kaartje.find("dl").before(descriptionOverlay);

  	descriptionLink.bind('mouseenter',
      function () {

      	$(".productkaart-omschrijving-overlay").hide();
      	descriptionOverlay.show();

      	return false;

      });

  	kaartje.bind('mouseleave',
      function () {

      	$(".productkaart-omschrijving-overlay").hide();
      	descriptionOverlay.show();

      	return false;

      },
      function () {

      	descriptionOverlay.hide();

      	return false;

      }
    );

  });
  
}

///
/// Maken Product Bevat Container
///
function initShortlists() 
{
  // alle listitems ophalen
  var listItems = null;
  var maxItems = 6;

  var containers = $("div.productdetail-medicijnen-specificaties-content");

  containers.each(function(i) {

    listItems = null;
    var productBevatContainer = $(this);

    listItems = $("ul li", productBevatContainer);
    if (listItems.length > maxItems) {

      // popup aanmaken (als js fout is, wordt hele lijst getoond)
      var popupListContainer = $("<div style=\"display:none;\" class=\"productdetail-productbevat-popup\"></div>");
      var popupListContainerHeader = productBevatContainer.prev(".productdetail-medicijnen-specificaties-kop").clone();
      var popupList = $("<ul></ul>");

      var scroll = productBevatContainer.position();
     
      // open popup link toevoegen
      var popupOpen = $("<a href=\"#openProductBevat\">Meer...</a>");
      popupOpen.wrap("<li class=\"meer\"></li>");
      popupOpen.bind('click', function(e) {

        $(".productdetail-productbevat-popup").hide();

        var pos = productBevatContainer.offset();
        popupListContainer
              .show(300)
              .css("top", scroll.top - 30);

        if (popupListContainer.parent().hasClass("meerinfo-blok")) {
          popupListContainer
              .css("right", 550);
        }

        return false;
      });

      // sluit popup link toevoegen
      var popupClose = $("<a class=\"bestelpopup-button-sluiten\" href=\"#sluitProductBevat\">sluiten</a>");
      popupClose.bind('click', function() {

        popupListContainer.hide(300);

        return false;

      });

      listItems.each(function(index) {

        var curItem = $(this);

        // items aan popup toevoegen
        popupList.append(curItem.clone(true));

        if (index > maxItems) {
          curItem.remove();
        }

      });

      // toevoegen op pagina
      popupListContainer
          .append(popupClose)
          .append(popupListContainerHeader)
          .append(popupList);

      productBevatContainer
          .after(popupListContainer)
          .find("ul")
              .append(popupOpen.parent());
    }
  });
}

var timerIDKenmerkTimeout = null;
//function showKenmerkenTimeout(event, element, iVariatieGroepNr, timeoutMs) {
//	var mousePosition = {'x':0,'y':0};
//	if (timerIDKenmerkTimeout!=null) {
//		clearTimeout(timerIDKenmerkTimeout);
//		timerIDKenmerkTimeout = null;
//	}
//	if (event.pageY != null) {
//		mousePosition.x = event.pageX;
//		mousePosition.y = event.pageY;
//	}
//	else { // IE
//		mousePosition.x = event.screenX;
//		mousePosition.y = event.screenY + window.document.documentElement.scrollTop;
//	}
//	timerIDKenmerkTimeout = setTimeout(function () {
//		showKenmerken(element, iVariatieGroepNr, true, mousePosition)
//		}, timeoutMs);
//}

/// <summary>
/// Toont de kenmerkentabel van het gegeven variatiegroepnummer.
/// Als deze al is geopend wordt hij gesloten en als hij al in eens geopend is
/// wordt hij uit de cache getrokken.
/// </summary>
/// <param name="element">Het object van de link die geklikt is</param>
/// <param name="iVariatieGroepNr">Het variatiegroepnummer waaraan de tabel gekoppeld is</param>
function showKenmerken(element, iVariatieGroepNr, showOnMousePosition, mousePosition) 
{
  var curTabelId = dursySettings.tblPrefix + iVariatieGroepNr;

  var el = $(element);
  if (dursySettings.canvas == null) {
    dursySettings.canvas = $(".canvas");
  }

  // link al geopend?
  if (dursySettings.jTabelId == curTabelId) {

    // tabel sluiten & verwijderen
    var tabel = $("#" + curTabelId);
    verwijder_tabel(tabel);
    
  }
  else {

    // bestaat al in cache?
    var tabel = dursySettings.canvas.data(curTabelId);
    if (tabel != undefined && tabel != null) 
    {
    	toonTabel(el, tabel, iVariatieGroepNr, showOnMousePosition, mousePosition);
    }
    else 
    {
      // haal nieuwe op
      $.ajax({
        type: "POST",
        url: "/Core/Handlers/autocomplete.asmx/GetKenmerkenPopup",
        data: "{ 'iVariatieGroepNr': '" + iVariatieGroepNr + "' }",
        contentType: "application/json; charset=utf-8",
        dataType: 'json',
        error: ajax_error_handler,
        success: function(msg)
        {
          var data;
          if (msg.hasOwnProperty('d'))
            data = msg.d;
          else
            data = msg;

          toonTabel(el, data, iVariatieGroepNr, showOnMousePosition, mousePosition);
          dursySettings.canvas.data(dursySettings.jTabelId, data);
        }
      });     // einde ajax request

    } // einde niet in cache

  } // einde niet geopend

}

/// <summary>
/// Toont een kenmerkentabel aan de hand van de HTML, en positioneerd deze aan de hand van
/// de link die geklikt is (jEl).
/// </summary>
///</returns>De ID die gegeven is aan de tabel</returns>
/// <param name="jEl">Het jQuery encapsulated object van de link die geklikt is</param>
/// <param name="htmlTabel">De string met HTMl die ge-insert moet worden</param>
/// <param name="iVariatieGroepNr">Het variatiegroepnummer waaraan de tabel gekoppeld is</param>
var autoHideTimeoutID = -1;
function toonTabel(jEl, data, iVariatieGroepNr, showOnMousePosition, mousePosition) {

  var jTabel = $(data);
  var jTabelId = dursySettings.tblPrefix + iVariatieGroepNr;

  // alle andere tabellen verwijderen
  $(".wp_kenmerkentabel").remove();

  var jProductkaart = $(jEl).parents(".productkaart");
  if (jProductkaart.parent().hasClass("stramien-item")) {
    jProductkaart = jProductkaart.parent();
  }
  dursySettings.canvas.append(jTabel);

  // bereken nieuwe positie
  var cssValues = berekenTabelPositie(jTabel, jProductkaart, showOnMousePosition, mousePosition);
  
  // tabel tonen op juiste positie
  jTabel
    .css(cssValues)
    .slideDown(400)
		.bind("mouseenter", function () { clearTimeout(autoHideTimeoutID); })
  //automatisch verbergen als je met de muis uit de popup gaat
		.bind("mouseleave", function () { verwijder_tabel(jTabel); })
  // zorgen dat de tabel ook gesloten kan worden
    .find(".kenmerkentabel_sluiten").bind('click', function () {

    	verwijder_tabel(jTabel);

    }).end()

  // automatisch verbergen popup.
  autoHideTimeoutID = setTimeout(function () { verwijder_tabel(jTabel); jTabel = null }, 3000);
  dursySettings.jTabelId = jTabelId;
}

/// <summary>
/// Sluit een reeds geopende tabel
/// </summary>
/// <param name="jTabel">De tabel die is geopend</param>
function verwijder_tabel(jTabel)
{
  jTabel.slideUp(400, function()
  {
    jTabel.remove();
    dursySettings.jTabelId = null;
  });
}

/// <summary>
/// Berekent de nieuwe positie waarop de tabel getoond moet worden
/// </summary>
/// <returns>De css waardes top, left/right voor de tabel</returns>
/// <param name="jTabel">De betreffende tabel</param>
/// <param name="jProductkaart">Het productkaartje behorend bij de tabel</param>
function berekenTabelPositie(jTabel, jProductkaart, showOnMousePosition, mousePosition)
{
  var tableWidth = jTabel.outerWidth();
  var sidebar = $(".contentcontainer .linkerkolom").outerWidth() + 8;
  var kaartjePosition = jProductkaart.position();
  var canvasWidth = dursySettings.canvas.outerWidth();
  var kaartjeWidth = jProductkaart.outerWidth();
  var kaartjeOffsetLeft = kaartjePosition.left + sidebar;
  var kaartjeOffsetRight = canvasWidth - (kaartjeOffsetLeft + kaartjeWidth);
  
	var css = null;
	if (showOnMousePosition == true) {
		//log(window.event);
		//log(mouseEvent);
		//log(kaartjePosition);
		//alert(mouseEvent);
		css = {
			'top': (mousePosition.y), // + kaartjePosition.top,
			'left': undefined,
			'right':undefined
		};
		//kaartjeWidth = mouseEvent.x ? mouseEvent.pageX : mouseEvent.clientX;
	}else{

		css = {
			'top': (255 + 135) + kaartjePosition.top, // kaartje = 255 hoog, header = 135 hoog
			'left': undefined,
			'right': undefined
		};
	}
	
	if (kaartjeOffsetRight > tableWidth) {

		// kaartje past
		css.left = kaartjeOffsetLeft + kaartjeWidth;

	}
	else {

		if ((kaartjeOffsetLeft + kaartjeWidth) > tableWidth) {

			// kaartje past
			css.right = 10;

		}
		else {

			if (kaartjeOffsetLeft > kaartjeOffsetRight) {

				//naar rechts uitlijnen
				var offsetPlusTable = (kaartjeOffsetRight + kaartjeOffsetRight) + tableWidth;
				if (offsetPlusTable > canvasWidth) {
					css.right = 10;
				}
				else {
					css.right = -kaartjeOffsetRight;
				}

			} else {

				//naar links
				//naar rechts uitlijnen
				var offsetPlusTable = (kaartjeOffsetRight + kaartjeOffsetRight) + tableWidth;
				if (offsetPlusTable > canvasWidth) {
					css.right = 10;
				}
				else {
					css.right = -kaartjeOffsetLeft;
				}
			}
		}
	}
  
  return css;
}

/// <summary>
/// Originele toon kenmerkentabel
/// Toont de kenmerkentabel van het gegeven variatiegroepnummer.
/// Wordt niet gebruikt als xmlHttp = true
/// </summary>
/// <param name="element">Het object van de link die geklikt is</param>
/// <param name="iVariatieGroepNr">Het variatiegroepnummer waaraan de tabel gekoppeld is</param>
function default_showKenmerken(element, iVariatieGroepNr) {

  var el = $(element);
  var table = $('#' + iVariatieGroepNr + '.wp_kenmerkentabel');
  var stramien = false;
  var stramienItem = null;

  
  $(".stramien-item").css('z-index', 50);

  if (table.css("display") != "block") {

    var productkaart = $(element).parents(".productkaart");
    if (productkaart.parent().hasClass("stramien-item")) {
      stramien = true;
      stramienItem = productkaart.parent();
    }

    $(".wp_kenmerkentabel")
      .not(table)
      .hide(100)
      .parents(".productkaart")
          .css('z-index', 100)
          .end();

    var tableWidth = table.outerWidth();
    var sidebar = $(".contentcontainer .linkerkolom").outerWidth() + 8;
    var canvasWidth = $(".canvas").outerWidth();
    var kaartjeWidth = productkaart.outerWidth();
    var kaartjeOffsetLeft = productkaart.position().left + sidebar;
    var kaartjeOffsetRight = canvasWidth - (kaartjeOffsetLeft + kaartjeWidth);

    if (kaartjeOffsetRight > tableWidth) {
      
      // kaartje past
      table.css({
        top: 255,
        left: kaartjeWidth
      });
      
    }
    else 
    {

      if ((kaartjeOffsetLeft + kaartjeWidth) > tableWidth) {

        // kaartje past
        table.css({
          top: 255,
          right: 0
        });

      }
      else {

        if (kaartjeOffsetLeft > kaartjeOffsetRight) {
          
          //naar rechts uitlijnen
          table.css({
            top: 255,
            right: -kaartjeOffsetRight
          });

        } else {
        
          //naar links
          //naar rechts uitlijnen
          table.css({
            top: 255,
            left: -kaartjeOffsetLeft
          });
        }
      }
    }

    productkaart.css({
      'z-index': 500
    });

  }

  table.toggle();
  

  $(".kenmerkentabel_sluiten", table).bind('click', function() {

    table.hide();
    $(".productkaart").css('z-index', 100);
    if (stramien) {
      $(".stramien-item").css('z-index', 99);
    }

    $(this).unbind('click');

  });

  return false;
}


/// <summary>
/// Vangt jQuery ajax errors op
/// </summary>
/// <param name="XMLHttpRequest">Het ajax request object</param>
/// <param name="textStatus">Het type error</param>
/// <param name="errorThrown">[Exception object, optional]</param>
function ajax_error_handler(XMLHttpRequest, textStatus, errorThrown) {

  var error = XMLHttpRequest.responseText;
  var message = error;
  switch (message) {
    case "Authentication failed.":
      if (confirm("U bent uitgelogd en kunt daarom geen acties uitvoeren, wilt u meteen opnieuw inloggen?")) {
        location.href = location.href;
      }
      break;
    default:
      //alert(message);
      break;
  }
};

/** tonen menu uitklaps + highlighten geselecteerd menu item **/

var hideProductgroepTimeoutID = 0;
function showProductgroep(linkEl, menuNaam) {
  $('.menu_uitklap').hide();
  $('#productgroepen_hoofdmenu a:not(.selected).active').removeClass("active");

  var menu = $('#productgroep_' + menuNaam);
  if (menu != null) {
    menu.show();
    linkEl = $(linkEl);
    linkEl.addClass("active");
    menu.bind('mouseleave', { link: linkEl, activeMenu: menu }, hideProductgroep);
    menu.bind('mouseenter', clearHideProductgroepTimeout);
    linkEl.bind('mouseleave', { link: linkEl, activeMenu: menu }, hideProductgroepTimeout);
  }
  return false;
}

function clearHideProductgroepTimeout() {
	clearTimeout(hideProductgroepTimeoutID); 
}

function hideProductgroepTimeout(event) {
	hideProductgroepTimeoutID = setTimeout(function () { hideProductgroep(event); }, 50);
}

function hideProductgroep(event) {
	if (event.data.activeMenu != null) {
		event.data.activeMenu.hide();
		event.data.link.removeClass("active");
	}
	
}
/** // tonen menu uitklaps + highlighten geselecteerd menu item **/

/// <summary>
/// Initaliseren van de pagina
/// </summary>
$(function () {
	// referentie voor tonen van productkaartjes
	dursySettings.canvas = $(".canvas:first");

	// de productomschrijvingen laden
	initProductDescriptions();

	// en de shortlists van inhoud en informatie etc.
	initShortlists();

	// vanafprijs kaartjes mouseovers
	var spanVanafPrijs = $("span.vanafprijs");
	if (spanVanafPrijs.length) {
		spanVanafPrijs.qtip({
			content: 'Vanaf prijs: selecteer de maat van uw keuze voor de prijs.',
			show: 'mouseover',
			hide: 'mouseout'
		});
	};

	// afbeeldingen maten
	$('.productkaart-visual img').bind('mouseover', function (e) {
		var timeoutMs = 800;
		var iVariatieGroepNr = $(this).attr("rel");
		var mousePosition = { 'x': e.pageX, 'y': e.pageY };
		
		if (timerIDKenmerkTimeout != null) {
			clearTimeout(timerIDKenmerkTimeout);
		}
		var elHover = $(this);
		timerIDKenmerkTimeout = setTimeout(function () {
			showKenmerken(elHover, iVariatieGroepNr, true, mousePosition)
		}, timeoutMs);

	});

	$('.productkaart-visual img').bind('mouseout', function (e) {
		if (timerIDKenmerkTimeout != null)
		{
			clearTimeout(timerIDKenmerkTimeout);
		}
	});

	// zoekveld onfocus wissen default text
	var zoekveld = $(".top-zoekcontainer input");
	if (zoekveld != null) {
		zoekveld.bind("focus", function (event) {
			$(this).val('');
		}
    );
		zoekveld.bind("blur", function (event) {
			var defaultText = "Typ hier productnaam, trefwoord of productnummer";
			if ($(this).val() == "") {
				$(this).val(defaultText);
			}
		}
    );
	}
	// zoekveld op zoeken pagina
	zoekveld = $(".zoekinvoer-container input");
	if (zoekveld != null) {
		zoekveld.bind("focus", function (event) {
			$(this).val('');
		}
    );
		zoekveld.bind("blur", function (event) {
			var defaultText = "Typ hier productnaam, trefwoord of productnummer";
			if ($(this).val() == "") {
				$(this).val(defaultText);
			}
		}
    );
	}


	// klikken van info buttons uitschakelen
	$(".info").bind('click', function () { return false; });

	/*20090612- EE */
	/*de noContext functie geeft problemen met het tonen van de select(dropdowns) in Safari 4*/
	/*20090612- EE */
	//$("body").noContext();
	//$("body").disableTextSelect();

	// uitkappen filter box
	var filterbox = $(".filter_box");
	if (filterbox != null) {
		filterbox.bind("click", function () { $(".filter_items", this).css("display", "block"); });
		filterbox.hover(
      function () {
      	//$(".filter_items", this).css("display", "block");
      },
      function () {
      	$(".filter_items", this).css("display", "none");
      }
    );
	}
});



// usage: log('inside coolFunc',this,arguments);
// paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
window.log = function () {
  log.history = log.history || [];   // store logs to an array for reference
  log.history.push(arguments);
  if (this.console) {
    console.log(Array.prototype.slice.call(arguments));
  }
};