From: Radek Czajka <rczajka@rczajka.pl>
Date: Wed, 24 Jul 2019 09:05:14 +0000 (+0200)
Subject: Carousel fixes.
X-Git-Url: https://git.mdrn.pl/wolnelektury.git/commitdiff_plain/d048787bd42b9d009aa7b3dfb5c08f7682f231e6

Carousel fixes.
---

diff --git a/src/social/templates/social/embed_video.html b/src/social/templates/social/embed_video.html
index 9810e7f2a..34f2e06f3 100644
--- a/src/social/templates/social/embed_video.html
+++ b/src/social/templates/social/embed_video.html
@@ -1,6 +1,6 @@
 {% if youtube_id %}
-<iframe style="position: absolute; left:0;right:0;height:100%;width:100%;"
+<iframe style="position: absolute; left:0;right:0;height:100%;width:100%; background-image:url('https://img.youtube.com/vi/{{ youtube_id }}/0.jpg'); background-position: 50%; background-size: cover;"
 	type="text/html" width="100%" height="360"
-						   src="http://www.youtube.com/embed/{{ youtube_id }}"
-	 frameborder="0"></iframe>
-	  {% endif %}
+	data-src="https://www.youtube.com/embed/{{ youtube_id }}"
+	frameborder="0"></iframe>
+{% endif %}
diff --git a/src/wolnelektury/static/js/base.js b/src/wolnelektury/static/js/base.js
index 439ba1327..2d0ebbf64 100644
--- a/src/wolnelektury/static/js/base.js
+++ b/src/wolnelektury/static/js/base.js
@@ -66,6 +66,14 @@
         });
 
 
+        $('.carousel').on('cycle-before', function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
+            $("iframe", outgoingSlideEl).attr("src", '');
+            $("iframe", incomingSlideEl).attr("src", $("iframe", incomingSlideEl).attr('data-src'));
+        });
+        $('.carousel section').first().each(function() {
+            $("iframe", this).attr("src", $("iframe", this).attr('data-src'));
+        });
+
 
         (function() {
             var $current = null;
diff --git a/src/wolnelektury/static/scss/main/main_page.scss b/src/wolnelektury/static/scss/main/main_page.scss
index 60af2d898..20f2fb3bc 100755
--- a/src/wolnelektury/static/scss/main/main_page.scss
+++ b/src/wolnelektury/static/scss/main/main_page.scss
@@ -325,23 +325,33 @@ section {
 
     .cycle-prev, .cycle-next {
         position: absolute;
-        top: 0;
-        bottom: 0;
+        top: 50/975 * 100vw;
+        bottom: 50/975 * 100vw;
         width: 15%;
         z-index: 1000;
         background: black;
         color: white;
         opacity: 0;
 
+        @media screen and (min-width: 62.5em) {
+            top: 50px;
+            bottom: 50px;
+        }
+
         &::after {
+            top: 50/975 * 100vw;
+            bottom: 50/975 * 100vw;
             font-size: 100/975*100vw;
             display: block;
-            line-height: 315/975*100vw;
+            line-height: (315-100)/975*100vw;
             text-align: center;
+            cursor: pointer;
 
             @media screen and (min-width: 62.5em) {
                 font-size: 100px;
-                line-height: 315px;
+                line-height: 315px - 100px;
+                top: 50px;
+                bottom: 50px;
             }
         }
         &:hover {
@@ -349,3 +359,39 @@ section {
         }
     }
 }
+
+
+.cycle-pager {
+    text-align: center;
+    width: 100%;
+    z-index: 500;
+    position: absolute;
+    bottom: 8%;
+    overflow: hidden;
+
+    span {
+        font-family: arial;
+        font-size: 64 /975*100vw;
+        width: 32 /975*100vw;
+        height: 32 /975*100vw;
+        display: inline-block;
+        color: #ddd;
+        cursor: pointer;
+
+        text-shadow: 0px 0px 5px rgba(0,0,0,0.75);
+
+        @media screen and (min-width: 62.5em) {
+            font-size: 64px;
+            width: 32px;
+            height: 32px;
+        }
+
+        &.cycle-pager-active {
+            color: #018189;
+        }
+    }
+
+    > * {
+        cursor: pointer;
+    }
+}
diff --git a/src/wolnelektury/views.py b/src/wolnelektury/views.py
index b32c64c52..4b20a5572 100644
--- a/src/wolnelektury/views.py
+++ b/src/wolnelektury/views.py
@@ -25,6 +25,7 @@ from social.utils import get_or_choose_cite
 from wolnelektury.forms import RegistrationForm, SocialSignupForm
 
 
+@never_cache
 def main_page(request):
     ctx = {
         'last_published': Book.objects.exclude(cover_thumb='').filter(parent=None).order_by('-created_at')[:6],