walcutt/searchable-jekyll-template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

caching link content for link preview

Browse Source
This commit is contained in:
hqweay 2022-06-27 21:33:31 +08:00
parent 8518ad014b
commit f872e0dc9b
2 changed files with 20 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
_includes/link-previews.html
View File

@ -50,6 +50,8 @@
var tooltipWrapper = document.getElementById('tooltip-wrapper') var tooltipWrapper = document.getElementById('tooltip-wrapper')
var tooltipContent = document.getElementById('tooltip-content') var tooltipContent = document.getElementById('tooltip-content')
var linkHistories = {};
function hideTooltip() { function hideTooltip() {
opacityTimeout = setTimeout(function() { opacityTimeout = setTimeout(function() {
tooltipWrapper.style.opacity = 0; tooltipWrapper.style.opacity = 0;
@ -66,20 +68,30 @@
var top = window.pageYOffset || document.documentElement.scrollTop var top = window.pageYOffset || document.documentElement.scrollTop
if (event.target.host === window.location.host) { if (event.target.host === window.location.host) {
iframe.src = event.target.href if (!linkHistories[event.target.href]) {
iframe.onload = function() { iframe.src = event.target.href
tooltipContentHtml = '' iframe.onload = function() {
tooltipContentHtml += '<div style="font-weight: bold;">' + iframe.contentWindow.document.querySelector('h1').innerHTML + '</div>' tooltipContentHtml = ''
tooltipContentHtml += iframe.contentWindow.document.querySelector('content').innerHTML tooltipContentHtml += '<div style="font-weight: bold;">' + iframe.contentWindow.document.querySelector('h1').innerHTML + '</div>'
tooltipContentHtml += iframe.contentWindow.document.querySelector('content').innerHTML
tooltipContent.innerHTML = tooltipContentHtml tooltipContent.innerHTML = tooltipContentHtml
linkHistories[event.target.href] = tooltipContentHtml
tooltipWrapper.style.display = 'block';
setTimeout(function() {
tooltipWrapper.style.opacity = 1;
}, 1)
}
} else {
tooltipContent.innerHTML = linkHistories[event.target.href]
tooltipWrapper.style.display = 'block'; tooltipWrapper.style.display = 'block';
setTimeout(function() { setTimeout(function() {
tooltipWrapper.style.opacity = 1; tooltipWrapper.style.opacity = 1;
}, 1) }, 1)
} }
tooltipWrapper.style.left = elem_props.left - (tooltipWrapper.offsetWidth / 2) + (elem_props.width / 2) + "px"; tooltipWrapper.style.left = elem_props.left - (tooltipWrapper.offsetWidth / 2) + (elem_props.width / 2) + "px";
if ((window.innerHeight - elem_props.top) < (tooltipWrapper.offsetHeight)) { if ((window.innerHeight - elem_props.top) < (tooltipWrapper.offsetHeight)) {
tooltipWrapper.style.top = elem_props.top + top - tooltipWrapper.offsetHeight - 10 + "px"; tooltipWrapper.style.top = elem_props.top + top - tooltipWrapper.offsetHeight - 10 + "px";

2
_notes/your-first-note.md
View File

@ -58,6 +58,8 @@ Notice in the "Notes mentioning this note" section that there is another note li
If you're on a device with mouse support, try hovering your mouse on internal links to preview the notes: [[a note about cats]]. If you're on a device with mouse support, try hovering your mouse on internal links to preview the notes: [[a note about cats]].
Links that have been previewed will be cached to avoid redundant requests.
### Images and other Markdown goodies ### Images and other Markdown goodies
Finally, because you have the full power of Markdown in this template, you can use regular Markdown syntax for various formatting options. Finally, because you have the full power of Markdown in this template, you can use regular Markdown syntax for various formatting options.