From 1b619dd8c0fbedcad8248f0504143e4d11c20968 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Frank=20Boe=CC=88s?= <frank.boes@shift.agency>
Date: Mon, 17 Oct 2016 09:25:48 +0200
Subject: [PATCH] AMP pages now have proper Youtube tags

---
 src/models/post.js                     | 6 +++++-
 themes/default/templates/amp-post.html | 1 +
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/models/post.js b/src/models/post.js
index 40ea56b8..084910c0 100644
--- a/src/models/post.js
+++ b/src/models/post.js
@@ -232,10 +232,14 @@ var Post = function (filename, markdown, meta) {
    * @return {String}      [description]
    */
   external.ampifyHtml = function(html) {
+    // <amp-youtube data-videoid="mGENRKrdoGY" layout="responsive" width="480" height="270"></amp-youtube>
+    // <amp-iframe width="640" height="360" src="https://www.youtube.com/embed/WfQfYe7-V1A?enablejsapi=1"></amp-iframe>
     return html
       .replace(/(<\/?)(img|video|audio|iframe)/g, '$1amp-$2')
-      .replace(/(<amp-(?:video|iframe))/g, '$1 width="640" height="360"')
+      .replace(/(<amp-img[^>]+)\/>/g,'$1></amp-img>')
+      .replace(/(<amp-(?:video|iframe))/g, '$1 width="640" height="360" layout="responsive"')
       .replace(/(<amp-(?:video|iframe)[^>]+) allowfullscreen=".+?"/g, '$1')
+      .replace(/<amp-iframe([^>]*) src="https:\/\/www.youtube.com\/embed\/(.+?)\?enablejsapi=1"([^>]*)>(.*?)<\/amp-iframe>/g,'<amp-youtube$1 data-videoid="$2"$3></amp-youtube>')
       .replace(/(<amp-(?:audio))/g, '$1 width="640" height="60"')
       .replace(/(<amp-(?:video|audio|iframe).+?>).+(<\/amp-(?:video|iframe))/g, '$1$2')
     ;
diff --git a/themes/default/templates/amp-post.html b/themes/default/templates/amp-post.html
index 461cb3ae..c709f32d 100644
--- a/themes/default/templates/amp-post.html
+++ b/themes/default/templates/amp-post.html
@@ -9,6 +9,7 @@
   <script async src="https://cdn.ampproject.org/v0.js"></script>
   <script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>
   <script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>
+  <script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>
   <style amp-custom>
     body { font: 80% Tahoma, sans-serif; padding:0; }
     a { color:maroon; }