ПафНутиЙ-Блог » Модули » {AJAX FULL-STORY} — модуль AJAX-загрузки полной новости для DLE

{AJAX FULL-STORY} — модуль AJAX-загрузки полной новости для DLE

10.01
130
15624
{AJAX FULL-STORY} — модуль AJAX-загрузки полной новости для DLE


Бесплатный модуль {AJAX FULL-STORY} позволяет организовать на сайте под управлением DataLife Engine быстрый просмотр полной новости на AJAX. А благодаря правильному кешированию он работает очень эффективно.

Особенности модуля


- Не требует каких-либо правок движка.
- Учёт прав доступа к новости. Если пользователю по каким то причинам запрещено просматривать полную новость в настройках - он не сможет её посмотреть.
- Подсчёт количества просмотров. Модуль учитывает настройки DLE и если требуется - засчитывает просмотр новости.
- Корректная очистка кеша модуля. Кеш модуля очищается в соответствии с правилами автоочистки кеша DLE, поэтому в быстром просмотре новость будет всегда актуального содержания.
- Поддержка всех тегов. Модуль поддерживает все теги шаблона fullstory.tpl. Если тег не нужен в быстром просмотре - вместо него будет пустота. (форма добавления комментариев, сами комментарии).
- Кеширование на стороне клиента. Модуль отдаёт правильные заголовки. Если включено кеширование на сайте и пользователь повторно вызовет быстрый просмотр новости - браузер получит в ответ 304 статус и отдаст пользователю закешированную (в браузере) страницу.

Требования к установке


  • Версия DLE: 10.2+ (на более старых не проверялся, но должен работать вплоть до 9.6)
  • Прямые руки.


Установка


  1. Скачать актуальную версию модуля
  2. Если сайт работает в кодировке windows-1251, необходимо перекодировать файлы модуля в эту кодировку.
  3. Распаковать содержимое папки upload в корень сайта.
  4. В нужном месте любого шаблона вставить минимальный код:

    <span data-afs-id="{news-id}">Быстрый просмотр</span>

    где
    {news-id}
    - ID новости (обязательный параметр).

  5. Так же можно использовать дополнительные атрибуты:

    <span 
    	data-afs-id="{news-id}" 
    	data-afs-template="mytemplate" 
    	data-afs-preset="mypreset"
    >Быстрый просмотр</span>


    - data-afs-template="mytemplate" - Путь к шаблону модуля относительно текущей папки с шаблоном сайта. Если на сайте разрешена смена скина, то путь будет построен относительно активного в данный момент шаблона сайта. По умолчанию: **{THEME}/ajax/fullstory**. (Необязательный параметр).
    - data-afs-preset="mypreset" - Путь к файлу с настройками модуля. По умолчанию не используется.

  6. В js файл шаблона вставить:

    $(document).on('click', '[data-afs-id]', function () {
    	var $this = $(this),
    		$data = $this.data();
    
    	$.ajax({
    			url: dle_root + 'engine/ajax/full-story.php',
    			type: 'GET',
    			dataType: 'html',
    			data: {
    				newsId: $data.afsId, // Обязательная переменная
    				preset: ($data.afsPreset) ? $data.afsPreset : '', // Название файла с настройками (необязательно)
    				template: ($data.afsTemplate) ? $data.afsTemplate : '', // Название файла с шаблоном (необязательно)
    			},
    		})
    		.done(function (data) {
    			var $html = $(data);
    
    			// Данные получены, можно заняться разбором и показать их в диалоге
    			// Ниже простейший пример вывода контента в стандартном модальном окне DLE
    
    			var modalId = 'afs-' + $data.afsId + '-' + $data.afsPreset + '-' + $data.afsTemplate;
    			modalId = modalId.replace(/\//g, "-");
    
    			var $modalBlock = $('<div style="display: none;"><div id="' + modalId + '"></div></div>');
    
    			$modalBlock
    				.appendTo('body') // Добавляем блок на страницу
    				.find('#' + modalId) // Ищем интересующий нас селектор
    				.html($html) // Вставляем в него полученный код
    				.dialog({ // Показываем модальное окно
    					width: 800
    				});
    
    		})
    		.fail(function () {
    			console.log("full-story error");
    		});
    });



  7. В CSS-файл шаблона вставить код для стилизации выводимых ошибок:

    .afs-error {
    	/*Общий стиль для всех ошибок*/
    	padding: 20px;
    	background: #fff;
    	color: #424242;
    }
    .afs-news-error {
    	/*Стиль ошибки, если новость не найдена*/
    	background: #eceff1;
    }
    .afs-tpl-error {
    	/*Стиль ошибки, если не найден шаблон*/
    	color: #b71c1c;
    }
    .afs-perm-error {
    	/*Стиль ошибки, если не достаточно прав для просмотра полной новости*/
    	background: #e65100;
    	color: #F5F5F5;
    }

  8. Не забудьте подправить JS и CSS код под свой сайт smile.

Параметры, принимаемые модулем


Модуль принимает через GET-запросы следующие параметры:
- newsId - Обязательный параметр. ID новости для показа.
- template - Путь к шаблону модуля относительно текущей папки с шаблоном сайта. Если на сайте разрешена смена скина, то путь будет построен относительно активного в данный момент шаблона сайта. По умолчанию:
{THEME}/ajax/fullstory

- preset - Путь к файлу с настройками модуля. По умолчанию не используется.

Настройки модуля


Настройки модуля хранятся в отдельном файле, это сделано для безопасной передачи настроек и уменьшения нагрузки на хостинг.
Для хранения настроек был выбран формат шаблона т.к. его можно отредактировать через админпанель.

При формировании настроек необходимо соблюдать следующий синтаксис:
- Параметры необходимо писать по одному в строке.
- Имя параметра и его значение необходимо разделять знаком равенства.

На данный момент возможно использование следующих параметров:
  • fields - Поля, отбираемые из БД.
    Доступны следующие поля для запроса:
    - short_story, full_story, xfields, comm_num, fixed, tags
    - Так же можно использовать поле all, тогда будут отобраны все возможные поля новости из БД. Аналогичный результат будет, если не передавать в модуль переменную preset или передать её пустой.
  • cachePrefix - Префикс кеша, создаваемого модулем. По умолчанию full. Если вы хотите, чтобы кеш модуля автоматически не чистился - можно изменить этот параметр.

Подробнее о настройках и работе с модулем читайте в обновляемой документации.

Надеюсь модуль будет полезен не только мне. Жду ваших отзывов!

Похожие материалы

  • EditRating — модуль для лёгкого редактирования рейтинга в DataLife Engine
  • UniForm — модуль универсальных ajax-форм для DataLife Engine
  • RSS Comments Pro модуль rss-ленты комментариев для DLE
  • Easy Like - модуль организации системы лайков новостей для DLE 9.x - 10.x (обновлено до 1.4)
Закрыть

Комментировать могут только зарегистрированные пользователи

+

Комментарии

ПафНутиЙ
ПафНутиЙ 13 февраля 2015 19:25
Ответов: 4 #4629
социальные кнопки работают на js, но инициализация их происходит в момент загрузки страницы.
Через ajax страница не загружается, а просто добавляются новые элементы в DOM-дерево, поэтому необходимо повторно инициализировать всё, что не "слушает" события.
Scaver
Scaver 13 февраля 2015 19:28
Ответов: 3 #4630
то есть нужно в full-story.tpl добавить скрипты?
ПафНутиЙ
ПафНутиЙ 13 февраля 2015 19:37
Ответов: 2 #4632
Зачем? их нет на странице в момент загрузки?
Scaver
Scaver 13 февраля 2015 19:52
Ответов: 1 #4633
Есть, не понял что нужно сделать ))
ПафНутиЙ
ПафНутиЙ 13 февраля 2015 22:00
Ответов: 0 #4634
Я не смогу объяснить т.к. для меня это простые вещи, а для вас - незнакомые буквы.
Тут либо учить матчасть, либо идти к фрилансерам.
Axel
Axel 18 февраля 2015 15:39
Ответов: 1 #4652
Необходимо в категории к новости вывести краткое описание, которое состоит из текста описания и некоторых доп. полей. Выводить хочу в всплывающем окне. Но вот я не хочу, чтобы в коде страницы было видно все это описание. я так понимаю, данный модуль подходит для этого?
ПафНутиЙ
ПафНутиЙ 18 февраля 2015 19:11
Ответов: 0 #4656
Модуль не работает с описаниями категорий.
Axel
Axel 18 февраля 2015 19:58
Ответов: 1 #4659
ПафНутиЙ,
Описание не категории, а новости. То есть в shortstory вывести частично информацию из fullstory, при этом чтобы в исходном коде небыло текста этого текста. Не хочу дублирлвать по сайту описание...
ПафНутиЙ
ПафНутиЙ 18 февраля 2015 20:14
Ответов: 0 #4661
это можно.
webtheory
webtheory 25 февраля 2015 17:58
Ответов: 3 #4669
Здравствуйте, Павел.Благодарю за модуль.
я создал галерею для сайта , при клике на картинку появляется модальное окно в который погружается контент из html файла который имеет определенную структуру .контент подгружается с помощью jquery.load() .
вопрос состоит в том как можно подгружать данные из Full-story с помощью вашего модуля.
ПафНутиЙ
ПафНутиЙ 25 февраля 2015 19:00
Ответов: 2 #4671
Просто замените .load на ajax, и подставьте нужный url.
webtheory
webtheory 25 февраля 2015 19:59
Ответов: 1 #4672
нужный адрес вводится как ID когда я подставляю в качестве ссылки этот параметр {news-id} ничего не работает .
http://webtheory.info/gallery.html
ПафНутиЙ
ПафНутиЙ 25 февраля 2015 20:18
Ответов: 0 #4673
возьмите код из статьи.
Lafler
Lafler 28 апреля 2015 18:08
Ответов: 1 #4743
Здравствуйте, пожалуйста обьясните мне в 2-х словах для чего он? на сайте: http://quantum-soft.ru/ используется именно этот модуль7
ПафНутиЙ
ПафНутиЙ 28 апреля 2015 18:30
Ответов: 0 #4745
Для ajax загрузки полной новости.
Думаю если вам эти слова ни о чём не говорят - модуль вам тоже не нужен.
По поводу сайта лучше спросить у его владельца, я не подскажу.
Lafler
Lafler 28 апреля 2015 19:18
Ответов: 1 #4746
Показать предыдущие новости, оно?
ПафНутиЙ
ПафНутиЙ 28 апреля 2015 19:27
Ответов: 0 #4747
нет.
igorello
igorello 14 мая 2015 08:37
Ответов: 3 #4798
Сделал на сайте в сайдбаре что-то типо "быстрые новости". Контент: посты из группы ВК. При клике на ссылку, ajax-fullstory открывает полную новость, все отображается. Но если закрыть окошко и заново кликнуть на ссылку, то окно открывается, но пост из ВК уже не подгружается. Как побороть? Код вк выдает типо такого:
<div id="vk_post_-42771288_93784"></div><script type="text/javascript">  (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//vk.com/js/api/openapi.js?116"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'vk_openapi_js'));  (function() {    if (!window.VK || !VK.Widgets || !VK.Widgets.Post || !VK.Widgets.Post("vk_post_-42771288_93784", -42771288, 93784, 'UCkwZ9BIazy5WCUTZ7uYasJNkDA', {width: 500})) setTimeout(arguments.callee, 50);  }());</script>

Вставляю этот код через 4 дополнительных поля. Шаблон полной новости "по умолчанию" из папки ajax, там только {title} и этот код.
Заранее спасибо.
ПафНутиЙ
ПафНутиЙ 14 мая 2015 09:04
Ответов: 2 #4799
Возможно где-то происходит ошибка, либо скрипт не отрабатывает по иной причине. Нужно видеть сайт.
igorello
igorello 14 мая 2015 09:49
Ответов: 1 #4800
Паша, вот здесь http://tancy-na-tnt.ru/ayaks-fulstori/
ПафНутиЙ
ПафНутиЙ 14 мая 2015 19:37
Ответов: 0 #4801
Виджет записывает данные в localstorage браузера, похоже поэтому и не обновляется его контент.
Думаю нужно использовать какой-то специальный виджет или очищать LS после закрытия окна, но не уверен что поможет.
aluminoter
aluminoter 2 июня 2015 22:37
Ответов: 0 #4834
Классный модуль. Очень классно подходит к каталогам. Либо то фильмы, либо презентация продукции.
В lightbox стало отлично, работает классно.
Спасибо за модуль!!!
NameUser
NameUser 6 июня 2015 00:11
Ответов: 4 #4839
Добрый день! Спасибо огромное, замечательный модуль!

Планируете ли реализовать комментирование?
ПафНутиЙ
ПафНутиЙ 7 июня 2015 20:45
Ответов: 3 #4844
в принципе идея такая была, но когда реализую - не скажу т.к. есть более приоритетные задачи.
NameUser
NameUser 9 июня 2015 19:25
Ответов: 0 #4847
В таком случае - спасибо за надежду на продолжение :) Буду ждать.
doktorpull
doktorpull 30 июля 2015 15:23
Ответов: 1 #4981
А есть возможность спемощью этого модуля вывести добавление новостей в модельном окне? и регистрацию?
ПафНутиЙ
ПафНутиЙ 2 августа 2015 08:03
Ответов: 0 #4984
Нет, т.к. модуль предназначен для просмотра новостей.
2100001518302
2100001518302 4 июля 2015 21:18
Ответов: 1 #4926
Здраствуйте Уважаемый Павел!
Скажите пожалуйста как из всплывающего окна полной новости убрать или закрыть ссылки(например ссылка с файлообменника)?Т.е чтобы ссылки не были видны во всплывающем окне зарегистрированным пользователям!
ПафНутиЙ
ПафНутиЙ 23 августа 2015 10:46
Ответов: 0 #5021
пробовали использовать тег
[group]
?
river
river 20 августа 2015 20:56
Ответов: 1 #5015
В отдельный файл вывел JS и CSS код, который вы приложи к инструкции. В shot-story добавил ваш "<span />", но быстрый просмотр" не работает.

Клацал, обновлял кеш, перекодировал все ваши файлы - ничего.

В чем ошибка? И что нужно прописывать в файлах preset-defaultю и fullstory, я их не не исправлял.

Информация

Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.