Тула
БЕСПЛАТНЫЙ АУДИТ Отправить заявку

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

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

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

Проблема

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

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

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

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

Цель

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

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

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

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

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

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

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.

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

Пример работы

В результате

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

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

Теги

RSS