Joomla 1.5: Создание плагина smilies - Создание плагина Joomla стр.3
Индекс материала |
---|
Joomla 1.5: Создание плагина smilies |
Создание плагина Joomla стр.2 |
Создание плагина Joomla стр.3 |
Все страницы |
Теперь опишу алгоритм работы панели админа: скрипт smiliestoolbar.php - получает сериализованный массив из файла collation.txt, десериализует его, и если в нём есть элементы, то он заполняет ими динамическую таблицу, если данных в массиве нет, то выводим таблицу с единственной, пустой строкой. В файле smiliestoolbar.php пропишем следующий код:
$smiles = array(); $smiles = unserialize( file_get_contents(JPATH_BASE.'/plugins/content/smilies/collation.txt') );
Далее нам потребуется Javascript, который предоставит нам функционал по добавлению/удалению строк таблицы:
<script type="text/javascript"> <!-- //добавить строку: function addrow(index) { var htmlTable = document.getElementById("smiletable"); htmlTable.insertRow(index + 1); htmlTable.rows[index + 1].insertCell(0); htmlTable.rows[index + 1].insertCell(1); htmlTable.rows[index + 1].insertCell(2); htmlTable.rows[index + 1].cells[0].innerHTML = '<input size="5" name="smile[ch][]" value="" />'; //Здесь сделано так, из-за косяков с id - при данном раскладе он получается одинаковым и это вызывает // ошибку в IE. htmlTable.rows[index + 1].cells[1].innerHTML = "<?php echo addslashes( images('smile[im][]','zzz'))?>"; htmlTable.rows[index + 1].cells[1].innerHTML = htmlTable.rows[index + 1].cells[1].innerHTML.replace(/zzz/gm,'img_' + index); htmlTable.rows[index + 1].cells[2].innerHTML = '<input type="button" onclick="addrow(this.parentNode.parentNode.rowIndex)" value="+" /> ' + '<input type="button" onclick="delrow(this.parentNode.parentNode.rowIndex)" value="-" />'; } //удалить строку: function delrow(index) { var htmlTable = document.getElementById("smiletable"), rowCount = htmlTable.rows.length; // Это проверка для того, что бы пользователь не мог удалить // последнюю строку. if(rowCount > 2) { htmlTable.deleteRow(index); } else { return false; } } //--> </script>
В листинге выше мы наблюдаем вставку php кода, использующую функцию images('smile[im][]','zzz') код этой функции выводит выпадающий список файлов картинок из директории /images/ и взят из метода класса JHTMLList::image()
Можно было бы использовать и стандарный функционал:
JHTML::_('list.images', $name, $active, ... );
Но он не позволяет передавать id для тега картинки, он формирует его из параметра $name, а так, как строки у нас формируются динамически, а имя элементов выпадающих списков для картинок - у нас одинаковое smile[im][] ( да кстати, и имена текстовых полей для символов смайлов тоже smile[ch][] ) формирующее в итоге массив $_POST['smile']:
Array ( [ch] => Array ( [0] => :) [1] => :( [2] => :P [3] => :@ ) [im] => Array ( [0] => articles.jpg [1] => clock.jpg [2] => ext_com.png [3] => ext_com.png ) )
то и id в таком случае получается одинаковым, и IE нам этого не прощает. Поэтому я взял код метода класса JHTMLList::image() и чуть - чуть его подправил, так, что бы можно было указывать id для тега картинки и попросту вынес его в отдельную функцию:
// Функция взята из класса JHTMLList::image() и переделана из-за того что в стандартной нельзя // Задать id картинке function images( $name, $idtag, $active = NULL, $directory = NULL, $extensions = "bmp|gif|jpg|png" ) { if ( !$directory ) { $directory = '/images/'; } jimport( 'joomla.filesystem.folder' ); $imageFiles = JFolder::files( JPATH_SITE.DS.$directory ); $images = array( JHTML::_('select.option', '', '- '. JText::_( 'Select Image' ) .' -' ) ); foreach ( $imageFiles as $file ) { if ( preg_match( "#$extensions#i", $file ) ) { $images[] = JHTML::_('select.option', $file ); } } $images = JHTML::_('select.genericlist', $images, $name, 'class="inputbox" size="1" '. $javascript, 'value', 'text', $active, $idtag ); return $images; }
А вот код, который формирует саму html - таблицу, согласно алгоритму:
<form name="smileconfig" method="post" action=""> <table id="smiletable" width="350px" cellpadding="1" cellspacing="1"> <thead> <tr> <th>Символ</th> <th>Картинка</th> <th> </th> </tr> </thead> <tbody> <?php if(count($smiles['ch']) < 1 ):?> <tr> <td style="width:76px"><input size="5" name="smile[ch][]" value="" /></td> <td> <?php echo JHTML::_('list.images', 'smile[im][]')?> </td> <td> <input type="button" onclick="addrow(this.parentNode.parentNode.rowIndex)" value="+" /> <input type="button" onclick="delrow(this.parentNode.parentNode.rowIndex)" value="-" /> </td> </tr> <?php else : for( $i = 0; $i < count($smiles['ch']); $i++) : ?> <tr> <td style="width:76px"><input size="5" name="smile[ch][]" value="<?php echo trim($smiles['ch'][$i])?>" /></td> <td> <?php echo images('smile[im][]','img_'.$i, trim($smiles['im'][$i] ))?> </td> <td> <input type="button" onclick="addrow(this.parentNode.parentNode.rowIndex)" value="+" /> <input type="button" onclick="delrow(this.parentNode.parentNode.rowIndex)" value="-" /> </td> </tr> <?php endfor; endif; ?> </tbody> </table> <input type="submit" name="send" value="сохранить" /> </form>
А вот полный листинг файла smiliestoolbar.php (это самый объёмный файл в плагине.)
<?php header('Content-type: text/html; charset=utf-8'); // Инициализация движка ---------------------------- define('_JEXEC',1); define('DS',DIRECTORY_SEPARATOR); define('JPATH_BASE', realpath('..'.DS.'..'.DS.'..'.DS)); require_once(JPATH_BASE.DS.'includes'.DS.'defines.php'); require_once(JPATH_BASE.DS.'includes'.DS.'framework.php'); $mainframe = JFactory::getApplication('administrator'); //--------------------------------------------------- if( isset($_POST['smile']) && is_array($_POST['smile']) ) { $saved = serialize( $_POST['smile'] ); file_put_contents(JPATH_BASE.'/plugins/content/smilies/collation.txt', $saved ); } $smiles = array(); $smiles = unserialize(file_get_contents(JPATH_BASE.'/plugins/content/smilies/collation.txt')); JHTMLList::image(); // Функция взята из класса JHTMLList::image() и переделана из-за того что в стандартной нельзя // Задать id картинке function images( $name, $idtag, $active = NULL, $directory = NULL, $extensions = "bmp|gif|jpg|png" ) { if ( !$directory ) { $directory = '/images/'; } jimport( 'joomla.filesystem.folder' ); $imageFiles = JFolder::files( JPATH_SITE.DS.$directory ); $images = array( JHTML::_('select.option', '', '- '. JText::_( 'Select Image' ) .' -' ) ); foreach ( $imageFiles as $file ) { if ( preg_match( "#$extensions#i", $file ) ) { $images[] = JHTML::_('select.option', $file ); } } $images = JHTML::_('select.genericlist', $images, $name, 'class="inputbox" size="1" '. $javascript, 'value', 'text', $active, $idtag ); return $images; } ?> <script type="text/javascript"> <!-- //добавить строку: function addrow(index) { var htmlTable = document.getElementById("smiletable"); htmlTable.insertRow(index + 1); htmlTable.rows[index + 1].insertCell(0); htmlTable.rows[index + 1].insertCell(1); htmlTable.rows[index + 1].insertCell(2); htmlTable.rows[index + 1].cells[0].innerHTML = '<input size="5" name="smile[ch][]" value="" />'; //Здесь сделано так, из-за косяков с id - при данном раскладе он получается одинаковым и это вызывает // ошибку в IE. htmlTable.rows[index + 1].cells[1].innerHTML = "<?php echo addslashes( images('smile[im][]','zzz'))?>"; htmlTable.rows[index + 1].cells[1].innerHTML = htmlTable.rows[index + 1].cells[1].innerHTML.replace(/zzz/gm,'img_' + index); htmlTable.rows[index + 1].cells[2].innerHTML = '<input type="button" onclick="addrow(this.parentNode.parentNode.rowIndex)" value="+" /> ' + '<input type="button" onclick="delrow(this.parentNode.parentNode.rowIndex)" value="-" />'; } //удалить строку: function delrow(index) { var htmlTable = document.getElementById("smiletable"), rowCount = htmlTable.rows.length; // Это проверка для того, что бы пользователь не мог удалить // последнюю строку. if(rowCount > 2) { htmlTable.deleteRow(index); } else { return false; } } //--> </script> <style> <!-- table#smiletable tr td{text-align:center} //--> </style> <form name="smileconfig" method="post" action=""> <table id="smiletable" width="350px" cellpadding="1" cellspacing="1"> <thead> <tr> <th>Символ</th> <th>Картинка</th> <th> </th> </tr> </thead> <tbody> <?php if(count($smiles['ch']) < 1 ):?> <tr> <td style="width:76px"><input size="5" name="smile[ch][]" value="" /></td> <td> <?php echo JHTML::_('list.images', 'smile[im][]')?> </td> <td> <input type="button" onclick="addrow(this.parentNode.parentNode.rowIndex)" value="+" /> <input type="button" onclick="delrow(this.parentNode.parentNode.rowIndex)" value="-" /> </td> </tr> <?php else : for( $i = 0; $i < count($smiles['ch']); $i++) : ?> <tr> <td style="width:76px"><input size="5" name="smile[ch][]" value="<?php echo trim($smiles['ch'][$i])?>" /></td> <td> <?php echo images('smile[im][]','img_'.$i, trim($smiles['im'][$i] ))?> </td> <td> <input type="button" onclick="addrow(this.parentNode.parentNode.rowIndex)" value="+" /> <input type="button" onclick="delrow(this.parentNode.parentNode.rowIndex)" value="-" /> </td> </tr> <?php endfor; endif; ?> </tbody> </table> <input type="submit" name="send" value="сохранить" /> </form>
Тут есть один тонкий момент: Когда мы настраиваем сопоставление символы - картинка, сохранить наши настройки мы сможем только той кнопкой "сохранить" которая выводится снизу нашей таблицы, а не стандарной кнопкой движка Joomla 1.5 - это плата за использование настолько нестандарного подхода к разработке панели админа.
Нам осталось лишь дописать код замены в файле smilies.php Замену будем производить, как во вводном тексте, так и полном тексте статьи, при помощи фунций str_replace - ей мы передадим массивы, полученные из десериализованного массива из файла collation.txt. Полный код основного файла плагина smilies.php
<?php defined('JPATH_BASE') or die ('Restricted access'); jimport( 'joomla.plugin.plugin' ); class plgContentSmilies extends JPlugin { function onPrepareContent( &$article, &$params, $limitstart) { $smiles = array(); // Получаем, десериализуем массив из файла: $smiles = unserialize(file_get_contents(JPATH_BASE.'/plugins/content/smilies/collation.txt')); // В массиве $smiles['im'] у нас только имена файлов, нужно что бы были // полноценные html теги картинок: foreach($smiles['im'] AS &$pic) { $pic = '<img class="smilies-pic" src="images/'.$pic.'" />'; } // Замена во вводном тексте: $article->introtext = str_replace($smiles['ch'], $smiles['im'], $article->introtext); // Замена в основном тексте: $article->text = str_replace($smiles['ch'], $smiles['im'], $article->text); return true; } }
На данный момент мы должны иметь следующие файлы:
smilies.php smilies.xml smilies/smiliesframe.php smilies/smiliestoolbar.php smilies/collation.txt smilies/index.html
Теперь можно залить картинки смайлов в папку images, настроить сопоставление символ - картинка и всё! В итоге мы получили механизм, коорый позволяет нам заменять некий набор символов в статье, на соответствующую картинку, причём и наборы символов и картинки можно добавлять в неограниченном количестве. Если что то не понятно спрашиваем в комментариях. Вот ссылка на готовый