From 662a49dc3f06749936cedd7349092bbe622f0bc6 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Thu, 25 Jun 2020 01:33:01 +0200 Subject: Fix various issues around OpenGraph representation of media (#14133) - Fix audio attachments not being represented in OpenGraph tags - Fix audio being represented as "1 image" in OpenGraph descriptions - Fix video metadata being overwritten by paperclip-av-transcoder - Fix embedded player not using Mastodon's UI - Fix audio/video progress bars not moving smoothly - Fix audio/video buffered bars not displaying correctly --- app/views/media/player.html.haml | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) (limited to 'app/views/media') diff --git a/app/views/media/player.html.haml b/app/views/media/player.html.haml index ea868b3f6..3d308ee69 100644 --- a/app/views/media/player.html.haml +++ b/app/views/media/player.html.haml @@ -1,2 +1,16 @@ -%video{ poster: @media_attachment.file.url(:small), preload: 'auto', autoplay: 'autoplay', muted: 'muted', loop: 'loop', controls: 'controls', style: "width: #{@media_attachment.file.meta.dig('original', 'width')}px; height: #{@media_attachment.file.meta.dig('original', 'height')}px" } - %source{ src: @media_attachment.file.url(:original), type: @media_attachment.file_content_type } +- content_for :header_tags do + = render_initial_state + = javascript_pack_tag 'public', integrity: true, crossorigin: 'anonymous' + +- if @media_attachment.video? + = react_component :video, src: @media_attachment.file.url(:original), preview: @media_attachment.file.url(:small), blurhash: @media_attachment.blurhash, width: 670, height: 380, editable: true, detailed: true, inline: true, alt: @media_attachment.description do + %video{ controls: 'controls' } + %source{ src: @media_attachment.file.url(:original) } +- elsif @media_attachment.gifv? + = react_component :media_gallery, height: 380, standalone: true, autoplay: true, media: [ActiveModelSerializers::SerializableResource.new(@media_attachment, serializer: REST::MediaAttachmentSerializer).as_json] do + %video{ autoplay: 'autoplay', muted: 'muted', loop: 'loop' } + %source{ src: @media_attachment.file.url(:original) } +- elsif @media_attachment.audio? + = react_component :audio, src: @media_attachment.file.url(:original), poster: full_asset_url(@media_attachment.account.avatar_static_url), width: 670, height: 380, fullscreen: true, alt: @media_attachment.description, duration: @media_attachment.file.meta.dig(:original, :duration) do + %audio{ controls: 'controls' } + %source{ src: @media_attachment.file.url(:original) } -- cgit