Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: wrap full-size Twitter onebox images in aspect-ratio

This commit is contained in:
Arpit Jalan 2018-03-23 17:35:17 +05:30
parent 62f09af1c2
commit 17584bca5e
2 changed files with 3 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
lib/cooked_post_processor.rb
View File

@ -447,8 +447,7 @@ class CookedPostProcessor
new_parent = img.add_next_sibling("<div class='aspect-image' style='--aspect-ratio:#{width}/#{height};'/>") new_parent = img.add_next_sibling("<div class='aspect-image' style='--aspect-ratio:#{width}/#{height};'/>")
new_parent.first.add_child(img) new_parent.first.add_child(img)
end end
elsif (parent_class&.include?("instagram-images") || parent_class&.include?("tweet-images")) && width > 0 && height > 0
elsif parent_class&.include?("instagram-images") && width > 0 && height > 0
img.remove_attribute("width") img.remove_attribute("width")
img.remove_attribute("height") img.remove_attribute("height")
img.parent["class"] = "aspect-image-full-size" img.parent["class"] = "aspect-image-full-size"

7
lib/twitter_api.rb
View File

@ -16,20 +16,17 @@ class TwitterApi
result = Rinku.auto_link(text, :all, 'target="_blank"').to_s result = Rinku.auto_link(text, :all, 'target="_blank"').to_s
if tweet['extended_entities'] && media = tweet['extended_entities']['media'] if tweet['extended_entities'] && media = tweet['extended_entities']['media']
result << "<div class='tweet-images'>"
media.each do |m| media.each do |m|
if m['type'] == 'photo' if m['type'] == 'photo'
if large = m['sizes']['large'] if large = m['sizes']['large']
result << "<img class='tweet-image' src='#{m['media_url_https']}' width='#{large['w']}' height='#{large['h']}'>" result << "<div class='tweet-images'><img class='tweet-image' src='#{m['media_url_https']}' width='#{large['w']}' height='#{large['h']}'></div>"
end end
elsif m['type'] == 'video' elsif m['type'] == 'video'
if large = m['sizes']['large'] if large = m['sizes']['large']
result << "<iframe class='tweet-video' src='https://twitter.com/i/videos/#{tweet['id_str']}' width='#{large['w']}' height='#{large['h']}' frameborder='0'></iframe>" result << "<div class='tweet-images'><iframe class='tweet-video' src='https://twitter.com/i/videos/#{tweet['id_str']}' width='#{large['w']}' height='#{large['h']}' frameborder='0'></iframe></div>"
end end
end end
end end
result << "</div>"
end end
result result