mirror of
https://github.com/Sped0n/bridget.git
synced 2026-04-22 14:09:30 -07:00
fix lazy load placeholder display bug
This commit is contained in:
@@ -7,8 +7,7 @@ import {
|
|||||||
type position,
|
type position,
|
||||||
createImgElement,
|
createImgElement,
|
||||||
calcImageIndex,
|
calcImageIndex,
|
||||||
delay,
|
delay
|
||||||
type imgElement
|
|
||||||
} from './utils'
|
} from './utils'
|
||||||
import { thresholdSensitivityArray, thresholdIndex } from './thresholdCtl'
|
import { thresholdSensitivityArray, thresholdIndex } from './thresholdCtl'
|
||||||
import { imgIndexSpanUpdate } from './indexDisp'
|
import { imgIndexSpanUpdate } from './indexDisp'
|
||||||
@@ -27,8 +26,7 @@ export const layers: HTMLDivElement[] = [
|
|||||||
// layers position caching
|
// layers position caching
|
||||||
export const layersStyleArray: string[][] = [
|
export const layersStyleArray: string[][] = [
|
||||||
['0px', '0px', '0px', '0px', '0px'],
|
['0px', '0px', '0px', '0px', '0px'],
|
||||||
['0px', '0px', '0px', '0px', '0px'],
|
['0px', '0px', '0px', '0px', '0px']
|
||||||
['', '', '', '', '']
|
|
||||||
]
|
]
|
||||||
|
|
||||||
// global index for "activated"
|
// global index for "activated"
|
||||||
@@ -39,10 +37,10 @@ let last: position = { x: 0, y: 0 }
|
|||||||
|
|
||||||
// activate top image
|
// activate top image
|
||||||
const activate = (index: number, x: number, y: number): void => {
|
const activate = (index: number, x: number, y: number): void => {
|
||||||
const imgElem: imgElement = createImgElement(imagesArray[index], true)
|
const imgElem: HTMLImageElement = createImgElement(imagesArray[index])
|
||||||
styleCache(x, y, imgElem.bgStyle, layersStyleArray)
|
styleCache(x, y, layersStyleArray)
|
||||||
layersStyleSet(layersStyleArray, layers)
|
layersStyleSet(layersStyleArray, layers)
|
||||||
FIFO(imgElem.image, layers)
|
FIFO(imgElem, layers)
|
||||||
last = { x, y }
|
last = { x, y }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -64,7 +64,7 @@ export const overlayDisable = (): void => {
|
|||||||
// handle close click
|
// handle close click
|
||||||
async function handleCloseClick(): Promise<void> {
|
async function handleCloseClick(): Promise<void> {
|
||||||
overlayDisable()
|
overlayDisable()
|
||||||
layersStyleSet(layersStyleArray, layers, true, false)
|
layersStyleSet(layersStyleArray, layers)
|
||||||
for (let i: number = 4; i >= 0; i--) {
|
for (let i: number = 4; i >= 0; i--) {
|
||||||
layers[i].dataset.status = `r${4 - i}`
|
layers[i].dataset.status = `r${4 - i}`
|
||||||
}
|
}
|
||||||
@@ -72,21 +72,21 @@ async function handleCloseClick(): Promise<void> {
|
|||||||
for (let i: number = 4; i >= 0; i--) {
|
for (let i: number = 4; i >= 0; i--) {
|
||||||
layers[i].dataset.status = 'null'
|
layers[i].dataset.status = 'null'
|
||||||
}
|
}
|
||||||
layersStyleSet(layersStyleArray, layers, false, true)
|
layersStyleSet(layersStyleArray, layers)
|
||||||
window.addEventListener('mousemove', handleOnMove)
|
window.addEventListener('mousemove', handleOnMove)
|
||||||
}
|
}
|
||||||
|
|
||||||
const handlePrevClick = (): void => {
|
const handlePrevClick = (): void => {
|
||||||
globalIndexDec()
|
globalIndexDec()
|
||||||
const imgIndex = calcImageIndex(globalIndex, imagesArrayLen)
|
const imgIndex = calcImageIndex(globalIndex, imagesArrayLen)
|
||||||
FIFO(createImgElement(imagesArray[imgIndex], false).image, layers)
|
FIFO(createImgElement(imagesArray[imgIndex]), layers)
|
||||||
imgIndexSpanUpdate(imgIndex + 1, imagesArrayLen)
|
imgIndexSpanUpdate(imgIndex + 1, imagesArrayLen)
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleNextClick = (): void => {
|
const handleNextClick = (): void => {
|
||||||
globalIndexInc()
|
globalIndexInc()
|
||||||
const imgIndex = calcImageIndex(globalIndex, imagesArrayLen)
|
const imgIndex = calcImageIndex(globalIndex, imagesArrayLen)
|
||||||
FIFO(createImgElement(imagesArray[imgIndex], false).image, layers)
|
FIFO(createImgElement(imagesArray[imgIndex]), layers)
|
||||||
imgIndexSpanUpdate(imgIndex + 1, imagesArrayLen)
|
imgIndexSpanUpdate(imgIndex + 1, imagesArrayLen)
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -148,8 +148,8 @@ export const vwRefreshInit = (): void => {
|
|||||||
} else {
|
} else {
|
||||||
r.style.setProperty('--footer-height', '31px')
|
r.style.setProperty('--footer-height', '31px')
|
||||||
}
|
}
|
||||||
// recenter image
|
// recenter image (only in overlay)
|
||||||
center(layers[4])
|
if (layers[4].dataset.status === 't0') center(layers[4])
|
||||||
},
|
},
|
||||||
{ passive: true }
|
{ passive: true }
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user