adjust iframely tags, but they don't work yet

voxmedia · Aug 1, 2018 · 6a7e9cb · 6a7e9cb
1 parent 3f2e5ea
commit 6a7e9cb
Show file tree

Hide file tree

Showing 6 changed files with 37 additions and 51 deletions.
diff --git a/src/lib/index.js b/src/lib/index.js
@@ -79,9 +79,7 @@ export function getProjectConfig(project) {
   return yaml.safeLoad(fs.readFileSync(configFile, 'utf8'))
 }
 
-const TEMPLATES = []
-export function render(tmpl, data) {
-  if ( !TEMPLATES[tmpl] )
-    TEMPLATES[tmpl] = template(fs.readFileSync(path.join(getStaticPath(), 'templates', tmpl), 'utf8'))
-  return TEMPLATES[tmpl](Object.assign({render}, data))
+export function render(templateName, data) {
+  const tmpl = template(fs.readFileSync(path.join(getStaticPath(), 'templates', templateName), 'utf8'))
+  return tmpl(Object.assign({render}, data))
 }
diff --git a/src/worker/tasks/project_deploy.js b/src/worker/tasks/project_deploy.js
@@ -46,12 +46,12 @@ function projectBuild({ project, settings }) {
 
     fs.writeFile(
       path.join(dest, 'index.html'),
-      render('embed.html.ejs', { config, content, project, embed_meta.fallbacks, slug, deploy_url }),
+      render('embed.html.ejs', { config, content, project, embed_meta, slug, deploy_url }),
       end)
 
     fs.writeFile(
       path.join(dest, 'preview.html'),
-      render('preview.html.ejs', { config, embed_code, project, embed_meta.fallbacks, slug, deploy_url }),
+      render('preview.html.ejs', { config, embed_code, project, embed_meta, slug, deploy_url }),
       end)
 
     fs.writeFile(
@@ -61,7 +61,7 @@ function projectBuild({ project, settings }) {
 
     fs.writeFile(
       path.join(dest, 'oembed.json'),
-      render('oembed.json.ejs', { config, embed_code, project, embed_meta.fallbacks, slug, deploy_url }),
+      render('oembed.json.ejs', { config, embed_code, project, embed_meta, slug, deploy_url }),
       end)
   })
 }

diff --git a/static/templates/embed.html.ejs b/static/templates/embed.html.ejs
@@ -2,51 +2,14 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, user-scalable=no" />
   <title><%=config.headline || project.title%></title>
 
-  <meta name="viewport" content="width=device-width, user-scalable=no" />
   <meta name="description" content="<%=config.leadin%>" />
 
-  <meta property="fb:app_id" content="1477830955774082" />
-  <meta property="og:site_name" content="Vox.com" />
-  <meta property="og:type" content="article" />
-  <meta property="og:title" content="<%=config.headline || project.title%>" />
-  <meta property="og:image" content="<%=deploy_url + fallbacks[0].name %>" />
-  <meta property="og:description" content="<%=config.leadin%>" />
-  <meta property="og:url" content="" />
-
   <meta name="author" content="<%=config.credit%>" />
 
-  <meta property="article:publisher" content="https://www.facebook.com/Vox" />
-
-  <meta name="twitter:site" content="@voxdotcom" />
-  <meta property="twitter:account_id" content="2347049341" />
-  <meta name="twitter:card" content="summary_large_image" />
-  <meta name="twitter:image:src" content="<%=deploy_url + fallbacks[0].name %>" />
-  <meta name="twitter:image:width" content="<%=fallbacks[0].width%>" />
-  <meta name="twitter:image:height" content="<%=fallbacks[0].height%>" />
-  <meta name="twitter:url" content="" />
-  <meta name="twitter:title" content="<%=config.headline || project.title%>" />
-  <meta name="twitter:description" content="<%=config.leadin%>" />
-
-  <link rel="iframely reader" type="application/javascript"
-        id="<%=slug%>__graphic"
-        href="<%=deploy_url %>embed.js" title="<%=config.headline || project.title%>" />
-
-  <% for(var i = 0; i < fallbacks.length; i++) { %>
-  <link rel="iframely thumbnail" type="<%=fallbacks[i].mime %>"
-        href="<%=deploy_url + fallbacks[i].name %>"
-        title="<%=config.headline || project.title%>"
-        sizes="<%=fallbacks[i].width + 'x' + fallbacks[i].height %>"/>
-  <% } %>
-
-  <link rel="alternate" type="application/json+oembed"
-    href="<%=deploy_url%>oembed.json"
-    title="<%=config.headline || project.title%>" />
-
-  <link rel="canonical" href="" />
-
-  <link rel="shortcut icon" href="https://cdn3.vox-cdn.com/community_logos/52517/voxv.png" />
+  <%=render('meta_tags.html.ejs', {slug, deploy_url, embed_meta, config, project}) %>
 
   <style type="text/css">
     @font-face{

diff --git a/static/templates/meta_tags.html.ejs b/static/templates/meta_tags.html.ejs
@@ -0,0 +1,23 @@
+  <!--
+  <link rel="iframely reader" type="text/html"
+        href="<%=deploy_url %>"
+        title="<%=config.headline || project.title%>"
+        media="(min-width:288) and (min-height:<%=embed_meta.height%>)" />
+  -->
+  <link rel="iframely reader" type="application/javascript"
+        id="<%=slug%>__graphic"
+        href="<%=deploy_url %>embed.js" title="<%=config.headline || project.title%>"
+        media="(min-width:288) and (min-height:<%=embed_meta.height%>)" />
+  <% for(var i = 0; i < embed_meta.fallbacks.length; i++) { %>
+  <link rel="iframely thumbnail" type="<%=embed_meta.fallbacks[i].mime %>"
+        href="<%=deploy_url + embed_meta.fallbacks[i].name %>"
+        title="<%=config.headline || project.title%>"
+        sizes="<%=embed_meta.fallbacks[i].width + 'x' + embed_meta.fallbacks[i].height %>"/>
+  <% } %>
+  <link rel="alternate" type="application/json+oembed"
+        href="<%=deploy_url%>oembed.json"
+        title="<%=config.headline || project.title%>" />
+
+  <link rel="canonical" href="https://www.vox.com" />
+
+  <link rel="shortcut icon" href="https://cdn3.vox-cdn.com/community_logos/52517/voxv.png" />
diff --git a/static/templates/oembed.json.ejs b/static/templates/oembed.json.ejs
@@ -8,8 +8,8 @@
 "author_url": "",
 "html": "<%=embed_code.replace(/"/g, '\\"')%>",
 "width": "100%",
-"height": "",
-"thumbnail_url": "",
-"thumbnail_width": "",
-"thumbnail_height": "",
+"height": "<%=embed_meta.height %>",
+"thumbnail_url": "<%=deploy_url + embed_meta.fallbacks[0].name %>",
+"thumbnail_width": "<%=embed_meta.fallbacks[0].width %>",
+"thumbnail_height": "<%=embed_meta.fallbacks[0].height %>"
 }
diff --git a/static/templates/preview.html.ejs b/static/templates/preview.html.ejs
@@ -6,6 +6,8 @@
   <meta name="robots" content="noindex">
   <meta name="viewport" content="width=device-width, user-scalable=no" />
 
+  <%=render('meta_tags.html.ejs', {slug, deploy_url, embed_meta, config, project}) %>
+
   <style type="text/css">
     @font-face{
       font-family: "Balto";