|
|
@ -6,14 +6,39 @@
|
|
|
|
meta = @media_attachment.file.meta || {}
|
|
|
|
meta = @media_attachment.file.meta || {}
|
|
|
|
|
|
|
|
|
|
|
|
- if @media_attachment.video?
|
|
|
|
- if @media_attachment.video?
|
|
|
|
= react_component :video, src: @media_attachment.file.url(:original), preview: @media_attachment.thumbnail.present? ? @media_attachment.thumbnail.url : @media_attachment.file.url(:small), frameRate: meta.dig('original', 'frame_rate'), blurhash: @media_attachment.blurhash, width: 670, height: 380, editable: true, detailed: true, inline: true, alt: @media_attachment.description, media: [ActiveModelSerializers::SerializableResource.new(@media_attachment, serializer: REST::MediaAttachmentSerializer)].as_json do
|
|
|
|
= react_component :video,
|
|
|
|
|
|
|
|
alt: @media_attachment.description,
|
|
|
|
|
|
|
|
blurhash: @media_attachment.blurhash,
|
|
|
|
|
|
|
|
detailed: true,
|
|
|
|
|
|
|
|
editable: true,
|
|
|
|
|
|
|
|
frameRate: meta.dig('original', 'frame_rate'),
|
|
|
|
|
|
|
|
height: 380,
|
|
|
|
|
|
|
|
inline: true,
|
|
|
|
|
|
|
|
media: [ActiveModelSerializers::SerializableResource.new(@media_attachment, serializer: REST::MediaAttachmentSerializer)].as_json,
|
|
|
|
|
|
|
|
preview: @media_attachment.thumbnail.present? ? @media_attachment.thumbnail.url : @media_attachment.file.url(:small),
|
|
|
|
|
|
|
|
src: @media_attachment.file.url(:original),
|
|
|
|
|
|
|
|
width: 670 do
|
|
|
|
%video{ controls: 'controls' }
|
|
|
|
%video{ controls: 'controls' }
|
|
|
|
%source{ src: @media_attachment.file.url(:original) }
|
|
|
|
%source{ src: @media_attachment.file.url(:original) }
|
|
|
|
- elsif @media_attachment.gifv?
|
|
|
|
- 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
|
|
|
|
= react_component :media_gallery,
|
|
|
|
|
|
|
|
autoplay: true,
|
|
|
|
|
|
|
|
height: 380,
|
|
|
|
|
|
|
|
media: [ActiveModelSerializers::SerializableResource.new(@media_attachment, serializer: REST::MediaAttachmentSerializer).as_json],
|
|
|
|
|
|
|
|
standalone: true do
|
|
|
|
%video{ autoplay: 'autoplay', muted: 'muted', loop: 'loop' }
|
|
|
|
%video{ autoplay: 'autoplay', muted: 'muted', loop: 'loop' }
|
|
|
|
%source{ src: @media_attachment.file.url(:original) }
|
|
|
|
%source{ src: @media_attachment.file.url(:original) }
|
|
|
|
- elsif @media_attachment.audio?
|
|
|
|
- elsif @media_attachment.audio?
|
|
|
|
= react_component :audio, src: @media_attachment.file.url(:original), poster: @media_attachment.thumbnail.present? ? @media_attachment.thumbnail.url : @media_attachment.account.avatar_static_url, backgroundColor: meta.dig('colors', 'background'), foregroundColor: meta.dig('colors', 'foreground'), accentColor: meta.dig('colors', 'accent'), width: 670, height: 380, fullscreen: true, alt: @media_attachment.description, duration: meta.dig(:original, :duration) do
|
|
|
|
= react_component :audio,
|
|
|
|
|
|
|
|
accentColor: meta.dig('colors', 'accent'),
|
|
|
|
|
|
|
|
alt: @media_attachment.description,
|
|
|
|
|
|
|
|
backgroundColor: meta.dig('colors', 'background'),
|
|
|
|
|
|
|
|
duration: meta.dig(:original, :duration),
|
|
|
|
|
|
|
|
foregroundColor: meta.dig('colors', 'foreground'),
|
|
|
|
|
|
|
|
fullscreen: true,
|
|
|
|
|
|
|
|
height: 380,
|
|
|
|
|
|
|
|
poster: @media_attachment.thumbnail.present? ? @media_attachment.thumbnail.url : @media_attachment.account.avatar_static_url,
|
|
|
|
|
|
|
|
src: @media_attachment.file.url(:original),
|
|
|
|
|
|
|
|
width: 670 do
|
|
|
|
%audio{ controls: 'controls' }
|
|
|
|
%audio{ controls: 'controls' }
|
|
|
|
%source{ src: @media_attachment.file.url(:original) }
|
|
|
|
%source{ src: @media_attachment.file.url(:original) }
|
|
|
|