templates/ProfileList/_show_more.profiles.html.twig line 1

Open in your IDE?
  1. {% set totalPages = (profiles.totalCount / profiles.currentLimit)|round(0, 'ceil') %}
  2. <div class="d-flex justify-content-center" id="showmore_container">
  3.     <button class="show-more btn btn-danger align-items-center justify-content-center{{ totalPages == 0 or totalPages == 1 or totalPages == profiles.currentPage ? ' d-none' : '' }} rounding  mb-1"
  4.         type="button" id="showMoreBtnShowMore" data-show-ignore>Показать еще</button>
  5. </div>
  6. <script type="text/javascript">
  7.     document.addEventListener('DOMContentLoaded', function() {
  8.         window.moreLoader = new MoreLoader({
  9.             'btnMoreSelector': '#showMoreBtnShowMore',
  10.             'containerSelector': '#profile-list',
  11.             'receiveRenderedResponse': true,
  12.             'responseCallback': function(response) {
  13.                 const profileListRoot = document.getElementById('profile-list');
  15.                 const existIdSet = new Set([...profileListRoot.querySelectorAll('.models-item-col')].map(el => {
  16.                     const id = +el.dataset.profileId;
  17.                     return isNaN(id) ? null : id;
  18.                 }).filter(id => id !== null));
  20.                 const div = document.createElement('div');
  21.                 div.innerHTML = response;
  23.                 const profileListResponse = [...div.querySelectorAll('.models-item-col')];
  24.                 const responseIdList = [];
  26.                 {# // Добавляем только новые элементы и собираем их ID #}
  27.                 profileListResponse.forEach(el => {
  28.                     const profileId = +el.dataset.profileId;
  29.                     if (!isNaN(profileId) && !existIdSet.has(profileId)) {
  30.                         profileListRoot.appendChild(el);
  31.                         responseIdList.push(profileId);
  32.                     }
  33.                 });
  35.                 if (responseIdList.length < 4) {
  36.                     setTimeout(()=>{
  37.                         window.moreLoader.showMore();
  38.                     }, 10)
  39.                 }
  41.                 document.querySelectorAll('.pagination').forEach(function (el) {
  42.                     el.style.display = 'none';
  43.                 });
  46.                 document.querySelectorAll('img.lazy').forEach(function (el) {
  47.                     if (el.hasAttribute('data-src'))
  48.                         el.src = el.dataset.src;
  49.                 });
  51.                 document.dispatchEvent(new Event("filter:load:finish"));
  52.             },
  53.             'templateSelector': null,
  55.             'url': '{{ app.request.requestUri }}',
  56.             'urlCity': '{{ app.request.attributes.get('city').uriIdentity }}',
  57.             'urlPagePartTemplate': 'page%N%/',
  58.             'currentPage': {{ profiles.currentPage }},
  59.             'totalPages': {{ (profiles.totalCount / profiles.currentLimit)|round(0, 'ceil') }},
  60.             'perPage': 5,
  61.             'itemsInRow': 2,
  62.             'recordsArrayName': 'profiles',
  63.         });
  64.     });
  65. </script>
  66. {% include 'ShowMore/_show_more.base.html.twig' %}