Backup_Repos/komga
1
0
Fork 0
mirror of https://github.com/gotson/komga.git synced 2026-05-07 12:01:40 +02:00
Code Issues Projects Releases Wiki Activity

feat(webreader): align double pages according to reading direction

Browse source 
closes #670
This commit is contained in:
Gauthier Roebroeck 2021-12-14 11:25:10 +08:00
parent 4a519379ee
commit 218fd79e51
1 changed files with 28 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
komga-webui/src/functions/book-spreads.ts
View file

@ -11,8 +11,12 @@ export function buildSpreads(pages: PageDtoWithUrl[], pageLayout: PagedReaderLay
const pagesClone = cloneDeep(pages) const pagesClone = cloneDeep(pages)
let lastPages = undefined let lastPages = undefined
if (pageLayout === PagedReaderLayout.DOUBLE_PAGES) { if (pageLayout === PagedReaderLayout.DOUBLE_PAGES) {
spreads.push([pagesClone.shift()] as PageDtoWithUrl[]) const firstPage = pagesClone.shift() as PageDtoWithUrl
if (pagesClone.length > 0) lastPages = [pagesClone.pop()] as PageDtoWithUrl[] spreads.push([createEmptyPage(firstPage), firstPage] as PageDtoWithUrl[])
if (pagesClone.length > 0) {
const lastPage = pagesClone.pop() as PageDtoWithUrl
lastPages = [lastPage, createEmptyPage(lastPage)] as PageDtoWithUrl[]
}
} }
while (pagesClone.length > 0) { while (pagesClone.length > 0) {
const p = pagesClone.shift() as PageDtoWithUrl const p = pagesClone.shift() as PageDtoWithUrl
@ -22,13 +26,13 @@ export function buildSpreads(pages: PageDtoWithUrl[], pageLayout: PagedReaderLay
if (pagesClone.length > 0) { if (pagesClone.length > 0) {
const p2 = pagesClone.shift() as PageDtoWithUrl const p2 = pagesClone.shift() as PageDtoWithUrl
if (isPageLandscape(p2)) { if (isPageLandscape(p2)) {
spreads.push([p]) spreads.push([p, createEmptyPage(p)])
spreads.push([p2]) spreads.push([p2])
} else { } else {
spreads.push([p, p2]) spreads.push([p, p2])
} }
} else { } else {
spreads.push([p]) spreads.push([p, createEmptyPage(p)])
} }
} }
} }
@ -38,3 +42,23 @@ export function buildSpreads(pages: PageDtoWithUrl[], pageLayout: PagedReaderLay
return pages.map(p => [p]) return pages.map(p => [p])
} }
} }
function createEmptyPage(page: PageDtoWithUrl): PageDtoWithUrl {
return {
url: createTransparentDataUrl(page?.width || 20, page?.height || 30),
} as PageDtoWithUrl
}
function createTransparentDataUrl(w: number, h: number): string {
const canvas = document.createElement('canvas')
canvas.width = w
canvas.height = h
const ctx = canvas.getContext('2d')
if (ctx) {
ctx.fillStyle = 'rgb(0,0,0,0)'
ctx.fillRect(0, 0, w, h)
}
return canvas.toDataURL()
}