Работа с базой данных. Добавление, чтение, обновление и удаление данных в таблице модуля Joomla 3.x

👁 111 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

К списку «Проектирование модуля для Joomla 3.x»

Итак, мы уже знаем как создает таблица для модуля в БД MySQL, осталось работать с этой таблицей и еще, в данном посте рассмотрим как взаимодействовать элементами управления модуля с файловой системой, когда мы будем загружать иконку для портфолио, и с таблицей модуля для реализации CRUD(Create, Read, Update, Delete) в таблице.

 

Продолжение следует…

 

Работа за базой данных. Инсталляция и деинсталляция структуры и данных БД из модуля Joomla 3.x

👁 123 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

К списку «Проектирование модуля для Joomla 3.x»

И так, пришло время одного из самых главных частей нашего модуля — базы данных. Joomla может работать со многими БД: MSQL, Oracle, Postgree и т.п. Для нас сейчас интересует БД MySQL, поэтому ориентрируем подачу материала именно на эту систему управления базами данных.

Файловая структура

Как и в предыдущем посте, на данном шаге структура файловой системы тоже претерпит ряд изменений по возрастающей. Добавим 2 файла c расширением *.sql, в которых будет структура и начальные тестовые данные для установки и удаления данных из БД. При установке модуля файл инсталляции будет создавать новую таблицу mod_table_portfolio для нашего модуля, а при удалении модуля файл деинсталляции удалит эту таблицу, что разрешит проблему сохранения системы Joomla в чистоте.

Ниже представлена новая файловая структура модуля, где в корень модуля добавлена новая папка sql, а в ней файлы с конструкциями языка SQL

stage-4-module-file-structure-of-joomla-3

Как видим, добавили 2 файла, mod_portfolio.install.mysql.utf8.sql и mod_portfolio.uninstall.mysql.utf8.sql, которые имеют следующий код в себе

CREATE TABLE IF NOT EXISTS `mod_table_portfolio` (
	`id` int(10) NOT NULL AUTO_INCREMENT,
        `title` varchar(100) NOT NULL,
	`description` text NOT NULL,
	`icon` varchar(100) NOT NULL,
 
  PRIMARY KEY (`id`)
) ENGINE=INNODB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1;
 
INSERT INTO `mod_table_portfolio` (`title`, `description`, `icon`) VALUES ('Название проекта 1', 'Описание проекта 1', 'images/icon1.png');
INSERT INTO `mod_table_portfolio` (`title`, `description`, `icon`) VALUES ('Название проекта 2', 'Описание проекта 2', 'images/icon2.png');
INSERT INTO `mod_table_portfolio` (`title`, `description`, `icon`) VALUES ('Название проекта 3', 'Описание проекта 3', 'images/icon3.png');
DROP TABLE IF EXISTS `mod_table_portfolio`

 

Переопределение структуры установочного файла mod_portfolio.xml

Добавим новый теги install и uninstall, которые будут выполняться на этапе установки и удаления модуля, в этих тегах укажем пути к нашим SQL-файлам и дополнительно добавим папку sql в тег распознавания фалов и директорий в теге files

<?xml version="1.0" encoding="utf-8"?>
<extension
	type="module"
	version="3.0"
	client="site">
	<name>Module Portfolio. Stage 4</name>
	<author>David Amirkhanov</author>
	<creationDate>August 2016</creationDate>
	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
	<authorEmail>mail.websofter@gmail.com</authorEmail>
	<authorUrl>www.websofter.ru</authorUrl>
	<version>1.0.0</version>
	<description>Module Portfolio for Joomal CMS designed by David Amirkhanov</description>
	<files>
		<filename module="mod_portfolio">mod_portfolio.php</filename>
		<filename>index.html</filename>
        <filename>helper.php</filename>
        <folder>sql</folder>
		<folder>tmpl</folder>
        <folder>language</folder>
	</files>
        <media folder="tmpl" destination="mod_portfolio">
            <folder>images</folder>
            <folder>css</folder>
            <folder>js</folder>
        </media>
	<languages folder="language">
		<language tag="en-GB">en-GB/en-GB.mod_portfolio.ini</language>
		<language tag="en-GB">en-GB/en-GB.mod_portfolio.sys.ini</language>
		<language tag="ru-RU">ru-RU/ru-RU.mod_portfolio.ini</language>
		<language tag="ru-RU">ru-RU/ru-RU.mod_portfolio.sys.ini</language>
	</languages>
	<config>
		<fields name="params">
			<fieldset name="basic">
                            <field 
                                name="title" 
                                type="text"
                                label="MOD_PORTFOLIO_TITLE"
                                description="MOD_PORTFOLIO_TITLE_DESC"
                                required="true"
                                size="30"
                                class="mod-portfolio-title"
                                validate="" />
                            <field 
                                name="description" 
                                type="editor" 
                                default="" 
                                label="MOD_PORTFOLIO_DESCRIPTION" 
                                description="MOD_PORTFOLIO_DESCRIPTION_DESC"/>
                            <field 
                                name="icon" 
                                type="file"
                                label="MOD_PORTFOLIO_FILE" 
                                description="MOD_PORTFOLIO_FILE_DESC"
                                accept="images/*"/>
			</fieldset>
		</fields>
	</config>
    <install>
        <sql>
            <file driver="mysql" charset="utf8">sql/mod_portfolio.install.mysql.utf8.sql</file>
        </sql>
    </install>
    <uninstall>
        <sql>
            <file driver="mysql" charset="utf8">sql/mod_portfolio.uninstall.mysql.utf8.sql</file>
        </sql>
    </uninstall>
</extension>

 

Установка и демо

Теперь, при установке в БД данный модуль создаст отдельную таблицу mod_table_portfolio для модуля, в котором мы сможем сохранять, изменять и удалять данные портфолио

stage-4-module-table-in-list-of-tables-joomla-3

Данная таблица будет содержать структуры и первичные данные, которые были определены в файле инсталляции таблицы модуля mod_portfolio.install.mysql.utf8.sql

stage-4-module-table-data-and-structure-joomla-3

Скачать проект для данного шага создания модуля можно скачать по ссылке mod_portfolio_v1.0.0_stage_4.zip.

Добавление файлов CSS, JavaScript и картинок к модулю для Joomla 3.x

👁 144 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

К списку «Проектирование модуля для Joomla 3.x»

И так, у нас есть скелет и возможность менять язык модуля. Теперь нам надо оживить ее, используя стилевые таблицы и динамику через CSS и JavaScript.

Файловая структура

Как и в предыдущем примере, нам надо добавить несколько папок и файлов в них. Тут нет строгости в плане определенного места нахождения, именования этих файлов и их количества. Главное — чтобы после создания каждой папки или файла, он был зарегистрирован в файле инсталляции mod_portfolio.xml иначе, при установке модуля, эти папки и файлы могут быть не подгружены в систему. Давайте определим файловую структуру данного шага создания модуля следующим образом

joomla-module-file-structure-by-stage-3

Мы добавили 3 папки в директорию шаблонов модуля, где css  -папка, где будут файлы стилей, images — папка, где будут храниться файлы изображений модуля, js — папка, где будут храниться библиотеки и скрипты JavaScript.

Структура файла инсталляции mod_portfolio.xml

Теперь изменим файл инсталляции под обновленную файловую структуру нашего модуля. Добавим новый тег media, с указанием новых папок

<?xml version="1.0" encoding="utf-8"?>
<extension
	type="module"
	version="3.0"
	client="site">
	<name>WebSofter Module Portfolio. Stage 3</name>
	<author>David Amirkhanov</author>
	<creationDate>August 2016</creationDate>
	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
	<authorEmail>mail.websofter@gmail.com</authorEmail>
	<authorUrl>www.websofter.ru</authorUrl>
	<version>1.0.0</version>
	<description>Module Portfolio for Joomal CMS designed by David Amirkhanov</description>
	<files>
		<filename module="mod_portfolio">mod_portfolio.php</filename>
		<filename>index.html</filename>
                <filename>helper.php</filename>
		<folder>tmpl</folder>
                <folder>language</folder>
	</files>
    <media folder="tmpl" destination="mod_portfolio">
        <folder>images</folder>
        <folder>css</folder>
        <folder>js</folder>
    </media>
	<languages folder="language">
		<language tag="en-GB">en-GB/en-GB.mod_portfolio.ini</language>
		<language tag="en-GB">en-GB/en-GB.mod_portfolio.sys.ini</language>
		<language tag="ru-RU">ru-RU/ru-RU.mod_portfolio.ini</language>
		<language tag="ru-RU">ru-RU/ru-RU.mod_portfolio.sys.ini</language>
	</languages>
	<config>
		<fields name="params">
			<fieldset name="basic">
                            <field 
                                name="title" 
                                type="text"
                                label="MOD_PORTFOLIO_TITLE"
                                description="MOD_PORTFOLIO_TITLE_DESC"
                                required="true"
                                size="30"
                                class="mod-portfolio-title"
                                validate="" />
                            <field 
                                name="description" 
                                type="editor" 
                                default="" 
                                label="MOD_PORTFOLIO_DESCRIPTION" 
                                description="MOD_PORTFOLIO_DESCRIPTION_DESC"/>
                            <field 
                                name="icon" 
                                type="file"
                                label="MOD_PORTFOLIO_FILE" 
                                description="MOD_PORTFOLIO_FILE_DESC"
                                accept="images/*"/>
			</fieldset>
		</fields>
	</config>
</extension>

 

Продемонстрируем что-нибудь полезное

Давайте сделаем что-нибудь при помощи подключенных файлов CSS, JavaScript и картинок.

Для начала нам нужно подключить добавленные файлы в файле шаблона default.php при помощи методов системного класса JDocument фреймворка Joomla

<?php
defined( '_JEXEC' ) or die( 'Restricted access' );

//Подключаем зависимости
$document = JFactory::getDocument();
$modulePath = JURI::base() . 'modules/mod_portfolio/tmpl/';
$document->addStyleSheet($modulePath.'css/mod_portfolio.css');
$document->addScript($modulePath.'js/jquery-3.1.0.min.js');
$document->addScript($modulePath.'js/mod_portfolio.js');

?>

<article class="mod-portfolio-content">
    Контент модуля из шаблона...
    <br/>
    <center><img src="<?php echo $modulePath ?>images/joomla-icon.png"/></center>
    <br/>
    <button id="mod-portfolio-btn">Кнопка</button>
</article>

Сделаем так, чтобы по иду кнопки выводилось сообщение, событие которого определено в файле mod_portfolio.js, а стиль контейнера было определено в файле mod_portfolio.css.

Заметьте, что мы пользуемся библиотекой jQuery, который тоже подключается выше нашего пользовательского скрипта. Главный метод $() должен быть заменен на jQuery(), иначе Joomla выведет ошибки из-за конфликтов.

Представим обозрению mod_portfolio.js и mod_portfolio.css

jQuery(document).ready(function(){
    jQuery("#mod-portfolio-btn").click(function(){
        alert("Событие...");
    });
});
.mod-portfolio-content{
    background-color: azure;
    padding: 5px;
    min-height: 300px;
    width: 100%;
    border: 1px solid #cccccc;
    border-radius: 5px;
}

 

Результат работы

Ниже представлен скриншот работы и поведения данного модуля после установки

stage-3-result-screen-shot-of-joomla-module-design

Установочный модуль для данного шага проекта можете скачать тут mod_portfolio_v1.0.0_stage_3.zip.

 

Определение языковых файлов для модуля Joomla 3.x

👁 142 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

К списку «Проектирование модуля для Joomla 3.x»

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

Файлова структура модуля

Структура модуля изменится, мы добавим папку languages, в котором создадим подпапки ru-RU и en-GB, в которых, соответственно, будут находиться по паре файлов:

*.mod_portfolio.ini — этот файл является языковым пакетом для общего описания функционала.

*.mod_portfolio.sys.ini — этот файл является языковым пакетом для системной информации модуля.

new-structure-of-module-by-stage-2

Структура установочного файла mod_portfolio.xml

Теперь необходимо добавить дополнительный код в файл установки, чтобы определить папку языковых файлов и языковые пакеты. Если коротко, то каждое поле имеет 2 параметра(атрибута) в теге, которые выступают названием name и описанием — description. В предыдущем примере мы просто писали в эти атрибуты текст, а сейчас определим для них константы, которые будут потом по своему определены в каждом языковом файле, где в файле en-GB.mod_portfolio.ini этой константе будет присвоен английский текст, а в ru-RU.mod_portfolio.ini — русский текст. Код данного файла изменится следующим образом:

<?xml version="1.0" encoding="utf-8"?>
<extension
	type="module"
	version="3.0"
	client="site">
	<name>WebSofter Module Portfolio. Stage 2</name>
	<author>David Amirkhanov</author>
	<creationDate>August 2016</creationDate>
	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
	<authorEmail>mail.websofter@gmail.com</authorEmail>
	<authorUrl>www.websofter.ru</authorUrl>
	<version>1.0.0</version>
	<description>Module Portfolio for Joomal CMS designed by David Amirkhanov</description>
	<files>
		<filename module="mod_portfolio">mod_portfolio.php</filename>
		<filename>index.html</filename>
        <filename>helper.php</filename>
		<folder>tmpl</folder>
        <folder>language</folder>
	</files>
	<languages folder="language">
		<language tag="en-GB">en-GB/en-GB.mod_portfolio.ini</language>
		<language tag="en-GB">en-GB/en-GB.mod_portfolio.sys.ini</language>
		<language tag="ru-RU">ru-RU/ru-RU.mod_portfolio.ini</language>
		<language tag="ru-RU">ru-RU/ru-RU.mod_portfolio.sys.ini</language>
	</languages>
	<config>
		<fields name="params">
			<fieldset name="basic">
                            <field 
                                name="title" 
                                type="text"
                                label="MOD_PORTFOLIO_TITLE"
                                description="MOD_PORTFOLIO_TITLE_DESC"
                                required="true"
                                size="30"
                                class="mod-portfolio-title"
                                validate="" />
                            <field 
                                name="description" 
                                type="editor" 
                                default="" 
                                label="MOD_PORTFOLIO_DESCRIPTION" 
                                description="MOD_PORTFOLIO_DESCRIPTION_DESC"/>
                            <field 
                                name="icon" 
                                type="file"
                                label="MOD_PORTFOLIO_FILE" 
                                description="MOD_PORTFOLIO_FILE_DESC"
                                accept="images/*"/>
			</fieldset>
		</fields>
	</config>
</extension>

 

А языковые файлы будут содержать описания этих констант

;System translate for module
MOD_PORTFOLIO_TITLE="Title"
MOD_PORTFOLIO_TITLE_DESC="Title of project"
MOD_PORTFOLIO_DESCRIPTION="Description"
MOD_PORTFOLIO_DESCRIPTION_DESC="Description of project"
MOD_PORTFOLIO_FILE="icon"
MOD_PORTFOLIO_FILE_DESC="Icon of project"
;Общий перевод для модуля
MOD_PORTFOLIO_TITLE="Название"
MOD_PORTFOLIO_TITLE_DESC="Название проекта"
MOD_PORTFOLIO_DESCRIPTION="Описание"
MOD_PORTFOLIO_DESCRIPTION_DESC="Описание проекта"
MOD_PORTFOLIO_FILE="Иконка"
MOD_PORTFOLIO_FILE_DESC="Иконка проекта"

После установки и при смене языка сайта вы увидите, что модуль тоже меняет язык и при этом важно, чтобы и в системе были установлены те же языки, что в модуле. Скачать данный шаг проекта можно по ссылке mod_portfolio_v1.0.0_stage_2.zip.

Проектирование модуля для Joomla 3.x

👁 180 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Ниже представлен список статей о том, как работать с модулями в Joomla 3.x на программном уровне, в частности, будет рассмотрены такие темы, как создание, вывод, управление, удаление, работа с БД и т.п.

  1. Создание простого модуля для Joomla 3.x
  2. Определение языковых файлов для модуля Joomla 3.x
  3. Добавление файлов CSS, JavaScript и картинок к модулю для Joomla 3.x
  4. Работа за базой данных. Инсталляция и деинсталляция структуры и данных БД из модуля Joomla 3.x
  5. Работа с базой данных. Добавление, чтение, обновление и удаление данных в таблице модуля Joomla 3.x

Создание простого модуля для Joomla 3.x

👁 366 просмотров
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (1 оценок, среднее: 5,00 из 5)
Загрузка...

К списку «Проектирование модуля для Joomla 3.x»

Назначение модуля

Чтобы проектировать модуль нам надо определиться с тем, что он будет делать. Данный модуль будет являться скриптом для вывода портфолио пользователя сайта и будет иметь возможность работать с БД и управлять содержимым портфолио.

Базовый скелет модуля

Прежде, чем перейдем к интенсивному процессу разработки создадим скелет модуля и изучим его от А до Я, чтобы больше не отвлекаться на мелкие недопонятые вопросы. Данный скелет модуля будет иметь возможность устанавливаться в Joomla и удаляться из него, а дальше уже будем разъяснять какой файл для чего служит и рассмотри усложнение модуля в плане функциональных возможностей — будем учить по нарастающей.

Файлы и папки модуля

Корень модуля выглядит так, как показано на картинке ниже и далее каждый файл разъясняется

stage-1-module-files-photo-foto-post-create-module-for-joomla

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

 

helper.php — т.н. помощник модуля, в котором реализуется главный класс модуля и делает фактическую работу в получении информации, которая будет отображаться в модуле (как правило, из базы данных или другого источника).

<?php
class ModPortfolio{
    //Поля главного класса
    public static $title = "";
    public static $description = "";
    public static $icon = "";
    //Методы главного класса
    public static function view($param){
        echo $param;
    }
}
?>

mod_portfoio.php — самый главный файл. Это точка входа в наш модуль. Именно он будет первым запускаться и является, своего рода, контроллером связи между данными и видом.

<?php
defined( '_JEXEC' ) or die( 'Restricted access' );
require_once dirname(__FILE__) . '/helper.php';

//Выводим сообщение
ModPortfolio::view("<br/>Контент модуля из контроллера...<br/>");
//Подключаем схему
require( JModuleHelper::getLayoutPath( 'mod_portfolio') );
?>

mod_portfoio.xml — это манифест нашего модуля, в котором будут параметры, настройки модуля. Этот файл так же регламентирует процесс установки модуля и процесс его правильного удаления из системы Joomla.

<?xml version="1.0" encoding="utf-8"?>
<extension
	type="module"
	version="3.0"
	client="site">
	<name>WebSofter Module Portfolio. Stage 1</name>
	<author>David Amirkhanov</author>
	<creationDate>August 2016</creationDate>
	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
	<authorEmail>mail.websofter@gmail.com</authorEmail>
	<authorUrl>www.websofter.ru</authorUrl>
	<version>1.0.0</version>
	<description>Module Portfolio for Joomal CMS designed by David Amirkhanov</description>
	<files>
		<filename module="mod_portfolio">mod_portfolio.php</filename>
		<filename>index.html</filename>
                <filename>helper.php</filename>
		<folder>tmpl</folder>
	</files>
	<config>
		<fields name="params">
			<fieldset name="basic">
                            <field 
                                name="title" 
                                type="text"
                                label="Заголовок"
                                description="Заголовок проекта"
                                required="true"
                                size="30"
                                validate="" />
                            <field 
                                name="description" 
                                type="editor" 
                                default="" 
                                label="Описание" 
                                description="Описание проекта"/>
                            <field 
                                name="icon" 
                                type="file"
                                label="Иконка" 
                                description="Иконка проекта"
                                accept="images/*"/>
			</fieldset>
		</fields>
	</config>
</extension>


index.html — кладется в каждую папку, которую вы создаете, чтобы левый пользователь не мог зайти в каталог введя его адрес в браузере.

<!DOCTYPE html>
<html>
    <head>
        <title>Пусто</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div>Вам сюда нельзя</div>
    </body>
</html>

tmpl — в этой папке лежат файлы-шаблоны, стили и скрипты, они отвечают за внешний вид модуля и ее динамическое оформление. Здесь наш HTML код с сопутствующим оформлением.

tmpl/default.php — этот файл является видом по умолчанию. Т.е. если вы не указываете какой-то конкретный шаблон, запускается default.php, который распознается системой, а его именование стандартное и задокументированное.

<?php
defined( '_JEXEC' ) or die( 'Restricted access' );
?>

<article style="background-color: #cccccc; border:1px solid silver;">
    Контент модуля из шаблона...
    <br/>
    <button id="mod-portfolio-btn">Кнопка</button>
</article>

 

Установка…

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

admin-side-of-module-joomla-by-stage-1

а со стороны клиента

module-output-info-joomla

В дальнейшем усложним задачу и добавим дополнительный функционал. Данный шаг проекта можно скачать по ссылке mod_portfolio_v1.0.0_stage_1.zip.