Плагин “Content - Spoiler Text” - скрытый текст в контенте (спойлер)

[beliyadm]

Плагин “Content - Spoiler Text” - скрытый текст в контенте, версия 1.0

Что это такое - возможность создать в контенте разворачиваемые блоки скрытого текста с эффектом анимации, при этом используется библиотека Jquery и плагин Accordeon от разработчика Jörn Zaefferer

Последовательность действий:
1 - установить плагин (и по желанию кнопку для редактора), опубликовать их (Content - Spoiler Button и Content - Spoiler text)
2 - в режиме редактирования материала вставить теги (либо нажать кнопку Spoiler)

Код:

{spoiler title=Скрытый текст}здесь скрытый от посторонних глаз текст{/spoiler}

3 - вписать нужный текст
4 - можно задавать произвольный текст заголовка скрытого блока (параметр title является обязательным!), допустимыми являются символы кириллицы, цифры 0-9 и символ подчеркивания _
5 - в параметрах плагина возможно указать необходимость подгрузки библиотеки Jquery (если уже используется на сайте) и скорость разворачивания скрытого блока (по умолчанию 200 мс)
6 - оформление заложено в файле plugins/content/pb_spoiler/style.css
7 - возможно использовать HTML форматирование внутри скрытого блока (теги, изображения, прочее)
8 - в параметрах плагина кнопки можно выставить значение заголовка по умолчанию

Где можно использовать:
1 - создание простейшего FAQ на сайте в пределах одной страницы
2 - просто скрытые блоки информации, не особо актуальной для пользователя
3 - да мало ли где еще

Тестировалось: Joomla 1.5.10, Mozilla, Opera, Safary (MS), GChrome. Под ИЕ-шками не смотрел

UPD - версия плагина 1.1 (pb_spoiler_plg_1.1.zip)
1 - добавлен функционал работы как от библиотеки Jquery, так и встроенного в движок mootools - опционально указывается в настройках плагина, по умолчанию mootools
2 - удалена опция указания скорости прокрутки, по умолчанию выставлено 400 мс для обоих скриптов
3 - исправлена ошибка подгрузки скриптов

Обновление - версия плагина 1.3 от scorpsan

там все сделано и в настройках есть куча параметров которыми можно заставить спойлеры открываться и закрываться как вам нужно....

Версия 1.2 для J!1.6 от VDG
Скачать http://narod.ru/disk/16864442001/plg_pbspoiler_1.2.zip.html
Изменения

Показать текстовый блок

1. Работа в Joomla 1.6
2. Убраны стили и картинки. Считаю, что стили — дело шаблона. Кому как надо так и оформляйте, включая стрелочки
3. Вывод теперь одинаков для обоих фреймворков, что упрощает правку стилей. Сделав изменения в шаблоне можете переключать движки в зависимости от желания, ничего не посыпется.
4. Обеспечена совместимость с IE6+, проверено в 6, 8 и 9
5. Поддержка многоязычности. Дана русская локализация
6. Из шаблонов убраны ссылки. Не хорошо, когда есть ссылки, которые не задействованы.

Дополнительно:

• Решение проблемы с юникодом и национальными языками

[beliyadm]

спойлер у меня не скрывает, весь скрытый текст открыт сразу и не сворачивается

проверить в исходном коде, что подключились необходимые скрипты и стили

[alex54]

проверить в исходном коде, что подключились необходимые скрипты и стили

я не програмист можно разжевать что и как проверить

[alex54]

кстати при редактировании новости выдает

Код:

Fatal error: Call to undefined method JSite::getSiteURL() in Z:\home\alex54.ru\satnsk\plugins\editors-xtd\pb_spoiler.php on line 32

такой же и с демокнопкой, только php уже кнопки

[beliyadm]

кстати при редактировании новости выдает

Код:

Fatal error: Call to undefined method JSite::getSiteURL() in Z:\home\alex54.ru\satnsk\plugins\editors-xtd\pb_spoiler.php on line 32

не знаю пока причину, не у всех корректно отрабатывает, решение здесь

[alex54]

с ошибкой разобрались - ушла
но спойлер не пашет, как проверить
 

проверить в исходном коде, что подключились необходимые скрипты и стили

и с демо кнопкой проблемы, ставлю плагин последним и кнопка становится дубль споилера с тем же функционалом
Joomla 1.5.10

[delphine]

Вопрос такой! Как сделать так чтобы текст отображался-скрывался не при клике, а при наведении мыши? Кто знает?
Предполагаю что нужно использовать onMouseover и onMouseout, но никак не могу прикрутить...

p.s. Разобрался

[ivieDVeD]

Всем привет! Чего только не пробовал - не работает. ставил разные версии (1,0 и 1,1) с кнопкой и без. В разных браузерах.. Бесполезно..
Отображаются ссылки и ничего не работает (см. приложение) Все установлено на Joomla 1.5.10

[delphine]

ivieDVeD, ссылка есть на сайт?

[ivieDVeD]

Он у меня локальном сервере 

[beliyadm]

ivieDVeD - с каким скриптом указываешь работу плагина (jquery или mootools)? Скрипты в HEAD подгружаются?

[ivieDVeD]

ivieDVeD - с каким скриптом указываешь работу плагина (jquery или mootools)? Скрипты в HEAD подгружаются?

В во вложении сохранил из браузера образцы страниц с jquery и mootools. Не работает в обоих случаях... Но выглядит по разному...
page_mootols.rar
page_jquery.rar
По началу думал дело в шаблоне, но при смене аналогичная ситуация...

[delphine]

А что же это такое?

Код

<script type="text/javascript" src=".../jquery.htm">
<script type="text/javascript" src=".../accordion.htm">
<link href=".../style.htm" type="text/css">

Ну и по мутулзу то же самое.

Код

<script type="text/javascript" src=".../spoiler_002.htm">
<link rel="stylesheet" href=".../spoiler.htm" type="text/css">

А где же JS, CSS. Так и должно быть "htm"?

А может конфликтуют скрипты? У тебя в самом начале грузятся jquery и mootools, а потом ещё раз этоже для сполера. А также позже ещё грузится accordionmenu.js. Может всё это хозяйство и глючит? попробуй всё поодключать, и посомотреть, заработает или нет. А потом потихоньку включай что отключил, и смотри в какой момент перестанет работать. Так и найдешь с кем конфликтует.

[ivieDVeD]

Не знаю что к чему, но я установил полностью с нуля Джумлу  v1.5.11 и поставил на нее плагин, то же самое...

[beliyadm]

Не знаю что к чему, но я установил полностью с нуля Джумлу  v1.5.11 и поставил на нее плагин, то же самое...

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

Код:

<script type="text/javascript" src=".../spoiler_002.htm">
<link rel="stylesheet" href=".../spoiler.htm" type="text/css">

а вот это действительно бред какой то, физически такого быть не должно

[doctorgrif]

а вот это действительно бред какой то, физически такого быть не должно

почему не должно? автор просто накосячил в написании плагтна и вместо  js и css накорябал htm
переписать в исходнике и делов то?

[beliyadm]

почему не должно? автор просто накосячил в написании плагтна и вместо  js и css накорябал htm

что значит автор накосячил? Плагин то мой собственный и нет там такого в коде

Код

$header 	.= '<script type="text/javascript" src="/plugins/content/pb_spoiler/mootools/spoiler.js"></script>';
$header 	.= '<link rel="stylesheet" href="/plugins/content/pb_spoiler/mootools/spoiler.css" type="text/css" />';
$mainframe->addCustomHeadTag($header);
 

[doctorgrif]

тогда извиняюсь, челом бъю об пол...
а автозамены (какой-никакой) у ТС нет? ну может в htaccess какая-то фигня прописана - по запрету загрузки js/css?
ручной способ установки меняет картину?

[delphine]

Что самое интересное, до и после все скрипты и css нормальные.

[beliyadm]

тогда самый простой вариант - закомментировать в файле плагина данные две строки и вставить в HEAD шаблона вызов данных JS CSS файлов

[ivieDVeD]

А теперь можно все понятным языком, что сделать чтобы все заработало? Уж очень понравился мне этот плагин...

[delphine]

1. Открываешь файл pb_spoiler.php.
2. Находишь там:

Код

$mainframe->addCustomHeadTag($header);

и комментируешь так:

Код

//$mainframe->addCustomHeadTag($header);

3. Сохраняешь изменения.
3. Открываешь файл шаблона.
4. В секцию HEAD дописываешь:
Если будешь использовать mootools

Код

<script type="text/javascript" src="/plugins/content/pb_spoiler/mootools/spoiler.js"></script>
<link rel="stylesheet" href="/plugins/content/pb_spoiler/mootools/spoiler.css" type="text/css" />

Если будешь использовать jquery

Код

<script type="text/javascript" src="'/plugins/content/pb_spoiler/jquery/jquery.js"></script>
<script type="text/javascript" src="'/plugins/content/pb_spoiler/jquery/accordion.js"></script>
<link rel="stylesheet" href="/plugins/content/pb_spoiler/jquery/style.css" type="text/css" />
<script type="text/javascript">
jQuery().ready(function(){
// applying the settings
 jQuery('.pbspoiler').Accordion({
  active: 'span.selected',
  header: 'span.head',
  alwaysOpen: false,
  animated: true,
  showSpeed: 400
 });
});
</script>

5. Сохраняешь.
6. Пользуешься.

(beliyadm, ошибок вроде нету?)

[delphine]

beliyadm, а такой вопрос. Использую jquery. А если на странице нет ни одного сполера, а всё эта байда для него всё-равно загружена, ошибок в IE не всплывает? 
В частности вот с этим блоком:

Код

<script type="text/javascript">
jQuery().ready(function(){
// applying the settings
 jQuery('.pbspoiler').Accordion({
  active: 'span.selected',
  header: 'span.head',
  alwaysOpen: false,
  animated: true,
  showSpeed: 400
 });
});

[beliyadm]

delphine - моя вина открой файл pb_spoiler.php и перетащи вызов функции pb_spoiler_css(); выше в функцию function pb_spoiler_replacer

[ivieDVeD]

Сделал все описанное delphine, все точно так же...

[beliyadm]

все должно быть корректно, было так

Код

function pb_spoiler_replacer ( &$matches )
	{
		//$jstype = pb_spoiler_params();
		$plugin 		=& JPluginHelper::getPlugin('content', 'pb_spoiler');
		$pluginParams 	= new JParameter( $plugin->params );
	 	$jstype 		= $pluginParams->get('jstype', 1);
		$html 			= '';
		$regex1 = "#{spoiler title=([_0-9A-Za-zА-яа-яЁё](.*?))}#s";
		$regex2 = "#{/spoiler}#s";
		$spoilertext = preg_replace($regex2, '', (preg_replace($regex1, '', $matches[0])));
 
		switch ($jstype) {
			case '1'; //mootools
			$html .= '<div class="spoiler">
			<div class="sp-head">
			<div class="sp-head-click"><a href="#">'.$matches[1].'</a></div></div>
			<div class="sp-body">'.$spoilertext.'</div>
			</div>';
			break;
			case '2'; //jquery
			$html .= '<ul class="pbspoiler">';
			$html .= '<li><span class="head"><a href="javascript:;" title="Развернуть">'.$matches[1].'</a></span>
			    	<ul>
			    		<li>'.$spoilertext.'</li>
			    	</ul>
		    	</li>';
		 	$html .= '</ul>';
		 	break;
		}
        return $html;
	}
pb_spoiler_css();

а должно стать так

Код

function pb_spoiler_replacer ( &$matches )
	{
		//$jstype = pb_spoiler_params();
		pb_spoiler_css();
		$plugin 		=& JPluginHelper::getPlugin('content', 'pb_spoiler');
		$pluginParams 	= new JParameter( $plugin->params );
	 	$jstype 		= $pluginParams->get('jstype', 1);
		$html 			= '';
		$regex1 = "#{spoiler title=([_0-9A-Za-zА-яа-яЁё](.*?))}#s";
		$regex2 = "#{/spoiler}#s";
		$spoilertext = preg_replace($regex2, '', (preg_replace($regex1, '', $matches[0])));
 
		switch ($jstype) {
			case '1'; //mootools
			$html .= '<div class="spoiler">
			<div class="sp-head">
			<div class="sp-head-click"><a href="#">'.$matches[1].'</a></div></div>
			<div class="sp-body">'.$spoilertext.'</div>
			</div>';
			break;
			case '2'; //jquery
			$html .= '<ul class="pbspoiler">';
			$html .= '<li><span class="head"><a href="javascript:;" title="Развернуть">'.$matches[1].'</a></span>
			    	<ul>
			    		<li>'.$spoilertext.'</li>
			    	</ul>
		    	</li>';
		 	$html .= '</ul>';
		 	break;
		}
        return $html;
	}

то есть вызов функции подгрузки скриптов происходит только в случае обнаружения вхождения ключевых тегов спойлера на странице

[delphine]

ivieDVeD, давай ещё раз страницу, уже с измененым кодом

[delphine]

beliyadm, а так правильно? у меня так в HEAD по два, три, четыре... раза все загружается...

у меня ошибка вылазит когда я в шаблон это вставляю

Код

jQuery().ready(function(){jQuery('.pbspoiler').Accordion({active:'span.selected',header:'span.head',alwaysOpen:false,animated:true,showSpeed:400}) });

а не на всех страницах есть этот pbspoiler
а только её в pb_spoiler.php оставить не могу, так как этот $header втыкается при загрузке раньше чем грузится сам скрипт jquery.
Опять же ошибка выползает.

А выткать загрузку jquery.js и accordion.js выше

Код

<jdoc:include type="head" />

что то не очень хочется...

[ivieDVeD]

Снова сделал все как написано... Аналогично... Страница в приложении.

[ivieDVeD]

Решил проблему самостоятельно! По аналогии с другим плагином нашел различия, и вот что я изменил:
в файле pb_spoiler.php в местах где указывается путь, в самом начале поставил пробел и убрал слэш.  
было:

...('live_site').'/plugins/content/pb_spoiler/mootools/spoiler.js"></script>';

стало:

...('live_site'). 'plugins/content/pb_spoiler/mootools/spoiler.js"></script>';

mootools.js закинул в корень сайта.. И все зароботало!!!
 
Но теперь другая проблема: сайт "подкидывает" вверх при раскрытии спойлера. Т.е. если если страницу прокрутить вниз и раскрыть там спойлер, то страницу переносит резко вверх.

[delphine]

скинь страничку с уже работающим.