// 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"));

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

    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());
    }
  });
}

/// <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) 
{
  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);
    }
    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);
          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>
function toonTabel(jEl, data, iVariatieGroepNr) {

  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);
  
  // tabel tonen op juiste positie
  jTabel
    .css(cssValues)
    .slideDown(400)
    // zorgen dat de tabel ook gesloten kan worden
    .find(".kenmerkentabel_sluiten").bind('click', function(){

      verwijder_tabel(jTabel);

    }).end()

  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)
{
  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 = {
    '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;
  }
};

/// <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'
    });
  };

  // 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();

});