From e3fc5d1b9becb7e3ba1d6b280ca96ff54935fb77 Mon Sep 17 00:00:00 2001
From: Pablo Vazquez <venomgfx@gmail.com>
Date: Mon, 23 Jan 2017 15:47:14 +0100
Subject: [PATCH] Initial support for AMP (Accelerated Mobile Pages)

https://www.ampproject.org/

Basic implementation. Still needs the node description to be parsed,
as <img> tags need to be <amp-img> with special tags.
---
 pillar/web/nodes/routes.py        |  4 ++++
 src/templates/nodes/view_amp.jade | 35 +++++++++++++++++++++++++++++++
 2 files changed, 39 insertions(+)
 create mode 100644 src/templates/nodes/view_amp.jade

diff --git a/pillar/web/nodes/routes.py b/pillar/web/nodes/routes.py
index 5948c366..2a36e6f3 100644
--- a/pillar/web/nodes/routes.py
+++ b/pillar/web/nodes/routes.py
@@ -207,6 +207,10 @@ def view(node_id):
 
     template_path = '{0}/{1}_embed.html'.format(template_path, template_action)
 
+    # Full override for AMP view
+    if request.args.get('format') == 'amp':
+        template_path = 'nodes/view_amp.html'
+
     try:
         return render_template(template_path,
                                node_id=node._id,
diff --git a/src/templates/nodes/view_amp.jade b/src/templates/nodes/view_amp.jade
new file mode 100644
index 00000000..1f1fd3cc
--- /dev/null
+++ b/src/templates/nodes/view_amp.jade
@@ -0,0 +1,35 @@
+doctype html
+html(⚡)
+	head
+		meta(charset='utf-8')
+		script(async, src='//cdn.ampproject.org/v0.js')
+		title {{ node.name }} - Blender Cloud
+		link(rel='canonical', href='{{ url_for_node(node_id=node._id) }}')
+		meta(name='viewport', content='width=device-width,minimum-scale=1,initial-scale=1')
+		style(amp-boilerplate).
+			body {-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
+		style(amp-custom).
+			body {font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;font-weight: 400;font-style: normal;letter-spacing: 0;text-rendering: optimizeLegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-moz-font-feature-settings: "liga" on;color: rgba(0,0,0,.8);font-size: 18px;line-height: 1.4;}
+			h1, h2, h3, h4, h5, h6{margin: 20px;}
+			.node-description {margin: 10px 20px 30px 20px}
+			.view-on-cloud {padding: 20px}
+
+		noscript
+			style(amp-boilerplate).
+				body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}
+	body
+		| {% if node.picture %}
+		amp-img(
+			src="{{ node.picture.thumbnail('l', api=api) }}",
+			layout="responsive",
+			height="{{ node.picture.height }}",
+			width="{{ node.picture.width }}")
+		| {% endif %}
+
+		h1 {{ node.name }}
+
+		| {% if node.description %}
+		.node-description {{ node.description }}
+		| {% endif %}
+
+		a.view-on-cloud(href="{{ url_for_node(node_id=node._id) }}") View on Blender Cloud