Приветствую дорогие читатели. Как-то я писал модуль для OpenCart 2, назвал его условно: «Модуль интерактивного контента», проще говоря наложение меток (с дополнительным описанием) на изображения. Решил реализовать подобное на CMS Modx.
Ранее я слышал про заготовки для разработки собственных компонентов Modx, а именно: Doodles и ModExtra.
С Doodles я как-то работал на одном своем проекте, но там получилось не столько компонент сколько загруженная заготовка с последующей доработкой на backend и fronted…
Решил я все же воспользоваться Doodles по старой памяти, надо ли говорить, что проблемы начались на начальных этапах, не генерировалась модель, вероятно причина была что я где-то недоуказал CLASS или еще что-то, разбираться не стал, забил.
Скачал пакет ModExtra с GitHub’а, залил к себе на хостинг, выполнил требуемые действия (можно прочитать в Readme архива), и начал разработку своего дополнения…
В процессе разработки возникло не мало трудностей, одна из основных: Крохотные знания в ExtJs 3, что используется на backend’е Modx. Пришлось переворошить кучу документации, примеров из интернета, и просто следовать доводам логики так сказать, мало-помалу получалось реализовывать структуру своего компонента, для начала всплывающее окно с необходимыми полями, записью значений из полей в базу данных, создание элементов по клику и тд.
Как оказалось реализовать это все было полдела, настроить вывод и редактирование информации о той или иной схеме (изображении) с метками, информацию о самих метках и т.д., было куда сложнее, а именно, ошибок было море…
Исправляя ошибки, постепенно приводил свое дополнение к финалу разработки. Через 4 дня с начала разработки модуля, в админке, после двух десятков тестов все ошибки были исправлены и больше не возникали – зря я обрадовался… Настал момент разработки ключевого момента – перетаскивание или Drag&Drop тех самых меток… Примеров в интернете реализации подобного я можно сказать не нашел, мелкие «вырезки», описание метода, больше примеры были под ExtJs 6 и выше, методом проб и ошибок удалось реализовать перетаскивание точек по изображению, а так же сохранение их координат в базе данных.
Теперь уже точно создание и редактирование подобных схем было завершено.
Проблем с написанием сниппетов, системы чанков для вывода изображения с метками не возникло, модуль был закончен.
В общей сложности на такое решение у меня ушло 8 дней, тестировал его на чистом Modx’е без каких-либо установленных компонентов и верстки, и без ошибок работал на уже готовом проекте.
Данный компонент я выложил на площадке modstore.pro - Маркетплейс дополнений для MODX
Демо компонента:
Логин: demo
Пароль: demo12345
Написать комментарий