{"id":5376,"date":"2011-11-21T10:59:34","date_gmt":"2011-11-21T08:59:34","guid":{"rendered":"https:\/\/www.ideematic.com\/actualites\/?p=268"},"modified":"2011-11-21T10:59:34","modified_gmt":"2011-11-21T08:59:34","slug":"creer-des-filtres-personnalises-avec-paperclip","status":"publish","type":"post","link":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/","title":{"rendered":"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip"},"content":{"rendered":"

[vc_row][vc_column][vc_column_text]Paperclip<\/a> est une gem Ruby permettant de g\u00e9rer les uploads de fichiers sur une application Ruby On Rails et de les relier \u00e0 un mod\u00e8le ActiveRecord.<\/p>\n

L’un des int\u00e9r\u00eats de cette librairie est sa capacit\u00e9 \u00e0 g\u00e9rer l’upload d’images et leur redimensionnement en plusieurs formats. En effet Paperclip utilise la librairie ImageMagick<\/a> qui est une suite logicielle permettant de cr\u00e9er, \u00e9diter, composer et convertir des images bitmap. ImageMagick supporte plus de 100 formats de fichiers et peut \u00eatre consid\u00e9r\u00e9e comme le couteau Suisse de la manipulation d’images.<\/p>\n

Ceci \u00e9tant pos\u00e9, on peut faire \u00e0 peu pr\u00eat n’importe quelle manipulation d’images via une application Ruby On Rails. Nous allons voir comment.<\/p>\n

<\/p>\n

Lorsque l’on souhaite uploader des images via Paperclip, la librairie fournit nativement des \u00ab\u00a0processors\u00a0\u00bb (filtres en fran\u00e7ais) pour redimensionner les images dans une taille pr\u00e9d\u00e9finie via ImageMagick. L’exemple suivant utilise Paperclip pour ajouter une image \u00e0 un mod\u00e8le Reference.<\/p>\n

\nclass Reference < ActiveRecord::Base\n  has_attached_file :image, :styles => { :normal => "300x150" }\nend\n<\/pre>\n

Dans cet exemple, nous avons d\u00e9fini un attribut image auquel nous appliquons un style :normal ( via le hash styles) qui retaille l’image originale en 300px par 150px.<\/p>\n

Imaginons d\u00e9sormais que dans un cas utilisateur, notre image doit non seulement \u00eatre\u00a0retaill\u00e9e en 300×150 mais aussi que ses couleurs doivent \u00eatre att\u00e9nu\u00e9es.<\/p>\n

Pour cela, nous devons cr\u00e9er un processor Grayscale dans lequel nous allons demander \u00e0 ImageMagick de faire cette manipulation. Le processor doit se trouver dans lib\/paperclip_processors et se nommer grayscale.rb.<\/p>\n

\nmodule Paperclip\n    class Grayscale < Processor\n      def initialize file, options = {}, attachment = nil\n        super\n        @file           = file\n        @current_format = File.extname(@file.path)\n        @basename       = File.basename(@file.path, @current_format)\n      end\n\n      def make\n        dst = Tempfile.new(@basename)\n        dst.binmode\n        command = "-resize 300x150 -modulate 80,20,100 #{File.expand_path(@file.path)} #{File.expand_path(dst.path)}"\n\n        begin\n          success = Paperclip.run("convert", command)\n        rescue PaperclipCommandLineError\n          raise PaperclipError, "There was an error when transform in grayscale #{@basename}"\n        end\n\n        dst\n      end\n    end\nend\n<\/pre>\n

Ceci \u00e9tant fait, nous devons indiquer \u00e0 notre application Rails de charger les processors apr\u00e8s son d\u00e9marrage dans le fichier config\/application.rb<\/p>\n

\nconfig.after_initialize do\n  Dir.glob(File.join(File.expand_path(Rails.root),'lib','paperclip_processors','*.rb')).each do |processor|\n    require processor\n  end\nend\n<\/pre>\n

Enfin, nous devons modifier le code de notre mod\u00e8le Reference afin qu’il applique le processor Grayscale sur l’image que nous lui aurons envoy\u00e9e :<\/p>\n

\nclass Reference < ActiveRecord::Base\n  has_attached_file :image, :styles => { :normal => "300x150", :grayscale => { :processors => [:grayscale]  } }\nend\n<\/pre>\n

D\u00e9sormais, lorsqu’une image sera upload\u00e9e pour le mod\u00e8le Reference, celle-ci sera retrait\u00e9e pour \u00eatre retaill\u00e9e pour le style :normal et modifi\u00e9e via le processor Grayscale pour le style :grayscale :<\/p>\n

\"Image<\/a>

Image retaill\u00e9e automatiquement en style normal \u00e0 300x150<\/p><\/div>\n

\"Image<\/a>

Image retravaill\u00e9e pour obtenir un effet niveaux de gris<\/p><\/div> [\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"

[vc_row][vc_column][vc_column_text]Paperclip est une gem Ruby permettant de g\u00e9rer les uploads de fichiers sur une application Ruby On Rails et de les relier \u00e0 un mod\u00e8le ActiveRecord. L’un des int\u00e9r\u00eats de cette librairie est sa capacit\u00e9 \u00e0 g\u00e9rer l’upload d’images et leur redimensionnement en plusieurs formats. En effet Paperclip utilise la librairie ImageMagick qui est une […]<\/p>\n","protected":false},"author":11,"featured_media":1645,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[27],"tags":[52,57,58],"class_list":["post-5376","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ruby-on-rails","tag-ruby-on-rails-2","tag-paperclip","tag-processors"],"acf":[],"yoast_head":"\nCr\u00e9er des filtres personnalis\u00e9s avec Paperclip - Id\u00e9ematic<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip - Id\u00e9ematic\" \/>\n<meta property=\"og:description\" content=\"[vc_row][vc_column][vc_column_text]Paperclip est une gem Ruby permettant de g\u00e9rer les uploads de fichiers sur une application Ruby On Rails et de les relier \u00e0 un mod\u00e8le ActiveRecord. L’un des int\u00e9r\u00eats de cette librairie est sa capacit\u00e9 \u00e0 g\u00e9rer l’upload d’images et leur redimensionnement en plusieurs formats. En effet Paperclip utilise la librairie ImageMagick qui est une […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/\" \/>\n<meta property=\"og:site_name\" content=\"Id\u00e9ematic\" \/>\n<meta property=\"article:published_time\" content=\"2011-11-21T08:59:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.ideematic.com\/wp-content\/uploads\/2011\/11\/Paper-CLip-et-Image-Magick.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1314\" \/>\n\t<meta property=\"og:image:height\" content=\"418\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"mick\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"mick\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/\"},\"author\":{\"name\":\"mick\",\"@id\":\"https:\/\/www.ideematic.com\/#\/schema\/person\/6dd73b12c35e71d0edc290b3841dfcac\"},\"headline\":\"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip\",\"datePublished\":\"2011-11-21T08:59:34+00:00\",\"dateModified\":\"2011-11-21T08:59:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/\"},\"wordCount\":539,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.ideematic.com\/#organization\"},\"keywords\":[\"ruby on rails\",\"paperclip\",\"processors\"],\"articleSection\":[\"Ruby On Rails\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/\",\"url\":\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/\",\"name\":\"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip - Id\u00e9ematic\",\"isPartOf\":{\"@id\":\"https:\/\/www.ideematic.com\/#website\"},\"datePublished\":\"2011-11-21T08:59:34+00:00\",\"dateModified\":\"2011-11-21T08:59:34+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/www.ideematic.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Ruby On Rails\",\"item\":\"https:\/\/www.ideematic.com\/actualites\/category\/ruby-on-rails\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.ideematic.com\/#website\",\"url\":\"https:\/\/www.ideematic.com\/\",\"name\":\"Id\u00e9ematic\",\"description\":\"Id\u00e9ematic est une agence digitale \u00e0 Strasbourg et Paris\",\"publisher\":{\"@id\":\"https:\/\/www.ideematic.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.ideematic.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.ideematic.com\/#organization\",\"name\":\"Id\u00e9ematic\",\"url\":\"https:\/\/www.ideematic.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.ideematic.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.ideematic.com\/wp-content\/uploads\/2017\/12\/agence-react-native-ruby-on-rails.png\",\"contentUrl\":\"https:\/\/www.ideematic.com\/wp-content\/uploads\/2017\/12\/agence-react-native-ruby-on-rails.png\",\"width\":1200,\"height\":500,\"caption\":\"Id\u00e9ematic\"},\"image\":{\"@id\":\"https:\/\/www.ideematic.com\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.ideematic.com\/#\/schema\/person\/6dd73b12c35e71d0edc290b3841dfcac\",\"name\":\"mick\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/www.ideematic.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g\",\"caption\":\"mick\"},\"url\":\"https:\/\/www.ideematic.com\/actualites\/author\/mick\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip - Id\u00e9ematic","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/","og_locale":"fr_FR","og_type":"article","og_title":"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip - Id\u00e9ematic","og_description":"[vc_row][vc_column][vc_column_text]Paperclip est une gem Ruby permettant de g\u00e9rer les uploads de fichiers sur une application Ruby On Rails et de les relier \u00e0 un mod\u00e8le ActiveRecord. L’un des int\u00e9r\u00eats de cette librairie est sa capacit\u00e9 \u00e0 g\u00e9rer l’upload d’images et leur redimensionnement en plusieurs formats. En effet Paperclip utilise la librairie ImageMagick qui est une […]","og_url":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/","og_site_name":"Id\u00e9ematic","article_published_time":"2011-11-21T08:59:34+00:00","og_image":[{"width":1314,"height":418,"url":"https:\/\/www.ideematic.com\/wp-content\/uploads\/2011\/11\/Paper-CLip-et-Image-Magick.jpg","type":"image\/jpeg"}],"author":"mick","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"mick","Dur\u00e9e de lecture estim\u00e9e":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#article","isPartOf":{"@id":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/"},"author":{"name":"mick","@id":"https:\/\/www.ideematic.com\/#\/schema\/person\/6dd73b12c35e71d0edc290b3841dfcac"},"headline":"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip","datePublished":"2011-11-21T08:59:34+00:00","dateModified":"2011-11-21T08:59:34+00:00","mainEntityOfPage":{"@id":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/"},"wordCount":539,"commentCount":0,"publisher":{"@id":"https:\/\/www.ideematic.com\/#organization"},"keywords":["ruby on rails","paperclip","processors"],"articleSection":["Ruby On Rails"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/","url":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/","name":"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip - Id\u00e9ematic","isPartOf":{"@id":"https:\/\/www.ideematic.com\/#website"},"datePublished":"2011-11-21T08:59:34+00:00","dateModified":"2011-11-21T08:59:34+00:00","breadcrumb":{"@id":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.ideematic.com\/actualites\/2011\/11\/creer-des-filtres-personnalises-avec-paperclip\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/www.ideematic.com\/"},{"@type":"ListItem","position":2,"name":"Ruby On Rails","item":"https:\/\/www.ideematic.com\/actualites\/category\/ruby-on-rails\/"},{"@type":"ListItem","position":3,"name":"Cr\u00e9er des filtres personnalis\u00e9s avec Paperclip"}]},{"@type":"WebSite","@id":"https:\/\/www.ideematic.com\/#website","url":"https:\/\/www.ideematic.com\/","name":"Id\u00e9ematic","description":"Id\u00e9ematic est une agence digitale \u00e0 Strasbourg et Paris","publisher":{"@id":"https:\/\/www.ideematic.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.ideematic.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/www.ideematic.com\/#organization","name":"Id\u00e9ematic","url":"https:\/\/www.ideematic.com\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.ideematic.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.ideematic.com\/wp-content\/uploads\/2017\/12\/agence-react-native-ruby-on-rails.png","contentUrl":"https:\/\/www.ideematic.com\/wp-content\/uploads\/2017\/12\/agence-react-native-ruby-on-rails.png","width":1200,"height":500,"caption":"Id\u00e9ematic"},"image":{"@id":"https:\/\/www.ideematic.com\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.ideematic.com\/#\/schema\/person\/6dd73b12c35e71d0edc290b3841dfcac","name":"mick","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/www.ideematic.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/?s=96&r=g","caption":"mick"},"url":"https:\/\/www.ideematic.com\/actualites\/author\/mick\/"}]}},"_links":{"self":[{"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/posts\/5376","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/comments?post=5376"}],"version-history":[{"count":0,"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/posts\/5376\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/media\/1645"}],"wp:attachment":[{"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/media?parent=5376"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/categories?post=5376"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ideematic.com\/wp-json\/wp\/v2\/tags?post=5376"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}