$(document).ready(function() {
  var token = $('body').data('token');

  $('.js-btn-filter').on('click', function() {
    url = 'index.php?route=report/customer_online&token=' + token;

    var filter_customer = $("input[name='filter_customer']").attr('value');

    if (filter_customer) {
      url += '&filter_customer=' + encodeURIComponent(filter_customer);
    }

    var filter_ip = $("input[name='filter_ip']").attr('value');

    if (filter_ip) {
      url += '&filter_ip=' + encodeURIComponent(filter_ip);
    }

    location = url;
  });

  function showToast(message) {
    const oldToast = document.querySelector('.notification');
    if (oldToast) oldToast.remove();

    const toast = document.createElement('div');
    toast.className = 'notification';
    toast.style.cssText = `
      position: fixed;
      top: 20px;
      left: 50%;
      transform: translateX(-50%);
      width: 360px;
      max-width: 90%;
      height: auto;
      min-height: 70px;
      background-color: #fff3cd;
      color: #856404;
      border: 1px solid #ffeeba;
      border-radius: 5px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.15);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px;
      font-size: 16px;
      z-index: 9999;
      animation: fadeIn 0.3s ease;
    `;

    const icon = document.createElement('i');
      icon.className = 'fas fa-exclamation-circle';
      icon.style.cssText = `
        padding-right: 16px;
        font-size: 1rem;
      `;
      toast.appendChild(icon);

      const text = document.createElement('span');
      text.style.flex = '1';
      text.textContent = message;
      toast.appendChild(text);

    const closeBtn = document.createElement('button');
      closeBtn.innerHTML = '<i class="fas fa-times"></i>';
      closeBtn.style.cssText = `
        background: transparent;
        border: none;
        cursor: pointer;
        font-size: 1rem;
        color: inherit;
        padding-left: 16px;
      `;
      closeBtn.addEventListener('click', () => toast.remove());
      toast.appendChild(closeBtn);

    const progressBar = document.createElement('div');
    progressBar.style.cssText = `
      position: absolute;
      bottom: 0;
      left: 0;
      height: 4px;
      background: #856404;
      width: 0%;
      border-bottom-left-radius: 8px;
      border-bottom-right-radius: 8px;
      animation: progressBarAnim 5s linear forwards;
    `;
    toast.appendChild(progressBar);

    document.body.appendChild(toast);

    setTimeout(() => {
      toast.style.animation = 'fadeOut 0.3s ease';
      setTimeout(() => toast.remove(), 300);
    }, 5000);

    const style = document.createElement('style');
    style.innerHTML = `
      @keyframes fadeIn {
        from { opacity: 0; transform: translate(-50%, -10px); }
        to { opacity: 1; transform: translate(-50%, 0); }
      }
      @keyframes fadeOut {
        from { opacity: 1; transform: translate(-50%, 0); }
        to { opacity: 0; transform: translate(-50%, -10px); }
      }
      @keyframes progressBarAnim {
        from { width: 0%; }
        to { width: 100%; }
      }
    `;
    document.head.appendChild(style);
  }

  $('#btnDownloadPDF').on('click', function() {
    var element = document.getElementById('relatorio_clientes_online_pdf');

    if (!element) {
      showToast('Não há clientes online no momento para gerar o relatório', 'warning');
      return;
    }

    var opt = {
      margin:       [15, 10, 15, 10],
      filename:     'relatorio-clientes-online.pdf',
      image:        { type: 'jpeg', quality: 1 },
      html2canvas:  {
        scale: 2,              
        scrollX: 0,
        scrollY: 0,
        windowWidth: document.documentElement.offsetWidth,
        windowHeight: document.documentElement.scrollHeight
      },
      jsPDF: {
        unit: 'mm',
        format: 'a4',
        orientation: 'portrait',
        compress: true
      },
      pagebreak: {
        mode: ['avoid-all', 'css', 'legacy'], 
        before: '.page-break-before',
        after:  '.page-break-after'
      }
    };

    html2pdf().from(element).set(opt).save();
  });

});