Pull to refresh

Добавление водяного знака к изображениям в RefineryCMS

Reading time 2 min
Views 3.5K
Довольно часто возникает задача поставить watermark на изображения на сайте. Обычно большинство разработчиков не видит проблему (многие PHP CMS это из коробки тянут), однако в мире Rails и движка RefineryCMS не все так гладко.
Refinery использует Dragonfly (специальный gem для работы с изображениями, основанный на Rack и обрабатывающий изображения «на лету») и здесь могут возникнуть некоторые трудности.

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


Само собой вам нужна картинка с прозрачным фоном png расширения. Назовем ее watermark.png и разместим в public/ директории проекта.

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

Итак сделаем свой класс по обработке изображений, который и будет накладывать водяной знак:

class ImageProcessor
  def watermark(temp_object)
    tempfile = new_tempfile
    args = " -dissolve 50% -gravity south #{Rails.root}/public/watermark.png #{temp_object.path} #{tempfile.path}"
    full_command = "composite #{args}"
    result = `#{full_command}`
    tempfile
  end

private

  def new_tempfile(ext=nil)
    tempfile = ext ? Tempfile.new(['dragonfly', ".#{ext}"]) : Tempfile.new('dragonfly')
    tempfile.binmode
    tempfile.close
    tempfile
  end
end


Основная идея по созданию процессоров для Dragonfly взята отсюда. Теперь разберем код.
Класс содержит 2 метода.
Метод new_tempfile создает временный файл — именно он будет «на выходе» (это результат операции наложения изображений) и используется в команде ImageMagick.
Метод watermark соответственно наш метод добавления водяного знака. Здесь все просто: аргументом temp_object является объект dragonfly изображения. Дальше мы создаем временный файл и записываем аргументы для команды composite из ImageMagick, которая и даст нам наложение изображений. Это простая и не оптимизированная версия, поэтому путь до файла watermark.png указывается прям здесь. Аргументы:
-dissolve 50% добавляет прозрачность.
-gravity south размещение снизу.
#{Rails.root}/public/watermark.png — путь до файла с вотермарком.
#{temp_object.path} — путь до исходного изображения.
#{tempfile.path} — путь до нашего временного файла. Именно последний и будет содержать итоговое «склеенное» изображение.

Теперь нам нужно подключить наш класс для обработки к приложению. Можно создать отдельный файл config/initializer/dragonfly.rb со следующим содержимым:

app = Dragonfly[:refinery_images]
app.processor.register(ImageProcessor)

Первая строчка получает так называемое «приложение» Dragonfly от RefineryCMS, вторая строчка непосредственно регистрирует наш класс.

Теперь можно это использовать вот-так:
<%= image_tag image.thumbnail('800x600#').process(:watermark).url %>

Будет выведена наша картинка уже с водяным знаком. Таким образом метод process из Dragonfly может работать с любыми зарегистрированными процессорами.

Данная статья на примере RefineryCMS показывает как можно быстро и просто добавить свой обработчик изображений к Dragonfly. Вы можете использовать это и без Refinery с другими прекрасными функциями из ImageMagick.
Tags:
Hubs:
+4
Comments 3
Comments Comments 3

Articles