From 99f3a5554074d9a12619797c474b3de4c6085f02 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Sun, 5 Jul 2020 18:28:25 +0200 Subject: Add color extraction for audio thumbnails (#14209) --- app/views/media/player.html.haml | 2 +- app/views/statuses/_detailed_status.html.haml | 2 +- app/views/statuses/_simple_status.html.haml | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) (limited to 'app/views') diff --git a/app/views/media/player.html.haml b/app/views/media/player.html.haml index 3d308ee69..1d0374897 100644 --- a/app/views/media/player.html.haml +++ b/app/views/media/player.html.haml @@ -11,6 +11,6 @@ %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 + = 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: @media_attachment.file.meta.dig('colors', 'background'), foregroundColor: @media_attachment.file.meta.dig('colors', 'foreground'), accentColor: @media_attachment.file.meta.dig('colors', 'accent'), 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) } diff --git a/app/views/statuses/_detailed_status.html.haml b/app/views/statuses/_detailed_status.html.haml index d10017db9..dce122607 100644 --- a/app/views/statuses/_detailed_status.html.haml +++ b/app/views/statuses/_detailed_status.html.haml @@ -33,7 +33,7 @@ = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } - elsif status.media_attachments.first.audio? - audio = status.media_attachments.first - = react_component :audio, src: audio.file.url(:original), poster: audio.thumbnail.present? ? audio.thumbnail.url : status.account.avatar_static_url, blurhash: audio.blurhash, width: 670, height: 380, alt: audio.description, duration: audio.file.meta.dig('original', 'duration') do + = react_component :audio, src: audio.file.url(:original), poster: audio.thumbnail.present? ? audio.thumbnail.url : status.account.avatar_static_url, backgroundColor: audio.file.meta.dig('colors', 'background'), foregroundColor: audio.file.meta.dig('colors', 'foreground'), accentColor: audio.file.meta.dig('colors', 'accent'), width: 670, height: 380, alt: audio.description, duration: audio.file.meta.dig('original', 'duration') do = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } - else = react_component :media_gallery, height: 380, sensitive: status.sensitive?, standalone: true, autoplay: autoplay, media: status.media_attachments.map { |a| ActiveModelSerializers::SerializableResource.new(a, serializer: REST::MediaAttachmentSerializer).as_json } do diff --git a/app/views/statuses/_simple_status.html.haml b/app/views/statuses/_simple_status.html.haml index ab09dfe45..b29e92ddc 100644 --- a/app/views/statuses/_simple_status.html.haml +++ b/app/views/statuses/_simple_status.html.haml @@ -39,7 +39,7 @@ = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } - elsif status.media_attachments.first.audio? - audio = status.media_attachments.first - = react_component :audio, src: audio.file.url(:original), poster: audio.thumbnail.present? ? audio.thumbnail.url : status.account.avatar_static_url, blurhash: audio.blurhash, width: 610, height: 343, alt: audio.description, duration: audio.file.meta.dig('original', 'duration') do + = react_component :audio, src: audio.file.url(:original), poster: audio.thumbnail.present? ? audio.thumbnail.url : status.account.avatar_static_url, backgroundColor: audio.file.meta.dig('colors', 'background'), foregroundColor: audio.file.meta.dig('colors', 'foreground'), accentColor: audio.file.meta.dig('colors', 'accent'), width: 610, height: 343, alt: audio.description, duration: audio.file.meta.dig('original', 'duration') do = render partial: 'statuses/attachment_list', locals: { attachments: status.media_attachments } - else = react_component :media_gallery, height: 343, sensitive: status.sensitive?, autoplay: autoplay, media: status.media_attachments.map { |a| ActiveModelSerializers::SerializableResource.new(a, serializer: REST::MediaAttachmentSerializer).as_json } do -- cgit From a783bdf4adee3444e9cd32c2eaa0712214ba1230 Mon Sep 17 00:00:00 2001 From: ThibG Date: Tue, 7 Jul 2020 01:33:38 +0200 Subject: Fix hashtag column options styling (#14247) * Enable nonces for stylesheets * Pass nonce to react-select --- .../hashtag_timeline/components/column_settings.js | 27 ++++++++++++---------- app/views/layouts/application.html.haml | 1 + config/initializers/content_security_policy.rb | 18 +++++++++++++++ 3 files changed, 34 insertions(+), 12 deletions(-) (limited to 'app/views') diff --git a/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js b/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js index 956f16734..27300f020 100644 --- a/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js +++ b/app/javascript/mastodon/features/hashtag_timeline/components/column_settings.js @@ -4,6 +4,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import Toggle from 'react-toggle'; import AsyncSelect from 'react-select/async'; +import { NonceProvider } from 'react-select'; import SettingToggle from '../../notifications/components/setting_toggle'; const messages = defineMessages({ @@ -58,18 +59,20 @@ class ColumnSettings extends React.PureComponent { {this.modeLabel(mode)} - + + + ); } diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml index 39fa0678f..e32cdcabb 100755 --- a/app/views/layouts/application.html.haml +++ b/app/views/layouts/application.html.haml @@ -25,6 +25,7 @@ = javascript_pack_tag 'common', integrity: true, crossorigin: 'anonymous' = javascript_pack_tag "locale_#{I18n.locale}", integrity: true, crossorigin: 'anonymous' = csrf_meta_tags + %meta{ name: 'style-nonce', content: request.content_security_policy_nonce } = stylesheet_link_tag '/inert.css', skip_pipeline: true, media: 'all', id: 'inert-style' diff --git a/config/initializers/content_security_policy.rb b/config/initializers/content_security_policy.rb index 7dcc028ab..98dc711e1 100644 --- a/config/initializers/content_security_policy.rb +++ b/config/initializers/content_security_policy.rb @@ -47,7 +47,25 @@ end # https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy-Report-Only # Rails.application.config.content_security_policy_report_only = true +Rails.application.config.content_security_policy_nonce_generator = -> request { SecureRandom.base64(16) } + +# Monkey-patching Rails 5 +module ActionDispatch + class ContentSecurityPolicy + def nonce_directive?(directive) + directive == 'style-src' + end + end +end + +# Rails 6 would require the following instead: +# Rails.application.config.content_security_policy_nonce_directives = %w(style-src) + PgHero::HomeController.content_security_policy do |p| p.script_src :self, :unsafe_inline, assets_host p.style_src :self, :unsafe_inline, assets_host end + +PgHero::HomeController.after_action do + request.content_security_policy_nonce_generator = nil +end -- cgit