Автоподгрузка записей типа контента 2.X

747
В рамках работы над одним проектом понадобилась Автоподгрузка записей типа контента при прокрутке.
Оформил разработку в виде отдельного компонента, который подключается в шаблоне списка записей типа контента.
И делюсь им.

Что это

Автоподгрузка записей типа контента

Обычная автоподгрузка записей. Работает в двух режимах - по клику и автоматически. В месте размещения выводится кнопка, клик по которой подгрузит ниже записи со следующей страницы

Кнопка (и стили и скрипты) выводятся следующим кодом

Код PHP:
  1. <?php
  2. if($total > $page * $perpage){
  3. $this->renderControllerChild('zloading','button',[
  4. ]);
  5. }
  6. ?>
Этот код надо разместить в файле списка записей (например, default_list.tpl.php или сделать копию этого файла и назвать типконтента_list.tpl.php, чтобы использовать автоподгрузку только в одном типе контента) ДО кода вывода пагинации

Код PHP:
  1. <?php echo html_pagebar($page, $perpage, $total, $page_url, array_merge($filters, $ext_hidden_params)); ?>

Автоматическая подгрузка

Если нужен режим автоматической подгрузки, то нужно добавить параметр вот так

Код PHP:
  1. <?php
  2. if($total > $page * $perpage){
  3. $this->renderControllerChild('zloading','button',[
  4. 'auto' => true
  5. ]);
  6. }
  7. ?>
тогда новые записи будут подгружать автоматически при прокрутке.

Демо

Испытать в работе можно тут

Ограничения

Автор захотел сделать еще один велосипед на IntersectionObserver и сознательно не использовать сторонних библиотек автоподгрузки. Настаивать на их использовании бесполезно.
Компонент предоставляется как есть, бесплатно. Автор не несет никакой ответственности.
Компонент не пишет ничего в базу. Поэтому для удаления просто удалите файлы компонента.
Предназначен только для шаблона modern (и дочерних)

Вебмастерам

После подгрузки очередной страницы вызывается событие icms_zloading_loaded. Вы можете использовать его, чтобы переинициализировать скрипты во вновь подгруженных записях. Пример использования события есть в templates/modern/controllers/zloading/button.tpl.php

Где взять

В списке файлов моего профиля https://instantcms.ru/users/1009/files.html
Последняя актуальная версия на момент написания zloading20210103_1.0.0 https://instantcms.ru/users/files/download7785.html
Там же всегда будет последняя актуальная версия разработки, если обновления таки будут.

Обратите внимание! В архиве для примера находится файл templates/modern/content/news_list.tpl.php с включенным в него кодом для вывода автоподгрузки. Этот шаблон применится к типу контента news, если таковой есть. Вы можете удалить этот файл или переименовать. Или не копировать при установке.
Быстропоиск
Комментарии (15)
Алексей 3 января 2021 в 22:35 -9
Это конечно супер что Вам заказали и Вы сделали. 97% разработок тут так и появляются. Упакуйте в готовое решение. Люди будут покупать кому надо.
Дай тут что то то бесплатно -Но рассказав как это сделать что бы заработало- это для тех кто что бы попробовать. На реальных проектах вряд ли люди будут ставить. Соберите по человечески - выставите счет например я бы купил за 600 руб.+ сделайте описание+ оформите в каталог дополнений.
Zau4man 4 января 2021 в 08:57 +2
Это готовое решение. Осталось только подсказать компоненту, где его ждут, разместив в шаблоне небольшой кусок кода.

Я думал сделать виджетом, но виджет не знает про пагинацию. Можно грузить все скрипты при каждом вызове виджета, искать пагинацию, и если есть пагинация, запускать код в работу. Мне такой вариант не подходит.

Сделать решение универсальным для всех не получится. У всех разные поля, из коробки будут работать только поля без интерактива. Например, не получится так подгрузить яндекс карту, нужно будет немного танцев. И т.п.
Def 4 января 2021 в 04:26 0
Было бы отлично после прочтения записи типа контента, чтобы подгружалась следующая, как сейчас на многих контентных новостных сайтах.
Это тоже отличное дополнение!
Zau4man 4 января 2021 в 09:03 +1
чтобы подгружалась следующая
нельзя сделать универсальное решение. Ну или я не могу сделать это. Скрипты, подгруженные ajaxом, должны быть адаптированы к тому, чтобы сработать на вновь показанных записях и др.

Сделать под конкретный сайт и набор полей в принципе можно.
Василич 4 января 2021 в 22:14 +1
У вас есть на это время? Сделать для актуального шаблона, для обычного типа контента(например новости), грузить после комментов и пары виджетов и в конце написать маленькую инструкцию, чтоб можно было переделывать под свои нужды.
Если есть время, сколько будет стоить данная разработка?
Спасибо.
Zau4man 5 января 2021 в 15:11 +1
Я посмотрю, как будет время.
Интересно, удастся ли "завести" комментарии у подгруженных записей.
Zau4man 11 января 2021 в 22:20 0
Комментарии "завести" не удалось. Там совпадают идентификаторы, надо править шаблоны.
Пока получилось так

Gifка на 2.5мб, ахтунг
Завтра постараюсь сделать живое демо.
Tolya 4 января 2021 в 09:10 +1
Потыкался в демо, и вот что думаю можно доработать. чтоб при скроле в верх также подгружались записи. Для чего всё это, докрутил я до 2й страницы перешёл в запись -> почитал нажал назад и попадаю на 2 страницу, то есть верхних записей нет, а если надо... smile
DeDja 4 января 2021 в 10:19 0
Изложенное Вами весьма приемлемо и не ново.

Смотреть:
https://instantcms.ru/forum/thread18939-1.html
https://instantcms.ru/blogs/bitblog/modul-avtopodgruzki-stranic-dlja-instantcms-2-x.html

Небольшая демка с модулем от Val на моём стареньком демо сайте - http://xyz-nk.ru/activity
Tolya 4 января 2021 в 18:03 0
Изложенное Вами весьма приемлемо и не ново.
Я в курсе что такое есть и практикуется в отдельных сторонних библиотек.
livecom 4 января 2021 в 16:12 0
И было бы здорово, если что-то подобное сделать для контента в записях. Например, при достижении определенного количества знаков, появляется кнопка "Читать дальше".
Scythian 4 января 2021 в 16:16 +3
Zau4man, спасибо большое за безвозмездно предоставленное полезное дополнение! v
Сергей 4 января 2021 в 20:02 +1
Поддержу Scythian. Тоже, спасибо большое Zau4man
F_a_R_i_D 4 января 2021 в 22:10 0
Нужная вещь, спасибо!
Но без пагинации было бы лучше.
Zau4man 5 января 2021 в 15:09 +1
Вы можете скрыть ее стилями.
Без пагинации не получится узнать ссылку на следующую страницу.