L'essentiel de Ruby on Rails

Tirer parti de Polymorphic et de Paperclip

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Supposons que vous souhaitiez associer l'avatar d'un utilisateur et l'image d'un sujet. Au lieu de créer deux modèles, simplifiez-vous le travail grâce au polymorphisme.
04:46

Transcription

Nous allons, dans cette vidéo, ajouter un système d'upload de fichiers dans notre application, tout en découvrant l'association polymorphique. Pour l'upload des fichiers, nous aurons recours à la gemme Paperclip. Cette gemme requiert que vous ayez ImageMagick installé sur votre système. Le « Read me » de la gemme explique comment l'installer. Une fois ImageMacgick installé, rajoutez la gemme Paperclip dans votre gemfile et exécutez bundle install. Nous allons créer un modèle pictures qui contiendra un attribut name ainsi qu'une association à imageable sous forme polymorphique. Une fois la génération effectuée, n'oubliez pas d'exécuter rake db:migrate. Paperclip, pour fonctionner, a également besoin de cette ligne de configuration options de votre fichier config environments development. Cette ligne est issue de la documentation de Read me de Paperclip. Plus bas dans le Read me, vous pouvez, également, trouver les deux lignes à ajouter à votre modèle, afin qu'il puisse recevoir des fichiers uploadés. Plutôt qu'avatar, nous allons mettre, ici, file. Il nous reste à ajouter les champs requis par Paperclip à notre modèle Picture. Pour cela, générez une nouvelle migration. Rajouter à votre fichier de migration, cette ligne. De nouveau, elle est issue du Read me de Paperclip. Ré-exécutez db_migrate et revenez dans votre modèle Picture. Remarquez les quatre champs qui ont été créés grâce à la nouvelle migration que nous venons de faire. Ces quatre champs sont utilisés par Paperclip et seront, automatiquement, renseignés lorsque nous uploaderons des fichiers. Nous allons, maintenant, associer nos modèles topic et user à Picture afin de pouvoir associer un avatar à nos utilisateurs et une image à nos sujets de discussion. Nous utilisons, pour cette association, l'option has, puisqu'il s'agit d'une association polymorphique. Nous allons, également, permettre l'upload du fichier lors de l'édition ou la création d'un sujet de discussion. Aussi, ajoutons-nous accepts nested attributes for picture. N'oubliez pas, également ici, l'option validate true, pour que, lorsque nous éditons ou créons un sujet de discussion, cela valide, également, l'image associée. Nous allons faire de même pour nos utilisateurs, mais en nommant, plutôt, l'association avatar. Puisqu'il n'existe pas de modèle avatar, et que l'avatar sera stocké dans le modèle picture, nous utilisons, ici, l'option class name pour indiquer à Ruby on rails que l'association avatar fait, en réalité, référence à l'objet picture. De la même manière que pour topic nous ajoutons avatar à accepts nested attributes for. Occupons-nous, maintenant, de faire fonctionner les formulaires. Initialisons, ici, une nouvelle image. Faites de même dans l'action edit. Évidemment, dans l'action edit, nous ne voulons pas initialiser une nouvelle image si notre sujet de discussion en possède déjà une. Il nous faut, ensuite, autoriser l'édition des attributs du modèle picture dans la méthode topic params. Faisons de même pour nos utilisateurs. Initialisons l'avatar pour l'utilisateur et autorisons les modifications de ses attributs. Notez, ici, que nous utilisons bien le mot-clé avatar et non pas picture. Nous allons, maintenant, modifier nos formulaires. Commençons par le formulaire des sujets de discussion. Nous utilisons, ici, la méthode simple fields for pour pouvoir, ensuite, éditer les champs de picture . simple form saura, automatiquement, générer un champ pour uploader un fichier pour l'input file. Faisons de même pour nos utilisateurs. Au cas où, vous pouvez, également, préciser à simple form que le for file doit être un champ de sélection de fichier grâce à l'option as . Et voilà. Nous avons bien le champ, ici, et le plot de fichier fonctionne. Nous pouvons rajouter une indication si un fichier existe déjà grâce à un hint. Ce qui aura pour effet d'afficher le nom du fichier. Enfin, pour l'affichage de l'image, nous pouvons utiliser la méthode image tag. Ici, nous faisons bien attention que l'image picture possède bien un fichier. Pour accéder à l'URL du fichier, il faut utiliser cette méthode .url sur l'attribut file de picture. N'oubliez pas l'option alt pour l'accessibilité de votre site. La méthode .url peut prendre différents paramètres. original aura pour effet de récupérer une image en taille originale du fichier. Si vous regardez dans votre modèle picture, vous verrez qu'il existe deux autres styles :medium et thumb. Vous pouvez, du coup, utiliser medium et thumb à l'intérieur de la méthode URL pour changer la taille de votre image à l'affichage. C'est Paperclip qui s'occupe de redimensionner, automatiquement, l'image aux dimensions souhaitées. Voilà : nous avons, désormais, notre image qui s'affiche sur la page de notre sujet de discussion. Vous avez, donc, vu dans cette vidéo comment, grâce à Paperclip, on peut uploader des fichiers dans une application Ruby on rails. N'hésitez pas à aller explorer la documentation de PaperClip qui est, extrêmement, bien fournie.

L'essentiel de Ruby on Rails

Concevez des applications web évolutives et intemporelles avec Ruby on Rails. Installez l’environnement, réalisez un projet de stack overflow, enrichissez-le, etc.

6h08 (85 vidéos)
Aucun commentaire n´est disponible actuellement

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !