Add `srcset` option to `image_tag` helper
This commit is contained in:
parent
4448873c87
commit
43efae22a7
|
@ -1,3 +1,7 @@
|
|||
* Add `srcset` option to `image_tag` helper
|
||||
|
||||
*Roberto Miranda*
|
||||
|
||||
* Fix issues with scopes and engine on `current_page?` method.
|
||||
|
||||
Fixes #29401.
|
||||
|
|
|
@ -227,16 +227,30 @@ module ActionView
|
|||
# # => <img alt="Icon" class="menu_icon" src="/icons/icon.gif" />
|
||||
# image_tag("/icons/icon.gif", data: { title: 'Rails Application' })
|
||||
# # => <img data-title="Rails Application" src="/icons/icon.gif" />
|
||||
# image_tag("icon.png", srcset: "/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w, /assets/pic_1980.jpg 1980w", sizes: '100vw', class: 'my-image')
|
||||
# <img src="/assets/ants_1980.jpg" srcset="/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w, /assets/pic_1980.jpg 1980w" sizes="100vw" class="my-image">
|
||||
# image_tag("icon.png", srcset: { 'pic_640.jpg' => '640w', 'pic_1024.jpg' => '1024w', 'pic_1980.jpg' => '1980w' }, sizes: '100vw', class: 'my-image')
|
||||
# <img src="/assets/ants_1980.jpg" srcset="/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w, /assets/pic_1980.jpg 1980w" sizes="100vw" class="my-image">
|
||||
# image_tag("icon.png", srcset: [['pic_640.jpg', '640w'], ['pic_1024.jpg', '1024w'], ['pic_1980.jpg', '1980w']], sizes: '100vw', class: 'my-image')
|
||||
# <img src="/assets/ants_1980.jpg" srcset="/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w, /assets/pic_1980.jpg 1980w" sizes="100vw" class="my-image">
|
||||
def image_tag(source, options = {})
|
||||
options = options.symbolize_keys
|
||||
check_for_image_tag_errors(options)
|
||||
skip_pipeline = options.delete(:skip_pipeline)
|
||||
|
||||
src = options[:src] = path_to_image(source, skip_pipeline: options.delete(:skip_pipeline))
|
||||
src = options[:src] = path_to_image(source, skip_pipeline: skip_pipeline)
|
||||
|
||||
unless src.start_with?("cid:") || src.start_with?("data:") || src.blank?
|
||||
options[:alt] = options.fetch(:alt) { image_alt(src) }
|
||||
end
|
||||
|
||||
if options[:srcset] && !options[:srcset].is_a?(String)
|
||||
options[:srcset] = options[:srcset].map do |src, size|
|
||||
src_path = path_to_image(src, skip_pipeline: skip_pipeline)
|
||||
"#{src_path} #{size}"
|
||||
end.join(", ")
|
||||
end
|
||||
|
||||
options[:width], options[:height] = extract_dimensions(options.delete(:size)) if options[:size]
|
||||
tag("img", options)
|
||||
end
|
||||
|
|
|
@ -197,7 +197,10 @@ class AssetTagHelperTest < ActionView::TestCase
|
|||
%(image_tag("mouse.png", :alt => nil)) => %(<img src="/images/mouse.png" />),
|
||||
%(image_tag("data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==", :alt => nil)) => %(<img src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" />),
|
||||
%(image_tag("")) => %(<img src="" />),
|
||||
%(image_tag("gold.png", data: { title: 'Rails Application' })) => %(<img data-title="Rails Application" src="/images/gold.png" alt="Gold" />)
|
||||
%(image_tag("gold.png", data: { title: 'Rails Application' })) => %(<img data-title="Rails Application" src="/images/gold.png" alt="Gold" />),
|
||||
%(image_tag("rss.gif", srcset: "/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w")) => %(<img srcset="/assets/pic_640.jpg 640w, /assets/pic_1024.jpg 1024w" src="/images/rss.gif" alt="Rss" />),
|
||||
%(image_tag("rss.gif", srcset: { "pic_640.jpg" => "640w", "pic_1024.jpg" => "1024w" })) => %(<img srcset="/images/pic_640.jpg 640w, /images/pic_1024.jpg 1024w" src="/images/rss.gif" alt="Rss" />),
|
||||
%(image_tag("rss.gif", srcset: [["pic_640.jpg", "640w"], ["pic_1024.jpg", "1024w"]])) => %(<img srcset="/images/pic_640.jpg 640w, /images/pic_1024.jpg 1024w" src="/images/rss.gif" alt="Rss" />)
|
||||
}
|
||||
|
||||
FaviconLinkToTag = {
|
||||
|
|
Loading…
Reference in New Issue