Fix declaration order
This commit is contained in:
parent
7299157521
commit
f1cfb326d5
235
melpomene.js
235
melpomene.js
|
|
@ -64,6 +64,63 @@ var MOUSEWHELL_WAIT = false;
|
||||||
// UTILITIES
|
// UTILITIES
|
||||||
// =============
|
// =============
|
||||||
|
|
||||||
|
// Dimensions utilites
|
||||||
|
// -------------------
|
||||||
|
|
||||||
|
function getPagesCount()
|
||||||
|
{
|
||||||
|
return READER_PAGES.childElementCount;
|
||||||
|
}
|
||||||
|
|
||||||
|
function pageOriginalHeight(pageNumber)
|
||||||
|
{
|
||||||
|
return READER_PAGES.children[pageNumber - 1].naturalHeight;
|
||||||
|
}
|
||||||
|
|
||||||
|
function pageOriginalWidth(pageNumber)
|
||||||
|
{
|
||||||
|
return READER_PAGES.children[pageNumber - 1].naturalWidth;
|
||||||
|
}
|
||||||
|
|
||||||
|
function readerFrameRatio()
|
||||||
|
{
|
||||||
|
return READER_CONTENT_FRAME.clientWidth / READER_CONTENT_FRAME.clientHeight;
|
||||||
|
}
|
||||||
|
|
||||||
|
function pageMaxHeight()
|
||||||
|
{
|
||||||
|
let maxHeight = 0;
|
||||||
|
|
||||||
|
for (let i = 0; i < READER_PAGES.children.length; i += 1)
|
||||||
|
{
|
||||||
|
if(READER_PAGES.children[i].naturalHeight > maxHeight)
|
||||||
|
{
|
||||||
|
maxHeight = READER_PAGES.children[i].naturalHeight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return maxHeight;
|
||||||
|
}
|
||||||
|
|
||||||
|
function pageVerticalOffset(pageNumber)
|
||||||
|
{
|
||||||
|
return ( pageMaxHeight() - pageOriginalHeight(pageNumber) ) / 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
function previousPagesWidth(pageNumber)
|
||||||
|
{
|
||||||
|
// The width of all previous pages relative to the provided index
|
||||||
|
|
||||||
|
let totalWidth = 0;
|
||||||
|
|
||||||
|
for (let idx = 0; idx < pageNumber - 1; idx += 1)
|
||||||
|
{
|
||||||
|
totalWidth += READER_PAGES.children[idx].naturalWidth;
|
||||||
|
}
|
||||||
|
|
||||||
|
return totalWidth;
|
||||||
|
}
|
||||||
|
|
||||||
// Zooms utilites
|
// Zooms utilites
|
||||||
// --------------
|
// --------------
|
||||||
|
|
||||||
|
|
@ -167,121 +224,21 @@ function updateProgressBar()
|
||||||
PROGRESS_BAR.style.width = getReadingProgressPercent() + "%";
|
PROGRESS_BAR.style.width = getReadingProgressPercent() + "%";
|
||||||
}
|
}
|
||||||
|
|
||||||
// Dimensions utilites
|
|
||||||
// -------------------
|
|
||||||
|
|
||||||
function getPagesCount()
|
|
||||||
{
|
|
||||||
return READER_PAGES.childElementCount;
|
|
||||||
}
|
|
||||||
|
|
||||||
function pageOriginalHeight(pageNumber)
|
|
||||||
{
|
|
||||||
return READER_PAGES.children[pageNumber - 1].naturalHeight;
|
|
||||||
}
|
|
||||||
|
|
||||||
function pageOriginalWidth(pageNumber)
|
|
||||||
{
|
|
||||||
return READER_PAGES.children[pageNumber - 1].naturalWidth;
|
|
||||||
}
|
|
||||||
|
|
||||||
function readerFrameRatio()
|
|
||||||
{
|
|
||||||
return READER_CONTENT_FRAME.clientWidth / READER_CONTENT_FRAME.clientHeight;
|
|
||||||
}
|
|
||||||
|
|
||||||
function pageMaxHeight()
|
|
||||||
{
|
|
||||||
let maxHeight = 0;
|
|
||||||
|
|
||||||
for (let i = 0; i < READER_PAGES.children.length; i += 1)
|
|
||||||
{
|
|
||||||
if(READER_PAGES.children[i].naturalHeight > maxHeight)
|
|
||||||
{
|
|
||||||
maxHeight = READER_PAGES.children[i].naturalHeight;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return maxHeight;
|
|
||||||
}
|
|
||||||
|
|
||||||
function pageVerticalOffset(pageNumber)
|
|
||||||
{
|
|
||||||
return ( pageMaxHeight() - pageOriginalHeight(pageNumber) ) / 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
function previousPagesWidth(pageNumber)
|
|
||||||
{
|
|
||||||
// The width of all previous pages relative to the provided index
|
|
||||||
|
|
||||||
let totalWidth = 0;
|
|
||||||
|
|
||||||
for (let idx = 0; idx < pageNumber - 1; idx += 1)
|
|
||||||
{
|
|
||||||
totalWidth += READER_PAGES.children[idx].naturalWidth;
|
|
||||||
}
|
|
||||||
|
|
||||||
return totalWidth;
|
|
||||||
}
|
|
||||||
|
|
||||||
// =========
|
// =========
|
||||||
// ACTIONS
|
// ACTIONS
|
||||||
// =========
|
// =========
|
||||||
|
|
||||||
function initReader()
|
function updateFocusByWidth(width)
|
||||||
{
|
{
|
||||||
VERSION_DISPLAY.innerText = VERSION_DISPLAY.innerText.replace("Unknown version", MELPOMENE_VERSION);
|
FOCUS_OVERLAY_WIDTH.style.width = `${width / READER_CONTENT_FRAME.clientWidth * 100}%`;
|
||||||
|
FOCUS_OVERLAY_HEIGHT.style.height = "100%";
|
||||||
loadZoomsFromImgTagsIfRequired();
|
|
||||||
moveReaderDisplayToZoom(0);
|
|
||||||
|
|
||||||
// Smoothly show pictures when they intersect with the viewport
|
|
||||||
const visibilityObserver = new IntersectionObserver(
|
|
||||||
(entries, _observer) =>
|
|
||||||
{
|
|
||||||
entries.forEach((entry) =>
|
|
||||||
{
|
|
||||||
if (entry.isIntersecting)
|
|
||||||
{
|
|
||||||
entry.target.style.opacity = 1;
|
|
||||||
entry.target.style.visibility = "visible";
|
|
||||||
}
|
}
|
||||||
|
|
||||||
else
|
function updateFocusByHeight(height)
|
||||||
{
|
{
|
||||||
entry.target.style.opacity = 0;
|
FOCUS_OVERLAY_WIDTH.style.width = "100%";
|
||||||
entry.target.style.visibility = "hidden";
|
FOCUS_OVERLAY_HEIGHT.style.height = `${height / READER_CONTENT_FRAME.clientHeight * 100}%`;
|
||||||
}
|
}
|
||||||
});
|
|
||||||
},
|
|
||||||
{ root: READER_CONTENT_FRAME, rootMargin: "-10px" }
|
|
||||||
);
|
|
||||||
|
|
||||||
for (let i = 0; i < READER_PAGES.children.length; i += 1)
|
|
||||||
{
|
|
||||||
const img = READER_PAGES.children[i];
|
|
||||||
visibilityObserver.observe(img);
|
|
||||||
|
|
||||||
PROGRESS_BAR_PAGES.appendChild(document.createElement("div"));
|
|
||||||
}
|
|
||||||
|
|
||||||
READER_PAGES.style.display = "flex";
|
|
||||||
|
|
||||||
setTimeout(
|
|
||||||
() => { READER_PAGES.hidden = false },
|
|
||||||
"300"
|
|
||||||
);
|
|
||||||
|
|
||||||
setTimeout(
|
|
||||||
() =>
|
|
||||||
{
|
|
||||||
HELP_CONTROLS.style.opacity = null;
|
|
||||||
HELP_CONTROLS.style.transform = null;
|
|
||||||
},
|
|
||||||
DELAY_BEFORE_HIDDING_CONTROLS
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function moveReaderDisplayToArea(pageNumber, oWidth, oHeight, oPosx, oPosy)
|
function moveReaderDisplayToArea(pageNumber, oWidth, oHeight, oPosx, oPosy)
|
||||||
{
|
{
|
||||||
|
|
@ -400,18 +357,6 @@ function moveReaderDisplayToZoom(index)
|
||||||
CURRENT_ZOOM = index;
|
CURRENT_ZOOM = index;
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateFocusByWidth(width)
|
|
||||||
{
|
|
||||||
FOCUS_OVERLAY_WIDTH.style.width = `${width / READER_CONTENT_FRAME.clientWidth * 100}%`;
|
|
||||||
FOCUS_OVERLAY_HEIGHT.style.height = "100%";
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateFocusByHeight(height)
|
|
||||||
{
|
|
||||||
FOCUS_OVERLAY_WIDTH.style.width = "100%";
|
|
||||||
FOCUS_OVERLAY_HEIGHT.style.height = `${height / READER_CONTENT_FRAME.clientHeight * 100}%`;
|
|
||||||
}
|
|
||||||
|
|
||||||
function toggleViewMode()
|
function toggleViewMode()
|
||||||
{
|
{
|
||||||
if (IS_PAGE_MODE)
|
if (IS_PAGE_MODE)
|
||||||
|
|
@ -474,6 +419,60 @@ function moveReader(toNext)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function initReader()
|
||||||
|
{
|
||||||
|
VERSION_DISPLAY.innerText = VERSION_DISPLAY.innerText.replace("Unknown version", MELPOMENE_VERSION);
|
||||||
|
|
||||||
|
loadZoomsFromImgTagsIfRequired();
|
||||||
|
moveReaderDisplayToZoom(0);
|
||||||
|
|
||||||
|
// Smoothly show pictures when they intersect with the viewport
|
||||||
|
const visibilityObserver = new IntersectionObserver(
|
||||||
|
(entries, _observer) =>
|
||||||
|
{
|
||||||
|
entries.forEach((entry) =>
|
||||||
|
{
|
||||||
|
if (entry.isIntersecting)
|
||||||
|
{
|
||||||
|
entry.target.style.opacity = 1;
|
||||||
|
entry.target.style.visibility = "visible";
|
||||||
|
}
|
||||||
|
|
||||||
|
else
|
||||||
|
{
|
||||||
|
entry.target.style.opacity = 0;
|
||||||
|
entry.target.style.visibility = "hidden";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
{ root: READER_CONTENT_FRAME, rootMargin: "-10px" }
|
||||||
|
);
|
||||||
|
|
||||||
|
for (let i = 0; i < READER_PAGES.children.length; i += 1)
|
||||||
|
{
|
||||||
|
const img = READER_PAGES.children[i];
|
||||||
|
visibilityObserver.observe(img);
|
||||||
|
|
||||||
|
PROGRESS_BAR_PAGES.appendChild(document.createElement("div"));
|
||||||
|
}
|
||||||
|
|
||||||
|
READER_PAGES.style.display = "flex";
|
||||||
|
|
||||||
|
setTimeout(
|
||||||
|
() => { READER_PAGES.hidden = false },
|
||||||
|
"300"
|
||||||
|
);
|
||||||
|
|
||||||
|
setTimeout(
|
||||||
|
() =>
|
||||||
|
{
|
||||||
|
HELP_CONTROLS.style.opacity = null;
|
||||||
|
HELP_CONTROLS.style.transform = null;
|
||||||
|
},
|
||||||
|
DELAY_BEFORE_HIDDING_CONTROLS
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// =============
|
// =============
|
||||||
// CALLBACKS
|
// CALLBACKS
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue