Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Always present a video element #2386

Merged
merged 1 commit into from
Feb 7, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 20 additions & 36 deletions app/components/media/tag_component.rb
Original file line number Diff line number Diff line change
Expand Up @@ -57,47 +57,31 @@ def media_element
end
end

def media_tag_name
safari_wants_audio_with_captions? ? 'video' : type
end

def safari_wants_audio_with_captions?
type == 'audio' && render_captions? && webkit_useragent?
end

# Many user agents include "safari"
# Tested with:
# rubocop:disable Layout/LineLength
# Firefox: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:134.0) Gecko/20100101 Firefox/134.0"
# Edge: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36 Edg/132.0.0.0'
# iOS Safari: "Mozilla/5.0 (iPhone; CPU iPhone OS 18_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.2 Mobile/15E148 Safari/604.1"
# MacOS Safari: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.3 Safari/605.1.15"
# rubocop:enable Layout/LineLength
def webkit_useragent?
/^((?!chrome|android).)*safari/i.match?(request.headers['User-Agent'])
end

def restricted?
@file.stanford_only? || @file.location_restricted?
end

# We render a video tag, even if it's an audio, because we may have VTT to display and
# we want the control bar to fade away to not conflict with the captions display.
# Audio tags don't fade the control bar.
def media_tag # rubocop:disable Metrics/MethodLength
tag.send(media_tag_name,
preload: restricted? ? 'none' : 'auto',
id: "sul-embed-media-#{@resource_iteration.index}",
data: {
auth_url: authentication_url,
index: @resource_iteration.index,
media_tag_target: 'authorizeableResource',
controller: 'media-player',
action: 'media-seek@window->media-player#seek ' \
'auth-success@window->media-player#initializeVideoJSPlayer'
},
poster: poster_url_for,
controls: 'controls',
class: 'sul-embed-media-file',
crossorigin: 'use-credentials', # So that VTT can be downloaded when download:stanford
height: '100%') do
tag.video(
preload: restricted? ? 'none' : 'auto',
id: "sul-embed-media-#{@resource_iteration.index}",
data: {
auth_url: authentication_url,
index: @resource_iteration.index,
media_tag_target: 'authorizeableResource',
controller: 'media-player',
action: 'media-seek@window->media-player#seek ' \
'auth-success@window->media-player#initializeVideoJSPlayer'
},
poster: poster_url_for,
controls: 'controls',
class: 'sul-embed-media-file',
crossorigin: 'use-credentials', # So that VTT can be downloaded when download:stanford
height: '100%'
) do
streaming_source + captions
end
end
Expand Down
17 changes: 1 addition & 16 deletions spec/components/media/tag_component_spec.rb
Original file line number Diff line number Diff line change
Expand Up @@ -145,28 +145,13 @@
context 'with audio' do
let(:resource) { build(:resource, :audio) }

it 'renders an audio tag in the provided document' do
expect(page).to have_css('audio', visible: :all)
end

context 'when a file-level thumbnail is present' do
let(:resource) { build(:resource, :audio) }

it 'includes a poster attribute pointing at the thumbnail' do
expect(page).to have_css('audio[poster]', visible: :all)
audio = page.find('audio[poster]', visible: :all)
expect(audio['poster']).to match(%r{/bc123df4567%2Faudio_1/full/})
end
end

context 'when a file level thumbnail is not present' do
let(:resource) do
build(:resource, :audio, files: [build(:resource_file, :audio)])
end

it 'includes the default poster attribute' do
expect(page).to have_css('audio[poster]', visible: :all)
audio = page.find('audio[poster]', visible: :all)
audio = page.find('video[poster]', visible: :all)
expect(audio['poster']).to match(/waveform-audio-poster/)
end
end
Expand Down