You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
99 lines
3.4 KiB
99 lines
3.4 KiB
module QuestionsHelper
|
|
|
|
def decorate_divs_for_typewriting_effect(html)
|
|
doc = Nokogiri::HTML.fragment(html, 'utf-8')
|
|
|
|
doc.xpath('./*[position() > last()-2]').each do |div|
|
|
div['class'] = 'typewriter-text'
|
|
end
|
|
|
|
doc.to_html.html_safe
|
|
end
|
|
|
|
def image_orientation(file_attachment)
|
|
return nil unless file_attachment&.attached?
|
|
|
|
metadata = file_attachment.blob.metadata
|
|
width = metadata[:width] || 0
|
|
height = metadata[:height] || 0
|
|
|
|
if width > height
|
|
:landscape
|
|
elsif height > width
|
|
:portrait
|
|
else
|
|
:square
|
|
end
|
|
end
|
|
|
|
def responsive_picture_tag_for_question(question)
|
|
# assets = question.assets.includes(file_attachment: :blob).to_a
|
|
assets = question.assets.includes(file_attachment: :blob).select{ |asset| asset.file.image? }.to_a
|
|
|
|
# Find one landscape and one portrait image
|
|
landscape_asset = assets.find { |asset| image_orientation(asset.file) == :landscape }
|
|
portrait_asset = assets.find { |asset| image_orientation(asset.file) == :portrait }
|
|
|
|
# Fall back to any image if specific orientation not found
|
|
landscape_asset ||= portrait_asset
|
|
portrait_asset ||= landscape_asset
|
|
|
|
# If we have at least one image
|
|
if landscape_asset || portrait_asset
|
|
primary_asset = landscape_asset || portrait_asset
|
|
|
|
# If we have both orientations, create a responsive picture tag
|
|
if landscape_asset && portrait_asset && landscape_asset != portrait_asset
|
|
render_responsive_picture(landscape_asset, portrait_asset)
|
|
else
|
|
# Just one orientation available, create a simple picture tag
|
|
render_simple_picture(primary_asset)
|
|
end
|
|
else
|
|
# No images available
|
|
|
|
content_tag(:div, "No images available", class: "no-images")
|
|
end
|
|
end
|
|
|
|
private
|
|
|
|
def render_responsive_picture(landscape_asset, portrait_asset)
|
|
content_tag(:picture) do
|
|
concat(
|
|
content_tag(:source, "",
|
|
media: "(orientation: portrait)",
|
|
srcset: rails_storage_proxy_path(portrait_asset.file.variant(resize_to_limit: [800, nil])) + " 800w, " +
|
|
rails_storage_proxy_path(portrait_asset.file.variant(resize_to_limit: [1600, nil])) + " 1600w, " +
|
|
rails_storage_proxy_path(portrait_asset.file.variant(resize_to_limit: [2400, nil])) + " 2400w",
|
|
sizes: "100vw"
|
|
)
|
|
)
|
|
|
|
concat(
|
|
image_tag(
|
|
rails_storage_proxy_path(landscape_asset.file.variant(resize_to_limit: [800, nil])),
|
|
srcset: rails_storage_proxy_path(landscape_asset.file.variant(resize_to_limit: [800, nil])) + " 800w, " +
|
|
rails_storage_proxy_path(landscape_asset.file.variant(resize_to_limit: [1600, nil])) + " 1600w, " +
|
|
rails_storage_proxy_path(landscape_asset.file.variant(resize_to_limit: [2400, nil])) + " 2400w",
|
|
sizes: "100vw",
|
|
'data-controller': "image"
|
|
)
|
|
)
|
|
end
|
|
end
|
|
|
|
def render_simple_picture(asset)
|
|
content_tag(:picture) do
|
|
image_tag(
|
|
rails_storage_proxy_path(asset.file.variant(resize_to_limit: [800, nil])),
|
|
srcset: rails_storage_proxy_path(asset.file.variant(resize_to_limit: [800, nil])) + " 800w, " +
|
|
rails_storage_proxy_path(asset.file.variant(resize_to_limit: [1600, nil])) + " 1600w, " +
|
|
rails_storage_proxy_path(asset.file.variant(resize_to_limit: [2400, nil])) + " 2400w",
|
|
sizes: "100vw",
|
|
'data-controller': "image"
|
|
)
|
|
end
|
|
end
|
|
|
|
end
|