shopPRO/admin/templates/shop-product/product-edit-custom-script.php

<?php
$product = is_array($this->product ?? null) ? $this->product : [];
$productId = (int)($product['id'] ?? 0);
$userId = (int)($this->user['id'] ?? 0);
$imagesCount = is_array($product['images'] ?? null) ? count($product['images']) : 0;
$filesCount = is_array($product['files'] ?? null) ? count($product['files']) : 0;

$imageMaxPx = 1920;
if (isset($GLOBALS['settings']['image_px']) && (int)$GLOBALS['settings']['image_px'] > 0) {
    $imageMaxPx = (int)$GLOBALS['settings']['image_px'];
}

$uploadToken = bin2hex(random_bytes(24));
if (!isset($_SESSION['upload_tokens']) || !is_array($_SESSION['upload_tokens'])) {
    $_SESSION['upload_tokens'] = [];
}
$_SESSION['upload_tokens'][$uploadToken] = [
    'user_id' => $userId,
    'expires' => time() + 60 * 20,
];

$cookieCategories = [];
if (!empty($_COOKIE['cookie_categories'])) {
    $decoded = @unserialize($_COOKIE['cookie_categories']);
    if (is_array($decoded)) {
        $cookieCategories = $decoded;
    }
}
?>

<link type="text/css" rel="stylesheet" href="/libraries/plupload/jquery.plupload.queue/css/jquery.plupload.queue.css" />
<link type="text/css" rel="stylesheet" href="/libraries/selectize/css/selectize.css" />
<link type="text/css" rel="stylesheet" href="/libraries/selectize/css/selectize.default.css" />

<script type="text/javascript" src="/libraries/jquery/sortable/sortable.js"></script>
<script type="text/javascript" src="/libraries/plupload/plupload.js"></script>
<script type="text/javascript" src="/libraries/plupload/plupload.html5.js"></script>
<script type="text/javascript" src="/libraries/plupload/plupload.html4.js"></script>
<script type="text/javascript" src="/libraries/plupload/jquery.plupload.queue/jquery.plupload.queue.js"></script>
<script type="text/javascript" src="/libraries/plupload/i18n/pl.js"></script>
<script type="text/javascript" src="/libraries/jquery-nested-sortable/jquery.mjs.nestedSortable.js"></script>
<script type="text/javascript" src="/libraries/jquery/lozad.js"></script>
<script type="text/javascript" src="/libraries/selectize/js/standalone/selectize.js"></script>

<style type="text/css">
  #fg-product-edit .layout-tree-toggle {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    padding: 0;
    margin-right: 4px;
    color: #666;
    cursor: pointer;
    text-indent: 0;
    background-image: none !important;
  }
  #fg-product-edit .layout-tree-toggle:focus,
  #fg-product-edit .layout-tree-toggle:active,
  #fg-product-edit .layout-tree-toggle:focus-visible {
    outline: none;
    box-shadow: none;
  }
  #fg-product-edit li.sort-expanded > div .layout-tree-toggle i {
    transform: rotate(90deg);
  }
  #fg-product-edit .sortable li.sort-branch > div > .layout-tree-toggle {
    display: inline-flex;
    float: none;
    margin-right: 4px;
  }
  #fg-product-edit .menu_sortable .icheckbox_minimal-blue {
    margin-top: 0;
    margin-right: 5px;
  }
  #fg-product-edit .menu_sortable .g-checkbox {
    position: relative;
    overflow: hidden;
  }
  #files-list {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
  }
  #files-list li {
    display: block;
    width: 100%;
    margin-bottom: 6px;
    cursor: move;
  }
  #files-list li .input-group {
    width: 100%;
  }
</style>

<script type="text/javascript">
  var images_count = <?= (int)$imagesCount ?>;
  var files_count = <?= (int)$filesCount ?>;
  var product_id = <?= (int)$productId ?>;

  function remove_custom_filed(el) {
    confirm_delete_element(function() {
      el.parent().parent().parent().remove();
    });
  }

  $(function() {

    // --- Podgląd produktu ---
    $('body').on('click', '#product-preview', function() {
      $.ajax({
        type: 'POST',
        cache: false,
        url: '/admin/shop_product/ajax_product_url/',
        data: { product_id: $('#id').val() },
        success: function(response) {
          var data = jQuery.parseJSON(response);
          var win = window.open(data.url, '_blank');
          if (win) win.focus();
        }
      });
    });

    // --- Selectize: produkty powiązane ---
    $('#products_related').selectize({
      maxItems: 999,
      plugins: ['remove_button']
    });

    // --- Lozad: lazy load obrazków ---
    var observer = lozad();
    observer.observe();

    // --- Śledzenie kolejności galerii i plików (hidden inputs) ---
    function ensureGalleryOrderInput() {
      var $form = $('#fg-product-edit');
      if (!$form.length) return null;
      var $input = $form.find('input[name="gallery_order"]');
      if (!$input.length) {
        $input = $('<input>', { type: 'hidden', name: 'gallery_order', id: 'gallery_order' });
        $form.append($input);
      }
      return $input;
    }

    function buildGalleryOrder() {
      var order = [];
      $('#images-list li').each(function() {
        var imageId = $(this).find('a.article_image_delete').attr('image-id');
        if (imageId) order.push(imageId);
      });
      return order.join(';');
    }

    function refreshGalleryOrderInput() {
      var $input = ensureGalleryOrderInput();
      if ($input) $input.val(buildGalleryOrder());
    }

    function ensureFilesOrderInput() {
      var $form = $('#fg-product-edit');
      if (!$form.length) return null;
      var $input = $form.find('input[name="files_order"]');
      if (!$input.length) {
        $input = $('<input>', { type: 'hidden', name: 'files_order', id: 'files_order' });
        $form.append($input);
      }
      return $input;
    }

    function buildFilesOrder() {
      var order = [];
      $('#files-list li').each(function() {
        var fileId = $(this).find('.product_file_edit').attr('file_id');
        if (fileId) order.push(fileId);
      });
      return order.join(';');
    }

    function refreshFilesOrderInput() {
      var $input = ensureFilesOrderInput();
      if ($input) $input.val(buildFilesOrder());
    }

    ensureGalleryOrderInput();
    refreshGalleryOrderInput();
    ensureFilesOrderInput();
    refreshFilesOrderInput();

    // --- Sortable: galeria zdjęć ---
    var imageList = document.getElementById('images-list');
    if (imageList) {
      Sortable.create(imageList, {
        onEnd: function() {
          $.ajax({
            type: 'POST',
            cache: false,
            url: '/admin/shop_product/images_order_save/',
            data: { product_id: product_id, order: buildGalleryOrder() },
            beforeSend: function() { $('#overlay').show(); },
            success: function(data) {
              $('#overlay').hide();
              var response = jQuery.parseJSON(data);
              if (response.status !== 'ok') create_error(response.msg);
            }
          });
          refreshGalleryOrderInput();
        }
      });
    }

    // --- Sortable: pliki ---
    var filesList = document.getElementById('files-list');
    if (filesList) {
      Sortable.create(filesList, {
        onEnd: function() {
          refreshFilesOrderInput();
        }
      });
    }

    // --- Plupload: upload zdjęć ---
    $('#images-uploader').pluploadQueue({
      multipart_params: {
        upload_token: '<?= htmlspecialchars($uploadToken, ENT_QUOTES, 'UTF-8') ?>'
      },
      runtimes: 'html5,html4',
      init: {
        Refresh: function() {
          $('.plupload_buttons').css('display', 'inline');
          $('.plupload_upload_status').css('display', 'inline');
          $('.plupload_start').addClass('plupload_disabled').removeClass('plupload_disabled');
        },
        UploadComplete: function() {
          $('.plupload_buttons').css('display', 'inline');
          $('.plupload_upload_status').css('display', 'inline');
          $('.plupload_start').addClass('plupload_disabled').removeClass('plupload_disabled');
        },
        FileUploaded: function(up, file, response) {
          var data = jQuery.parseJSON(response.response);
          $('#images-list').append(
            '<li id="image-' + data.image_id + '">' +
              '<img class="article-image lozad" data-src="/libraries/thumb.php?img=' + data.data_link + '&w=300&h=300">' +
              '<a href="#" class="input-group-addon btn btn-danger article_image_delete" image-id="' + data.image_id + '">' +
                '<i class="fa fa-trash"></i>' +
              '</a>' +
              '<input type="text" class="form-control image-alt" value="" image-id="' + data.image_id + '" placeholder="atrybut alt...">' +
            '</li>'
          );
          images_count++;
          observer.observe();
          refreshGalleryOrderInput();
          $('html, body').animate({ scrollTop: $('#images-uploader').offset().top }, 1);
        }
      },
      url: '/libraries/plupload/upload-product-images.php',
      chunk_size: '1mb',
      max_file_size: '20mb',
      unique_names: false,
      resize: {
        width: <?= (int)$imageMaxPx ?>,
        height: <?= (int)$imageMaxPx ?>,
        quality: 95
      },
      filters: [{ title: 'Obrazki', extensions: 'jpg,gif,png,bmp,jpeg' }]
    });

    // --- Plupload: upload plików ---
    $('#files-uploader').pluploadQueue({
      multipart_params: {
        upload_token: '<?= htmlspecialchars($uploadToken, ENT_QUOTES, 'UTF-8') ?>'
      },
      runtimes: 'html5,html4',
      init: {
        Refresh: function() {
          $('.plupload_buttons').css('display', 'inline');
          $('.plupload_upload_status').css('display', 'inline');
          $('.plupload_start').addClass('plupload_disabled').removeClass('plupload_disabled');
        },
        FileUploaded: function(up, file, response) {
          var data = jQuery.parseJSON(response.response);
          $('#files-list').append(
            '<li id="file-' + data.file_id + '">' +
              '<div class="input-group">' +
                '<input type="text" class="form-control product_file_edit" file_id="' + data.file_id + '" value="' + data.file_name + '" />' +
                '<a href="#" class="input-group-addon btn btn-info product_file_delete" file_id="' + data.file_id + '">' +
                  '<i class="fa fa-trash"></i>' +
                '</a>' +
              '</div>' +
            '</li>'
          );
          files_count++;
          refreshFilesOrderInput();
        }
      },
      url: '/libraries/plupload/upload-product-files.php',
      chunk_size: '1mb',
      max_file_size: '50mb',
      unique_names: false,
      filters: [{ title: 'Wszystkie pliki', extensions: '*' }]
    });

    // --- Drzewo kategorii: ukryj strzałki na liściach ---
    function refreshTreeDisclosureState() {
      $('ol.sortable li').each(function() {
        var $li = $(this);
        var hasChildren = $li.children('ol').children('li').length > 0;
        var $toggle = $li.children('div').children('.disclose');

        if (hasChildren) {
          $li.removeClass('sort-leaf').addClass('sort-branch');
          if (!$li.hasClass('sort-collapsed') && !$li.hasClass('sort-expanded')) {
            $li.addClass('sort-collapsed');
          }
          $toggle.attr('aria-expanded', $li.hasClass('sort-expanded') ? 'true' : 'false').show();
        } else {
          $li.removeClass('sort-branch sort-collapsed sort-expanded').addClass('sort-leaf');
          $toggle.attr('aria-expanded', 'false').hide();
        }
      });
    }

    // --- Drzewo kategorii: nestedSortable + iCheck ---
    if ($.fn && typeof $.fn.iCheck === 'function') {
      $('#fg-product-edit .menu_sortable .g-checkbox').iCheck({
        checkboxClass: 'icheckbox_minimal-blue',
        radioClass: 'iradio_minimal-blue'
      });
    }

    $('ol.sortable').nestedSortable({
      forcePlaceholderSize: true,
      handle: 'div',
      helper: 'clone',
      items: 'li',
      opacity: .9,
      placeholder: 'placeholder',
      revert: 250,
      tabSize: 45,
      tolerance: 'pointer',
      toleranceElement: '> div',
      maxLevels: 2,
      isTree: true,
      expandOnHover: 700,
      protectRoot: false
    });

    $('.disclose').on('click', function() {
      var $li = $(this).closest('li');
      $li.toggleClass('sort-collapsed').toggleClass('sort-expanded');
      $(this).attr('aria-expanded', $li.hasClass('sort-expanded') ? 'true' : 'false');
    });

    $('.disclose').mousedown(function(e) {
      if (e.which === 1) {
        var category_id = $(this).parent('div').parent('li').attr('id');
        $.ajax({
          type: 'POST',
          cache: false,
          url: '/admin/shop_category/cookie_categories/',
          data: { category_id: category_id }
        });
      }
    });

    refreshTreeDisclosureState();

    <?php foreach ($cookieCategories as $key => $val): ?>
      <?php if ($val): ?>$('#<?= $key ?>').children('div').children('.disclose').click();<?php endif; ?>
    <?php endforeach; ?>

    // --- AJAX: zmiana alt zdjęcia ---
    $('body').on('change', '.image-alt', function() {
      var $input = $(this);
      $.ajax({
        type: 'POST',
        cache: false,
        url: '/admin/shop_product/image_alt_change/',
        data: { image_id: $input.attr('image-id'), image_alt: $input.val() },
        beforeSend: function() { $('#overlay').show(); },
        success: function(data) {
          $('#overlay').hide();
          var response = jQuery.parseJSON(data);
          if (response.status !== 'ok') create_error(response.msg);
        }
      });
    });

    // --- AJAX: zmiana nazwy pliku ---
    $('body').on('change', '.product_file_edit', function() {
      var $input = $(this);
      $.ajax({
        type: 'POST',
        cache: false,
        url: '/admin/shop_product/product_file_name_change/',
        data: { file_id: $input.attr('file_id'), file_name: $input.val() },
        beforeSend: function() { $('#overlay').show(); },
        success: function(data) {
          $('#overlay').hide();
          var response = jQuery.parseJSON(data);
          if (response.status !== 'ok') create_error(response.msg);
        }
      });
    });

    // --- AJAX: usunięcie pliku ---
    $('body').on('click', '.product_file_delete', function() {
      $(this).blur();
      var file_id = $(this).attr('file_id');

      $.alert({
        title: 'Pytanie',
        content: 'Na pewno chcesz usunąć wybrany plik?',
        type: 'orange',
        closeIcon: true,
        closeIconClass: 'fa fa-times',
        typeAnimated: true,
        animation: 'opacity',
        columnClass: 'col-12 col-lg-10',
        theme: 'modern',
        icon: 'fa fa-question',
        buttons: {
          cancel: { text: 'Nie', btnClass: 'btn-dark', action: function() {} },
          confirm: {
            text: 'Tak', btnClass: 'btn-danger', keys: ['enter'],
            action: function() {
              $.ajax({
                type: 'POST',
                cache: false,
                url: '/admin/shop_product/product_file_delete/',
                data: { file_id: file_id },
                beforeSend: function() {
                  $('#file-' + file_id).find('input').addClass('disabled');
                  $('#file-' + file_id).find('a').addClass('disabled');
                },
                success: function(data) {
                  var response = jQuery.parseJSON(data);
                  if (response.status === 'ok') {
                    $('#file-' + file_id).remove();
                    refreshFilesOrderInput();
                  } else {
                    create_error(response.msg);
                  }
                }
              });
            }
          }
        }
      });
      return false;
    });

    // --- AJAX: usunięcie zdjęcia ---
    $('body').on('click', '.article_image_delete', function() {
      $(this).blur();
      var image_id = $(this).attr('image-id');

      $.alert({
        title: 'Pytanie',
        content: 'Na pewno chcesz usunąć wybrane zdjęcie?',
        type: 'orange',
        closeIcon: true,
        closeIconClass: 'fa fa-times',
        typeAnimated: true,
        animation: 'opacity',
        columnClass: 'col-12 col-lg-10',
        theme: 'modern',
        icon: 'fa fa-question',
        buttons: {
          cancel: { text: 'Nie', btnClass: 'btn-dark', action: function() {} },
          confirm: {
            text: 'Tak', btnClass: 'btn-danger', keys: ['enter'],
            action: function() {
              $.ajax({
                type: 'POST',
                cache: false,
                url: '/admin/shop_product/image_delete/',
                data: { image_id: image_id },
                beforeSend: function() { $('#overlay').show(); },
                success: function(data) {
                  $('#overlay').hide();
                  var response = jQuery.parseJSON(data);
                  if (response.status === 'ok') {
                    $('#image-' + image_id).remove();
                    refreshGalleryOrderInput();
                  } else {
                    create_error(response.msg);
                  }
                }
              });
            }
          }
        }
      });
      return false;
    });

    // --- Odśwież kolejność galerii/plików przed zapisem ---
    $('body').on('click', '#g-edit-save, #g-edit-save-close', function() {
      refreshGalleryOrderInput();
      refreshFilesOrderInput();
    });

    // --- Kalkulator cen netto/brutto ---
    $('body').on('keyup', '#price_netto', function() { calculate_price_brutto(); });
    $('body').on('keyup', '#price_brutto', function() { calculate_price_netto(); });
    $('body').on('keyup', '#price_netto_promo', function() { calculate_price_brutto_promo(); });
    $('body').on('keyup', '#price_brutto_promo', function() { calculate_price_netto_promo(); });
    $('body').on('change', '#vat', function() { calculate_price_brutto(); });

    // --- Dodawanie custom field ---
    $('body').on('click', '#add_custom_field', function(e) {
      e.preventDefault();
      var html = '';
      html += '<div class="form-group row custom-field-row bg-white p-4">';
        html += '<div class="form-group row"><label class="col-sm-3 control-label">Nazwa pola:</label>';
        html += '<div class="col-sm-9"><input type="text" class="form-control" name="custom_field_name[]" value=""></div></div>';
        html += '<div class="form-group row"><label class="col-sm-3 control-label">Rodzaj pola:</label>';
        html += '<div class="col-sm-9"><select class="form-control" name="custom_field_type[]">';
        html += '<option value="text" selected>Tekst</option>';
        html += '<option value="image">Obrazek</option>';
        html += '</select></div></div>';
        html += '<div class="form-group row"><label class="col-sm-3 control-label">Status pola:</label>';
        html += '<div class="col-sm-9"><label style="margin:0; font-weight:normal;" class="d-flex align-items-center mt-3">';
        html += '<input type="checkbox" class="custom-field-required" name="custom_field_required[]"> wymagane</label></div></div>';
        html += '<div class="form-group row"><div class="col-sm-12 text-right">';
        html += '<span class="input-group-addon btn btn-info" onclick="remove_custom_filed( $( this ) );">usuń</span>';
        html += '</div></div>';
      html += '</div>';
      $('.additional_fields').append(html);
    });

  });

  // --- Funkcje kalkulacji cen ---
  function calculate_price_brutto() {
    var price_netto = $('#price_netto').val().replace(',', '.');
    if (!price_netto) return false;
    var vat = $('#vat').val().replace(',', '.');
    var price_brutto = price_netto * 1 + price_netto * vat / 100;
    price_brutto = Math.floor(price_brutto * 100) / 100;
    price_brutto = number_format(price_brutto, 2, '.', '');
    return $('#price_brutto').val(price_brutto);
  }

  function calculate_price_netto() {
    var price_brutto = $('#price_brutto').val().replace(',', '.');
    var vat = $('#vat').val().replace(',', '.');
    var price_netto = price_brutto / (vat / 100 + 1);
    price_netto = number_format(price_netto, 2, '.', '');
    return $('#price_netto').val(price_netto);
  }

  function calculate_price_brutto_promo() {
    var price_netto = $('#price_netto_promo').val().replace(',', '.');
    var vat = $('#vat').val().replace(',', '.');
    var price_brutto = price_netto * 1 + price_netto * vat / 100;
    price_brutto = Math.floor(price_brutto * 100) / 100;
    price_brutto = number_format(price_brutto, 2, '.', '');
    if (Math.floor(price_netto) <= 0) {
      $('#price_netto_promo').val('');
      $('#price_brutto_promo').val('');
      return true;
    }
    return $('#price_brutto_promo').val(price_brutto);
  }

  function calculate_price_netto_promo() {
    var price_brutto = $('#price_brutto_promo').val().replace(',', '.');
    var vat = $('#vat').val().replace(',', '.');
    var price_netto = price_brutto / (vat / 100 + 1);
    price_netto = number_format(price_netto, 2, '.', '');
    if (Math.floor(price_brutto) <= 0) {
      $('#price_netto_promo').val('');
      $('#price_brutto_promo').val('');
      return true;
    }
    return $('#price_netto_promo').val(price_netto);
  }

  // --- Generowanie SKU ---
  function generate_sku_code(product_id) {
    $.ajax({
      type: 'POST',
      cache: false,
      url: '/admin/shop_product/generate_sku_code/',
      data: { product_id: product_id },
      beforeSend: function() { $('#sku').addClass('disabled'); },
      success: function(data) {
        $('#sku').removeClass('disabled');
        var response = jQuery.parseJSON(data);
        if (response.status === 'ok') {
          $('#sku').val(response.sku);
        } else {
          create_error(response.msg);
        }
      }
    });
  }

  // --- Generowanie linku SEO ---
  function generate_seo_links(lang, title, article_id) {
    if (title === '') return false;

    $.ajax({
      type: 'POST',
      cache: false,
      url: '/admin/pages/generateSeoLink/',
      data: { title: title, article_id: article_id },
      beforeSend: function() {
        $('#seo_link_' + lang).parents('.g-form-data').find('input, a').each(function() {
          $(this).prop('disabled', true).addClass('disabled');
        });
      },
      success: function(data) {
        $('#seo_link_' + lang).parents('.g-form-data').find('input, a').each(function() {
          $(this).prop('disabled', false).removeClass('disabled');
        });
        var response = jQuery.parseJSON(data);
        if (response.status === 'ok') {
          $('#seo_link_' + lang).val(response.seo_link);
        } else {
          create_error(response.msg);
        }
      }
    });
  }
</script>