MIGX галерея
с мультизагрузкой

04 августа 2016 Кирилл 16.4K просмотров

Перевод оригинальной статьи Using resource-specific mediasource and multifile-uploader with MIGX. Немного переделана конфигурация для MIGX.

Создаем источник файлов

Открываем в верхнем меню пункт "Медиа" - "Источники файлов". Нажимаем "Создать новый источник файлов":

Имя: ResourceMediaPath
Тип источника файлов: Файловая система

Сохраняем, в списке находим только что созданный источник, жмем правую кнопку, выбираем "Редактировать". Необходимо отредактировать поля "basePath" и "baseUrl", установить им значение:

MODX

[[migxResourceMediaPath? &pathTpl=`assets/resourceimages/{id}/` &createFolder=`1`]]

Необходимо в /assets/ создать директорию resourceimages и установить права на запись.

Создаем TV параметр

Вкладка "Общая информация"
- Имя - resourcealbum
- Подпись - Галерея
Вкладка "Параметры ввода"
- Тип ввода - migx
- Конфигурации - resourcealbum
Вкладка "Доступно для шаблонов"
- Отмечаем шаблоны, в которых будет использоваться галерея.
Вкладка "Источники файлов"
- Для нужного контекста (web по умолчанию) устанавливаем созданный в первом шаге источник файлов ResourceMediaPath (двойным кликом по соответствующему полю).

Создаем конфигурацию для MIGX

В верхнем меню переходим в "Приложения" - "MIGX". Переключаемся на вкладку "MIGX" и нажимаем "Добавить элемент". В поле "Name" пишем resourcealbum, нажимаем кнопку "Выполнено". В списке находим созданную конфигурацию, нажимаем правой кнопкой, выбираем "Экспорт/импорт", в текстовое поле вставляем следующий код:

JSON

{
  "formtabs":[
    {
      "MIGX_id":71,
      "caption":"Изображение",
      "print_before_tabs":"0",
      "fields":[
        {
          "field":"title",
          "caption":"Заголовок",
          "MIGX_id":327,
          "pos":1
        },
        {
          "MIGX_id":329,
          "field":"description",
          "caption":"Описание",
          "description":"",
          "description_is_code":"0",
          "inputTV":"",
          "inputTVtype":"",
          "validation":"",
          "configs":"",
          "restrictive_condition":"",
          "display":"",
          "sourceFrom":"config",
          "sources":"",
          "inputOptionValues":"",
          "default":"test",
          "useDefaultIfEmpty":"0",
          "pos":2
        },
        {
          "MIGX_id":425,
          "field":"image",
          "caption":"Изображение",
          "description":"",
          "description_is_code":"0",
          "inputTV":"",
          "inputTVtype":"image",
          "validation":"",
          "configs":"",
          "restrictive_condition":"",
          "display":"none",
          "sourceFrom":"migx",
          "sources":"",
          "inputOptionValues":"",
          "default":"",
          "useDefaultIfEmpty":"0",
          "pos":4
        }
      ],
      "pos":1
    }
  ],
  "contextmenus":"edit_migx||duplicate_migx||remove_migx_and_image||movetotop_migx||movetotop_bottom",
  "actionbuttons":"loadfromsource||uploadfiles",
  "columnbuttons":"",
  "filters":"",
  "extended":{
    "migx_add":"Add Image",
    "disable_add_item":1,
    "add_items_directly":"",
    "formcaption":"Изображение",
    "update_win_title":"",
    "win_id":"resourcegallery",
    "maxRecords":"",
    "addNewItemAt":"bottom",
    "multiple_formtabs":"",
    "multiple_formtabs_label":"",
    "multiple_formtabs_field":"",
    "multiple_formtabs_optionstext":"",
    "multiple_formtabs_optionsvalue":"",
    "actionbuttonsperrow":4,
    "winbuttonslist":"",
    "extrahandlers":"this.handleColumnSwitch",
    "filtersperrow":4,
    "packageName":"",
    "classname":"",
    "task":"",
    "getlistsort":"",
    "getlistsortdir":"",
    "sortconfig":"",
    "gridpagesize":"",
    "use_custom_prefix":"0",
    "prefix":"",
    "grid":"",
    "gridload_mode":1,
    "check_resid":1,
    "check_resid_TV":"",
    "join_alias":"",
    "has_jointable":"yes",
    "getlistwhere":"",
    "joins":"",
    "hooksnippets":"",
    "cmpmaincaption":"",
    "cmptabcaption":"",
    "cmptabdescription":"",
    "cmptabcontroller":"",
    "winbuttons":"",
    "onsubmitsuccess":"",
    "submitparams":""
  },
  "columns":[
    {
      "MIGX_id":1,
      "header":"ID",
      "dataIndex":"MIGX_id",
      "width":10,
      "renderer":"",
      "sortable":"false",
      "show_in_grid":1
    },
    {
      "MIGX_id":2,
      "header":"Заголовок",
      "dataIndex":"title",
      "width":20,
      "sortable":"false",
      "show_in_grid":1,
      "renderer":"",
      "clickaction":"",
      "selectorconfig":"",
      "renderchunktpl":"",
      "renderoptions":"",
      "editor":"this.textEditor"
    },
    {
      "MIGX_id":3,
      "header":"Изображение",
      "dataIndex":"image",
      "width":20,
      "renderer":"this.renderImage",
      "sortable":"false",
      "show_in_grid":1
    },
    {
      "MIGX_id":4,
      "header":"Опубликовано",
      "dataIndex":"published",
      "width":"",
      "sortable":"false",
      "show_in_grid":1,
      "renderer":"this.renderSwitchStatusOptions",
      "clickaction":"switchOption",
      "selectorconfig":"",
      "renderchunktpl":"",
      "renderoptions":[
        {
          "MIGX_id":1,
          "name":"publish",
          "use_as_fallback":"",
          "value":1,
          "clickaction":"",
          "handler":"",
          "image":"assets\/components\/migx\/style\/images\/cb_ticked.png"
        },
        {
          "MIGX_id":3,
          "name":"unpublish",
          "use_as_fallback":"",
          "value":"0",
          "clickaction":"",
          "handler":"",
          "image":"assets\/components\/migx\/style\/images\/cb_empty.png"
        }
      ],
      "editor":""
    }
  ]
}

После этого заходит в документ, который будет использовать галерею, в дополнительных полях видим таблицу и 2 кнопки:

Load from media source - загрузить все файлы, которые относятся к этому документу. Кнопка полезна, если вы закачиваете изображения по FTP. Для каждого из документов создается директория в assets/resourceimages/ID.
Upload Files - открывает диалоговое окно с загрузкой файлов в галерею.

Для того, чтобы сделать надписи кнопок на русском языке, можно создать соответствующие записи в лексиконе. Заходим в "Управление словарями", выбираем пространство имен "migx", тема "default", язык "ru" и создаем 2 записи:

Ключ	Значение
`migx.load_from_source`	Загрузить из папки
`migx.upload_images`	Загрузить с компьютера

Галерея корректно работает только с существующими ресурсами. Для использования с новыми ресурсами, необходимо сначала сохранить документ, чтобы ему был назначен ID.
При удалении изображений из таблицы TV поля, они так же удаляются из папки.

Метки MIGX Галерея

Создаем источник файлов

Создаем TV параметр

Создаем конфигурацию для MIGX

Обсудим ваш проект?