diff options
author | Mario <mario@mariovavti.com> | 2021-07-29 06:59:13 +0000 |
---|---|---|
committer | Mario <mario@mariovavti.com> | 2021-07-29 06:59:13 +0000 |
commit | 9722d157bf138753bc168f68c56b4963db6da4e9 (patch) | |
tree | a15bb81c35a2367fe4628614471d471ed86d2712 /view/theme/redbasic/js | |
parent | 219d47f04c7bb04dcc241b9ed6ca411fc9653f09 (diff) | |
parent | c6133d2558ce29e44342fa7be8bb65e0059aea02 (diff) | |
download | volse-hubzilla-9722d157bf138753bc168f68c56b4963db6da4e9.tar.gz volse-hubzilla-9722d157bf138753bc168f68c56b4963db6da4e9.tar.bz2 volse-hubzilla-9722d157bf138753bc168f68c56b4963db6da4e9.zip |
Merge branch 'dev' into bs5
Diffstat (limited to 'view/theme/redbasic/js')
-rw-r--r-- | view/theme/redbasic/js/redbasic.js | 75 |
1 files changed, 60 insertions, 15 deletions
diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js index b0b8d5dfc..9312d8390 100644 --- a/view/theme/redbasic/js/redbasic.js +++ b/view/theme/redbasic/js/redbasic.js @@ -11,7 +11,7 @@ $(document).ready(function() { if($(window).width() < 992) { $('main').css('width', $(window).width() + $('aside').outerWidth() ); } else { - $('main').css('width', '100%' ); + $('main').css('width', '100%'); } }); } @@ -20,15 +20,15 @@ $(document).ready(function() { stickyScroll('.aside_spacer_left', '.aside_spacer_top_left', '.content', parseFloat(window.getComputedStyle(document.querySelector('#region_1')).getPropertyValue('padding-top')), 0); stickyScroll('.aside_spacer_right', '.aside_spacer_top_right', '.content', parseFloat(window.getComputedStyle(document.querySelector('#region_3')).getPropertyValue('padding-top')), 20); - $('#expand-aside').on('click', toggleAside); - - $('section').on('click', function() { + $('#expand-aside').on('click', function() { if($('main').hasClass('region_1-on')){ - toggleAside(); + toggleAside('left'); + } + else { + toggleAside('right'); } }); - $('.usermenu').click(function() { if($('#navbar-collapse-1, #navbar-collapse-2').hasClass('show')){ $('#navbar-collapse-1, #navbar-collapse-2').removeClass('show'); @@ -69,6 +69,49 @@ $(document).ready(function() { } } setInterval(function () {checkNotify();}, 10 * 1000); + + var touch_start = null; + var touch_max = window.innerWidth / 10; + + window.addEventListener('touchstart', function(e) { + if (e.touches.length === 1){ + //just one finger touched + touch_start = e.touches.item(0).clientX; + if (touch_start < touch_max) { + $('html, body').css('overflow-y', 'hidden'); + } + } + else { + //a second finger hit the screen, abort the touch + touch_start = null; + } + }); + + window.addEventListener('touchend', function(e) { + $('html, body').css('overflow-y', ''); + + let touch_offset = 30; //at least 30px are a swipe + if (touch_start) { + //the only finger that hit the screen left it + let touch_end = e.changedTouches.item(0).clientX; + + if (touch_end > (touch_start + touch_offset)) { + //a left -> right swipe + if (touch_start < touch_max) { + toggleAside('right'); + } + } + if (touch_end < (touch_start - touch_offset)) { + //a right -> left swipe + //toggleAside('left'); + } + } + }); + + $(document).on('hz:hqControlsClickAction', function(e) { + toggleAside('left'); + }); + }); function setStyle(element, cssProperty) { @@ -136,16 +179,18 @@ function makeFullScreen(full) { } } -function toggleAside() { - $('#expand-aside-icon').toggleClass('fa-arrow-circle-right').toggleClass('fa-arrow-circle-left'); - if($('main').hasClass('region_1-on')){ - $('html, body').css('overflow-x', ''); - $('main').removeClass('region_1-on') +function toggleAside(swipe) { + + if ($('main').hasClass('region_1-on') && swipe === 'left') { + $('#expand-aside-icon').addClass('fa-arrow-circle-right').removeClass('fa-arrow-circle-left'); + $('html, body').css({ 'position': '', left: '' }); + $('main').removeClass('region_1-on'); $('#overlay').remove(); } - else { - $('html, body').css('overflow-x', 'hidden'); - $('main').addClass('region_1-on') - $('<div id="overlay"></div>').appendTo('section'); + if (!$('main').hasClass('region_1-on') && swipe === 'right') { + $('#expand-aside-icon').removeClass('fa-arrow-circle-right').addClass('fa-arrow-circle-left'); + $('html, body').css({ 'position': 'sticky', 'left': '0px'}); + $('main').addClass('region_1-on'); + $('<div id="overlay"></div>').appendTo('body').one('click', function() { toggleAside('left'); }); } } |