From 497a088e9f493c698b82a9c66a596511189bf6a0 Mon Sep 17 00:00:00 2001
From: Tor-Einar Skog <tor-einar.skog@nibio.no>
Date: Tue, 24 Oct 2017 09:04:45 +0200
Subject: [PATCH] Trying to integrate video
---
VIPSWeb/static/css/vipsweb.css | 18 ++++++++++++++++++
roughage/templates/roughage/nutrition.html | 8 +++++++-
2 files changed, 25 insertions(+), 1 deletion(-)
diff --git a/VIPSWeb/static/css/vipsweb.css b/VIPSWeb/static/css/vipsweb.css
index 176bcf58..be4d90b4 100755
--- a/VIPSWeb/static/css/vipsweb.css
+++ b/VIPSWeb/static/css/vipsweb.css
@@ -839,3 +839,21 @@ div.advertisement {
border: 3px solid #008136;
padding: 10px 20px 25px 25px;
}
+
+/* For embedding VIMEO etc responsively */
+.responsive-video {
+position: relative;
+padding-bottom: 56.25%;
+padding-top: 60px; overflow: hidden;
+}
+
+
+.responsive-video iframe,
+.responsive-video object,
+.responsive-video embed {
+position: absolute;
+top: 0;
+left: 0;
+width: 100%;
+height: 100%;
+}
diff --git a/roughage/templates/roughage/nutrition.html b/roughage/templates/roughage/nutrition.html
index 3eb9322a..ca181a85 100755
--- a/roughage/templates/roughage/nutrition.html
+++ b/roughage/templates/roughage/nutrition.html
@@ -34,9 +34,11 @@
<p>
Felt merket med * må fylles ut. Velg klimastasjon for årets klimadata, normaldata eller begge.
</p>
+
<form id="{{form_id}}">
<div class="row">
<div class="col-md-6">
+
<input type="hidden" name="timeZone" value="Europe/Oslo"/>
<div class="form-group">
<label for="weatherStationId">Målestasjon for årets værdata</label>
@@ -89,7 +91,11 @@
</div>
<div class="col-md-6">
- <div id="weatherStationSelectionMap" style="height: 450px;max-height: 450px;">
+ <div class="responsive-video">
+ <iframe src="https://player.vimeo.com/video/147571372" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
+ <p><a href="https://vimeo.com/147571372">Grovformodellen 2015</a> from <a href="https://vimeo.com/nibio">NIBIO</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
+ </div>
+ <div id="weatherStationSelectionMap" style="height: 450px;max-height: 450px; margin: 15px;">
<div id="popover"></div>
</div>
</div>
--
GitLab