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 }}