FEATURE: Add onebox for loom (#26016)

Loom share links will now onebox and use the embedded loom player.
This commit is contained in:
Blake Erickson 2024-03-04 15:12:08 -07:00 committed by GitHub
parent b788c08712
commit 40b707a690
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 55 additions and 2 deletions

View File

@ -980,14 +980,16 @@ aside.onebox.mixcloud-preview {
}
}
iframe.vimeo-onebox {
iframe.vimeo-onebox,
iframe.loom-onebox {
width: 100%;
height: auto;
aspect-ratio: 16/9;
}
@supports not (aspect-ratio: auto) {
iframe.vimeo-onebox {
iframe.vimeo-onebox,
iframe.loom-onebox {
width: 690px;
height: 388px;
}

View File

@ -211,3 +211,4 @@ require_relative "engine/facebook_media_onebox"
require_relative "engine/hackernews_onebox"
require_relative "engine/motoko_onebox"
require_relative "engine/tiktok_onebox"
require_relative "engine/loom_onebox"

View File

@ -0,0 +1,34 @@
# frozen_string_literal: true
module Onebox
module Engine
class LoomOnebox
include Engine
include StandardEmbed
matches_regexp(%r{^https?://(www\.)?loom\.com/share/\w+(/\w+)?/?})
requires_iframe_origins "https://www.loom.com"
always_https
def placeholder_html
::Onebox::Helpers.video_placeholder_html
end
def to_html
video_id = url.split("/").last
video_src = "https://www.loom.com/embed/#{video_id}"
<<~HTML
<iframe
class="loom-onebox"
src="#{video_src}"
frameborder="0"
webkitallowfullscreen
mozallowfullscreen
allowfullscreen
</iframe>
HTML
end
end
end
end

View File

@ -0,0 +1,16 @@
# frozen_string_literal: true
RSpec.describe Onebox::Engine::LoomOnebox do
it "returns the right HTML markup for the onebox" do
expect(
Onebox
.preview(
"https://www.loom.com/share/c9695e5dc084496c80b7d7516d2a569a?sid=e1279914-ecaa-4faf-afa8-89cbab488240",
)
.to_s
.chomp,
).to eq(
'<iframe class="loom-onebox" src="https://www.loom.com/embed/c9695e5dc084496c80b7d7516d2a569a?sid=e1279914-ecaa-4faf-afa8-89cbab488240" frameborder="0" allowfullscreen="" seamless="seamless" sandbox="allow-same-origin allow-scripts allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation"></iframe>',
)
end
end