{"id":2566,"date":"2026-05-21T07:11:29","date_gmt":"2026-05-21T07:11:29","guid":{"rendered":"https:\/\/croc-west.com\/?page_id=2566"},"modified":"2026-05-26T13:02:51","modified_gmt":"2026-05-26T13:02:51","slug":"ingredient-focus-test","status":"publish","type":"page","link":"https:\/\/croc-west.com\/cs\/ingredient-focus-test\/","title":{"rendered":"ingredient-focus-test"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8220;1&#8243; _builder_version=&#8220;4.27.6&#8243; _module_preset=&#8220;default&#8220; background_color=&#8220;RGBA(255,255,255,0)&#8220; background_enable_image=&#8220;off&#8220; custom_margin=&#8220;0px|0px|0px|0px|false|false&#8220; custom_padding=&#8220;0px||100px||false|false&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_row _builder_version=&#8220;4.27.6&#8243; _module_preset=&#8220;default&#8220; width=&#8220;100%&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_column type=&#8220;4_4&#8243; _builder_version=&#8220;4.27.6&#8243; _module_preset=&#8220;default&#8220; global_colors_info=&#8220;{}&#8220;][et_pb_code _builder_version=&#8220;4.27.6&#8243; _module_preset=&#8220;default&#8220; hover_enabled=&#8220;0&#8243; custom_css_free_form=&#8220;#ingredient-focus-search {||  max-width: 1000px;||  margin: auto;||  padding: 80px 20px;||  font-family: sans-serif;||  min-height: 80vh;||  display: flex;||  flex-direction: column;||}||||.lot-search-box {||  display: flex;||  gap: 10px;||  margin-top: 20px;||}||||.lot-search-box input {||  flex: 1;||  padding: 14px;||  border: 1px solid #DAC0AA;||  border-radius: 8px;||  font-size: 16px;||}||||.lot-search-box button {||  padding: 14px 24px;||  background:  #B7312B;||  color: white;||  border: none;||  border-radius: 8px;||  cursor: pointer;||}||||#lotResult {||  margin-top: 40px;||  flex: 1;||}||||.ingredient-card {||  background: #F0E7D8;||  border: 1px solid #DAC0AA;||  border-radius: 12px;||  padding: 20px;||  margin-bottom: 20px;||}||||.ingredient-header {||  display: flex;||  justify-content: space-between;||  align-items: center;||}||||.info-button {||  background: #5C4738;||  color: white;||  border: none;||  border-radius: 50%;||  width: 26px;||  height: 26px;||  cursor: pointer;||}||||.ingredient-description {||  display: none;||  margin-top: 15px;||  color: #5C4738;||}||||.lot-header {||  margin-bottom: 40px;||}||||.lot-meta {||  margin-top: 20px;||}||||.ingredient-card {||  background: #F0E7D8;||  border: 1px solid #DAC0AA;||  border-radius: 14px;||  padding: 24px;||  margin-bottom: 20px;||}||||.ingredient-main {||  display: flex;||  justify-content: space-between;||  align-items: center;||}||||.info-button {||  background: #5C4738;||  color: white;||  border: none;||  border-radius: 50%;||  width: 34px;||  height: 34px;||  cursor: pointer;||  font-weight: bold;||  transition: 0.3s;||}||||.info-button:hover {||  transform: scale(1.1);||  background:#B7312B;||}||||#ingredientPopup {||  position: fixed;||  inset: 0;||  background: rgba(30, 24, 20, 0.55);||  display: none;||  justify-content: center;||  align-items: center;||  z-index: 999999;||  padding: 40px 20px;||  opacity: 0;||  transition: opacity 0.3s ease;||  overflow-y: auto;||}||||.popup-content {||  background: #F0E7D8;||  max-width: 800px;||  width: 100%;||  border-radius: 18px;||  padding: 40px;||  position: relative;||  box-shadow: 0 25px 80px rgba(0,0,0,0.28);||  transform: translateY(20px) scale(0.96);||  transition: all 0.3s ease;||  max-height: 85vh;||  overflow-y: auto;||}||||.popup-content h3 {||  margin-bottom: 10px;||}||||.popup-origin {||  color: #B7312B;||  margin-bottom: 20px;||}||||.close-popup {||  position: absolute;||  top: 15px;||  right: 20px;||  background: none;||  border: none;||  font-size: 28px;||  cursor: pointer;||}||||.read-more-button {||  margin-top: 18px;||  background: none;||  border: none;||  padding: 0;||  color: #B7312B;||  font-weight: 600;||  cursor: pointer;||  font-size: 15px;||  transition: 0.3s;||}||||.read-more-button:hover {||  opacity: 0.7;||}||||.long-description {||  display: none;||  margin-top: 6px;||  max-height: 260px;||  overflow-y: auto;||  line-height: 1.6;||  white-space: pre-line;||}&#8220; global_colors_info=&#8220;{}&#8220; sticky_enabled=&#8220;0&#8243;]<\/p>\n<div id=\"ingredient-focus-search\"><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  <\/p>\n<h2>Zam\u011b\u0159en\u00ed na ingredience<\/h2>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  <pee>Zadejte \u010d\u00edslo \u0161ar\u017ee uveden\u00e9 na va\u0161em s\u00e1\u010dku.<\/pee><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  <\/p>\n<div class=\"lot-search-box\"><!-- [et_pb_line_break_holder] -->    <input type=\"text\" id=\"lotNumber\" placeholder=\"Ex : 1646\"><!-- [et_pb_line_break_holder] -->    <button onclick=\"loadLot()\">Zobrazit<\/button><!-- [et_pb_line_break_holder] -->  <\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  <\/p>\n<div id=\"lotResult\"><\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><script><!-- [et_pb_line_break_holder] -->let currentIngredients = [];<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->const searchButton = document.getElementById('lotSearchButton');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->if (searchButton) {<!-- [et_pb_line_break_holder] -->  searchButton.addEventListener('click', loadLot);<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->document.getElementById('lotNumber').addEventListener('keydown', function(event) {<!-- [et_pb_line_break_holder] -->  if (event.key === 'Enter') {<!-- [et_pb_line_break_holder] -->    event.preventDefault();<!-- [et_pb_line_break_holder] -->    loadLot();<!-- [et_pb_line_break_holder] -->  }<!-- [et_pb_line_break_holder] -->});<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->async function loadLot() {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const lot = document.getElementById('lotNumber').value.trim();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const resultDiv = document.getElementById('lotResult');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  if (!lot) {<!-- [et_pb_line_break_holder] -->    return;<!-- [et_pb_line_break_holder] -->  }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  resultDiv.innerHTML = `<pee>Chargement...<\/pee>`;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  try {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    let lang = document.documentElement.lang || 'fr';<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    lang = lang.toLowerCase();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    if (lang.includes('-')) {<!-- [et_pb_line_break_holder] -->      lang = lang.split('-')[0];<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    const url = `\/wp-content\/uploads\/ingredient-focus\/data\/${lang}\/${lot}.json`;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    console.log(\"URL appel\u00e9e :\", url);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    const response = await fetch(url);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    if (!response.ok) {<!-- [et_pb_line_break_holder] -->      throw new Error(\"Lot introuvable\");<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    const data = await response.json();<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    currentIngredients = data.ingredients;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    let html = `<!-- [et_pb_line_break_holder] -->      <\/p>\n<div class=\"lot-header\"><!-- [et_pb_line_break_holder] -->        <\/p>\n<h2>LOT ${data.lot}<\/h2>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        <\/p>\n<div class=\"lot-meta\"><!-- [et_pb_line_break_holder] -->          <pee><strong>Produit :<\/strong> ${data.produit}<\/pee><!-- [et_pb_line_break_holder] -->          <pee><strong>Date de fabrication :<\/strong> ${formatDate(data.date_fabrication)}<\/pee><!-- [et_pb_line_break_holder] -->          <pee><strong>DDM :<\/strong> ${formatDate(data.ddm)}<\/pee><!-- [et_pb_line_break_holder] -->        <\/div>\n<p><!-- [et_pb_line_break_holder] -->      <\/div>\n<p><!-- [et_pb_line_break_holder] -->    `;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    data.ingredients.forEach((ingredient, index) => {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      html += `<!-- [et_pb_line_break_holder] -->        <\/p>\n<div class=\"ingredient-card\"><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          <\/p>\n<div class=\"ingredient-main\"><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            <\/p>\n<div><!-- [et_pb_line_break_holder] -->              <strong>${ingredient.nom}<\/strong><!\u2013- [et_pb_br_holder] -\u2013><!-- [et_pb_line_break_holder] -->              <span>${ingredient.provenance}<\/span><!-- [et_pb_line_break_holder] -->            <\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            <button class=\"info-button\" onclick=\"openPopupByIndex(${index})\"><!-- [et_pb_line_break_holder] -->              i<!-- [et_pb_line_break_holder] -->            <\/button><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->          <\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        <\/div>\n<p><!-- [et_pb_line_break_holder] -->      `;<!-- [et_pb_line_break_holder] -->    });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    resultDiv.innerHTML = html;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  } catch (error) {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    console.error(error);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    resultDiv.innerHTML = `<!-- [et_pb_line_break_holder] -->      <pee>Aucun lot correspondant trouv\u00e9.<\/pee><!-- [et_pb_line_break_holder] -->    `;<!-- [et_pb_line_break_holder] -->  }<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->function formatDate(dateString) {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const options = {<!-- [et_pb_line_break_holder] -->    day: '2-digit',<!-- [et_pb_line_break_holder] -->    month: 'long',<!-- [et_pb_line_break_holder] -->    year: 'numeric'<!-- [et_pb_line_break_holder] -->  };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  return new Date(dateString).toLocaleDateString('fr-FR', options);<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->function openPopupByIndex(index) {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const ingredient = currentIngredients[index];<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  openPopup(<!-- [et_pb_line_break_holder] -->    ingredient.nom,<!-- [et_pb_line_break_holder] -->    ingredient.provenance,<!-- [et_pb_line_break_holder] -->    ingredient.description,<!-- [et_pb_line_break_holder] -->    ingredient.description_longue || ''<!-- [et_pb_line_break_holder] -->  );<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->function openPopup(title, provenance, description, descriptionLongue) {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const popup = document.getElementById('ingredientPopup');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  document.body.appendChild(popup);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  popup.innerHTML = `<!-- [et_pb_line_break_holder] -->    <\/p>\n<div class=\"popup-content\"><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      <button class=\"close-popup\" onclick=\"closePopup()\">\u00d7<\/button><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      <\/p>\n<h3>${title}<\/h3>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      <pee class=\"popup-origin\">${provenance}<\/pee><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      <pee>${description}<\/pee><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      ${descriptionLongue ? `<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        <\/p>\n<div id=\"longDescription\" class=\"long-description\"><!-- [et_pb_line_break_holder] -->          ${descriptionLongue}<!-- [et_pb_line_break_holder] -->        <\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        <button class=\"read-more-button\" onclick=\"toggleLongDescription()\"><!-- [et_pb_line_break_holder] -->          En savoir plus \u2192<!-- [et_pb_line_break_holder] -->        <\/button><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->      ` : ''}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    <\/div>\n<p><!-- [et_pb_line_break_holder] -->  `;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  popup.style.display = \"flex\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  document.body.style.overflow = \"hidden\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  setTimeout(() => {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    popup.style.opacity = \"1\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    const content = popup.querySelector('.popup-content');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    content.style.transform = \"translateY(0) scale(1)\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  }, 10);<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->function closePopup() {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const popup = document.getElementById('ingredientPopup');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const content = popup.querySelector('.popup-content');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  popup.style.opacity = \"0\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  content.style.transform = \"translateY(20px) scale(0.96)\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  document.body.style.overflow = \"\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  setTimeout(() => {<!-- [et_pb_line_break_holder] -->    popup.style.display = \"none\";<!-- [et_pb_line_break_holder] -->  }, 300);<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->function toggleLongDescription() {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const longDesc = document.getElementById('longDescription');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  const button = document.querySelector('.read-more-button');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  if (longDesc.style.display === \"block\") {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    longDesc.style.display = \"none\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    button.innerHTML = \"En savoir plus \u2192\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->  } else {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    longDesc.style.display = \"block\";<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    button.innerHTML = \"R\u00e9duire \u2191\";<!-- [et_pb_line_break_holder] -->  }<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><\/script><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><\/p>\n<div id=\"ingredientPopup\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->[\/et_pb_code][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-2566","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/pages\/2566","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/comments?post=2566"}],"version-history":[{"count":9,"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/pages\/2566\/revisions"}],"predecessor-version":[{"id":2575,"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/pages\/2566\/revisions\/2575"}],"wp:attachment":[{"href":"https:\/\/croc-west.com\/cs\/wp-json\/wp\/v2\/media?parent=2566"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}