lib/carrierwave/cloudflare/action_view/responsive_images_helper.rb
# Returns a reponsive image tag with variations.
#
# ==== Examples
#
#   responsive_image_tag('/bird.jpg', width: 1200, sizes:
#                        { phone: 600, tablet: 800 })
#
Returns a reponsive image tag with variations.
Examples


Returns a reponsive image tag with variations . Examples
def responsive_image_tag(url, width:, sizes: nil, dprs: [1, 2], **options)
          url = url.url if url.is_a?(CarrierWave::Uploader)
          if sizes.nil?
            return hidpi_image_tag(url, **options)
          end
          sizes[:default] = width
          breakpoints = {
            phone: "(max-width: 767px)",
            mobile: "(max-width: 767px)", 
            tablet: "(max-width: 1023px)",
            laptop: "(max-width: 1279px)",
            desktop: "(min-width: 1280px)",
            default: nil
          }
          sizes_attr = breakpoints.map do |device, media|
            next nil unless sizes[device]
            [media, "#{sizes[device]}px"].compact.join(" ")
          end.compact.join(", ")
          transform, rest = split_cdn_transform_options(options)
          base_version = cdn_transformed(url, width: width, **transform)
          variations = scrset_variations_from_breakpoints(sizes, dprs: dprs)
          srcset = variations.map do |size|
            scale = (size.to_f / width).round(2)
            [cdn_transformed(url, width: width, **transform, dpr: scale), "#{size}w"]
          end
          image_tag(
            base_version,
            srcset: srcset,
            sizes: sizes_attr,
            **rest
          )
        end
def responsive_image_tag ( url , width : , sizes : nil , dprs : [ 1 , 2 ] , ** options ) url = url . url if url . is_a? ( CarrierWave :: Uploader ) if sizes . nil? return hidpi_image_tag ( url , ** options ) end sizes [ :default ] = width breakpoints = { phone : "(max-width: 767px)" , mobile : "(max-width: 767px)" , tablet : "(max-width: 1023px)" , laptop : "(max-width: 1279px)" , desktop : "(min-width: 1280px)" , default : nil } sizes_attr = breakpoints . map do | device , media | next nil unless sizes [ device ] [ media , "#{sizes[device]}px" ] . compact . join ( " " ) end . compact . join ( ", " ) transform , rest = split_cdn_transform_options ( options ) base_version = cdn_transformed ( url , width : width , ** transform ) variations = scrset_variations_from_breakpoints ( sizes , dprs : dprs ) srcset = variations . map do | size | scale = ( size . to_f / width ) . round ( 2 ) [ cdn_transformed ( url , width : width , ** transform , dpr : scale ) , "#{size}w" ] end image_tag ( base_version , srcset : srcset , sizes : sizes_attr , ** rest ) end
Returns a reponsive image tag with variations.
Returns a reponsive image tag with variations .
# an alias for :phone # construct the array of available variation sizes in `srcset`
url
width
sizes
dprs
options