j/cyberware
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

feat(popover): add support for PDF (#913)

Browse source 
* feat(popover): add support for PDF

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

* chore: split pdf by ';'

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

* fix: remove unnecessary check

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>

---------

Signed-off-by: Aaron <29749331+aarnphm@users.noreply.github.com>
This commit is contained in:
Aaron Pham 2024-02-22 22:16:40 -05:00 committed by GitHub
parent 345c347a56
commit 96c7076fb5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 32 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
quartz/components/scripts/popover.inline.ts
View file

@ -47,8 +47,8 @@ async function mouseEnterHandler(
} }
if (!response) return if (!response) return
const contentType = response.headers.get("Content-Type") const [contentType] = response.headers.get("Content-Type")!.split(";")
const contentTypeCategory = contentType?.split("/")[0] ?? "text" const [contentTypeCategory, typeInfo] = contentType.split("/")
const popoverElement = document.createElement("div") const popoverElement = document.createElement("div")
popoverElement.classList.add("popover") popoverElement.classList.add("popover")
@ -56,7 +56,7 @@ async function mouseEnterHandler(
popoverInner.classList.add("popover-inner") popoverInner.classList.add("popover-inner")
popoverElement.appendChild(popoverInner) popoverElement.appendChild(popoverInner)
popoverInner.dataset.contentType = contentTypeCategory popoverInner.dataset.contentType = contentType ?? undefined
switch (contentTypeCategory) { switch (contentTypeCategory) {
case "image": case "image":
@ -69,6 +69,17 @@ async function mouseEnterHandler(
popoverInner.appendChild(img) popoverInner.appendChild(img)
break break
case "application":
switch (typeInfo) {
case "pdf":
const pdf = document.createElement("iframe")
pdf.src = targetUrl.toString()
popoverInner.appendChild(pdf)
break
default:
break
}
break
default: default:
const contents = await response.text() const contents = await response.text()
const html = p.parseFromString(contents, "text/html") const html = p.parseFromString(contents, "text/html")

25
quartz/components/styles/popover.scss
View file

@ -38,14 +38,25 @@
white-space: normal; white-space: normal;
} }
& > .popover-inner[data-content-type="image"] { & > .popover-inner[data-content-type] {
padding: 0; &[data-content-type*="pdf"],
max-height: 100%; &[data-content-type*="image"] {
padding: 0;
max-height: 100%;
}
img { &[data-content-type*="image"] {
margin: 0; img {
border-radius: 0; margin: 0;
display: block; border-radius: 0;
display: block;
}
}
&[data-content-type*="pdf"] {
iframe {
width: 100%;
}
} }
} }