This is an automated email from the ASF dual-hosted git repository.

potiuk pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/airflow-site.git


The following commit(s) were added to refs/heads/main by this push:
     new b6ce741de7 [Landing pages] Replace use case video iframes with links  
(#1002)
b6ce741de7 is described below

commit b6ce741de7743dc0b60d16dc875d5f9cf6ff891a
Author: Michael Robinson <68482867+merobi-...@users.noreply.github.com>
AuthorDate: Wed Apr 10 10:04:13 2024 -0400

    [Landing pages] Replace use case video iframes with links  (#1002)
    
    * Fix for google news error.
    
    Signed-off-by: merobi-hub <mer...@gmail.com>
    
    * Replace use case video ifrmaes with links.
    
    Signed-off-by: merobi-hub <mer...@gmail.com>
    
    ---------
    
    Signed-off-by: merobi-hub <mer...@gmail.com>
---
 .../content/en/use-cases/business_operations.md    | 22 +++-------------------
 .../site/content/en/use-cases/etl_analytics.md     | 21 +++------------------
 .../en/use-cases/infrastructure-management.md      | 21 +++------------------
 landing-pages/site/content/en/use-cases/mlops.md   | 21 +++------------------
 .../site/layouts/partials/hooks/head-end.html      |  3 ---
 5 files changed, 12 insertions(+), 76 deletions(-)

diff --git a/landing-pages/site/content/en/use-cases/business_operations.md 
b/landing-pages/site/content/en/use-cases/business_operations.md
index 5daf45cc19..8c829ae8f9 100644
--- a/landing-pages/site/content/en/use-cases/business_operations.md
+++ b/landing-pages/site/content/en/use-cases/business_operations.md
@@ -20,27 +20,11 @@ This video shows an example of using Airflow to run the 
pipelines that power a c
 
 
 <div id="videoContainer" style="display: flex; justify-content: center; 
align-items: center; border: 2px solid #ccc; width: 75%; margin: auto; padding: 
20px;">
-    <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_business_ops_video.png" 
style="cursor: pointer; width: 100%; max-width: 560px;" alt="Click to play a 
one minute video showing the use case" title="Click to play video"/>
+    <a href="https://www.youtube.com/embed/2CEApKN0z1U?autoplay=1";>
+        <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_business_ops_video.png" 
style="cursor: pointer; width: 100%; max-width: 560px;" alt="Click to play a 
one minute video showing the use case" title="Click to play video"/>
+    </a>
 </div>
 
-<script>
-    document.getElementById('videoPlaceholder').addEventListener('click', 
function() {
-        var iframe = document.createElement('iframe');
-        iframe.setAttribute('src', 
'https://www.youtube.com/embed/2CEApKN0z1U?autoplay=1');
-        iframe.setAttribute('width', '100%');
-        iframe.setAttribute('height', '315');
-        iframe.setAttribute('frameborder', '0');
-        iframe.setAttribute('allow', 'accelerometer; autoplay; 
clipboard-write; encrypted-media; gyroscope; picture-in-picture');
-        iframe.setAttribute('allowfullscreen', 'allowfullscreen');
-        iframe.style.display = 'block';
-
-        var videoContainer = document.getElementById('videoContainer');
-        videoContainer.innerHTML = '';
-        videoContainer.appendChild(iframe);
-    });
-</script>
-
-
 </br>
 
 ## Why use Airflow for Business Operations?
diff --git a/landing-pages/site/content/en/use-cases/etl_analytics.md 
b/landing-pages/site/content/en/use-cases/etl_analytics.md
index b0f612cfbb..c578c3e22c 100644
--- a/landing-pages/site/content/en/use-cases/etl_analytics.md
+++ b/landing-pages/site/content/en/use-cases/etl_analytics.md
@@ -19,26 +19,11 @@ The video below shows a simple ETL/ELT pipeline in Airflow 
that extracts climate
 
 
 <div id="videoContainer" style="display: flex; justify-content: center; 
align-items: center; border: 2px solid #ccc; width: 75%; margin: auto; padding: 
20px;">
-    <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_etl_video.png" style="cursor: 
pointer; width: 100%; max-width: 560px;" alt="Click to play a one minute video 
showing the use case" title="Click to play video"/>
+    <a href="https://www.youtube.com/embed/ljBU_VyihVQ?autoplay=1";>
+        <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_etl_video.png" style="cursor: 
pointer; width: 100%; max-width: 560px;" alt="Click to play a one minute video 
showing the use case" title="Click to play video"/>
+    </a>
 </div>
 
-<script>
-    document.getElementById('videoPlaceholder').addEventListener('click', 
function() {
-        var iframe = document.createElement('iframe');
-        iframe.setAttribute('src', 
'https://www.youtube.com/embed/ljBU_VyihVQ?autoplay=1');
-        iframe.setAttribute('width', '90%');
-        iframe.setAttribute('height', '315');
-        iframe.setAttribute('frameborder', '0');
-        iframe.setAttribute('allow', 'accelerometer; autoplay; 
clipboard-write; encrypted-media; gyroscope; picture-in-picture');
-        iframe.setAttribute('allowfullscreen', 'allowfullscreen');
-        iframe.style.display = 'block';
-
-        var videoContainer = document.getElementById('videoContainer');
-        videoContainer.innerHTML = '';
-        videoContainer.appendChild(iframe);
-    });
-</script>
-
 </br>
 
 ## Why use Airflow for ETL/ELT pipelines?
diff --git 
a/landing-pages/site/content/en/use-cases/infrastructure-management.md 
b/landing-pages/site/content/en/use-cases/infrastructure-management.md
index bab2aea859..60adf5543e 100644
--- a/landing-pages/site/content/en/use-cases/infrastructure-management.md
+++ b/landing-pages/site/content/en/use-cases/infrastructure-management.md
@@ -18,26 +18,11 @@ Airflow can interact with any API, which makes it a great 
tool to manage your in
 Infrastructure management is often needed within the context of other use 
cases, such as MLOps, or implementing data quality checks. This video shows an 
example of how it might be used for an MLOps pipeline. You can find the code 
shown in this example 
[here](https://github.com/astronomer/use-case-setup-teardown-data-quality).
 
 <div id="videoContainer" style="display: flex; justify-content: center; 
align-items: center; border: 2px solid #ccc; width: 75%; margin: auto; padding: 
20px;">
-    <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_infra_video.png" style="cursor: 
pointer; width: 100%; max-width: 560px;" alt="Click to play a one minute video 
showing the use case" title="Click to play video"/>
+    <a href="https://www.youtube.com/embed/JkURWnl76GQ?autoplay=1";>
+        <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_infra_video.png" style="cursor: 
pointer; width: 100%; max-width: 560px;" alt="Click to play a one minute video 
showing the use case" title="Click to play video"/>
+    </a>
 </div>
 
-<script>
-    document.getElementById('videoPlaceholder').addEventListener('click', 
function() {
-        var iframe = document.createElement('iframe');
-        iframe.setAttribute('src', 
'https://www.youtube.com/embed/JkURWnl76GQ?autoplay=1');
-        iframe.setAttribute('width', '100%');
-        iframe.setAttribute('height', '315');
-        iframe.setAttribute('frameborder', '0');
-        iframe.setAttribute('allow', 'accelerometer; autoplay; 
clipboard-write; encrypted-media; gyroscope; picture-in-picture');
-        iframe.setAttribute('allowfullscreen', 'allowfullscreen');
-        iframe.style.display = 'block';
-
-        var videoContainer = document.getElementById('videoContainer');
-        videoContainer.innerHTML = '';
-        videoContainer.appendChild(iframe);
-    });
-</script>
-
 </br>
 
 ## Why use Airflow for Infrastructure Management
diff --git a/landing-pages/site/content/en/use-cases/mlops.md 
b/landing-pages/site/content/en/use-cases/mlops.md
index f42f656c01..b42a3e7558 100644
--- a/landing-pages/site/content/en/use-cases/mlops.md
+++ b/landing-pages/site/content/en/use-cases/mlops.md
@@ -18,26 +18,11 @@ Machine Learning Operations (MLOps) is a broad term 
encompassing everything need
 The following video shows an example of using Airflow and Weaviate to create 
an automatic RAG pipeline that ingests and embeds data from news articles and 
provides trading advice. You can find the code shown in this example 
[here](https://github.com/astronomer/use-case-airflow-llm-rag-finance).
 
 <div id="videoContainer" style="display: flex; justify-content: center; 
align-items: center; border: 2px solid #ccc; width: 75%; margin: auto; padding: 
20px;">
-    <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_mlops_video.png" style="cursor: 
pointer; width: 100%; max-width: 560px;" alt="Click to play a one minute video 
showing the use case" title="Click to play video"/>
+    <a href="https://www.youtube.com/embed/QcBdh_n4es4?autoplay=1";>
+        <img id="videoPlaceholder" 
src="/usecase-video-placeholders/placeholder_mlops_video.png" style="cursor: 
pointer; width: 100%; max-width: 560px;" alt="Click to play a one minute video 
showing the use case" title="Click to play video"/>
+    </a>
 </div>
 
-<script>
-    document.getElementById('videoPlaceholder').addEventListener('click', 
function() {
-        var iframe = document.createElement('iframe');
-        iframe.setAttribute('src', 
'https://www.youtube.com/embed/QcBdh_n4es4?autoplay=1');
-        iframe.setAttribute('width', '90%');
-        iframe.setAttribute('height', '315');
-        iframe.setAttribute('frameborder', '0');
-        iframe.setAttribute('allow', 'accelerometer; autoplay; 
clipboard-write; encrypted-media; gyroscope; picture-in-picture');
-        iframe.setAttribute('allowfullscreen', 'allowfullscreen');
-        iframe.style.display = 'block';
-
-        var videoContainer = document.getElementById('videoContainer');
-        videoContainer.innerHTML = '';
-        videoContainer.appendChild(iframe);
-    });
-</script>
-
 </br>
 
 ## Why use Airflow for MLOps?
diff --git a/landing-pages/site/layouts/partials/hooks/head-end.html 
b/landing-pages/site/layouts/partials/hooks/head-end.html
index 16facd7859..c840423105 100644
--- a/landing-pages/site/layouts/partials/hooks/head-end.html
+++ b/landing-pages/site/layouts/partials/hooks/head-end.html
@@ -53,7 +53,4 @@
 {{ $vendorsHeader := index . "vendors~header" }}
 <link rel="preload" href="{{ relURL $vendorsHeader.js }}" as="script">
 
-<!-- CSP for YouTube video iframes -->
-<meta http-equiv="Content-Security-Policy" content="frame-src 
https://www.youtube.com"; />
-
 {{ end }}

Reply via email to