Carrierwave et mini_magick trouver les largeurs et la hauteur

Question

Après un peu d'enquête, j'ai décidé d'utiliser Carrierwave et mini_magick sur ma nouvelle application rail3.

Je l'ai configuré et cela fonctionne parfaitement. Cependant, j'ai une question, c'est que je voudrais pouvoir accéder à la largeur et la hauteur, donc je peux former le html correctement. Cependant, il n'y a pas de défaut pour extraire cette information et en raison de la façon dont il stocke les données, je ne suis pas vraiment en mesure d'ajouter quelque chose contre la base de données.

Quelqu'un a-t-il des conseils ou des idées? Est-ce même possible?

Answer 1

class Attachment 
    mount_uploader :file, FileUploader 

    def image 
    @image ||= MiniMagick::Image.open(file.path) 
    end 
end 

Et l'utiliser comme ceci:

Attachment.first.image['width'] # => 400 
Attachment.first.image['height'] # => 300 

Answer 2

Juste pour l'enregistrement, j'ai utilisé une solution similaire, mais en utilisant des fichiers avec Mongo GridFS, ici il va:

def image 
    @image ||= MiniMagick::Image.read(Mongo::GridFileSystem.new(Mongoid.database).open(file.path, 'r')) 
    end 

Answer 3

Inconvénient de calculer Image height/width en utilisant RMagick ou MiniMagick en cours d'exécution:

• Son UC
• Il nécessite Internet pour obtenir l'image et calculer les dimensions.
• Son un __gVirt_NP_NN_NNPS<__ processus lent

Pour votre information Vous pouvez également calculer l'image Height, Width après l'image est entièrement chargée en utilisant l'événement load associé à l'étiquette <img> avec l'aide de jQuery.

Par exemple:

$(document).ready(function(){ 
    var $image = $('.fixed-frame img'); 
    $image.load(function(){ 
     rePositionLogo($image); 
    }); 

    if($image.prop('complete')){ 
    rePositionLogo($image); 
    } 

}); 

function rePositionLogo($image){ 
    var height = $image.height(); 
    var width = $image.width(); 
    if (width > height) { 
    $image.parents('.header').addClass('landscape'); 
    var marginTop = (105 - $image.height())/2; 
    $image.css('margin-top', marginTop + 'px') 
    }else{ 
    $image.parents('.header').addClass('portrait'); 
    } 
} 

Soyez prudent, car load() ne se déclenche pas lorsqu'une image est déjà chargée. Cela peut se produire facilement lorsqu'une image se trouve dans le navigateur de l'utilisateur cache.

Vous pouvez vérifier si une image est déjà chargée à l'aide de $('#myImage').prop('complete'), ce qui renvoie true lorsqu'une image est chargée.