add initial placeholder for embed block, re #23

resources/assets/stylesheets/scss/courseware.scss

@@ -3377,6 +3377,11 @@ e m b e d  b l o c k
                 width: 100% !important;
             }
         }
+        .cw-block-embed-click-wrapper {
+            background-color: $content-color-20;
+            border: solid thin $content-color-40;
+            padding: 1em;
+        }
         .cw-block-embed-info {
             margin-top: 0.5em;
         }

resources/vue/components/courseware/CoursewareEmbedBlock.vue

@@ -10,7 +10,7 @@
         >
             <template #content>
                 <div v-if="currentTitle !== ''" class="cw-block-title">{{ currentTitle }}</div>
-                <div v-if="oembedData !== null">
+                <div v-if="activated && oembedData !== null">
                     <div
                         v-if="oembedData.type === 'rich' || oembedData.type === 'video'"
                         v-html="oembedData.html"
@@ -26,6 +26,15 @@
                         <img :src="oembedData.fullsize_url" />
                     </div>
                 </div>
+                <div v-else-if="oembedData !== null" class="cw-block-embed-click-wrapper">
+                    <div v-translate="{provider: oembedData.provider_name}">
+                        Dieser Inhalt wird von %{provider} bereitgestellt. Es gelten die Datenschutzbestimmungen von %{provider}.<br>
+                        Klicken Sie hier, wenn Sie zustimmen, dass der Inhalt von %{provider} geladen wird.
+                    </div>
+                    <button class="button accept" @click.prevent="activated = true">
+                        <translate>Inhalt anzeigen</translate>
+                    </button>
+                </div>
                 <div class="cw-block-embed-info" v-if="oembedData !== null">
                     <span class="cw-block-embed-title">{{ oembedData.title }}</span>
                     <span class="cw-block-embed-author-name">
@@ -102,6 +111,7 @@ export default {
     },
     data() {
         return {
+            activated: false,
             currentTitle: '',
             currentSource: '',
             currentUrl: '',