7 files changed, 143 insertions, 0 deletions
diff --git a/project/templates/vidframe/base_preview.xhtml b/project/templates/vidframe/base_preview.xhtml
new file mode 100644
index 0000000..eaf0bea
--- /dev/null
+++ b/project/templates/vidframe/base_preview.xhtml
@@ -0,0 +1,60 @@
+
+{%- extends "vidframe/base_vidframe.xhtml" -%}
+
+
+
+{%- block style %}
+    body {
+        background-color: black;
+    }
+    a {
+        position: absolute;
+        top: 0;
+        left: 0;
+    }
+    img.thumb {
+        opacity: 0.5;
+    }
+    div.playbutton {
+        opacity: 1.0;
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        top: 0;
+        left: 0;
+    }
+    svg {
+        position: absolute;
+        fill: #fff;
+        width: 100px;
+        height: 100px;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+    }
+    div.playbutton:hover svg,
+    div.playbutton:focus svg {
+        fill: #17e617;
+    }
+{% endblock -%}
+
+
+
+{%- block video %}
+<div class="playbutton">
+    <a href="{%- block vidlink -%}{%- endblock -%}">
+        <img class="thumb" src="{%- block thumbnail -%}{%- endblock -%}"
+             alt="Click to load video"
+             width="100%"
+             height="100%" />
+        <svg:svg version="1.1" xmlns:svg="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 311.69 311.69">
+            <svg:path d="M155.84,0A155.85,155.85,0,1,0,311.69,155.84,155.84,155.84,0,0,0,155.84,
+            0Zm0,296.42A140.58,140.58,0,1,1,296.42,155.84,140.58,140.58,0,0,1,155.84,296.42Z"/>
+            <svg:polygon points="218.79 155.84 119.22 94.34 119.22 217.34 218.79 155.84"/>
+        </svg:svg>
+    </a>
+</div>
+{% endblock -%}
+
+
diff --git a/project/templates/vidframe/base_video.xhtml b/project/templates/vidframe/base_video.xhtml
new file mode 100644
index 0000000..f298705
--- /dev/null
+++ b/project/templates/vidframe/base_video.xhtml
@@ -0,0 +1,26 @@
+
+{%- extends "vidframe/base_vidframe.xhtml" -%}
+
+
+
+{%- block style %}
+    body {
+        margin: 0;
+        padding: 0;
+    }
+{% endblock -%}
+
+
+
+{%- block video %}
+<div>
+    <object type="video/mp4"
+            data="{%- block vidfile -%}{%- endblock -%}"
+            width="{%- block vidwidth -%}{%- endblock -%}"
+            height="{%- block vidheight -%}{%- endblock -%}">
+        <a href="{%- block backup -%}{%- endblock -%}">Download video</a>
+    </object>
+</div>
+{% endblock -%}
+
+
diff --git a/project/templates/vidframe/base_vidframe.xhtml b/project/templates/vidframe/base_vidframe.xhtml
new file mode 100644
index 0000000..4f2e00e
--- /dev/null
+++ b/project/templates/vidframe/base_vidframe.xhtml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC
+    "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN"
+    "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
+<head>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title></title>
+    <style type="text/css">
+{% block style -%}{%- endblock %}
+    </style>
+</head>
+<body>
+{% block video -%}
+{%- endblock %}
+</body>
+</html>
diff --git a/project/templates/vidframe/endoh1_column_preview.xhtml b/project/templates/vidframe/endoh1_column_preview.xhtml
new file mode 100644
index 0000000..9a444e6
--- /dev/null
+++ b/project/templates/vidframe/endoh1_column_preview.xhtml
@@ -0,0 +1,9 @@
+
+{%- extends "vidframe/base_preview.xhtml" -%}
+
+
+
+{%- block vidlink -%}/vidframe/endoh1_column_video.xhtml{%- endblock -%}
+{%- block thumbnail -%}/vid/endoh1_column.jpg{%- endblock -%}
+
+
diff --git a/project/templates/vidframe/endoh1_column_video.xhtml b/project/templates/vidframe/endoh1_column_video.xhtml
new file mode 100644
index 0000000..3cebb18
--- /dev/null
+++ b/project/templates/vidframe/endoh1_column_video.xhtml
@@ -0,0 +1,11 @@
+
+{%- extends "vidframe/base_video.xhtml" -%}
+
+
+
+{%- block vidfile -%}/vid/endoh1_column.mp4{%- endblock -%}
+{%- block vidwidth -%}806{%- endblock -%}
+{%- block vidheight -%}490{%- endblock -%}
+{%- block backup -%}/vid/endoh1_column.mp4{%- endblock -%}
+
+
diff --git a/project/templates/vidframe/fluid_tanada_preview.xhtml b/project/templates/vidframe/fluid_tanada_preview.xhtml
new file mode 100644
index 0000000..9e27878
--- /dev/null
+++ b/project/templates/vidframe/fluid_tanada_preview.xhtml
@@ -0,0 +1,9 @@
+
+{%- extends "vidframe/base_preview.xhtml" -%}
+
+
+
+{%- block vidlink -%}/vidframe/fluid_tanada_video.xhtml{%- endblock -%}
+{%- block thumbnail -%}/vid/fluid_tanada.jpg{%- endblock -%}
+
+
diff --git a/project/templates/vidframe/fluid_tanada_video.xhtml b/project/templates/vidframe/fluid_tanada_video.xhtml
new file mode 100644
index 0000000..4328290
--- /dev/null
+++ b/project/templates/vidframe/fluid_tanada_video.xhtml
@@ -0,0 +1,11 @@
+
+{%- extends "vidframe/base_video.xhtml" -%}
+
+
+
+{%- block vidfile -%}/vid/fluid_tanada.mp4{%- endblock -%}
+{%- block vidwidth -%}806{%- endblock -%}
+{%- block vidheight -%}490{%- endblock -%}
+{%- block backup -%}/vid/fluid_tanada.mp4{%- endblock -%}
+
+