mirror of
https://github.com/alrayyes/wiki.git
synced 2025-06-22 12:56:33 +00:00
Fix popover
This commit is contained in:
parent
6e6dd4cb0b
commit
77485b754d
9 changed files with 67 additions and 64 deletions
assets/js
|
@ -1,5 +1,5 @@
|
|||
function htmlToElement(html) {
|
||||
const template = document.createElement('template')
|
||||
const template = document.createElement("template")
|
||||
html = html.trim()
|
||||
template.innerHTML = html
|
||||
return template.content.firstChild
|
||||
|
@ -7,29 +7,27 @@ function htmlToElement(html) {
|
|||
|
||||
function initPopover(baseURL) {
|
||||
const basePath = baseURL.replace(window.location.origin, "")
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
fetchData.then(({ content }) => {
|
||||
const links = [...document.getElementsByClassName("internal-link")]
|
||||
links
|
||||
.filter(li => li.dataset.src)
|
||||
.forEach(li => {
|
||||
const linkDest = content[li.dataset.src.replace(/\/$/g, "").replace(basePath, "")]
|
||||
if (linkDest) {
|
||||
const popoverElement = `<div class="popover">
|
||||
fetchData.then(({ content }) => {
|
||||
const links = [...document.getElementsByClassName("internal-link")]
|
||||
links
|
||||
.filter((li) => li.dataset.src)
|
||||
.forEach((li) => {
|
||||
const linkDest = content[li.dataset.src.replace(/\/$/g, "").replace(basePath, "")]
|
||||
if (linkDest) {
|
||||
const popoverElement = `<div class="popover">
|
||||
<h3>${linkDest.title}</h3>
|
||||
<p>${removeMarkdown(linkDest.content).split(" ", 20).join(" ")}...</p>
|
||||
<p class="meta">${new Date(linkDest.lastmodified).toLocaleDateString()}</p>
|
||||
</div>`
|
||||
const el = htmlToElement(popoverElement)
|
||||
li.appendChild(el)
|
||||
li.addEventListener("mouseover", () => {
|
||||
el.classList.add("visible")
|
||||
})
|
||||
li.addEventListener("mouseout", () => {
|
||||
el.classList.remove("visible")
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
const el = htmlToElement(popoverElement)
|
||||
li.appendChild(el)
|
||||
li.addEventListener("mouseover", () => {
|
||||
el.classList.add("visible")
|
||||
})
|
||||
li.addEventListener("mouseout", () => {
|
||||
el.classList.remove("visible")
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue