Плагин LVSpoiler - спойлеры с динамической загрузкой изображений

[Arkadiy]

«Lazy Velo Spoiler» является эволюционной версией плагина «pb_spoiler» от beliyadm.

Главные особенности (опции) нашего плагина:
1. Подгрузка изображений только для открытых и открывающихся спойлеров. Это позволяет оперировать большими массивами изображений не увеличивая нагрузку на сервер и не замедляя загрузку страницы.
На данный момент механизм динамической подгрузки выглядит по-разному для jQuery и MooTools вариантов (в первом случае спойлер сразу открывается, а вместо изображений появляются заглушки в виде прелоадеров, во втором – спойлер открывается после загрузки всех изображений внутри себя, а индикатор загрузки возникает рядом с заголовком спойлера).

2. Опции jQuery и MooTools максимально унифицированы, в результате чего пользователь может безболезненно выбирать любую версию, не теряя настроек и функционала.

3. Параметр «оставлять открытыми» вынесен внутрь синтаксиса плагина, что позволяет создавать произвольные комбинации закрытых/открытых спойлеров для каждой страницы сайта.

4. Языковые константы вынесены в ini-файлы, что позволяет легко переводить плагин на нужный язык. В настоящий момент доступны русская и английская версия.

На сегодня плагин существует только для Joomla версии 1.5.20 и выше.  При выборе MooTools-версии необходимо активировать системный плагин MooTools-upgrade.

Правила использования:
В текст статьи необходимо вставить следующую конструкцию:

Код:

{spoiler title=Заголовок opened=1}Скрытый текст{/spoiler}

где opened - состояние спойлера при загрузке страницы, 1 - открыт, 0 - закрыт.

В работе помогали:
effrit - доработка mootools-спойлера, английская локализация, свежие идеи
staticlight - английская локализация
Lexx - версия для Joomla 1.7
al-teen - стилевое оформление спойлеров

Системные требования для 1.5 - версия Joomla не менее 1.5.22 и включенный плагин mootools upgrade.

Скачать самые свежие версии можно здесь http://argens.ru/index.php/9-my-extension/7-lazy-velo-spoiler.html

Демо:
http://argens.ru/index.php/9-my-extension/5-loginza.html - 1.7.1 mootools
http://test.barier-cs.com/ - 1.5.22 jQuery

Внизу прикреплены кнопки вставки кода спойлера на страницу для Joomla 1.5 и 1.7 соответственно. Так-же прикреплен спойлер 1.0.7 версии, работающий в 1.5, 1.6 и 1.7.

[Arkadiy]

Обновил версии плагинов до 1.0.6, исправлена работа спойлера в ие 7, 8, частично в 9 (в версии для Joomla 1.7 работает хорошо, а  для Joomla 1.5 только в режиме совместимости). Грешу на более старую версию mootools в 1.5.22, на которой испытывал.

[gost1k]

Было бы здорово если спойлер по умолчанию без преписки opened=# устанавливал значение на 0, и вообще отображался на сайте, без добавления. И еще самое главное. Сделать в спойлере что информация внутри него загружается при открытии, можно было бы работать с массивной информацией на сайте, не перегружая загрузку страницы.

[Arkadiy]

1. Без прописки opened регулярное выражение сбивается, так-что без него никуда.
2. Сколько надо текста, чтобы он поимел сколько-нибудь существенный вес в мегабайтах? Думаю чересчур много чтобы его пихать на одну страницу. Например книжки в электронном виде с чтивом дня на 3-7 имеют вес около мегабайта - двух.

[effrit]

угу, кроме графики что ещё массивным быват? только видео и звук. так тто не сильно актуально.
а вот на счёт дефолтного opened - я тоже изначально его предлагал опциональным сделать, но раз уж Аркадий сделал так, то нехай буде ). в конце концов, есть плагины для организации кнопки, для вставки готовой конструкции в визивиг, так что не сильно критично )

[Arkadiy]

Можно сделать другой плагин, который при открытии спойлера подтягивает указанную статью (в общем любой контент Joomla), но путать его сюда довольно сложно получится т.к. принципы действия совершенно различные.

[effrit]

спойлеры со статьями вроде видел уже )
с AJAX подкгрзкой хтмла - точно есть на JED.
так что смысла, действительно, мало в усложнеии функционала - это спойлер для.. гхм.. спойлеров и картинок.

[gost1k]

Ну я столкнулся с такой проблемой.
Тащу видео из контакта. А когда прогружается страница, собственно прогружается и видео, а если там 200+ видео файлов. что сопутно сериалам и аниме, выходит мягко сказать не особо весело. а про opened - просто запарило везде дописывать. причем он идет после названия, править много названий тоже не весело. В принципе склоняюсь к мысли разбивать страницы.

[Arkadiy]

Переделал тестовую страницу, с настройкой "Показать по" "Нажатию и перейти к УРЛ" jQuery, очень прикольно на больших объемах информации смотрится с подтягиванием заголовка кверху. Mootools тоже подтягивает, но без анимации и часто неверно из-за того, что браузер считает расстояние от заголовка до верха в момент раскрытия одного спойлера и закрытия другого, т.е. в движении. Надо сделать чтобы он это делал после того как спойлеры отработают.

[effrit]

да, эффектно ). хотя я обычно не люблю подобыне свистелки ). больше нравится прямая логика- где нажал, там и открыл )

[Arkadiy]

Если отключить этот эффект, то текст спойлера, если он больше страницы, вообще творит всякие безобразия, на небольших размерах конечно этот эффект будет лишним.

[Arkadiy]

LVSpoiler1.0.8_j1.5_j1.7.zip опубликован в первом посте этой темы. Добавил font-family для заголовков спойлеров, тени для шрифта заголовка и бокса заголовка. Что получилось смотреть здесь http://argens.ru/demo.html

[effrit]

wfedin, у каждого спойлера итак есть уникальный ID (в рамках статьи):
1_spoiler
2_spoiler
...
если добавить к нему ещё и ID материала, то получется вообще уникальный идешник.

[wfedin]

У тебя в верстке проблемы.

Вот на дефолтном шаблоне beez_20

Опять проблемы вёрстки.

[wfedin]

Тем проще осталось увязать значение ид и ширины — если неуказано использовать ширину по дефолту
wfedin, у каждого спойлера итак есть уникальный ID (в рамках статьи):
1_spoiler
2_spoiler
...
если добавить к нему ещё и ID материала, то получется вообще уникальный идешник.

Остаётся теперь увязать ид и ширину, если неуказано используем настройки плагина.

[al-teen]

Код и CSS этой страницы покажите.У всех нормальное отображение, в том числе и на демо, у одного wfedin не получается.Аркадий, ты случайно специально для него, какую нибудь специальную кривую версию не делал?

[Arkadiy]

LVSpoiler_wfedin_editon, само собой
Просто если в редакторе вставлять картинку и делать ее выравнивание по правому краю, то оно делается float: right, следовательно все следующее за ним надо отделить clear: both как сделал я на демо, либо если хочется выстроить спойлер не снизу а слева от картинки, то надо задать диву, содержащему спойлер соответствующий марджин справа и все будет нормуль. Я не верстальщик, но азы-то все знать должны.

[wfedin]

надо задать диву, содержащему спойлер соответствующий марджин справа и все будет нормуль. Я не верстальщик, но азы-то все знать должны.

Или указать диву style="width:56?px" Но мы ведь не о костылях, правда?
Если не можете или невозможно сделать правильное обтекание изображений спойлером без костылей — давно б сказали и разговора небыло. Ато втираете про вёрстку лабуду какую-то.

[wfedin]

у одного wfedin не получается.Аркадий, ты случайно специально для него, какую нибудь специальную кривую версию не делал?

У меня таки всё получается, а вот жена у меня ни HTML ни CSS не знает.

[Arkadiy]

Но мы ведь не о костылях, правда?

Правда, мы о правилах верстки. Дело не в спойлере.

[effrit]

wfedin, это не лабуда. спойлер ведь не волшебный. он просто берёт часть контента и заключает её в дополнительные блоки.
отсюда и возможные проблемы с уплытием вёрски.
выложи сайт в сеть и дай ссылку, чтобы можно было давать конкретные рекоммендации, а то так погрязнем во взаимообвинениях )

al-teen, человек багрепортит, давай спокойнее относится к подобным сообщениям, иначе никакого отклика не будет от людей )

[wfedin]

Так о чём уже говорить вроде наконец выяснили что без костыля его не заставить нормально обрабатывать float.
Впринципе я без претензий, плагин и без того супер с минимумом знаний HTML и CSS всё настраивается. А там уж на усмотрение автора.

[wfedin]

Правда, мы о правилах верстки. Дело не в спойлере.

Может я чего-то непонимаю, но ведь только спойлер не учитывает место занимаемое изображением. При этом текст обтекает изображение как надо, а все рамки лезут не видя  картинки.

[Arkadiy]

Ну ты вставь туда любой див с любым текстом, заплывет под картинку.
У спойлера нет общего контейнера, по этому не получится в спойлере что-то с этим сделать.

[al-teen]

Аркадий, не помню добавлял или нет, когда оформлял.Добавь для раскрывающегося блока overflow: hidden; в цсс.По идее это должно решить проблему

[Arkadiy]

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

[al-teen]

Потому что для картинки задано свойство float.Он является условно-абсолютным.А через overflow ограничивается рамками контейнера.Причем сам контейнер тянется в зависимости от подобного блока

[wfedin]

Аркадий, не помню добавлял или нет, когда оформлял.Добавь для раскрывающегося блока overflow: hidden; в цсс.По идее это должно решить проблему

А с простым дивом сработало. Красиво, + за науку.

[wfedin]

Ну ты вставь туда любой див с любым текстом, заплывет под картинку.
У спойлера нет общего контейнера, по этому не получится в спойлере что-то с этим сделать.

Нечего возразить, таже ситуция. Помог совет от al-teen

[wfedin]

al-teen вот светлая голова, одна строчка для jQuery

Код:

.thelanguage {overflow:hidden;}

и

Я счастлив!
А мотулз так у меня толком нехотит работать.