Forked from foobear/copy-element-text-bookmarklet.js
Last active
June 1, 2021 21:27
-
-
Save jdehorty/fe135ee7f1a9d67fe8c826c49a054747 to your computer and use it in GitHub Desktop.
JavaScript bookmarklet to click an element and copy its text contents. See https://makandracards.com/makandra/46962
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var overlay = document.createElement('div'); | |
Object.assign(overlay.style, { | |
position: 'fixed', | |
top: 0, | |
left: 0, | |
width: '100vw', | |
height: '100vh', | |
zIndex: 99999999, | |
background: 'transparent', | |
cursor: 'crosshair' | |
}); | |
document.body.append(overlay); | |
function copyToClipboard(textToCopy) { | |
// navigator clipboard api needs a secure context (https) | |
if (navigator.clipboard && window.isSecureContext) { | |
// navigator clipboard api method' | |
return navigator.clipboard.writeText(textToCopy); | |
} else { | |
// text area method | |
let textArea = document.createElement("textarea"); | |
textArea.value = textToCopy; | |
// make the textarea out of viewport | |
textArea.style.position = "fixed"; | |
textArea.style.left = "-999999px"; | |
textArea.style.top = "-999999px"; | |
document.body.appendChild(textArea); | |
textArea.focus(); | |
textArea.select(); | |
return new Promise((res, rej) => { | |
// here the magic happens | |
document.execCommand('copy') ? res() : rej(); | |
textArea.remove(); | |
}); | |
} | |
}; | |
function getElement(event) { | |
overlay.style.pointerEvents = 'none'; | |
var element = document.elementFromPoint(event.clientX, event.clientY); | |
overlay.style.pointerEvents = 'auto'; | |
return element; | |
} | |
document.addEventListener('mousemove', function(event) { | |
var element = getElement(event); | |
if (!element) return; | |
var position = element.getBoundingClientRect(); | |
Object.assign(overlay.style, { | |
background: 'rgba(0, 128, 255, 0.25)', | |
outline: '1px solid rgba(0, 128, 255, 0.5)', | |
top: '' + position.top + 'px', | |
left: '' + position.left + 'px', | |
width: '' + position.width + 'px', | |
height: '' + position.height + 'px' | |
}); | |
}); | |
overlay.addEventListener('click', function(event) { | |
var element = getElement(event); | |
var text = element.textContent || element.value; | |
text = text.replace(/\n[ \n]+\n/g, "\n").replace(/\n\n+/g, "\n\n").replace(/^\n+|\n+$/g, ''); | |
if (!text.match("\n")) text = text.replace(/^ +| +$/, '') | |
copyToClipboard(text); | |
document.body.removeChild(overlay); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Minified Version