<!-- <script href="/assets/js/jquery-3.6.0.min.js"></script> -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>


<!-- BOOTSTRAP JS CDN LINKED HERE  -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>

<!-- FONTAWESOME ICON JS CDN LINKED HERE  -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/js/all.min.js"></script>

<!-- AOS ANIMATION JS CDN LINKED HERE  -->
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>
  AOS.init();
</script>
<script src="/socket.io/socket.io.js"></script>
<script>
  const socket = io();
</script>
<script>
  $(".dangerous-form").submit(function(e) {
      const warning = $(this).data('warning')
      if (!confirm(warning)) {
        e.preventDefault()
      }
    })
</script>
<% if(user) { %>
<script>
  socket.on('connect', () => {
    console.log('Connected to server');
    const userId = '<%= user._id %>';
    const userModel = 'user';
    socket.emit('joinRoom', {
      id: userId,
      model: userModel
    });
  });
</script>
<% } %>
<% if(business) { %>
<script>
  socket.on('connect', () => {
    console.log('Connected to server');
    const businessId = '<%= business._id %>';
    const businessModel = 'business';
    socket.emit('joinRoom', {
      id: businessId,
      model: businessModel
    });
  });
</script>
<% } %>
<!-- OWN JS LINED HERE -->
<!-- <script href="/assets/js/select.js"></script> -->
<script href="/assets/js/suggestTags.js"></script>
<script href="/assets/js/fancybox.min.js"></script>
<!-- <script href="/assets/js/script.js"></script> -->
<script>
  function createToast(message, type = 'success') {
    // Create the toast container if it doesn't exist
    let toastContainer = document.querySelector(".toast-container");
    if (!toastContainer) {
      toastContainer = document.createElement("div");
      toastContainer.classList.add("toast-container");
      document.body.appendChild(toastContainer);
    }
    // Create the toast element
    let toast = document.createElement("div");
    toast.className = `toast ${type} align-items-center show`;
    toast.setAttribute("role", "alert");
    toast.setAttribute("aria-live", "assertive");
    toast.setAttribute("aria-atomic", "true");
    // Create the inner HTML of the toast
    toast.innerHTML = `
        <div class="d-flex">
            <div class="toast-body">${message}</div>
            <button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
        </div>
    `;
    // Append the toast to the toast container
    toastContainer.appendChild(toast);

    // Add event listener to remove toast on close button click
    toast.querySelector(".btn-close")?.addEventListener("click", function() {
      toast.remove();
    });
    // Remove the toast after 5 seconds
    setTimeout(() => {
      toast.remove();
    }, 5000);
  }
  // (function ($) {
  //     let classes = ['outline-primary', 'outline-dark', 'outline-danger', 'info', 'secondary'];
  //     let selects = $('select[multiple]');
  //     selects.each(function (i, e) {
  //         let randomClass = classes[Math.floor(Math.random() * classes.length)];
  //         $(this).bsSelectDrop({
  //             // btnClass: 'btn btn-'+classes[i],
  //             btnClass: 'select-multiple',
  //             btnWidth: 'auto',
  //             darkMenu: false,
  //             showSelectionAsList: false,
  //             showActionMenu: true,
  //             // showSelectedText: (count, total) => {return `${count} von ${total} Städte ausgewählt`}
  //         });
  //     })
  // }(jQuery));
  function deleteCookie(name) {
    debugger
    document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
    location.reload()
  }

  function createCookie(name, value, days) {
    let expires = "";
    if (days) {
      const date = new Date();
      date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
      expires = "; expires=" + date.toUTCString();
    }
    document.cookie = name + "=" + (value || "") + expires + "; path=/";
  }

  function readCookie(name) {
    const nameEQ = name + "=";
    const cookies = document.cookie.split(';');
    for (let i = 0; i < cookies.length; i++) {
      let cookie = cookies[i];
      while (cookie.charAt(0) === ' ') cookie = cookie.substring(1, cookie.length);
      if (cookie.indexOf(nameEQ) === 0) return cookie.substring(nameEQ.length, cookie.length);
    }
    return null;
  }

  $('.suggestTags').each((ind, elem) => {
    $(elem).amsifySuggestags({
      // suggestions: JSON.parse($(elem).data('suggestion')),
      suggestions: $(elem).data('suggestion'),
      whiteList: true
    });
  })
</script>
<script>
  document.querySelector(".logout-btn")?.addEventListener('click', () => {
    document.cookie = 'authtoken=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
    location.reload()
  })
</script>
<script>
  setTimeout(() => {
    $(".toast").remove()
  }, 5000);
</script>

<script>
  $(".dropdown-wrapper .dropdown-toggler").click(function() {
    $(this).parent().toggleClass('opened')
  })
  $("body").click(function(e) {
    const element = e.target
    const isNotificationElement = ($(element).hasClass('dropdown-wrapper') || $(element).parents('.dropdown-wrapper').length > 0)
    if (!isNotificationElement) {
      $(".dropdown-wrapper").removeClass('opened')
    }
  })
</script>

<!-- <script>
    setInterval(() => {
        setTimeout(() => {
            $("html, body").animate({ scrollTop: 0 }, "slow");
        }, 15000);
        setTimeout(() => {
            $("html, body").animate({ scrollTop: 1500 }, "slow");
        }, 30000);
    }, 30000);
</script> -->

<script>
  const checkbox = document.getElementById('working-now-exp');
  const endDateMonth = document.getElementById('endingDate_month');
  const endDateYear = document.getElementById('endingDate_year');

  checkbox?.addEventListener('change', function () {
    if (this.checked) {
      // Disable end date fields
      endDateMonth.disabled = true;
      endDateYear.disabled = true;
    } else {
      // Enable end date fields
      endDateMonth.disabled = false;
      endDateYear.disabled = false;
    }
  });
</script>


<script>


const volunteerCheckbox = document.getElementById('working-now-volunteer-exp');
  const volunteerEndDateMonth = document.getElementById('endingDate_month_volunteer');
  const volunteerEndDateYear = document.getElementById('endingDate_year_volunteer');

  volunteerCheckbox?.addEventListener('change', function () {
    if (this.checked) {
      // Disable end date fields
      volunteerEndDateMonth.disabled = true;
      volunteerEndDateYear.disabled = true;
    } else {
      // Enable end date fields
      volunteerEndDateMonth.disabled = false;
      volunteerEndDateYear.disabled = false;
    }
  });
</script>

<script>
      $(".api-field").keyup(async function(){
      $(this).siblings('.api-locations').remove()
      const value = $(this).val()
      if(value.length >= 1){
        const res = await fetch('/api/location/fetch', {
          method: 'POST',
          headers: {
            "Content-Type": "application/json"
          },
          body: JSON.stringify({place: value})
        })
        const resJson = await res.json()
        const elem = document.createElement('ul')
        $(elem).addClass('api-locations')
        resJson.map((item)=>{
          $(elem).append(`<li><button type="button" onClick="selectValue(this,'${item.city}, ${item.admin_name}')">${item.city}, ${item.admin_name}</li></button>`)
        })
        $(this).parent().append(elem)
        console.log('resJson',resJson)
      }
    })
    const selectValue = (elem,value) => {
      $(elem).parents('ul').siblings('input').val(value)
      $(elem).parents('ul').remove()
    }
    $('body').click(function(e){
      const elem = $(e.target)
      if(!$(elem).parents('.api-locations').length){
        $('.api-locations').remove()
      }
    })
</script>