Привет друзья!
Две недели назад разработка нового сайта на MODx меня в очередной раз заставила «обрезать» админку до нужного функционала для «простого» заказчика.
Уже на тот момент функционал ManagerManager меня не удовлетворял и приходилось использовать различные хаки для меню, дерева ресурсов, чанков и т. д.
Ну вот и я пустился в путь написания плагина…
Сначала был плагин исключительно для дерева ресурсов. С помощью него я успешно прятал нужные мне ресурсы.
Потом возникла необходимость в редактировании меню. Не долго думав(день), я бросил в топку первый плагин и стал писать полнофункциональный плагин для управления всей админкой.
Сейчас я исключительно не хочу рассказывать, что было дальше, т. к. это не вступительный туториал.
Я хочу просто показать, что мой плагин
JSAM на данный момент умеет.
Настройка производится с помощью всеми любимых правил :)
Например меню можно настроить как-то так:
if( data.type == 'menu' ){
this.link.rename( 'Просмотр', false, 'Просмотр сайта' );
this.link.rename( 'Новый ресурс', false, 'Новый документ' );
this.link.add( 'Элементы', 'Редактировать футер', 'index.php?id=1&a=78' );
this.link.add( 'Элементы', 'Редактировать шаблон', 'index.php?id=3&a=16' );
if( data.manager.shortname == 'Administrator' ){
this.link.remove( 'Новая ссылка' );
this.tab.rename( 'Элементы', 'Детали' );
this.link.remove( 'Управление элементами' );
// Управление META-тегами и ключевыми словами
this.link.remove( 2, 'Детали' );
this.tab.remove( 'Модули' );
this.tab.remove( 'Пользователи' );
this.tab.remove( 'Отчеты' );
this.link.remove( 'Импортировать сайт' );
this.link.remove( 'Экспортировать сайт' );
this.link.remove( 'Конфигурация' );
this.link.move( 'Очистить кэш', false, false, 'Инструменты' );
this.link.move( 'Управление файлами', false, false, 'Инструменты' );
}
}
А выглядеть это будет вот так:
С помощью JSAM также можно настроить чанки, шаблоны, ресурсы и т. д.
Например с помощью следующих правил можно настроить определённый чанк:
if( data.id == 1 && data.type == 'chunk' ){
this.get.page.header().html( 'Редактировать футер' );
this.get.page.description().html( 'Здесь вы можете отредактировать информацию, которая находится внизу страницы на сайте' );
this.hide.settings();
this.hide.redactor();
this.hide.textarea.descriptionBlock();
this.hide.actions.stay();
this.hide.actions.copy();
this.hide.actions.remove();
}
И вид:
Насколько вы успели заметить, правила написаны на языке JavaScript, как и впрочем всё остальное(люблю JavaScript!).
Также использую библиотеку jQuery 1.4.2
JSAM также при загрузке фрейма рисует оверлей и уберает монотонный прелоадер при загрузке ресурса:
JSAM любит консоль FireBug и с удовольствием печатает там отчёты:
UPD-2. Законченный вариант:
Естественно JSAM работает в отдельном фрейме, если его отдельно запустить от админки.
В нём присутствуют ещё куча вкусных бубликов.
НО! На данный момент он ещё в разработке. И поэтому чуть позже будет выложен законченный продукт.
Теперь самое главное! Этим топиком я ищу интересные идеи на счёт нового плагина. Может они у вас есть?)
UPD-1: Обновил код примера настройки меню.
Комментарии (81)
RSS свернуть / развернутьstyle-nes
На данный момент полностью закончена разработка API управления меню :)
Приступаю к чанкам и шаблонам)
Regent
Если действовать, как я описал в топике, то для того, чтобы скрылись необходимые и/или показались необходимые поля нужно сохранить документ и открыть его для редактирования. Т.к. mm не умеет знает какому родителю принадлежит вновь создаваемый документ.
Собственно вопрос, будет ли такая возможность в JSAM.
И да, как расшифровывается JSAM? )))
pitbull
JSAM такие вещи знает ещё как!
Родитель у вновь создаваемого документа легко узнаётся…
Вообщем при создании/редактировании ресурса всегда в переменной data.parent будет доступен ID родителя :)
Помимо этого в переменной data.parentParent будет доступен ID родителя родителя, т. к. это тоже важный критерий при настройке ресурса. Лично мной подобный параметр был активно использован при разработке 2-х сайтов.
JSAM — JavaScript-Manager for admin
@description: JavaScript-инструментарий менеджера MODx для настройки внешнего вида панели администратора
Regent
Желаю скорейшего релиза ;)
pitbull
А не лучше будет сделать, как в jQuery parent в виде элемента и parents в виде массива родителей?
Или конструкция data.parent.parent не будет работать?
pitbull
Представьте сколько будет запросов к БД!
С другой стороны это(data.parent[.parent[.parent[...]]]) ПРОСТО ЧЕРТОВСКИ УДОБНО БУДЕТ для настройки ресурсов.
Вот и я думаю, что выбрать?
Regent
А если бывает и бывает, то непродолжительно, я думаю это никак ощутимо на производительности не скажется.
pitbull
Если его вот под такой формат делать:
И создать функцию
То конструкцию data.parent[.parent[.parent[...]]] легко создавать уже с помощью JS!
Какие плюсы?
При желании с помощью JS можно получить вообще ID родителя любого документа :)
Вот код, как будут запрашиваться данные:
Запрос лёгок :)
Вердикт: jsam.parents и data.parent[.parent[.parent[...]]] быть!
pitbull спасибо!
Regent
pitbull
Carw
Вот тогда действительно быстро дело будет!
Но это оставим пока на следующую версию.
Regent
Массив parents всё-таки будет находится в data, т. к. будет при загрузке нового документа обновляться.
В связи с этим можно сделать функцию jsam.parents( id ), которая будет проверять, вообще ли есть такой родитель в цепочке родителей ресурса:
Получается просто прекрасная и гибкая штука!
Сейчас уже могу сказать, что первая релизная версия будет 0.0.2rc1. С помощью неё можно будет настраивать: меню, дерево ресурсов, чанки, документы и главную страницу(именно сейчас её API в разработке). Будет поддержка ru и en языков в отчётах Firebug`a
Также будет создан сайт с доками по API и исчерпывающим опсианием :)
Regent
Я тоже любитель создавать сайты, но подумайте сможете ли вы в обозримые N лет оплачивать хостинг и доменное имя ;)
Последнее время часто натыкался на вещи, документация которых должна быть на сайте, а сайта такого даавно уже нет. Это бывает печально.
// мысли в слух )
pitbull
Если что-то непредвиденное случится, есть люди, которые смогут об этом позаботиться ;)
// Сначала надо сделать, а там разберёмся :)
Regent
Carw
А за предложение спасибо, но не надо. Денежка на это есть)
Regent
А можно будет сделать так чтобы конкретные чанки открывались сразу с визуальным редактором а не просто как код? Как это реализовано с отдельными страницами?
banev
+1 функция превращения textarea в TinyMCE
Я об этом кстати ещё не додумался :)
И естественно +1 хорошее предложение в копилку)
Regent
— Запрет на удаление документа с определенным ID (не на редактирование а именно на удаление).
— Запрет на создание дочерних документов ниже определенного уровня вложенности.
banev
— Запрет на создание дочерних документов ниже определенного уровня вложенности. — вот это уже реальная задача и легко осуществимая! Можно ещё также сделать запрет на создания дочерних документов у определённого ID(в том числе и в корне — его ID=0). Теперь надо придумать ихнее API
Regent
По поводу второго предложения — есть ли вариант привязывать запрет не только к ID документа, но и к ID шаблона документа? Получится вообще идеальная схема каталога, где его структура будет утверждена клиентом на стадии составления техзадания, и у клиента не будет технической возможности нарушить логику создания новых веток и подпунктов. Это облегчит понимание клиентом возможностей структуры, а разработчиков избавит от необходимости верстки многоуровневых выпадающих меню, ну или от объяснений типа: «хоть вы и создали эту страницу — в меню она отображаться не будет, создайте на уровень повыше» :)
Исходя из моего опыта — абсолютное большинство информации можно структурировать обходясь двумя-тремя уровнями вложенности. Копая глубже клиент усложняет жизнь и себе и мне и посетителям. Бывают исключения — но редко…
banev
Вообще можно будет сделать запрет по:
1. Если есть определённый ID в цепочке родителей
2. ID шаблона по умолчанию в этом новом документе
3. Ещё какие-то некоторые детали нового документа(если они есть)
Собственно такая гибкость самой настройки сможет дать полностью удовлетворяющую админку без головной боли!
Regent
banev
Carw
+1 в копилку =)
Regent
banev
ну и совсем круто было бы в дереве сайта: меню->дочерний ресурс->список шаблонов :)
antonkuzmin
На счёт второго не понял =)
Regent
СОЗДАТЬ ИНФОРМАЦИОННУЮ СТРАНИЦУ
СОЗДАТЬ ФОТОГАЛЕРЕЮ
Мысль шикарная, но реализуемо ли?
Или как вариант при создании дочернего документа, ввести промежуточную страницу которая через радиобаттоны спрашивает в каком с каким шаблоном создавать страницу, а уже потом перекидывает к редактированию полей.
banev
Только перед этим нужно будет хорошо покопаться в API текущего дерева ресурсов. Ещё не разбирал его по косточкам)
Да, первый вариант шикарнее второго)
Regent
Изменить / добавить пункты можно легко.
burik
Итак, почти дописал объект(-набор функций) для управления табами в правом нижнем фрейме(Главная страница, ресурсы, чанки и т. д.).
Конечно там табы организовавыются не так, как хотелось бы — и из-за этого много мороки. Табы организовываются с помощью виджета Tab Pane 1.02(For WebFX (http://webfx.eae.net/)) — 2003 года выпуска
Мной на данынй момент написаны функции:
1. Получение всех/определённого таба, как jQuery объектов
2. «Клика», т. е. отображения определённого таба по умолчанию
3. Скрытия/Показывания определённого таба
4. ДОБАВЛЕНИЯ нового таба
5. Перемещения определённого таба в определённую позицию среди табов
6. Переименования таба
Хочу спросить, может ещё какие функции нужны?
Regent
Теперь JSAM поддерживает два языка: русский и английский.
По умолчанию стоит английский язык.
Язык определяется не из userAgent браузера, а именно из переменной в конфиге, т. е. $modx -> config[ 'manager_language' ]
Вот вкусная картинка примеров отчёта в Firebug`e на двух языках:
Regent
У меня вот мысль еще появилась, а не влить ли сюда еще мой эксперимент? Направления по-сути близки и дополнительные плюсы для разработчика получатся, особенно если это дело еще расширить до шаблонов / плагинов / модулей.
Carw
Но одно но! Чуть позже и в виде модуля
Да да, модуля :)
Т. е. впереди абсолютная безграничность настройки админки
Regent
Carw
Т. е. в папке плагина jsam будет папка, например extensions, *.inc.php файлы в которой будут выполнятся после ввода в фрейм jsam`а, но до выполнения правил.
Собственно так можно будет создать что угодно
Regent
Вот небольшой примерчик настройки главной страницы для редактора:
А вот результат:
И вторая вкладка:
Regent
Еще сегодня такая мысль пришла интересная. Как насчет расширенных виджетов? Стандартный список не всегда дает нужные возможности, а при желании допустим можно привязать совершенно новый вид виджета. Изначально скажем использовать стандартное текстовое поле, а затем менять его на нужный вид. Это позволит и множественную привязку файлов сделать или некую галерею, или управление тегами, как в ММ.
Carw
В предыдущем комментарии я выразился «модуль». А имел ввиду виджет :)
Да, конечно таких виджетов можно будет написать приличное множество!
Вот такие виджеты задумывались с неделю назад:
1. Виджет мини-галереи изображений — аналог поля «добавить изображение», только с предпросмотром и множественным добавлением изображений в одно поле
2. Виджет «Пара-значение». Полностью настраиваемый виджет текстовых полей. Например вида:
Имя:input, Название:inpiut
Имя:input, Название:inpiut
И всё это с помощью одной функции, которая превращает обычный input во всё это.
Наверно из моих слов ничего не понятно :)
Regent
Но если выше действительно под модулем на самом деле подразумевался виджет, то тогда я не понимаю как мой эксперимент можно в виде модуля тем более, если расширить на плагины / шаблоны. :)
Carw
Ведь JSAM работает на самом самом самом событии OnManagerPageInit, с помощью которого всё можно :)
А также легко можно добавить искусственно события OnSnipFormPrerender и OnBeforeSnipFormSave(это я щас так думаю)…
Regent
Carw
С помощью этого массива вытекают красивые способы логической настройки! А на данный момент функции:
1. jsam.isParents( documentID, parentID ) — проверяет, есть ли у документа documentID родитель в цепочке родителей с ID равном parentID
2. jsam.getParents( documentID ) — возвращает список родителей документа
3. jsam.level( documentID ) — возвращает уровень вложенности документа! С помощью этой функции можно например запретить создание документов ниже определённого уровня вложенности и т. д.!
Пока придумываю ещё функции…
Regent
Regent, вы, этот — молодец!!! ;)
pitbull
Меня такие комментарии всё больше поддалкивают на работу)
Regent
Выборка полей происходит по их текущему имени!
Например:
Просто?)
Regent
Заголовок
Расширенный заголовок
Carw
Проверяется на полное соответствие)
Если вдаваться в подробности, то я использую всевдо-селектор :contains
Вот код:
Regent
Например вот результат такого кода:
Больше названия полей не будут сжиматься до ужаса)
Regent
banev
Закрытое тестирование приближается =)
В этой релизной версии будет возможность управления отображением ресурсов,
, чанков, меню и деревом. На большее пока меня не хватит(
Regent
banev
Regent
pitbull
Всё началось с того, что любое манипулирование с tinyMCE в перемещениях по DOM заканчивалось крахом самого tinyMCE. Ну после этого удара tinyMCE отнял у меня 50% стимула к дальнейшему развитию этой ветки. Остальные 50% ушли в глубокие раздумья на сутки.
Сегодня утром мозг сконструировал гениальное решение и теперь манипулирование с DOM-окружением tinyMCE происходит идеально :)
Более того tinyMCE в качестве контрибуции согласился на функцию быстрого переключения его в textarea и обратно(Результат — около 0,7ms времени). Также теперь любое поле можно будет превратить в tinyMCE :)
На данный момент полностью дописаны API управления меню и главной страницей. Сейчас ведётся работа над страничкой редактирования/создания ресурса. После будет быстро пересоздано API управления страничкой редактирования/создания чанка. Ну а в конце будет закинуто пару функций в API управления деревом ресурсов!
Также в бета-версии будут доступны два вшитых виджета:
1. Превращает поле в файл-менеджер
2. Превращает поле в картинко-менеджер
Вот такие дела =)
Regent
style-nes
Carw
Пока по его функционалу планируется приделать управление максимальным количеством файлов и вариант для одного файла.
А вот как его вызывать:
Есть какие нибудь пожелания по его функционалу?
П. С. Кто-нибудь знает что-нибудь про исчезание содержимого тега td в IE7 при наведении?
Уже день борюсь с этим недоразумением(
Причём происходит следующее: страничка загрузилась, виджет создался. Наведение на виджет мышкой и содержимое перестаёт отображаться(
Regent
Carw
Сейчас попробовал создать виджет во второй вкладке. Тоже самое — при наведении исчезает. Но когда я нажимаю на первую вкладку, а потом опять на вторую, где расположен виджет — виджет появляется, при наведении исчезает. Такое чувство, что это MooTools или TabPane сума сходят. Попробую проанализировать полностью код странички и скриптов
Regent
Carw
Ответ: проделки виджета TabPane. Ну а точнее это проделки IE6/7. При динамической вставке контента происходит конфликт z-index`ов и ячейка проваливается под саму таблицу.
Вот такой фикс я использую:
И на это я убил последних 2,5 дня + недоумение в прошлом. Как досадно, удар в спину :(
Regent
Carw
antonkuzmin
Regent
Carw
Regent
Leadmonkey
Regent
Leadmonkey
Regent
burik
Написал функцию для искусственного добавления кода на события:
Пример:
Также добавил собственные события в плагин:
1. OnJsamCreated — запускается после создания класса JSAM
2. OnJsamBeforeExecution — запускается до начала работы по созданию основного кода JSAM
3. OnJsamAftereExecution — запускается после работы по созданию основного кода JSAM
4. OnJsamBeforeLoadExtension — запускается до начала подключения расширений/виджетов
5. OnJsamExtension — запускается во время подключения расширений/виджета
6. OnJsamLoadExtension — запускается после подключения всех расширений
7. OnJsamPrintCode — запускается до вывода окончательного кода JSAM
Сейчас ищу способ искусственного добавления на страничку редактирования плагина этих событий. Но ничего хорошего и прозрачного пока не придумал. Видимо придётся регистрировать их в табличке site_system_eventnames при первом запуске плагина.
Теперь на стороне клиента(т. е. в JS интерфейсе) доступна полная информация по родителю ресурса — по адресу jsam.parentInfo.
Сейчас встраиваю в JSAM альтернативу плагину Inherit Parent Template, который наследует шаблон родителя. JSAM уже будет заменять два плагина.
П. С. вам реально нужно подобие функции mm_inherit?
Regent
pitbull
К тому же просто совесть не позволяет выпустить абсолютно сырой продукт…
В мыслях уже проследил путь к релизу, т. е. что надо доделать. Постараюсь в течении недели всё доделать)
Regent
П. С. Закрытое тестирование возможно будет на этой недели, если я успею доки спарсить с комментариев в JS-core файле.
Плагин на момент тестирования будет сыроват, но стабилен!
Regent
pitbull
banev
Сейчас уже вроде закончил косметическую причёску основного JS файла. Он вышел на 2493 строки и весом в 103 КБ. Исключил небезопасные и недоделанные функции. В общем причесал.
Осталось доки из этого файла спарсить и скомпилировать в достойный вид. И конечно написать инструкцию и выложить на блог.
Доки по методам в файле имеют примерно такой вид:
Думаемс =)
Regent
Дальнейшее обсуждение переносится в топик JSAM 0.0.2beta1 — Релиз!
Regent
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.