• Компания «КреатАйТи»
• Блог
• MODX Revolution

Плагин ResizeImageOnUpload для MODX Revo

Опубликовано: 08.10.2012 | MODX, Трюки, Дополнение, Работа с изображениями, Плагины

Этот небольшой плагин может оказаться очень полезным для вашего сайта и сильно упростить работу менеджерам сайта.



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

Проблема

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

Очень хорошо, если администратор сайта технически подкован и владеет Photoshop или иным графическим редактором и может обработать изображение перед загрузкой на сайт должным образом: задать размеры, установить подходящую степень сжатия для jpg файлов. Идеальный администратор! Но, к сожалению, не очень часто встречается и в итоге мы видим картину, когда на сайт загружены фотографии размером в несколько мегапикселей и весом значительно больше мегабайта.

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

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

Цель

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

Создание плагина

MODX Revolution имеет систему плагинов, с помощью которых можно решать самые разные задачи. Попробуем справиться и с нашей проблемой.

Создадим новый плагин и назовем его ResizeImageOnUpload:

На вкладке Системные события отметим галочкой строку с событием OnFileManagerUpload.

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

Исходный код плагина

Обратите внимание, что плагин работает в MODX версии старше 2.2 и полностью поддерживает "Источники файлов".

<?php
// проверяем нужное событие
if ($modx->event->name != 'OnFileManagerUpload') {return;}
// подключаем phpthumb
require_once MODX_CORE_PATH.'model/phpthumb/phpthumb.class.php';
// настройки плагина
$config = array(
'assets/upload/folder1/' => array(
'src' => array('w' => 800,'h' => 600,'zc' => 1,'bg' => '#fff','q' => 90),
),
'assets/upload/folder2/' => array(
'src' => array('w' => 400,'h' => 300,'zc' => 1,'bg' => '#fff','q' => 90),
'thumb' =>array('w' => 200,'h' => 150,'zc' => 1,'bg' => '#fff','q' => 70),
),
);
// параметры загружаемого файла
$file = $modx->event->params['files']['file'];
$directory = $modx->event->params['directory'];
// получаем media source
$ms = $modx->event->params['source'];
if($ms == null){
return;
}
// настройки media source
$msProperties = $ms->get('properties');
$directory = $msProperties['basePath']['value'].$directory;
// на всякий случай проверяем наличие // и заменяем на /
$directory = str_replace('//', '/', $directory);
// смотрим, что при загрузке не возникло ошибок
if ($file['error'] != 0) {
return;
}
$name = $file['name'];
$extensions = explode(',', $modx->getOption('upload_images'));
// проверям, что наша категория задана в настройках плагина
if (array_key_exists($directory, $config)) {
$config = $config[$directory];
}
else {
return;
}
// путь к файлу, имя файла, расширение
$filename = MODX_BASE_PATH.$directory.$name;
$def_fn = pathinfo($name, PATHINFO_FILENAME);
$ext = pathinfo($name, PATHINFO_EXTENSION);
// проверяем, что расширение файла задано в настройках MODX, как изображение
if (in_array($ext, $extensions)) {
$sizes = getimagesize($filename);
$format = substr($sizes['mime'],6);
// бежим по всем полям массива с конфигом
foreach($config as $imgKey =>$imgConfig){
$options = '';
if($imgKey == 'src'){
// для ключа src имя файла совпадает с исходным
$imgName = $filename;
}
else{
// формируем имя файла
//$imgName = MODX_BASE_PATH.$directory.$def_fn.'.'.$ext.'.'.$imgKey.'.'.$ext;
$imgName = MODX_BASE_PATH.$directory.$def_fn.'_'.$imgKey.'.'.$ext;
}
// создаем объект phpThumb..
$phpThumb = new phpThumb();
// ..и задаем параметры
$phpThumb->setSourceFilename($filename);
foreach ($imgConfig as $k => $v) {
$phpThumb->setParameter($k, $v);
}
// генерируем файл
if ($phpThumb->GenerateThumbnail()) {
if ($phpThumb->RenderToFile($imgName)) {
// устанавливаем права на файл, это опционально, зависит от сервера
chmod($imgName, 0666);
}
}
}
}

Настройка плагина

В начале плагина в массиве $config заданы настройки.

Ключ этого массива - путь к каталогу на сервере, например assets/upload/folder1/. Обратите внимание, что путь без / в начале. 

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

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

Помимо ключа src вы можете создать настройки с другим ключем, в примере выше это thumb. Каждый ключ позволит сгенерировать еще одно изображение в этой же папке с именем "имя_ключ.расширение".

Пример настроек

Массив $config с одного из сайтов:

$config = array(
'assets/images/offers/recommend/' => array(
'src' => array('w' => 200,'h' => 100,'zc' => 1),
),
'assets/images/offers/world/' => array(
'src' => array('w' => 200,'h' => 100,'zc' => 1),
'thumb' =>array('w' => 100,'h' => 50,'zc' => 1,'q' => 90),
),
);

Для демонстрации загрузим по очереди файл myimage.jpg в оба этих каталога и посмотрим, что получится.

• для каталога assets/images/offers/recommend/ происходит ресайз изображения до 200x100 точек, с автоматической обрезкой по краям (zc=1).
• для каталога 'assets/images/offers/world/ будет происходить ресайз изображения до 200x100 точек, с автоматической обрезкой по краям (zc=1), а также создание еще 1 изображение изображения размером 100x50 точек, с автоматической обрезкой по краям (zc=1). В случае если исходный файл был в формете jpg, он будет сохранен с с качеством сжатия 70.

Так это выглядит в файловой системе:

В результате

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

Кроме того, администраторы сайта будут вам благодарны, так как объем работы для них может сильно уменьшиться.

P.S. Идея плагина была взята у Василия Наумкина http://bezumkin.ru/blog/2012/08/04/resizeonupload/ , плагин был существенно переработан, добавлена поддержка источников файлов, изменен механизм ресайза изображений.

Теги

• MODX (20)
• Инструкции (10)
• Трюки (9)
• Дополнение (6)
• Работа с изображениями (4)
• Сниппеты (4)
• Социальная сеть (4)
• Mapex (3)
• Gallery (2)
• Плагины (2)
• SEO (2)
• modUserProfile (1)
• phpthumb (1)
• nginx (1)
• modUser (1)
• TinyMCE (1)
• getRelated (1)
• ReturnLink (1)
• tagLister (1)
• getPage (1)

RSS

• Блог о MODX Revolution

Компания «КреатАйТи»

© ООО «КреатАйТи», 2006 — 2014

Контакты

Тел: (4872) 79-24-00

E-mail: info@createit.ru

ICQ: 759-401

Skype: alexey.createit

Услуги

• Создание сайтов
• Продвижение сайтов
• Поддержка сайтов
• Разработка ПО

Поиск по сайту