1 Отредактировано zloitapok (18-02-2010 18:12:38)

Тема: Доработанный модуль меню

Модуль закончен.

Цели:

  • Как можно меньше кода в админке. Менеджеры должны сосредоточится на наполнении сайта, а не на конструкциях языка хтмл или какого-либо другого

  • Возможность загрузки изображений-иконок к каждому пункту меню

  • Как можно меньше ограничений по настройке внешнего вида меню

  • Максимальная простота редактирования шаблонов

  • Возможность постоянно держать раскрытими определенные пункты меню (Для javascript выпадающего меню)


В связи с этим, код шаблонов вынесен в отдельные файлы, а в админке меню будет только 3 изменения:

  • В редактировании свойств меню появится текстовое поле "папка шаблона меню"*.

  • В редактировании свойств меню появится текстовое поле для числа "Уровень раскрытия меню"**.

  • http://rel.org.ua/test/2.jpg

  • В редактировании пункта меню появится поле загрузки изображений

  • http://rel.org.ua/test/3.jpg

* Если оставить поле пустым, модуль будет искать шаблоны в своей папке ./application/modules/menu/templates/public/
** Все пункты меню, уровень которых меньше или равен указанному будут постоянно раскрыты, не зависимо от того выбраны они как активные или нет ( другими словами щелкнул ли пользователь по такому пункту меню или нет ). Не забываем что верхний уровень меню имеет номер 0. Пример такого меню: www.rozetka.com.ua

Установка:

1. Скачайте новый модуль меню http://dump.ru/file/4329241
2. Распакуйте его в ./application/modules, перезаписав старое
2. Выполните mysql запрос:

ALTER TABLE `menus_data` ADD `item_image` VARCHAR( 255 ) NOT NULL AFTER `item_type` ;

ALTER TABLE `menus` ADD `tpl` VARCHAR( 255 ) NULL AFTER `main_title` ,
ADD `expand_level` INT( 255 ) NULL AFTER `tpl` ;

Структура папки с шаблонами меню:

 - папка level_1
 -- файл container.tpl           ( Контейнер текущего уровня )
 -- файл item_default.tpl        ( Типичный элемент меню )
 -- файл item_default_active.tpl ( Типичный активный элемент меню )   
 -- файл item_first.tpl          ( Первый элемент меню )
 -- файл item_first_active.tpl   ( Первый активный элемент меню )
 -- файл item_last.tpl           ( Последний элемент меню )
 -- файл item_last_active.tpl    ( Последний активный меню )
 -- файл item_one.tpl            ( Единственный элемент меню )
 -- файл item_one_active.tpl     ( Единственный активный элемент меню )

 - папка level_2
 -- файл container.tpl           ( Контейнер текущего уровня )
 -- файл item_default.tpl        ( Типичный элемент меню )
 -- файл item_default_active.tpl ( Типичный активный элемент меню )   
 -- файл item_first.tpl          ( Первый элемент меню )
 -- файл item_first_active.tpl   ( Первый активный элемент меню )
 -- файл item_last.tpl           ( Последний элемент меню )
 -- файл item_last_active.tpl    ( Последний активный меню )
 -- файл item_one.tpl            ( Единственный элемент меню )
 -- файл item_one_active.tpl     ( Единственный активный элемент меню )
 ..............................................................................................................
 - папка level_n
 -- файл container.tpl           ( Контейнер текущего уровня )
 -- файл item_default.tpl        ( Типичный элемент меню )
 -- файл item_default_active.tpl ( Типичный активный элемент меню )   
 -- файл item_first.tpl          ( Первый элемент меню )
 -- файл item_first_active.tpl   ( Первый активный элемент меню )
 -- файл item_last.tpl           ( Последний элемент меню )
 -- файл item_last_active.tpl    ( Последний активный меню )
 -- файл item_one.tpl            ( Единственный элемент меню )
 -- файл item_one_active.tpl     ( Единственный активный элемент меню )

Как будет работать:

Предположим нам надо вывести пункт меню из уровня меню n (n больше или равно 0)
Переход к следующему пункту по списку ниже осуществляется в случае не выполнения текущего, кроме п. 5 и п. 6

1. Поиск родного ( first, last или one ) шаблона для активного пункта для уровня n.
2. Поиск родного ( first, last или one ) шаблона для неактивного пункта для уровня n.
3. Поиск типичного ( default ) шаблона для активного пункта для уровня n.
4. Поиск родного ( default) шаблона для неактивного пункта для уровня n.
5. Уменьшение n на 1. Если n больше или равно нулю Повтор пунктов 1..4.
6. Вывод сообщения о необходимом недостающем файле, путь к нему и название меню, которому необходим этот файл. Вывод подсказки.

"родной шаблон":
Для первого пункта меню родной шаблон будет item_first.tpl
Для первого выбранного пункта меню родной шаблон будет item_first_active.tpl
Для последнего пункта меню родной шаблон будет item_last.tpl
Для последнего выбранного пункта меню родной шаблон будет item_last_active.tpl
Для единственного пункта меню родной шаблон будет item_one.tpl
Для единственного выбранного пункта меню родной шаблон будет item_one_active.tpl
Для типичного пункта меню родной шаблон будет item_default.tpl
Для типичного выбранного пункта меню родной шаблон будет item_default_active.tpl


Настройку шаблона для вывода подсказки можно сделать здесь ./application/modules/menu/templates/public/error.tpl

Переменные, которые можно использовать в шаблонах меню:
$wrapper - переменная содержит пункты меню. Эту переменную можно использовать во всех файлах шаблонов меню.
$title - переменная содержит название пункта меню. Эту переменную можно использовать во всех файлах шаблонов меню, кроме container.tpl.
$link - переменная содержит линк на страницу/категорию/модуль/внешний ресурс. Эту переменную можно использовать во всех файлах шаблонов меню, кроме container.tpl.
$image - переменная содержит линк на картинку-иконку пункта меню (а вдминке есть интерфейс загрузки такой картинки). Эту переменную можно использовать во всех файлах шаблонов меню, кроме container.tpl.

Содержимое файла container.tpl по умолчанию:

<ul>{$wrapper}</ul>

Содержимое файла item_default.tpl по умолчанию:

<li>
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Содержимое файла item_default_active.tpl по умолчанию:

<li class="active">
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Содержимое файла item_first.tpl по умолчанию:

<li class="first">
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Содержимое файла item_first_active.tpl по умолчанию:

<li class="first active">
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Содержимое файла item_last.tpl по умолчанию:

<li class="last">
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Содержимое файла item_last_active.tpl по умолчанию:

<li class="last active">
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Содержимое файла item_one.tpl по умолчанию:

<li class="one">
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Содержимое файла item_one_active.tpl по умолчанию:

<li class="one active">
    <a href="{$link}">{$title}</a>
    {$wrapper}
</li>

Пример:
Предположим нам надо вывести меню, которое в верстке выглядит вот так:

<ul class="menu">
    <li><a href="#">Картинка 1 пункт 1</a></li>
    <li class="selected"><a href="#">Картинка 2 Пункт 2</a></li>
    <li><a href="#">Картинка 3 Пункт 3</a>
        <ul>
            <li><a href="#">Пункт 3_1</a></li>
            <li><a href="#">Пункт 3_2</a></li>
            <li><a href="#">Пункт 3_3</a></li>
        </ul>
    </li>
</ul>

Мы видим, что выбранный пункт меню имеет класс "selected", меню 2х уровневое и контейнер <ul> нулевого уровня меню имеет класс "menu" и для пунктов нулевого уровня меню надо вывести картинки

Это можно сделать с помощью модуля меню так:
Создаем в папке шаблона сайта какую-нибудь папку. В нашем варианте это будет "main_menu"
В ней создаем папки level_0 и level_1.
В папке level_0 создаем файлы container.tpl, item_default.tpl и item_default_active.tpl
В папке level_1 создаем файл container.tpl
Мы должны получить такую картину:

http://rel.org.ua/test/1.JPG

Для уровня меню 0 (level_0):
Настраиваем main_menu/level_0/container.tpl:

<ul class="menu">{$wrapper}</ul>

Настраиваем main_menu/level_0/item_default.tpl:

<li>
    <a href="{$link}">{media_url($image)} {$title}</a>
    {$wrapper}
</li>

Настраиваем main_menu/level_0/item_default_active.tpl:

<li class="selected">
    <a href="{$link}">{media_url($image)} {$title}</a>
    {$wrapper}
</li>

Для уровня меню 1 (level_1):
Настраиваем main_menu/level_1/container.tpl:

<ul>{$wrapper}</ul>

Итог:

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

Проверил в мультиязычности - работает чики-пики smile

Пользуйтесь smile

teapplix.com

2

Re: Доработанный модуль меню

Ухты  smile
Буду ждать.

Thumbs up Thumbs down

3 Отредактировано zloitapok (18-02-2010 04:32:46)

Re: Доработанный модуль меню

Пользуйтесь. Ссылка на скачивание в первом посте.

Комментарии в коде не везде проставил - потратил много времени на документацию, сейчас своими проектами надо заниматься. Если что не понятно - спрашивайте

teapplix.com

4

Re: Доработанный модуль меню

Напишите что думаете по поводу включения его а официальный релиз

teapplix.com

5

Re: Доработанный модуль меню

Скоро дам ответ, но работы вижу сделано не мало.

Thumbs up Thumbs down

6 Отредактировано zloitapok (18-02-2010 17:05:25)

Re: Доработанный модуль меню

admin пишет:

Скоро дам ответ, но работы вижу сделано не мало.

2 дня на программинг

teapplix.com

7 Отредактировано admin (18-02-2010 17:34:51)

Re: Доработанный модуль меню

Ну вот, а надо еще тестировать  smile

Что-то не могу найти в описании, например я создал меню "left_menu", далее какие действия? создавать папку left_menu со всеми файлами? или для новых меню есть директоия с дефолтными шаблонами например "default_menu"?

пс. по модулю галерея отписал на почту. жду ответа smile

Thumbs up Thumbs down

8 Отредактировано zloitapok (18-02-2010 18:00:48)

Re: Доработанный модуль меню

Дефолтные настройки можно скопировать отсюда: ./application/modules/menu/templates/public/

Вы создали папку left_menu в корне темы сайта (./templates/main/ если тема main), в нее скопировали содержимое ./application/modules/menu/templates/public/ без файла error.tpl.
Внутри только папка level_0. чтоб получить level_1, level_2, ... , level_n, делаете копию папки level_0 и называете ее level_1, снова копируете, и так далее, пока не сделаете достаточное кол-во шаблонов для нужных уровней вложенности.
Но это все требуется только если каждый уровень меню отличается от предъидущего. Наиболее часто, как показывает практика, шаблон отличаются у нулевого и первого уровня меню, все последующие имеют такой же шаблон как у первого уровня. В этом случае достаточно создать 2 папки level_0 и level_1 и прописать в них шаблоны. Шаблоны для 2го, 3го и т.д. уровней модуль будет брать из последней найденной папки с шаблоном, то есть level_1

teapplix.com

9

Re: Доработанный модуль меню

Было бы хорошо чтобы, если нет папки с именем меню - использовалась папка по умолчанию, например "defaults"

Ну и еще важный момент, сделать возможность перекрывать шаблоны, например чтобы использовались файлы из
./templates/lite/menus/menu_name/...  если нет то смотрим в папку модуля, если и там нет - то берем дефолнтые.

Thumbs up Thumbs down

10 Отредактировано zloitapok (18-02-2010 18:07:21)

Re: Доработанный модуль меню

admin пишет:

Было бы хорошо чтобы, если нет папки с именем меню - использовалась папка по умолчанию, например "defaults"

Ну и еще важный момент, сделать возможность перекрывать шаблоны, например чтобы использовались файлы из
./templates/lite/menus/menu_name/...  если нет то смотрим в папку модуля, если и там нет - то берем дефолнтые.

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

В папке модуля и есть стандартные шаблоны. Нигде в коде модуля не прописано html-конструкций. Это было бы не правильно, все они только в папке ./application/modules/menu/templates/public

teapplix.com

11

Re: Доработанный модуль меню

Ок. после теста отпишусь.

Thumbs up Thumbs down

12

Re: Доработанный модуль меню

Добавил 2 скриншота админпанели модуля к документации

teapplix.com

13 Отредактировано zloitapok (19-02-2010 15:56:10)

Re: Доработанный модуль меню

admin пишет:

Было бы хорошо чтобы, если нет папки с именем меню - использовалась папка по умолчанию, например "defaults"

Только сейчас заметил. Модуль ищет не папку с именем меню, а папку с заданным именем по тому пути, который указан в настройке конкретного меню в админке. Смотрите первый скриншот в первом посте. На скриншоте стоит menu/main_menu. Это означает что поиск будет в ./templates/your_theme/menu/main_menu/. Там модуль будет ожидать увидеть папку level_0. Я исходил из поставленной цели: как можно меньше ограничений по настройке.

teapplix.com

14

Re: Доработанный модуль меню

Есть сподвижки по тесту?

teapplix.com

15 Отредактировано zloitapok (26-02-2010 19:51:33)

Re: Доработанный модуль меню

Есть проблема.
Если сайт 2у язычный и для каждого языка своя тема, к примеру:
./templates/site_theme_ru/
./templates/site_theme_en/

То меню ищет шаблоны в той папке с темой сайта, которая выставляена в админке по-умолчанию. У меня язык по-умолчанию русский и меню генерируется по шаблонам из темплейта ./templates/site_theme_ru/
По логике в зависимости от текущего языка должна и папка в поиске меняться.

Подключал темплейты в модуле так:

$file = $this->template->template_dir.$this->tpl_folder.'/'.$file.'.tpl';

где в $this->tpl_folder находится строка пути к папке меню, что задано в админке меню. к примеру: menu/menu_1

return $this->template->fetch('file:'.$file);

Подскажите как получить имя папки с темой сайта на текущем языке?

teapplix.com

16

Re: Доработанный модуль меню

        $query = $this->db->get_where('languages', array('id' => $this->config->item('cur_lang')))->row_array();

        var_dump(TEMPLATES_PATH.$query['template']);

Thumbs up Thumbs down

17 Отредактировано zloitapok (27-02-2010 04:26:53)

Re: Доработанный модуль меню

Спасибо, помогло smile Ссылка на исправленую версию http://dump.ru/file/4369751

teapplix.com

18

Re: Доработанный модуль меню

этот сайт еще не готов, но на нем хорошо видно как можно прменить этот модуль www.uita.travel

teapplix.com

19

Re: Доработанный модуль меню

Супер! дополнения к модулю просто чудесное!!! большое спасибо.

Думаю нужно еще добавить шаблон, который бы выводился, если у пункта есть подпункты. Это пригодится в случае, если не все пункты меню уровня n включают в себе подпункты, а те, которые включают имеют другой стиль (например стрелочка справа). Вот так например:

<li id="submenu_arrow">
<a href="{$link}">{$title}</a>
{$wrapper}
</li>

Thumbs up Thumbs down

20 Отредактировано Funstarter (23-03-2010 23:40:35)

Re: Доработанный модуль меню

Нашел вроде баг.
Когда создал меню и назначил ему шаблон, меню не вывелось, выдает ошибку.

Не обнаружен необходимый файл шаблона для меню rightmenu1 
http://mysite/templates/default/rightmenu/level_0/item_default.tpl

Ищет шаблон не там.

Я это исправил, но немного корявым методом.

В файле  /application/modules/menu/menu.php в 757 строке заменил

$file = 'templates/'.$this->template->TEMPLATES_PATH.$query['template'].'/'.$this->tpl_folder.'/'.$file.'.tpl';

на

$file = realpath(dirname(__FILE__)).'/templates/'.$this->tpl_folder.'/'.$file.'.tpl';

и закомментировал проверку на ошибку шаблона в строке 457

/*if ($is_good) 
        {
            return $tpl;
        }
        else 
        {
            //передача управления сюда означает что один из необходимых файлов шаблона меню не найден в указанной папке
        
            if ($this->tpl_folder) 
            {
                $err_data = array('user_template' => $this->tpl_folder.'/'.$tpl.'.tpl');
            }
            else
            {
                $err_data = array('system_template' => './application/modules/menu/templates/public/'.$tpl.'.tpl');
            }
        
            $this->errors[] = $err_data;
            return FALSE;
        } */
        return $tpl;

Если не закомментировать эту проверку, то все равно выдает ошибку.

Thumbs up Thumbs down

21

Re: Доработанный модуль меню

Интересно, надо глянуть. Выложу исправленную версию когда разберусь

teapplix.com

22 Отредактировано MbyteZ (24-03-2010 02:35:38)

Re: Доработанный модуль меню

Funstarter пишет:

Нашел вроде баг.
Когда создал меню и назначил ему шаблон, меню не вывелось, выдает ошибку.

Не обнаружен необходимый файл шаблона для меню rightmenu1 
http://mysite/templates/default/rightmenu/level_0/item_default.tpl

Ищет шаблон не там.

Аналогичная ошибка, только вместо шаблона default - lite:
Error: File templates/lite/menu1/level_0/item_one.tpl not found;

Thumbs up Thumbs down

23

Re: Доработанный модуль меню

zloitapok пишет:

Спасибо, помогло smile Ссылка на исправленую версию http://dump.ru/file/4369751

Автор, или кто скачал - перезалейте пожалуйста модуль!! Удалили!

Thumbs up Thumbs down

24

Re: Доработанный модуль меню

да пожалуйста

Thumbs up Thumbs down

25

Re: Доработанный модуль меню

Мы этот модуль уже давно включили в сборку...

https://github.com/imagecms/ImageCMS - ночные сборки корпорейта
https://scrutinizer-ci.com/g/imagecms/ImageCMS/badges/quality-score.png?b=development https://codeclimate.com/github/imagecms/ImageCMS/badges/gpa.svg

Thumbs up Thumbs down