mirrors/calibre-web
1
0
Fork 0
mirror of https://github.com/janeczku/calibre-web synced 2024-11-24 10:37:23 +00:00
Code Issues Releases Wiki Activity

Fix progress bar direction

Browse Source
This commit is contained in:
BuildTools 2021-04-18 04:25:45 +09:00
parent 0138294b36
commit 755eb1405b
3 changed files with 38 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
cps/static/css/kthoom.css
View File

@ -84,15 +84,24 @@ body {
#progress .bar-load,
#progress .bar-read {
display: flex;
align-items: flex-end;
justify-content: flex-end;
position: absolute;
top: 0;
left: 0;
bottom: 0;
transition: width 150ms ease-in-out;
}
#progress .from-left {
left: 0;
align-items: flex-end;
justify-content: flex-end;
}
#progress .from-right {
right: 0;
align-items: flex-start;
justify-content: flex-start;
}
#progress .bar-load {
color: #000;
background-color: #ccc;

30
cps/static/js/kthoom.js
View File

@ -171,7 +171,10 @@ kthoom.ImageFile = function(file) {
function initProgressClick() {
$("#progress").click(function(e) {
var page = Math.max(1, Math.ceil((e.offsetX / $(this).width()) * totalImages)) - 1;
var offset = $(this).offset();
var x = e.pageX - offset.left;
var rate = settings.direction === 0 ? x / $(this).width() : 1 - x / $(this).width();
var page = Math.max(1, Math.ceil(rate * totalImages)) - 1;
currentImage = page;
updatePage();
});
@ -285,6 +288,22 @@ function updatePage() {
}
function updateProgress(loadPercentage) {
if (settings.direction === 0) {
$("#progress .bar-read")
.removeClass("from-right")
.addClass("from-left");
$("#progress .bar-load")
.removeClass("from-right")
.addClass("from-left");
} else {
$("#progress .bar-read")
.removeClass("from-left")
.addClass("from-right");
$("#progress .bar-load")
.removeClass("from-left")
.addClass("from-right");
}
// Set the load/unzip progress if it's passed in
if (loadPercentage) {
$("#progress .bar-load").css({ width: loadPercentage + "%" });
@ -526,18 +545,17 @@ function keyHandler(evt) {
break;
case kthoom.Key.SPACE:
var container = $("#mainContent");
var atTop = container.scrollTop() === 0;
var atBottom = container.scrollTop() >= container[0].scrollHeight - container.height();
// var atTop = container.scrollTop() === 0;
// var atBottom = container.scrollTop() >= container[0].scrollHeight - container.height();
if (evt.shiftKey && atTop) {
if (evt.shiftKey) {
evt.preventDefault();
// If it's Shift + Space and the container is at the top of the page
showPrevPage();
} else if (!evt.shiftKey && atBottom) {
} else {
evt.preventDefault();
// If you're at the bottom of the page and you only pressed space
showNextPage();
container.scrollTop(0);
}
break;
default:

4
cps/templates/readcbr.html
View File

@ -60,12 +60,12 @@
<a id="fullscreen" class="icon-resize-full">Fullscreen</a>
</div>
<div id="progress" role="progressbar" class="loading">
<div class="bar-load">
<div class="bar-load from-left">
<div class="text load">
Loading...
</div>
</div>
<div class="bar-read">
<div class="bar-read from-left">
<div class="text page"></div>
</div>
</div>