diff --git a/changes/changelog.d/875.bugfix b/changes/changelog.d/875.bugfix new file mode 100644 index 0000000000000000000000000000000000000000..609d83f6c5d5a42660cb421bb76815334a6fb6c0 --- /dev/null +++ b/changes/changelog.d/875.bugfix @@ -0,0 +1 @@ +Fixed broken embedded player layout after dependency update (#875) diff --git a/front/Dockerfile b/front/Dockerfile index 43c968012b26741f70ca2ebb97cec4607fbb7f9c..6acd9d9db69fb133b354c359a7a80247bae6a145 100644 --- a/front/Dockerfile +++ b/front/Dockerfile @@ -1,4 +1,4 @@ -FROM node:9 +FROM node:11 # needed to compile translations RUN curl -L -o /usr/local/bin/jq https://github.com/stedolan/jq/releases/download/jq-1.5/jq-linux64 && chmod +x /usr/local/bin/jq diff --git a/front/src/EmbedFrame.vue b/front/src/EmbedFrame.vue index 9c677e56e3a52ac1845460e86657c04fda60e873..991d9802bd2b8693eb8f02c48e41a3b25b8b8580 100644 --- a/front/src/EmbedFrame.vue +++ b/front/src/EmbedFrame.vue @@ -374,6 +374,8 @@ export default { </script> <style lang="scss"> +@import "~plyr/src/sass/plyr.scss"; + html, body, main { diff --git a/front/src/components/audio/EmbedWizard.vue b/front/src/components/audio/EmbedWizard.vue index e4412937e54e542a684381656a0810cf4c924b9b..13d9ffd656a512f1d07409229c38d1a8347cd5e2 100644 --- a/front/src/components/audio/EmbedWizard.vue +++ b/front/src/components/audio/EmbedWizard.vue @@ -58,9 +58,19 @@ export default { }, computed: { iframeSrc () { - return this.$store.getters['instance/absoluteUrl']( - `/front/embed.html?&type=${this.type}&id=${this.id}` - ) + let base = process.env.BASE_URL + if (base.startsWith('/')) { + // include hostname/protocol too so that the iframe link is absolute + base = `${window.location.protocol}//${window.location.host}${base}` + } + let instanceUrl = this.$store.state.instance.instanceUrl + let b = '' + if (!window.location.href.startsWith(instanceUrl)) { + // the frontend is running on a separate domain, so we need to provide + // the b= parameter in the iframe + b = `&b=${instanceUrl}` + } + return `${base}embed.html?&type=${this.type}&id=${this.id}${b}` }, frameWidth () { if (this.width) {