add swipe support for recent sounds and newsitems sections

diff --git a/panikweb_templates/static/css/_specifics.scss b/panikweb_templates/static/css/_specifics.scss
index 32cce0b1e89b93727983c456845002e7bf824a12..6789f4c319e51c7e2ebc7e473bebe1f9f15cf082 100644 (file)
--- a/panikweb_templates/static/css/_specifics.scss
+++ b/panikweb_templates/static/css/_specifics.scss
@@ -1405,6 +1405,9 @@ nav#program li {
                position: absolute;
                right: 2rem;
        }
+       div {
+               transition: all linear 0.2s;
+       }
 }
 
 #recent-emissions h3,

diff --git a/panikweb_templates/static/js/specifics.js b/panikweb_templates/static/js/specifics.js
index 81de7cabbb72dcb08b9bfcfabcbda24f5e985df7..92be25ef56062a3048b4049724bd667cfd5cd781 100644 (file)
--- a/panikweb_templates/static/js/specifics.js
+++ b/panikweb_templates/static/js/specifics.js
@@ -509,6 +509,23 @@ $(function() {
                $('.around-block.highlight').click();
                refresh_arrows();
 
+               $('#recent-news > div, #recent-sounds > div').on('swipe', function(e, dx, dy) {
+                       var x = $(this).data('x') || 0;
+                       if (dx == -1) {
+                               x += $(this).find('> div').outerWidth() + 10;
+                       } else if (dx == 1) {
+                               x -= $(this).find('> div').outerWidth() + 10;
+                       } else {
+                               return;
+                       }
+                       if (x < 0) x = 0;
+                       if (x > $(this).find('> div').width() * $(this).find('> div').length) {
+                               x -= $(this).find('> div').outerWidth() + 10;
+                       }
+                       $(this).data('x', x);
+                       $(this).css('transform', 'translateX(-' + x + 'px)');
+               });
+
                 $('#ticker li:not(:first)');
                if (ticker_interval) clearInterval(ticker_interval);
                function tick(){