diff --git a/app/javascript/apps/blocks-editor/components/Blocks.vue b/app/javascript/apps/blocks-editor/components/Blocks.vue index fdc9a3c984..4f5bfed506 100644 --- a/app/javascript/apps/blocks-editor/components/Blocks.vue +++ b/app/javascript/apps/blocks-editor/components/Blocks.vue @@ -48,6 +48,20 @@ export default { if (!confirm(this.$t('blocksEditor.confirm.duplication'))) return; this.$emit('duplicate', block); }, + loadSnippetScripts(event) { + // Script elements are note executed when loaded in v-html. + // We replace them with same content here to force the load (protected by CSP) + var snippetElement = event.el, + scriptElements = snippetElement.querySelectorAll('script'); + + scriptElements.forEach(script => { + const executableScript = document.createElement('script'); + Array.from(script.attributes).forEach(attribute => { + executableScript.setAttribute(attribute.name, attribute.value); + }); + script.replaceWith(executableScript); + }); + }, } }; @@ -102,7 +116,7 @@ export default { @click="onDuplicate($event, block)"> {{ $t('blocksEditor.actions.duplicate') }} - @@ -111,7 +125,9 @@ export default {
-
+
@@ -120,4 +136,4 @@ export default { - \ No newline at end of file + diff --git a/app/models/communication/block/template/video.rb b/app/models/communication/block/template/video.rb index 803cde7b3e..209ceca998 100644 --- a/app/models/communication/block/template/video.rb +++ b/app/models/communication/block/template/video.rb @@ -41,6 +41,10 @@ def video_embed_with_defaults video_provider.embed_with_defaults end + def video_snippet_classes + video_provider.snippet_classes + end + def before_validation super if url.present? && video_title.blank? && video_provider.present? diff --git a/app/services/video/provider.rb b/app/services/video/provider.rb index 5a6fa98324..3fad91a0f3 100644 --- a/app/services/video/provider.rb +++ b/app/services/video/provider.rb @@ -2,9 +2,10 @@ class Video::Provider PROVIDERS = [ Arte, Canalu, + Dailymotion, + Instagram, Vimeo, Youtube, - Dailymotion, Peertube # Comes last because detection is less reliable ] diff --git a/app/services/video/provider/default.rb b/app/services/video/provider/default.rb index bf033265d7..734265f2fe 100644 --- a/app/services/video/provider/default.rb +++ b/app/services/video/provider/default.rb @@ -61,6 +61,10 @@ def iframe_preview_tag(**iframe_options) content_tag(:iframe, nil, options) end + def snippet_classes + "ratio ratio-16x9" + end + def correct? url_in_domains? end diff --git a/app/services/video/provider/instagram.rb b/app/services/video/provider/instagram.rb new file mode 100644 index 0000000000..1158f58aea --- /dev/null +++ b/app/services/video/provider/instagram.rb @@ -0,0 +1,46 @@ +class Video::Provider::Instagram < Video::Provider::Default + DOMAINS = [ + 'instagram.com', + 'www.instagram.com' + ] + + def csp_domains + DOMAINS + end + + # https://www.instagram.com/reel/DZMwtovSJn4 + def identifier + video_url.split('reel/').last.split('/').first + end + + def iframe_tag(**iframe_options) + raw (blockquote + script) + end + + def iframe_preview_tag(**iframe_options) + iframe_tag + end + + def snippet_classes + "" + end + + def script + "" + end + + def title + html = URI.parse(video_url).open.read + # + meta_twitter_title = Nokogiri::HTML5(html).css("meta[name='twitter:title']").first + meta_twitter_title["content"] if meta_twitter_title + rescue + nil + end + + protected + + def blockquote + "
" + end +end diff --git a/app/views/admin/communication/blocks/templates/video/_snippet.html.erb b/app/views/admin/communication/blocks/templates/video/_snippet.html.erb index 5be930a649..ce38090ea9 100644 --- a/app/views/admin/communication/blocks/templates/video/_snippet.html.erb +++ b/app/views/admin/communication/blocks/templates/video/_snippet.html.erb @@ -1,4 +1,4 @@ -
+
<%= block.template.video_iframe_preview %>
<% unless block.template.video_title.blank? %> @@ -18,4 +18,4 @@ <%= block_component_show block, :transcription %>
-<% end %> \ No newline at end of file +<% end %> diff --git a/config/initializers/content_security_policy.rb b/config/initializers/content_security_policy.rb index f893746944..377d0e2af1 100644 --- a/config/initializers/content_security_policy.rb +++ b/config/initializers/content_security_policy.rb @@ -14,6 +14,7 @@ https://example.osuny.org/js/ https://plausible.io https://tally.so + https://www.instagram.com https://d2wy8f7a9ursnm.cloudfront.net/v7/ ) script_urls << "https://cdn.jsdelivr.net/npm/summernote@#{SummernoteRails::Rails::VERSION.split('.').take(3).join('.')}/dist/lang/"