Mirrors/gomuks
1
0
Fork 1
mirror of https://github.com/tulir/gomuks.git synced 2025-04-20 18:43:41 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Properly handle on-click unspoilering

Browse source
This commit is contained in:
nexy7574 2024-11-17 20:35:13 +00:00
parent de920db385
commit e1352872a0
1 changed files with 16 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
web/src/ui/timeline/content/useMediaContent.tsx
View file

@ -28,9 +28,21 @@ export const useMediaContent = (
? getEncryptedMediaURL(content.info.thumbnail_file.url) : getMediaURL(content.info?.thumbnail_url) ? getEncryptedMediaURL(content.info.thumbnail_file.url) : getMediaURL(content.info?.thumbnail_url)
if (content.msgtype === "m.image" || evtType === "m.sticker") { if (content.msgtype === "m.image" || evtType === "m.sticker") {
const style = calculateMediaSize(content.info?.w, content.info?.h, containerSize) const style = calculateMediaSize(content.info?.w, content.info?.h, containerSize)
let className = "image-container" const classes = ["image-container"]
if(content["m.spoiler"] === true) { if(content["m.spoiler"] === true) {
className += " attachment-spoiler" classes.push("attachment-spoiler")
}
const lightBox = use(LightboxContext)
const onClick = (event: React.MouseEvent<HTMLImageElement>) => {
// Check if it is spoilered. If it is, remove the attachment-spoiler class
if(event.currentTarget.parentElement?.classList.contains("attachment-spoiler")) {
console.debug("Removing spoiler")
event.currentTarget.parentElement?.classList.remove("attachment-spoiler")
} else {
console.debug("Opening lightbox")
return lightBox(event)
}
} }
return [<img return [<img
@ -39,8 +51,8 @@ export const useMediaContent = (
src={mediaURL} src={mediaURL}
alt={content.filename ?? content.body} alt={content.filename ?? content.body}
title={content["m.spoiler.reason"]} title={content["m.spoiler.reason"]}
onClick={use(LightboxContext)} onClick={onClick}
/>, className, style.container] />, classes.join(" "), style.container]
} else if (content.msgtype === "m.video") { } else if (content.msgtype === "m.video") {
const autoplay = false const autoplay = false
const controls = !content.info?.["fi.mau.hide_controls"] const controls = !content.info?.["fi.mau.hide_controls"]