no problem dude @phenomlab
I put a modification here that seems to work as a reminder if you don’t mind.
–> If yes, you can delete it.
use $('html, body').animate({ scrollTop: 0 }, '300');
to smoothly scroll the page to the top when the #pageUp
button is clicked. This code will provide a smooth scrolling effect from the bottom to the top of the page without reloading it.
What do you think of this?
// Scroll to top function
$(window).on('action:ajaxify.end', function(data) {
var matched = false;
$(document).ready(function() {
var pageUp = $('#pageUp');
var bar = $('.reading-meter');
var perWidth = $('.reading-meter').width();
// Main progressbar function
function pageScroller() {
var winScroll = document.body.scrollTop || document.documentElement.scrollTop;
var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
var scrolled = (winScroll / height) * 100;
document.getElementById("progress-bar").style.width = parseFloat(scrolled).toFixed(0) + "%";
$('#percentage').val(parseFloat(scrolled).toFixed(0) + "%");
// Prevent the mouse scroll wheel from scrolling down after the pageUp button is clicked
if ($('#pageUp').is(':focus')) {
event.preventDefault();
}
}
// Bind the pageScroller function to the window's scroll event
$(window).scroll(function() {
pageScroller();
});
// Check the URL and composer visibility separately from the scroll event
function checkURL() {
var thisURL = window.location.href;
var checkArray = ["topic", "notifications", "user"];
var isFound = false;
for (var i = 0, len = checkArray.length; i < len; i++) {
if (thisURL.indexOf(checkArray[i]) > -1) {
isFound = true;
break;
}
}
return isFound;
}
// Function to update visibility based on URL and composer
function updateVisibility() {
if (checkURL()) {
bar.removeClass('show');
pageUp.removeClass('show');
} else {
// Exception here is that we don't want the scroll bar to show when the composer is active
if ($(window).scrollTop() > 0 && (!$('[component="composer"]').is(":visible"))) {
bar.addClass('show');
pageUp.addClass('show');
} else {
bar.removeClass('show');
pageUp.removeClass('show');
}
}
}
// Call updateVisibility initially
updateVisibility();
// Bind updateVisibility function to the window's scroll event
$(window).scroll(function() {
updateVisibility();
});
// Scroll to top when #pageUp is clicked
$(document).on("click", "#pageUp", function(e) {
$('html, body').animate({ scrollTop: 0 }, '300'); // Animate scrolling to top
$('#progress-bar').width(0);
pageUp.removeClass('show');
});
});
});