New: Possibility to open video on new window

jonnitto · Oct 13, 2022 · 9a7b713 · 9a7b713
1 parent adc250c
commit 9a7b713
Show file tree

Hide file tree

Showing 6 changed files with 25 additions and 2 deletions.
diff --git a/Configuration/Settings.Jonnitto.yaml b/Configuration/Settings.Jonnitto.yaml
@@ -27,3 +27,8 @@ Jonnitto:
     button:
       play: 'resource://Jonnitto.PrettyEmbedHelper/Public/Assets/PlayButton.svg'
       pause: 'resource://Jonnitto.PrettyEmbedHelper/Public/Assets/PauseButton.svg'
+
+    # Should the player be embedded on the site or open in a new window?
+    openInNewWindow:
+      youtube: false
+      vimeo: false
diff --git a/Resources/Private/Assets/Helper/iFrame.js b/Resources/Private/Assets/Helper/iFrame.js
@@ -3,6 +3,11 @@ import triggerEvent from './triggerEvent';
 import getAriaLabel from './getAriaLabel';
 import * as lightboxHelper from '../Helper/Lightbox';
 
+const openexternal = (() => {
+    const value = document.currentScript.dataset.openexternal;
+    return value ? value.split(',') : [];
+})();
+
 const BASE = 'jonnitto-prettyembed';
 
 function markup(node) {
@@ -112,6 +117,10 @@ function restore(element, playClass) {
 }
 
 function lightbox(type) {
+    if (openexternal.includes(type)) {
+        return;
+    }
+
     const SELECTOR = `a.${BASE}--${type}.${BASE}--lightbox`;
 
     lightboxHelper.init(SELECTOR, function (event) {
@@ -138,6 +147,9 @@ function lightbox(type) {
 }
 
 function embed(type) {
+    if (openexternal.includes(type)) {
+        return;
+    }
     const SELECTOR = `a.${BASE}--${type}.${BASE}--inline`;
     const PLAY_CLASS = `${BASE}--play`;
 

diff --git a/Resources/Private/Fusion/Helper/Assets/Assets.fusion b/Resources/Private/Fusion/Helper/Assets/Assets.fusion
@@ -1,5 +1,6 @@
 prototype(Jonnitto.PrettyEmbedHelper:Assets) < prototype(Neos.Fusion:Component) {
     includeAssets = ${Configuration.setting('Jonnitto.PrettyEmbedHelper.includeAssets')}
+    openInNewWindow = ${Configuration.setting('Jonnitto.PrettyEmbedHelper.openInNewWindow')}
     inBackend = ${node.context.inBackend}
     youtubeAPI = false
 
@@ -27,6 +28,8 @@ prototype(Jonnitto.PrettyEmbedHelper:Assets) < prototype(Neos.Fusion:Component)
         }
         liveJS = Jonnitto.PrettyEmbedHelper:Assets.Fragment.Script {
             @if.set = ${!props.inBackend && props.includeAssets.js}
+            openYoutubeInNewWindow = ${props.openInNewWindow.youtube}
+            openVimeoInNewWindow = ${props.openInNewWindow.vimeo}
             filename = 'Main.js'
         }
     }

diff --git a/Resources/Private/Fusion/Helper/Assets/Fragment/Script.fusion b/Resources/Private/Fusion/Helper/Assets/Fragment/Script.fusion
@@ -7,13 +7,16 @@ prototype(Jonnitto.PrettyEmbedHelper:Assets.Fragment.Script) < prototype(Neos.Fu
     // https://github.com/sandstorm/Sandstorm.CookiePunch is installed
     sandstormCookiePunchIsInstalled = ${Configuration.setting('Neos.Neos.fusion.autoInclude')['Sandstorm.CookiePunch']}
     dataNeverBlock = ${!!this.sandstormCookiePunchIsInstalled}
+    openYoutubeInNewWindow = null
+    openVimeoInNewWindow = null
 
     renderer = Neos.Fusion:Tag {
         tagName = 'script'
         attributes {
             data-slipstream = true
             defer = ${props.defer}
             data-never-block = ${props.dataNeverBlock}
+            data-openexternal = ${Array.join(Array.filter([props.openYoutubeInNewWindow ? 'youtube' : null, props.openVimeoInNewWindow ? 'vimeo' : null]),',') || null}
             src = Neos.Fusion:Join {
                 path = Neos.Fusion:ResourceUri {
                     path = ${props.fullPath}

diff --git a/Resources/Public/Scripts/Main.js b/Resources/Public/Scripts/Main.js
diff --git a/Resources/Public/Scripts/Main.js.map b/Resources/Public/Scripts/Main.js.map