aboutsummaryrefslogtreecommitdiffstats
path: root/view
diff options
context:
space:
mode:
Diffstat (limited to 'view')
-rw-r--r--view/js/main.js4
-rw-r--r--view/js/mod_help.js18
-rw-r--r--view/php/default.php4
-rw-r--r--view/php/theme_init.php1
-rw-r--r--view/theme/redbasic/js/redbasic.js88
-rw-r--r--view/theme/redbasic/php/theme_init.php2
-rw-r--r--view/tpl/directory_header.tpl3
-rw-r--r--view/tpl/notes.tpl1
-rw-r--r--view/tpl/notifications_widget.tpl4
-rw-r--r--view/tpl/photo_album.tpl5
-rw-r--r--view/tpl/photos_recent.tpl5
-rw-r--r--view/tpl/viewcontact_template.tpl3
12 files changed, 79 insertions, 59 deletions
diff --git a/view/js/main.js b/view/js/main.js
index cd95a8a0b..0c48c8b18 100644
--- a/view/js/main.js
+++ b/view/js/main.js
@@ -1563,7 +1563,7 @@ function zFormError(elm,x) {
$(window).scroll(function () {
if(typeof buildCmd == 'function') {
// This is a content page with items and/or conversations
- if($(window).scrollTop() + $(window).height() > $(document).height() - 500) {
+ if($(window).scrollTop() + $(window).height() > $('#conversation-end').position().top) {
if((pageHasMoreContent) && (! loadingPage)) {
next_page++;
scroll_next = true;
@@ -1574,7 +1574,7 @@ $(window).scroll(function () {
}
else {
// This is some other kind of page - perhaps a directory
- if($(window).scrollTop() + $(window).height() > $(document).height() - 500) {
+ if($(window).scrollTop() + $(window).height() > $('#page-end').position().top) {
if((pageHasMoreContent) && (! loadingPage) && (! justifiedGalleryActive)) {
next_page++;
scroll_next = true;
diff --git a/view/js/mod_help.js b/view/js/mod_help.js
index 107845c04..9c3591498 100644
--- a/view/js/mod_help.js
+++ b/view/js/mod_help.js
@@ -14,7 +14,7 @@ toc = {};
$(document).ready(function () {
// Generate the table of contents in the side nav menu (see view/tpl/help.tpl)
$('#doco-top-toc').toc({content: "#doco-content", headings: "h3,h4,h5,h6"});
-
+
$(".doco-section").find('a').each(function () {
var url = document.createElement('a');
url.href = window.location;
@@ -31,8 +31,6 @@ $(document).ready(function () {
}
});
- $(document.body).trigger("sticky_kit:recalc");
-
toc.contentTop = [];
toc.edgeMargin = 20; // margin above the top or margin from the end of the page
toc.topRange = 200; // measure from the top of the viewport to X pixels down
@@ -72,7 +70,7 @@ $(document).ready(function () {
location.replace(newref)
}
-
+
// Determine language translations available from the language selector menu itself
var langChoices = [];
$('.lang-selector').find('.lang-choice').each(function (idx, a) {
@@ -89,7 +87,7 @@ $(document).ready(function () {
pathParts.push(help_language);
pick_me = false;
if($.inArray(path[i], langChoices) < 0) {
- i--;
+ i--;
}
}
} else {
@@ -97,20 +95,20 @@ $(document).ready(function () {
pathParts.push(path[i]);
}
}
-
+
}
// Update the address bar to reflect the loaded language
window.history.replaceState({}, '', '/' + pathParts.join('/'));
-
+
// Highlight the language in the language selector that is currently viewed
$('.lang-selector').find('.lang-choice:contains("' + help_language + '")').addClass('active');
-
+
// Construct the links to the available translations based and populate the selector menu
$('.lang-selector').find('.lang-choice').each(function (idx, a) {
var langLink = [];
for (var i = 0; i < pathParts.length; i++) {
-
+
if(i === 1) {
langLink.push($(a).html());
} else {
@@ -120,5 +118,5 @@ $(document).ready(function () {
}
$(a).attr('href', '/' + langLink.join('/'));
});
-
+
});
diff --git a/view/php/default.php b/view/php/default.php
index df9b02c4e..6f0735a11 100644
--- a/view/php/default.php
+++ b/view/php/default.php
@@ -12,12 +12,12 @@
<main>
<div class="content">
<div class="columns">
- <aside id="region_1"><div class="aside_spacer"><div id="left_aside_wrapper"><?php if(x($page,'aside')) echo $page['aside']; ?></div></div></aside>
+ <aside id="region_1"><div class="aside_spacer_top_left"></div><div class="aside_spacer_left"><div id="left_aside_wrapper" class="aside_wrapper"><?php if(x($page,'aside')) echo $page['aside']; ?></div></div></aside>
<section id="region_2"><?php if(x($page,'content')) echo $page['content']; ?>
<div id="page-footer"></div>
<div id="pause"></div>
</section>
- <aside id="region_3" class="d-none d-xl-block"><div class="aside_spacer"><div id="right_aside_wrapper"><?php if(x($page,'right_aside')) echo $page['right_aside']; ?></div></div></aside>
+ <aside id="region_3" class="d-none d-xl-block"><div class="aside_spacer_top_right"></div><div class="aside_spacer_right"><div id="right_aside_wrapper" class="aside_wrapper"><?php if(x($page,'right_aside')) echo $page['right_aside']; ?></div></div></aside>
</div>
</div>
</main>
diff --git a/view/php/theme_init.php b/view/php/theme_init.php
index a0118fa71..bf34f210a 100644
--- a/view/php/theme_init.php
+++ b/view/php/theme_init.php
@@ -20,7 +20,6 @@ head_add_js('autocomplete.js');
head_add_js('/library/jquery.timeago.js');
head_add_js('/library/readmore.js/readmore.js');
-head_add_js('/library/sticky-kit/sticky-kit.min.js');
head_add_js('/library/jgrowl/jquery.jgrowl.min.js');
head_add_js('/library/sjcl/sjcl.js');
diff --git a/view/theme/redbasic/js/redbasic.js b/view/theme/redbasic/js/redbasic.js
index 8d3b795cc..b0b8d5dfc 100644
--- a/view/theme/redbasic/js/redbasic.js
+++ b/view/theme/redbasic/js/redbasic.js
@@ -17,13 +17,8 @@ $(document).ready(function() {
}
$('#css3-calc').remove(); // Remove the test element
- if($(window).width() >= 992) {
- $('#left_aside_wrapper, #right_aside_wrapper').stick_in_parent({
- offset_top: parseInt($('aside').css('padding-top')),
- parent: 'main',
- spacer: '.aside_spacer'
- });
- }
+ 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);
@@ -33,24 +28,6 @@ $(document).ready(function() {
}
});
- var left_aside_height = $('#left_aside_wrapper').height();
-
- $('#left_aside_wrapper').on('click', function() {
- if(left_aside_height != $('#left_aside_wrapper').height()) {
- $(document.body).trigger("sticky_kit:recalc");
- left_aside_height = $('#left_aside_wrapper').height();
- }
- });
-
-
- var right_aside_height = $('#right_aside_wrapper').height();
-
- $('#right_aside_wrapper').on('click', function() {
- if(right_aside_height != $('#right_aside_wrapper').height()) {
- $(document.body).trigger("sticky_kit:recalc");
- right_aside_height = $('#right_aside_wrapper').height();
- }
- });
$('.usermenu').click(function() {
if($('#navbar-collapse-1, #navbar-collapse-2').hasClass('show')){
@@ -84,7 +61,7 @@ $(document).ready(function() {
var doctitle = document.title;
function checkNotify() {
var notifyUpdateElem = document.getElementById('notify-update');
- if(notifyUpdateElem !== null) {
+ if(notifyUpdateElem !== null) {
if(notifyUpdateElem.innerHTML !== "")
document.title = "(" + notifyUpdateElem.innerHTML + ") " + doctitle;
else
@@ -94,6 +71,58 @@ $(document).ready(function() {
setInterval(function () {checkNotify();}, 10 * 1000);
});
+function setStyle(element, cssProperty) {
+ for (var property in cssProperty){
+ element.style[property] = cssProperty[property];
+ }
+}
+
+function stickyScroll(sticky, stickyTop, container, topOffset, bottomOffset) {
+ var lastScrollTop = 0;
+ var sticky = document.querySelector(sticky);
+ var stickyHeight = sticky.getBoundingClientRect().height;
+ var stickyTop = document.querySelector(stickyTop);
+ var content = document.querySelector(container);
+ var diff = window.innerHeight - stickyHeight;
+ var h = 0;
+ var lasth = 0;
+ var st = window.pageYOffset || document.documentElement.scrollTop;
+
+ var resizeObserver = new ResizeObserver(function(entries) {
+ stickyHeight = sticky.getBoundingClientRect().height;
+ st = window.pageYOffset || document.documentElement.scrollTop;
+ diff = window.innerHeight - stickyHeight;
+ });
+
+ resizeObserver.observe(sticky);
+ resizeObserver.observe(content);
+
+ window.addEventListener('scroll', function() {
+ if(window.innerHeight > stickyHeight + topOffset) {
+ setStyle(stickyTop, { height: 0 + 'px' });
+ setStyle(sticky, { position: 'sticky', top: topOffset + 'px'});
+ }
+ else {
+ st = window.pageYOffset || document.documentElement.scrollTop; // Credits: "https://github.com/qeremy/so/blob/master/so.dom.js#L426"
+ if (st > lastScrollTop){
+ // downscroll code
+ setStyle(stickyTop, { height: lasth + 'px' });
+ setStyle(sticky, { position: 'sticky', top: Math.round(diff) - bottomOffset + 'px', bottom: '' });
+ } else {
+ // upscroll code
+ h = sticky.getBoundingClientRect().top - content.getBoundingClientRect().top - topOffset;
+ if(Math.round(stickyTop.getBoundingClientRect().height) === lasth) {
+ setStyle(stickyTop, { height: Math.round(h) + 'px' });
+ }
+ lasth = Math.round(h);
+ setStyle(sticky, { position: 'sticky', top: '', bottom: Math.round(diff - topOffset) + 'px' });
+ }
+ lastScrollTop = st <= 0 ? 0 : st; // For Mobile or negative scrolling
+ }
+ }, false);
+
+}
+
function makeFullScreen(full) {
if(typeof full=='undefined' || full == true) {
$('main').addClass('fullscreen');
@@ -104,7 +133,6 @@ function makeFullScreen(full) {
$('main').removeClass('fullscreen');
$('header, nav, aside, #fullscreen-btn').show();
$('#inline-btn').hide();
- $(document.body).trigger("sticky_kit:recalc");
}
}
@@ -114,16 +142,10 @@ function toggleAside() {
$('html, body').css('overflow-x', '');
$('main').removeClass('region_1-on')
$('#overlay').remove();
- $('#left_aside_wrapper').trigger("sticky_kit:detach");
}
else {
$('html, body').css('overflow-x', 'hidden');
$('main').addClass('region_1-on')
$('<div id="overlay"></div>').appendTo('section');
- $('#left_aside_wrapper').stick_in_parent({
- offset_top: parseInt($('aside').css('padding-top')),
- parent: 'main',
- spacer: '.aside_spacer'
- });
}
}
diff --git a/view/theme/redbasic/php/theme_init.php b/view/theme/redbasic/php/theme_init.php
index 5f73f6736..0ac580f0e 100644
--- a/view/theme/redbasic/php/theme_init.php
+++ b/view/theme/redbasic/php/theme_init.php
@@ -13,5 +13,3 @@ head_add_js('/library/bootbox/bootbox.min.js');
head_add_js('/library/bootstrap-tagsinput/bootstrap-tagsinput.js');
head_add_js('/library/datetimepicker/jquery.datetimepicker.js');
head_add_js('/library/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js');
-
-
diff --git a/view/tpl/directory_header.tpl b/view/tpl/directory_header.tpl
index 3ee9ee326..568e03cd0 100644
--- a/view/tpl/directory_header.tpl
+++ b/view/tpl/directory_header.tpl
@@ -16,7 +16,8 @@
{{foreach $entries as $entry}}
{{include file="direntry.tpl"}}
{{/foreach}}
- <div id="page-end"></div>
+ {{** make sure this element is at the bottom - we rely on that in endless scroll **}}
+ <div id="page-end" class="float-left w-100"></div>
</div>
<script>$(document).ready(function() { loadingPage = false;});</script>
<div id="page-spinner" class="spinner-wrapper">
diff --git a/view/tpl/notes.tpl b/view/tpl/notes.tpl
index 67da5ff37..4bee02aa0 100644
--- a/view/tpl/notes.tpl
+++ b/view/tpl/notes.tpl
@@ -16,7 +16,6 @@
$(document).ready(function(e){
noteText.on('change keyup keydown paste cut', function () {
noteText.height(0).height(noteText[0].scrollHeight);
- $(document.body).trigger("sticky_kit:recalc");
}).change();
});
diff --git a/view/tpl/notifications_widget.tpl b/view/tpl/notifications_widget.tpl
index 1a24ca7c4..1092bc155 100644
--- a/view/tpl/notifications_widget.tpl
+++ b/view/tpl/notifications_widget.tpl
@@ -137,7 +137,7 @@
}
</script>
-<div id="notifications_wrapper">
+<div id="notifications_wrapper" class="mb-4">
<div id="no_notifications" class="d-xl-none">
{{$no_notifications}}<span class="jumping-dots"><span class="dot-1">.</span><span class="dot-2">.</span><span class="dot-3">.</span></span>
</div>
@@ -154,7 +154,7 @@
<span class="float-right badge badge-secondary">{10}</span>
<img class="menu-img-1" data-src="{1}" loading="lazy">
<span class="">{2}</span>
- <i class="fa fa-{11} text-muted"></i>
+ <i class="fa fa-{11} text-muted"></i>
</a>
</div>
<div id="notifications" class="border border-bottom-0 rounded navbar-nav collapse">
diff --git a/view/tpl/photo_album.tpl b/view/tpl/photo_album.tpl
index eb16bcc98..ad4e2a38c 100644
--- a/view/tpl/photo_album.tpl
+++ b/view/tpl/photo_album.tpl
@@ -18,12 +18,13 @@
</div>
{{$upload_form}}
{{$album_edit.1}}
- <div class="section-content-wrapper-np">
+ <div class="section-content-wrapper-np clearfix">
<div id="photo-album-contents-{{$album_id}}" style="display: none">
{{foreach $photos as $photo}}
{{include file="photo_top.tpl"}}
{{/foreach}}
- <span id="page-end"></span>
+ {{** make sure this element is at the bottom - we rely on that for endless scroll **}}
+ <span id="page-end" class="d-block float-left w-100" style="position: absolute; bottom: 0px"></span>
</div>
</div>
</div>
diff --git a/view/tpl/photos_recent.tpl b/view/tpl/photos_recent.tpl
index 1e2f22e33..63c8b3515 100644
--- a/view/tpl/photos_recent.tpl
+++ b/view/tpl/photos_recent.tpl
@@ -9,12 +9,13 @@
<div class="clear"></div>
</div>
{{$upload_form}}
- <div class="section-content-wrapper-np">
+ <div class="section-content-wrapper-np clearfix">
<div id="photo-album-contents-{{$album_id}}" style="display: none">
{{foreach $photos as $photo}}
{{include file="photo_top.tpl"}}
{{/foreach}}
- <span id="page-end"></span>
+ {{** make sure this element is at the bottom - we rely on that in endless scroll **}}
+ <span id="page-end" class="d-block float-left w-100" style="position: absolute; bottom: 0px"></span>
</div>
</div>
</div>
diff --git a/view/tpl/viewcontact_template.tpl b/view/tpl/viewcontact_template.tpl
index 005fe17ce..cbbf3a97c 100644
--- a/view/tpl/viewcontact_template.tpl
+++ b/view/tpl/viewcontact_template.tpl
@@ -6,7 +6,8 @@
{{foreach $contacts as $contact}}
{{include file="contact_template.tpl"}}
{{/foreach}}
- <div id="page-end"></div>
+ {{** make sure this element is at the bottom - we rely on that in endless scroll **}}
+ <div id="page-end" class="float-left w-100"></div>
</div>
</div>
<script>$(document).ready(function() { loadingPage = false;});</script>
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-29 10:20:18 +0000