Fix: Some bugs

CHANGELOG.md

@@ -21,7 +21,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 - Blank page keep white color in dark theme [`8d1a5b7`](https://github.com/ollm/OpenComic/commit/8d1a5b741855fd0bae6a7efd9579c7ddecbfd3d1)
 - Open with OpenComic not working in macOS and some fixes in Windows and Linux [`ea90063`](https://github.com/ollm/OpenComic/commit/ea9006309eee995c92571e0bc4c919d50de8e55b)
 - Error opening an epub when OpenComic is closed [`84c838a`](https://github.com/ollm/OpenComic/commit/84c838a17a32b3f50e9b25bf016ea810c91d95e6)
-- Performance issues when generating some thumbnails
+- Performance issues when generating some thumbnails [`1a07d2d`](https://github.com/ollm/OpenComic/commit/1a07d2d9ad462e56fbd5e592b71868013d10aa12)
 
 ## [v1.0.0-beta.5](https://github.com/ollm/OpenComic/releases/tag/v1.0.0-beta.5) (24-11-2023)
 

scripts/dom.js

@@ -123,12 +123,12 @@ function addImageToDom(querySelector, path, animation = true)
 	let src = dom.queryAll('.fi-sha-'+querySelector+' img, .sha-'+querySelector+' img, img.fi-sha-'+querySelector).setAttribute('src', path);
 
 	let ri = dom.queryAll('.ri-sha-'+querySelector).setAttribute('src', path);
-	let cr = dom.queryAll('.continue-reading-sha-'+querySelector+', .search-result-sha-'+querySelector).css({backgroundImage: backgroundImage});
+	let imageBackground = dom.queryAll('.sha-image-bg-'+querySelector).css({backgroundImage: backgroundImage});
 
 	if(animation)
 	{
 		src.addClass('a', 'border');
-		cr.addClass('a');
+		imageBackground.addClass('a');
 	}
 	else
 	{

scripts/ebook.js

@@ -1309,6 +1309,15 @@ async function createRender(callback)
 	return win;
 }
 
+async function showRenders()
+{
+	for(let i = 0, len = renders.length; i < len; i++)
+	{
+		renders[i].render.show();
+		renders[i].render.setPosition(i * 100, 0)
+	}
+}
+
 var closeAllRendersST = false;
 
 function closeAllRendersDelayed()
@@ -1376,5 +1385,6 @@ module.exports = {
 	closeAllRenders: closeAllRenders,
 	renders: function(){return renders},
 	renderQueue: function(){return renderQueue},
+	showRenders: showRenders,
 	epub: false,
 }

scripts/ebook/render.js

@@ -18,7 +18,16 @@ window.onload = function() {
 
 }
 
-var renderPageIframe;
+function removeDocumentIframes()
+{
+	// Remove prev iframes
+	let iframes = document.querySelectorAll('iframe');
+
+	for(let i = 0, len = iframes.length; i < len; i++)
+	{
+		iframes[i].remove();
+	}
+}
 
 async function process(data)
 {
@@ -29,19 +38,29 @@ async function process(data)
 
 		ipcRenderer.send('rendered-ebook', data.index, pages);
 
+		removeDocumentIframes();
 	}
 	else if(data.type == 'render-page')
 	{
-		if(renderPageIframe) renderPageIframe.remove();
+		removeDocumentIframes();
 
 		book.updateConfig(data.config);
 		let pages = await book.splitInPages(data.html.documentElement, data.basePath, data.path);
 
-		renderPageIframe = book.pageToIframe(pages[0].html);
+		let renderPageIframe = book.pageToIframe(pages[0].html);
 
 		renderPageIframe.addEventListener('load', function(event) {
 
-			ipcRenderer.send('rendered-page', data.index, pages);
+			// Delay this to avoid white pages or pages from prev iframe
+			window.requestAnimationFrame(function(){
+
+				window.requestAnimationFrame(function(){
+
+					ipcRenderer.send('rendered-page', data.index, pages);
+
+				});
+
+			});
 
 		});
 

scripts/file-manager.js

@@ -659,7 +659,7 @@ var file = function(path) {
 			this.macosScopedResources[i]();
 		}
 
-		delete this.macosScopedResources;
+		this.macosScopedResources = [];
 
 	};
 }
@@ -2317,7 +2317,7 @@ var fileCompressed = function(path, _realPath = false, forceType = false, prefix
 			this.macosScopedResources[i]();
 		}
 
-		delete this.macosScopedResources;
+		this.macosScopedResources = [];
 
 	}
 

scripts/reading.js

@@ -805,11 +805,11 @@ function goToImageCL(index, animation = true, fromScroll = false, fromPageRange
 }
 
 //Go to a specific comic image
-function goToImage(imageIndex, bookmarks = false)
+function goToImage(imageIndex, disableSave = false)
 {
 	if(typeof imagesData[imageIndex] !== 'undefined')
 	{
-		if(!bookmarks)
+		if(!disableSave)
 			saveReadingProgressA = true;
 
 		readingDirection = true;
@@ -3008,6 +3008,8 @@ function loadBookmarks(bookmarksChild = false)
 {
 	var bookmarksPath = {}, mainPath = dom.indexMainPathA();
 
+	let images = [];
+
 	for(let key in readingCurrentBookmarks)
 	{
 		if(typeof readingCurrentBookmarks[key].path != 'undefined')
@@ -3019,12 +3021,7 @@ function loadBookmarks(bookmarksChild = false)
 			if(typeof bookmarksPath[bookmarkDirname] === 'undefined') bookmarksPath[bookmarkDirname] = [];
 
 			let sha = sha1(bookmark.path);
-
-			let thumbnail = cache.returnThumbnailsImages({path: bookmark.path, sha: sha}, function(data) {
-
-				dom.addImageToDom(data.sha, data.path);
-
-			});
+			images.push({path: bookmark.path, sha: sha});
 
 			let name = p.basename(bookmark.path);
 			let chapterIndex = app.extract(/^([0-9]+):sortonly/, name, 1);
@@ -3035,7 +3032,6 @@ function loadBookmarks(bookmarksChild = false)
 				index: (bookmarkDirname !== readingCurrentPath) ? bookmark.index : imagesPath[bookmark.path],
 				sha: sha,
 				mainPath: mainPath,
-				thumbnail: (thumbnail.cache) ? thumbnail.path : '',
 				path: bookmark.path,
 				chapterIndex: chapterIndex,
 				ebook: bookmark.ebook,
@@ -3074,12 +3070,7 @@ function loadBookmarks(bookmarksChild = false)
 		let bookmarkDirname = p.dirname(readingProgress.path);
 
 		let sha = sha1(readingProgress.path);
-
-		let thumbnail = cache.returnThumbnailsImages({path: readingProgress.path, sha: sha}, function(data){
-
-			dom.addImageToDom(data.sha, data.path);
-
-		});
+		images.push({path: readingProgress.path, sha: sha});
 
 		bookmarks.push({
 			continueReading: true,
@@ -3091,12 +3082,26 @@ function loadBookmarks(bookmarksChild = false)
 				index: readingProgress.index,
 				sha: sha,
 				mainPath: readingProgress.mainPath,
-				thumbnail: (thumbnail.cache) ? thumbnail.path : '',
 				path: readingProgress.path,
 			}],
 		});
 	}
 
+	let thumbnails = cache.returnThumbnailsImages(images, function(data) {
+
+		dom.addImageToDom(data.sha, data.path);
+
+	}, readingFile);
+
+	for(let i = 0, len = bookmarks.length; i < len; i++)
+	{
+		for(let i2 = 0, len2 = bookmarks[i].bookmarks.length; i2 < len2; i2++)
+		{
+			let thumbnail = thumbnails[bookmarks[i].bookmarks[i2].sha] || {};
+			bookmarks[i].bookmarks[i2].thumbnail = (thumbnail.cache) ? thumbnail.path : '';
+		}
+	}
+
 	bookmarks.sort(function (a, b) {
 
 		if(a.current || a.continueReading) return -1;
@@ -3732,7 +3737,7 @@ async function generateEbookPages(end = false, reset = false, fast = false, imag
 
 	images = {}, imagesData = {}, imagesDataClip = {}, imagesPath = {}, imagesNum = 0, contentNum = 0, pageRangeHistory = [];
 
-	let ebookPages = await readingFile.ebookPages(ebookConfig);
+	let ebookPages = await readingFileC.ebookPages(ebookConfig);
 
 	if(hasGenerateEbookPages === 1) // Priorize last generateEbookPages request
 	{
@@ -3768,12 +3773,12 @@ async function generateEbookPages(end = false, reset = false, fast = false, imag
 			});
 		}
 
-		_ebook = await readingFile.ebook();
+		_ebook = await readingFileC.ebook();
 
 		if(reset)
 			await render.reset();
 		else
-			await render.setFile(readingFile, false, 'ebook');
+			await render.setFile(readingFileC, false, 'ebook');
 
 		render.setImagesData(imagesData);
 		filters.setImagesPath(imagesPath, readingCurrentPath);
@@ -4140,7 +4145,7 @@ function mouseleave()
 	isMouseenter.document = false;
 }
 
-var touchTimeout, mouseout = {lens: false, body: false, window: false}, isMouseenter = {document: true}, touchStart = false, magnifyingGlassOffset = false, readingCurrentPath = false, readingCurrentBookmarks = undefined, zoomMoveData = {}, magnifyingGlassScroll = {scrollTop: false, time: 0}, readingDragScroll = false, gamepadScroll = false, readingIsCanvas = false, readingIsEbook = false, readingFile = false, gamepadAxesNow = 0, scrollInStart = false, scrollInEnd = false, trackingCurrent = false;
+var touchTimeout, mouseout = {lens: false, body: false, window: false}, isMouseenter = {document: true}, touchStart = false, magnifyingGlassOffset = false, readingCurrentPath = false, readingCurrentBookmarks = undefined, zoomMoveData = {}, magnifyingGlassScroll = {scrollTop: false, time: 0}, readingDragScroll = false, gamepadScroll = false, readingIsCanvas = false, readingIsEbook = false, readingFile = false, readingFileC = false, gamepadAxesNow = 0, scrollInStart = false, scrollInEnd = false, trackingCurrent = false;
 
 //It starts with the reading of a comic, events, argar images, counting images ...
 async function read(path, index = 1, end = false, isCanvas = false, isEbook = false, imagePath = false)
@@ -4695,10 +4700,16 @@ async function read(path, index = 1, end = false, isCanvas = false, isEbook = fa
 	readingIsCanvas = isCanvas;
 	readingIsEbook = isEbook;
 
+	if(readingFile) readingFile.destroy();
+	if(readingFileC) readingFileC.destroy();
+
+	readingFile = fileManager.file();
+	readingFileC = false;
+
 	if(isCanvas)
 	{
-		readingFile = fileManager.fileCompressed(path);
-		await render.setFile(readingFile, (config.readingMagnifyingGlass ? config.readingMagnifyingGlassZoom : false));
+		readingFileC = fileManager.fileCompressed(path);
+		await render.setFile(readingFileC, (config.readingMagnifyingGlass ? config.readingMagnifyingGlassZoom : false));
 
 		let _images = template.contentRight('.reading-body oc-img canvas').get();
 
@@ -4742,12 +4753,11 @@ async function read(path, index = 1, end = false, isCanvas = false, isEbook = fa
 	}
 	else if(isEbook)
 	{
-		readingFile = fileManager.fileCompressed(path);
+		readingFileC = fileManager.fileCompressed(path);
 		await generateEbookPages(end, false, false, imagePath);
 	}
 	else
 	{
-		readingFile = false;
 		render.setFile(false);
 
 		template.contentRight('.reading-body img').each(function() {

scripts/reading/render.js

@@ -306,14 +306,21 @@ async function render(index, _scale = false, magnifyingGlass = false)
 			let ocImg = contentRight.querySelector('.r-img-i'+index+' oc-img');
 			let ocImgMG = contentRight.querySelector('.reading-lens .r-img-i'+index+' oc-img');
 
-			let prevIframe = ocImg.querySelector('iframe');
-			if(prevIframe) prevIframe.remove();
+			if(ocImg)
+			{
+				let prevIframe = ocImg.querySelector('iframe');
+				if(prevIframe) prevIframe.remove();
 
-			let prevIframeMG = ocImgMG.querySelector('iframe');
-			if(prevIframeMG) prevIframeMG.remove();
+				ocImg.appendChild(iframe);
+			}
 
-			ocImg.appendChild(iframe);
-			ocImgMG.appendChild(iframeMG);
+			if(ocImgMG)
+			{
+				let prevIframeMG = ocImgMG.querySelector('iframe');
+				if(prevIframeMG) prevIframeMG.remove();
+
+				ocImgMG.appendChild(iframeMG);
+			}
 
 			if(ebookConfigChanged)
 			{

scripts/storage.js

@@ -477,10 +477,12 @@ var throttles = {};
 var debounces = {};
 
 // Improve save perfomance in places that do not require instantaneous save
-async function setThrottle(key)
+async function setThrottle(key, value)
 {
 	clearTimeout(throttles[key]);
 
+	storageJson[key] = value;
+
 	throttles[key] = setTimeout(function(){
 
 		clearTimeout(debounces[key]);

templates/index.content.right.list.html

@@ -2,15 +2,15 @@
 	{{#if comicsReadingProgress}}
 	<div class="continue-reading gamepad-item body-medium" onclick="{{#if comicsReadingProgress.ebook}}reading.setNextOpenChapterProgress({{comicsReadingProgress.chapterIndex}}, {{comicsReadingProgress.chapterProgress}});{{/if}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.mainPath}}');">
 		<div>
-			<div class="continue-reading-sha-{{comicsReadingProgress.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.thumbnail}});"></div>
+			<div class="sha-image-bg-{{comicsReadingProgress.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.thumbnail}});"></div>
 			<span>{{language.comics.continueReading}}:&nbsp&nbsp&nbsp{{{comicsReadingProgress.pathText}}}</span>
 		</div>
 	</div>
 	{{/if}}
 	{{#if comicsReadingProgressCurrentPath}}
 	<div class="continue-reading gamepad-item body-medium" onclick="{{#if comicsReadingProgressCurrentPath.ebook}}reading.setNextOpenChapterProgress({{comicsReadingProgressCurrentPath.chapterIndex}}, {{comicsReadingProgressCurrentPath.chapterProgress}});{{/if}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.mainPath}}');">
 		<div>
-			<div class="continue-reading-sha-{{comicsReadingProgressCurrentPath.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.thumbnail}});"></div>
+			<div class="sha-image-bg-{{comicsReadingProgressCurrentPath.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.thumbnail}});"></div>
 			<span>{{language.comics.continueReading}}:&nbsp&nbsp&nbsp{{{comicsReadingProgressCurrentPath.pathText}}}</span>
 		</div>
 	</div>

templates/index.content.right.module.html

@@ -2,15 +2,15 @@
 	{{#if comicsReadingProgress}}
 	<div class="continue-reading gamepad-item body-medium" onclick="{{#if comicsReadingProgress.ebook}}reading.setNextOpenChapterProgress({{comicsReadingProgress.chapterIndex}}, {{comicsReadingProgress.chapterProgress}});{{/if}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.mainPath}}');">
 		<div>
-			<div class="continue-reading-sha-{{comicsReadingProgress.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.thumbnail}});"></div>
+			<div class="sha-image-bg-{{comicsReadingProgress.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgress.thumbnail}});"></div>
 			<span>{{language.comics.continueReading}}:&nbsp&nbsp&nbsp{{{comicsReadingProgress.pathText}}}</span>
 		</div>
 	</div>
 	{{/if}}
 	{{#if comicsReadingProgressCurrentPath}}
 	<div class="continue-reading gamepad-item body-medium" onclick="{{#if comicsReadingProgressCurrentPath.ebook}}reading.setNextOpenChapterProgress({{comicsReadingProgressCurrentPath.chapterIndex}}, {{comicsReadingProgressCurrentPath.chapterProgress}});{{/if}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.mainPath}}');">
 		<div>
-			<div class="continue-reading-sha-{{comicsReadingProgressCurrentPath.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.thumbnail}});"></div>
+			<div class="sha-image-bg-{{comicsReadingProgressCurrentPath.sha}}" style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' comicsReadingProgressCurrentPath.thumbnail}});"></div>
 			<span>{{language.comics.continueReading}}:&nbsp&nbsp&nbsp{{{comicsReadingProgressCurrentPath.pathText}}}</span>
 		</div>
 	</div>

templates/reading.elements.menus.collections.bookmarks.html

@@ -8,7 +8,7 @@
 			</div>
 			{{#each bookmarks}}
 				<div class="reading-bookmark{{#unless ../continueReading}} reading-bookmark--{{key}}{{/unless}} menu-simple-element menu-simple-element-medium gamepad-item" onclick="{{#if ../current}}{{#if ebook}}reading.goToChapterProgress({{chapterIndex}}, {{chapterProgress}}, true);{{else}}reading.goToImage({{index}}, true);{{/if}}{{else}}{{#if ebook}}reading.setNextOpenChapterProgress({{chapterIndex}}, {{chapterProgress}});{{/if}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}');{{/if}} events.desactiveMenu('#collections-bookmark', '.bar-right-buttons .button-collections-bookmark');">
-					<div class="menu-simple-element-image menu-simple-element-image-{{sha}}" style="background-image: url({{thumbnail}})"></div>
+					<div class="menu-simple-element-image sha-image-bg-{{sha}}" style="background-image: url({{thumbnail}})"></div>
 					<span>{{#if ebook}}{{round progress}}%{{else}}{{index}}{{/if}}</span>
 					{{name}}
 					{{#if ebook}}({{round chapterProgress}}%){{/if}}

templates/search.results.html

@@ -4,7 +4,7 @@
 		{{#if icon}}
 		<i class="icon-24 material-icon">{{icon}}</i>
 		{{else}}
-		<div class="search-result-sha-{{image.sha}}" style="background-image: url({{image.thumbnail}});"></div>
+		<div class="sha-image-bg-{{image.sha}}" style="background-image: url({{image.thumbnail}});"></div>
 		{{/if}}
 	</div>
 	<span class="body-large">{{text}}</span>