Skip to content

Commit da36774

Browse files
committed
New: Global zoom in the slide reading
1 parent eb3249a commit da36774

19 files changed

+70
-20
lines changed

CHANGELOG.md

+1
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
1313
- Option to open folder/file directly in first image or in continue reading [`6a20160`](https://github.com/ollm/OpenComic/commit/6a20160bcd96291c14d16d025baf7aef7ebe13c9)
1414
- Change page using an input range [`527999c`](https://github.com/ollm/OpenComic/commit/527999ccacf16beea2387f7eef2f6cb7648fb2d5)
1515
- Go to page writing it in a dialog [`2d7a028`](https://github.com/ollm/OpenComic/commit/2d7a02853d27752094555275e77cdc7ad2ca3771)
16+
- Global zoom in the slide reading
1617

1718
##### 🐛 Bug Fixes
1819

languages/ca.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -169,10 +169,11 @@
169169
"reading": {
170170
"main": "Preferències de lectura",
171171
"maxMargin": "Marge horitzontal i vertical màxim",
172-
"globalZoom": "Aplica un zoom global en comptes d'imatge a imatge (Només en lectura vertical)",
172+
"globalZoom": "Zoom global en comptes d'imatge a imatge (Lectura vertical)",
173+
"globalZoomSlide": "Zoom global en comptes d'imatge a imatge (Lectura horitzontal)",
173174
"moveZoomWithMouse": "Moure el zoom mitjançant el cursor (Desactiva moure mitjançant arrossegar i deixar anar)",
174175
"scrollWithMouse": "Realitzar desplaçament movent el cursor per les vores de la pantalla (Desactiva desplaçament mitjançant arrossegar i deixar anar)",
175-
"startReadingInFullScreen": "Comença la lectura a pantalla completa",
176+
"startReadingInFullScreen": "Començar la lectura a pantalla completa",
176177
"trackingAtTheEnd": "Seguiment al final del capítol/tom"
177178
},
178179
"navigation": {

languages/cs.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/de.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/en.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -169,7 +169,8 @@
169169
"reading": {
170170
"main": "Reading preferences",
171171
"maxMargin": "Maximum horizontal and vertical margin",
172-
"globalZoom": "Applies a global zoom instead of image by image (Only in vertical reading)",
172+
"globalZoom": "Global zoom instead of image by image (Vertical reading)",
173+
"globalZoomSlide": "Global zoom instead of image by image (Slide reading)",
173174
"moveZoomWithMouse": "Move zoom using cursor (Disables moving by drag and drop)",
174175
"scrollWithMouse": "Scroll by moving the cursor along the edges of the screen (Disables drag and drop scrolling)",
175176
"startReadingInFullScreen": "Start reading in full screen",

languages/es.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -169,10 +169,11 @@
169169
"reading": {
170170
"main": "Preferencias de lectura",
171171
"maxMargin": "Margen horizontal y vertical máximo",
172-
"globalZoom": "Aplica un zoom global en vez de imagen a imagen (Solo en lectura vertical)",
172+
"globalZoom": "Zoom global en vez de imagen a imagen (Lectura vertical)",
173+
"globalZoomSlide": "Zoom global en vez de imagen a imagen (Lectura horizontal)",
173174
"moveZoomWithMouse": "Mover el zoom mediante el cursor (Desactiva mover mediante arrastrar y soltar)",
174175
"scrollWithMouse": "Realizar desplazamiento moviendo el cursor por los bordes de la pantalla (Desactiva desplazamiento mediante arrastrar y soltar)",
175-
"startReadingInFullScreen": "Empieza la lectura en pantalla completa",
176+
"startReadingInFullScreen": "Empezar la lectura en pantalla completa",
176177
"trackingAtTheEnd": "Seguimiento al final del capítulo/tomo"
177178
},
178179
"navigation": {

languages/fr.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/hu.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/it.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/ja.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/pt-br.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/ru.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/th.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "กำหนดค่าการอ่าน",
171171
"maxMargin": "ขยายระยะขอบแนวนอนแนวตั้งให้สุด",
172172
"globalZoom": "ใช้การซูมที่ตั้งไว้แทนการซูมแบบหนึ่งต่อหนึ่ง (เฉพาะการอ่านแนวตั้งเท่านั้น)",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "ย้ายซูมโดยใช้เคอร์เซอร์ (ปิดการย้ายโดยลากวาง)",
174175
"scrollWithMouse": "เลื่อนโดยย้ายเคอร์เซอร์ไปตามขอบจอ (ปิดการเลื่อนแบบลากและวาง)",
175176
"startReadingInFullScreen": "เริ่มอ่านแบบเต็มจอ",

languages/vi.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

languages/zh-hans.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "阅读设置",
171171
"maxMargin": "最大水平和垂直边距",
172172
"globalZoom": "应用全局缩放而不是逐个图片(仅在垂直阅读时)",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "使用鼠标移动缩放(禁用通过拖放移动)",
174175
"scrollWithMouse": "通过沿着屏幕边缘移动鼠标来滚动(禁用拖放滚动)",
175176
"startReadingInFullScreen": "开始全屏阅读",

languages/zh-hant.json

+1
Original file line numberDiff line numberDiff line change
@@ -170,6 +170,7 @@
170170
"main": "",
171171
"maxMargin": "",
172172
"globalZoom": "",
173+
"globalZoomSlide": "",
173174
"moveZoomWithMouse": "",
174175
"scrollWithMouse": "",
175176
"startReadingInFullScreen": "",

scripts/reading.js

+39-14
Original file line numberDiff line numberDiff line change
@@ -942,8 +942,10 @@ function goToIndex(index, animation = true, nextPrevious = false, end = false)
942942
let animationDurationS = ((animation) ? _config.readingViewSpeed : 0);
943943
let animationDurationMS = animationDurationS * 1000;
944944

945+
let _currentScale = currentScale;
946+
945947
if(currentScale != 1 && animation && !(config.readingGlobalZoom && readingViewIs('scroll')))
946-
reading.resetZoom();
948+
reading.resetZoom(true, false, true, true, (config.readingGlobalZoomSlide && readingViewIs('slide')));
947949

948950
let content = template._contentRight().firstElementChild;
949951
let rect = content.getBoundingClientRect();
@@ -1095,6 +1097,13 @@ function goToIndex(index, animation = true, nextPrevious = false, end = false)
10951097

10961098
}, false, false, true);
10971099

1100+
if(_currentScale != 1 && config.readingGlobalZoomSlide && readingViewIs('slide'))
1101+
{
1102+
currentZoomIndex = false;
1103+
currentScale = _currentScale;
1104+
reading.applyScale(false, _currentScale, true, _currentScale > 1 ? false : true);
1105+
}
1106+
10981107
//goToImageCL(imagesDistribution[eIndex-1][0].index, animation);
10991108

11001109
var isBookmarkTrue = false;
@@ -1611,12 +1620,10 @@ function showPreviousComic(mode, animation = true, invert = false)
16111620

16121621
var currentScale = 1, scalePrevData = {tranX: 0, tranX2: 0, tranY: 0, tranY2: 0, scale: 1, scrollTop: 0}, originalRect = false, originalRectReadingBody = false, originalRect2 = false, originalRectReadingBody2 = false, haveZoom = false, currentZoomIndex = false, applyScaleST = false, zoomingIn = false, prevAnime = false;
16131622

1614-
function applyScale(animation = true, scale = 1, center = false, zoomOut = false, round = true)
1623+
function applyScale(animation = true, scale = 1, center = false, zoomOut = false, delayed = false)
16151624
{
16161625
let animationDurationS = ((animation) ? _config.readingViewSpeed : 0);
16171626

1618-
if(round) scale = Math.round(scale * 100) / 100;
1619-
16201627
if(currentZoomIndex === false)
16211628
{
16221629
if(center || !readingViewIs('scroll'))
@@ -1813,13 +1820,30 @@ function applyScale(animation = true, scale = 1, center = false, zoomOut = false
18131820
translateX = withLimits.x;
18141821
translateY = withLimits.y;
18151822

1816-
dom.this(contentRight).find('.image-position'+currentZoomIndex, true).css({
1817-
transition: 'transform '+animationDurationS+'s, z-index '+animationDurationS+'s',
1818-
transform: 'translateX('+app.roundDPR(translateX)+'px) translateY('+app.roundDPR(translateY)+'px) scale('+scale+')',
1819-
transformOrigin: 'center center',
1820-
zIndex: scale == 1 ? 1 : 2,
1821-
// willChange: scale == 1 ? '' : 'transform',
1822-
});
1823+
let imagePosition = dom.this(contentRight).find('.image-position'+currentZoomIndex, true)
1824+
1825+
if(delayed)
1826+
{
1827+
setTimeout(function(){
1828+
1829+
imagePosition.css({
1830+
transition: 'transform 0s, z-index 0s',
1831+
transform: 'translateX('+app.roundDPR(translateX)+'px) translateY('+app.roundDPR(translateY)+'px) scale('+scale+')',
1832+
transformOrigin: 'center center',
1833+
zIndex: scale == 1 ? 1 : 2,
1834+
});
1835+
1836+
}, _config.readingViewSpeed * 1000);
1837+
}
1838+
else
1839+
{
1840+
imagePosition.css({
1841+
transition: 'transform '+animationDurationS+'s, z-index '+animationDurationS+'s',
1842+
transform: 'translateX('+app.roundDPR(translateX)+'px) translateY('+app.roundDPR(translateY)+'px) scale('+scale+')',
1843+
transformOrigin: 'center center',
1844+
zIndex: scale == 1 ? 1 : 2,
1845+
});
1846+
}
18231847

18241848
if(scale == 1)
18251849
{
@@ -1887,7 +1911,7 @@ function zoomOut(animation = true, center = false)
18871911

18881912

18891913
// Reset zoom or show in original size if is current in 1 scale
1890-
function resetZoom(animation = true, index = false, apply = true, center = true)
1914+
function resetZoom(animation = true, index = false, apply = true, center = true, delayed = false)
18911915
{
18921916
var animationDurationS = ((animation) ? _config.readingViewSpeed : 0);
18931917

@@ -1912,7 +1936,7 @@ function resetZoom(animation = true, index = false, apply = true, center = true)
19121936
currentScale = ((image.width / width + image.height / height) / 2) / window.devicePixelRatio;
19131937

19141938
if(apply)
1915-
applyScale(animation, currentScale, center, (currentScale < 1) ? true : false, false);
1939+
applyScale(animation, currentScale, center, (currentScale < 1) ? true : false);
19161940

19171941
return;
19181942
}
@@ -1929,7 +1953,7 @@ function resetZoom(animation = true, index = false, apply = true, center = true)
19291953
}
19301954
else
19311955
{
1932-
applyScale(animation, currentScale, true);
1956+
applyScale(animation, currentScale, true, false, delayed);
19331957

19341958
originalRect = false;
19351959
scalePrevData = {tranX: 0, tranX2: 0, tranY: 0, tranY2: 0, scale: 1, scrollTop: 0};
@@ -4837,6 +4861,7 @@ module.exports = {
48374861
zoomOut: zoomOut,
48384862
resetZoom: resetZoom,
48394863
dragZoom: dragZoom,
4864+
fixBlurOnZoom: fixBlurOnZoom,
48404865
applyScale: applyScale,
48414866
activeMagnifyingGlass: activeMagnifyingGlass,
48424867
changeMagnifyingGlass: changeMagnifyingGlass,

scripts/storage.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
var changes = 61; // Update this if readingPagesConfig is updated
1+
var changes = 62; // Update this if readingPagesConfig is updated
22

33
var readingPagesConfig = {
44
readingConfigName: '',
@@ -102,6 +102,7 @@ var storageDefault = {
102102
readingHideBarHeaderFullScreen: true,
103103
readingMaxMargin: 400,
104104
readingGlobalZoom: true,
105+
readingGlobalZoomSlide: true,
105106
readingMoveZoomWithMouse: false,
106107
readingScrollWithMouse: false,
107108
readingStartReadingInFullScreen: false,

templates/settings.content.right.html

+8
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,14 @@ <h2 class="headline-small">{{language.settings.masterFolders.main}}</h2>
3535

3636
<h2 class="headline-small">{{language.settings.reading.main}}</h2>
3737

38+
<div class="menu-simple-text gamepad-item">
39+
<span>{{language.settings.reading.globalZoomSlide}}</span>
40+
<div class="switch{{#if config.readingGlobalZoomSlide}} a{{/if}}" on="settings.set('readingGlobalZoomSlide', true)" off="settings.set('readingGlobalZoomSlide', false)">
41+
<div></div>
42+
<svg viewBox="0 0 52 32"><path d="M 8,0 C 3.58,0 0,3.58 0,8 0,12.42 3.58,16 8,16 8,16 8,16 8,16 12.42,16 16,12.42 16,8 16,3.58 12.42,0 8,0 8,0 8,0 8,0 Z"></path></svg>
43+
</div>
44+
</div>
45+
3846
<div class="menu-simple-text gamepad-item">
3947
<span>{{language.settings.reading.globalZoom}}</span>
4048
<div class="switch{{#if config.readingGlobalZoom}} a{{/if}}" on="settings.setGlobalZoom(true)" off="settings.setGlobalZoom(false)">

0 commit comments

Comments
 (0)