Login / Sign Up


Enter site:
Login: 
Password: 


First time here?
 
Register [?]:
Registering allows you:
  • Purchase products from the product catalog and access them any time.
  • Ask questions to another specialists in IT
  • Publish your own Joomla extensions, soft or other products if you are developer or distributor
  • Add interesting weblinks and access them from any place
  • Watch the updates of the site and have special abilities that guests don't have
  • Watch the news of the service and new articles and get knowledge
Choose login:
Your Email:
Enter the result of operation (in digits):
22 + 8 = ? Update

Пишем свой модуль для Joomla 1.5 PDF Print E-mail
Written by Максим   
Thursday, 23 June 2011 16:37
Liked:
64


Did not like: 1
В этой статье мы с вами создадим простой модуль для Joomla, который будет показывать полезные советы на сайте. Модуль
назовём mod_faidingtips (от англ. "Fading Tips"). Список полезных советов, а также скорость их чередования мы вынесем в настройки нашего
модуля.
Советы будут чередоваться плавными эффектами затухания и появления - этого можно легко достигнуть с помощью jQuery.
Поскольку сайт, на которуй будет устанавливаться наш модуль, может не поддерживать jQuery, мы должны предусмотреть
возможность подключения jQuery внутри модуля. Эта возможность будет также настраиваться с помощью параметров модуля.
Итак, для нашей задачи мы создадим где-нибудь на диске папку mod_faidingtips, а в ней следующие файлы и каталоги:
В этой статье мы с вами создадим простой модуль для Joomla, который будет показывать полезные советы на сайте. Модуль назовём mod_fadingtips (от англ. "Fading Tips"). Список полезных советов, а также скорость их чередования мы вынесем в настройки нашего модуля. Советы будут чередоваться плавными эффектами затухания и появления - этого можно легко достигнуть с помощью jQuery. Поскольку сайт, на который будет устанавливаться наш модуль, может не поддерживать jQuery, мы должны предусмотреть возможность подключения jQuery внутри модуля. Эта возможность будет также настраиваться с помощью параметров модуля. Итак, для нашей задачи мы создадим где-нибудь на диске папку mod_fadingtips, а в ней следующие файлы и каталоги:
 
  • mod_fadingtips.xml
  • mod_fadingtips.php
  • index.html
  • css/mod_fadingtips.css
  • css/index.html
  • tmpl/default.php
  • tmpl/index.html

Рассмотрим все файлы по порядку.

Дескриптор модуля mod_fadingtips.xml

Файл mod_fadingtips.xml является файлом описания (дескриптором) нашего модуля Joomla. Он содержит описание модуля (имя автора, дату создания, версию модуля), а также параметры, которые поддерживает модуль. При установке Joomla "смотрит" именно на этот файл и по нему определяет, какие файлы необходимо копировать в каталоги сборки Joomla. Чтобы движок Joomla корректно читал содержимое файла, он должен быть в кодировке UTF-8 в случае наличия русских и других специальных символов. Напишем содержимое для mod_fadingtips.xml:
 
	
		<?xml version="1.0" encoding="utf-8"?>
	
		<install type="module" version="1.5.0">
	
		<name>Fading Tips</name>
	
		<author>Allineed.Ru</author>
	
		<version>1.0.1</version>
	
		<creationDate>23/06/2011</creationDate>
	
		<description>Fading Tips позволяет показывать полезные советы на Вашем сайте.</description>
	
		<files>
	
		<filename>mod_fadingtips.xml</filename>
	
		<filename module="mod_fadingtips">mod_fadingtips.php</filename>
	
		<filename>index.html</filename>
	
		<folder>tmpl</folder>
	
		<folder>css</folder>
	
		</files>
	
		<params>
	
		<param name="loadJQuery" type="radio" default="1" label="Подключать jQuery?" description="" >
	
		   <option value="1">YES</option>
	
		<option value="0">NO</option>
	
		</param>
	
		<param name="animationSpeed" type="text" default="5000" label="Скорость анимации" description="" size="10" />
	
		<param name="tipsList" type="textarea" default="Tip1\nTip2\nTip3" label="Список советов" description="" rows="15" cols="40" />
	
		<param name="cssTipClass" type="text" default="fadingtip" label="CSS-класс для совета" description="" size="10" />
	
		<param name="cssContainerClass" type="text" default="ftcontainer" label="CSS-класс для контейнера" description="" size="10" />
	
		</params> 
	
		</install>
	
		
 
Видим, что в секции <files> перечислены все файлы и папки, которые будут копироваться при установке нашего модуля в каталог /modules/mod_fadingtips. В секции <params> указаны следующие параметры, которые будут доступны на странице настроек модуля в панели администрирования Joomla:
 
  • loadJQuery (переключатель) - если включен, то будем подгружать библиотеку jQuery к нашему сайту перед отрисовкой модуля.
  • animationSpeed (текстовое поле) - будет задавать скорость смены наших советов. Это время в миллисекундах. По умолчанию значение параметра равно 5000, что равно 5 секундам.
  • tipsList (текстовая область) - здесь мы будем указывать список советов. Каждый совет будет отделяться от других символом новой строки \n
  • cssTipClass (текстовое поле) - CSS-класс для отрисовки совета
  • cssContainerClass (текстовое поле) - CSS-класс для контейнера советов. Контейнер - это просто дополнительный <DIV>-элемент, который будет содержать все наши советы. Сделано для возможности дополнительной стилизации нашего модуля.
 
С файлом дескриптора мы завершили. Теперь пришло время написать точку входа нашего модуля - файл mod_fadingtips.php
 

Точка входа модуля - mod_fadingtips.php

Точка входа нашего модуля - это несложный и небольшой по объему файл mod_fadingtips.php. Основная его задача - подключить необходимые ресурсы (CSS-таблицы, скрипты) к документу перед отрисовкой модуля, загрузить параметры модуля и в конце - передать управление файлу default.php, который содержит логику отрисовки модуля. Ниже приведен текст для mod_fadingtips.php:
 
		
			
				<?php
			
				 
			
				// Запрещаем вызов скрипта напрямую
			
				defined( '_JEXEC' ) or die( 'Restricted access' );
			
				 
			
				// Получаем ссылку на объект текущего документа
			
				$doc = & JFactory::getDocument();
			
				// Подключаем файл CSS-стилей к модулю
			
				$doc->addStylesheet( JURI::root(true)."/modules/mod_fadingtips/css/mod_fadingtips.css" );
			
				 
			
				// Получаем советы из параметров в виде строки. Затем разбиваем все советы с помощью разделителя \n. 
			
				// Результат - массив строк $tipsList
			
				$tipsList = $params->get('tipsList');
			
				$tipsList = explode("\n", $tipsList);
			
				 
			
				// Считываем параметр, задающий необходимость подключения jQuery. Если параметр включен, подключаем
			
				// jQuery к документу
			
				$loadJQuery = $params->get('loadJQuery');
			
				if (intval($loadJQuery) == 1)
			
				$doc->addScript( 'http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js' );
			
				 
			
				// Считываем остальные параметры модуля
			
				$animationSpeed = $params->get('animationSpeed');
			
				$cssTipClass = $params->get('cssTipClass');
			
				$cssContainerClass = $params->get('cssContainerClass');
			
				 
			
				// Загружаем файл default.php, который располагается в папке tmpl внутри каталога нашего модуля
			
				require (JModuleHelper::getLayoutPath('mod_fadingtips'));
		
		
			
 
Как видим, файл достаточно прост и, на мой взгляд, не нуждается в дополнительных комментариях. Единственный момент, который я хотел бы отметить - последняя строка файла, где вызывается функция JModuleHelper::getLayoutPath. Приведу код функции getLayoutPath:
 
		
			
				JModuleHelper::getLayoutPath  ( $module,  $layout = 'default' ) {
			
				global $mainframe;
			
				 
			
				// Построить "шаблонный" и основной пути для разметки модуля
			
				$tPath = JPATH_BASE.DS.'templates'.DS.$mainframe->getTemplate().DS.'html'.DS.$module.DS.$layout.'.php';
			
				$bPath = JPATH_BASE.DS.'modules'.DS.$module.DS.'tmpl'.DS.$layout.'.php';
			
				 
			
				// Если шаблон имеет переопределение разметки, то использовать её
			
				if (file_exists($tPath)) {
			
				return $tPath;
			
				} else {
			
				return $bPath;
			
				}
			
				}
			
				
 
Как видим, функция принимает два параметра - $module и $layout. Первый - это название модуля, второй - название разметки для модуля, которое по умолчанию принимает значение 'default'. В последней строке нашего файла mod_fadingtips.php при вызове функции getLayoutPath мы опускаем второй параметр, а значит для отрисовки модуля будет загружаться файл /tmpl/default.php. Также обратите внимание, что любой модуль может иметь переопределение своей разметки в текущем шаблоне Joomla. Т.е., если у нас текущий шаблон называется SomeTemplate, и в каталоге /templates/SomeTemplate/html/mod_fadingtips/tmpl/ был бы файл default.php, то для отрисовки нашего модуля движок Joomla использовал бы именно его. Это дополнительная возможность, которую дает нам Joomla - благодаря ей можно иметь разметку модуля "по умолчанию" и переопределить внешний вид модуля для разных шаблонов сайта.
 

Отрисовка модуля - файл разметки по умолчанию default.php

Файл разметки default.php располагается в подпапке tmpl нашего модуля. Напишем туда следующий код:
 
				
					<?php
				
					 
				
					// Запрещаем вызов скрипта напрямую
				
					defined( '_JEXEC' ) or die( 'Restricted access' );
				
					 
				
					// Добавляем к документу встроенный JavaScript, который с помощью jQuery осуществляет перебор всех советов и попеременное их отображение.
				
					$doc->addScriptDeclaration("
				
					jQuery(document).ready( function($) {
				
					 
				
					// Текущий совет - изначально это первый <DIV>-элемент
				
					var curr = $(\".".$cssTipClass."\")[0];
				
					// Текущий индекс совета - изначально 0
				
					var currIndex = 0;
				
					// Общее число советов
				
					var count = $(\".".$cssTipClass."\").size();
				
					// Ссылка на последний элемент
				
					var last = $(\".".$cssTipClass."\")[count-1];
				
					// Скорость анимации
				
					var speed = ".$animationSpeed.";
				
					 
				
					// Сначала прячем все советы...
				
					$(\".".$cssTipClass."\").hide();
				
					 
				
					// Эта функция будет вызываться с частотой, указанной в переменной speed
				
					function rotate() {
				
					if ($(curr).prev().size() > 0) {
				
					$(curr).prev().fadeOut(function() {
				
					$(curr).fadeIn(); 
				
					curr = $(curr).next();
				
					currIndex++;
				
					if (currIndex == count) {
				
					curr = $(\".".$cssTipClass."\")[0];
				
					currIndex = 0;
				
					} 
				
					});
				
					} else {
				
					$(last).fadeOut(function() {
				
					$(curr).fadeIn();
				
					curr = $(curr).next();
				
					currIndex++; 
				
					});
				
					}
				
					}
				
					 
				
					// Вызываем отрисовку советов. Первый вызов - для мнговенной отрисовки, чтобы не ждать <speed> миллисекунд.
				
					rotate();
				
					// Устанавливаем интервал вызова функции rotate через <speed> миллисекунд
				
					var intervalID = setInterval(rotate, speed ); 
				
					 
				
					// Обработчик наведения мышью на совет и выведения мыши из области совета.
				
					// Когда курсор будет над советом, выключим анимацию, чтобы пользователь мог прочесть совет
				
					// Когда выводим курсор из области совета - снова ставим интервал.
				
					$(\".".$cssTipClass."\").hover(function() {
				
					$(\".".$cssTipClass."\").addClass('fadingtip_hover'); 
				
					clearInterval(intervalID);
				
					},
				
					function() {
				
					$(\".".$cssTipClass."\").removeClass('fadingtip_hover');
				
					intervalID = setInterval(rotate, speed );
				
					});
				
					});
				
					");
				
					?>
				
					 
				
					 
				
					<?php
				
					 
				
					function linksReplace($source) {
				
					$pattern = "/(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+/i";
				
					$replacement = "<a class='fadingtip_link' href='$0' target='_blank'>$0</a>";
				
					$source = preg_replace($pattern, $replacement, $source);
				
					 
				
					return $source;
				
					}
				
					 
				
					// Рисуем <DIV> для контейнера советов
				
					echo "<div class=\"".$cssContainerClass."\">";
				
					 
				
					// Бежим по массиву строк-советов
				
					foreach ($tipsList as $tip) {
				
					 
				
					// Рисуем DIV-элемент для совета с CSS-классом, который определили в параметрах модуля.
				
					echo "<div class=\"".$cssTipClass."\">";
				
					 
				
					// Вызываем функцию для замены в тексте совета всех ссылок, начинающихся с http, ftp, https на теги <A>, чтобы сделать ссылки "кликабельными"
				
					$tip = linksReplace ($tip);
				
					echo $tip;
				
					// Закрываем <DIV> для совета
				
					echo "</div>";
				
					}
				
					// Закрываем <DIV> для контейнера советов
				
					echo "</div>";
				
					?>
				
					
 

Файл стилей для модуля - mod_fadingtips.css

Мы почти завершили написание нашего модуля. Осталось добавить файл CSS-стилей mod_fadingtips.css:
 
				
					
						.fadingtip { background: #CCFFCC; color: #006600; padding:5px; border:0px dotted #006600; font-size:10pt; font-family:'Consolas';}
					
						.fadingtip_hover { background: #006600; color: #FFFFFF; padding:5px; border:0px dotted #006600; font-size:10pt; font-family:'Consolas';}
					
						a.fadingtip_link { color: orange !important; text-decoration:none !important; }
					
						a.fadingtip_link:hover { color: orange !important; text-decoration:underline !important;  }
					
						 
					
						.ftcontainer { border:0px solid #006600; width:200px; }
					
						
 

Файлы index.html

Последним штрихом в нашей работе будет создание трех файлов index.html. Один располагается в корневой папке нашего модуля, а два других - в папках css и tmpl. Этот файл нужен для того, чтобы введя в строке браузера полный путь к нашему модулю (например http://mysite/modules/mod_fadingtips), пользователь не получил доступа к листингу файлов. Создаваемый файл содержит единственную строку:
 
					
						<html><body bgcolor="#FFFFFF"></body></html>
					
						
 
Как легко догадаться, она просто отображает страницу с белым фоном.
 

Упаковка файлов и создание установочного архива mod_fadingtips.zip

Нам осталось запаковать наш модуль в установочный архив для Joomla. Для этого выделяем все файлы и папки внутри каталога mod_fadingtips и добавляем их в архив. Лично я для этой цели пользуюсь WinRAR с опцией упаковки в формат ZIP по умолчанию. После этого можно попробовать установить наш модуль через панель администрирования Joomla.
 
Надеюсь, данная статья помогла в изучении вопроса разработки модулей для Joomla 1.5. Комментарии приветствуются :) Желаю удачи в написании отличных модулей!
 

Установочный файл

Установочный файл нашего модуля можно скачать здесь
 

 



Last Updated on Friday, 05 July 2013 00:39
 
Автор статьи: Damascus
Всего статей: 62
Рейтинг: 3111
Страница Google+: Google

Found Error?

Система Orphus

Site Statistics

Яндекс.Метрика

Our Pages


Allineed.Ru © 2009-2012 - Allineed.Ru - ответы на IT вопросы, статьи о разработке, IT и программном обеспечении. При использовании материалов сайта ссылка обязательна. Использование данного сайта и любой его части означает принятие условий Пользовательского Соглашения.
Allineed.Ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters. The Joomla! name and logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.