<html>
<head>
<meta name="description" content="Add Right Click Menu to LaTeX on lesswrong">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
</body>
</html>
javascript:(function()%7Bfunction%20createCopyLatexItem()%20%7B%0A%20%20const%20copyLatexItem%20%3D%20document.createElement('div')%3B%0A%20%20copyLatexItem.textContent%20%3D%20'Copy%20LaTeX'%3B%0A%20%20copyLatexItem.style.cssText%20%3D%20%60%0A%20%20%20%20position%3A%20absolute%3B%0A%20%20%20%20background-color%3A%20white%3B%0A%20%20%20%20color%3A%20black%3B%0A%20%20%20%20border%3A%201px%20solid%20%23ccc%3B%0A%20%20%20%20padding%3A%204px%208px%3B%0A%20%20%20%20cursor%3A%20pointer%3B%0A%20%20%20%20z-index%3A%201000%3B%0A%20%20%20%20font-size%3A%2012px%3B%0A%20%20%60%3B%0A%20%20return%20copyLatexItem%3B%0A%7D%0A%0Afunction%20showCopyLatexMenu(event%2C%20copyLatexItem)%20%7B%0A%20%20copyLatexItem.style.top%20%3D%20%60%24%7Bevent.pageY%7Dpx%60%3B%0A%20%20copyLatexItem.style.left%20%3D%20%60%24%7Bevent.pageX%7Dpx%60%3B%0A%20%20document.body.appendChild(copyLatexItem)%3B%0A%7D%0A%0Afunction%20hideCopyLatexMenu(copyLatexItem)%20%7B%0A%20%20if%20(document.body.contains(copyLatexItem))%20%7B%0A%20%20%20%20document.body.removeChild(copyLatexItem)%3B%0A%20%20%7D%0A%7D%0A%0Adocument.addEventListener('contextmenu'%2C%20(event)%20%3D%3E%20%7B%0A%20%20if%20(event.target.closest('.mjx-math'))%20%7B%0A%20%20%20%20event.preventDefault()%3B%0A%20%20%20%20const%20copyLatexItem%20%3D%20createCopyLatexItem()%3B%0A%20%20%20%20showCopyLatexMenu(event%2C%20copyLatexItem)%3B%0A%0A%20%20%20%20copyLatexItem.addEventListener('click'%2C%20()%20%3D%3E%20%7B%0A%20%20%20%20%20%20const%20latexCode%20%3D%20event.target.closest('.mjx-math').getAttribute('aria-label')%3B%0A%20%20%20%20%20%20navigator.clipboard.writeText(latexCode).then(()%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20console.log('LaTeX%20code%20copied%20to%20clipboard%3A'%2C%20latexCode)%3B%0A%20%20%20%20%20%20%20%20hideCopyLatexMenu(copyLatexItem)%3B%0A%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%7D)%3B%0A%0A%20%20%20%20document.addEventListener('click'%2C%20()%20%3D%3E%20%7B%0A%20%20%20%20%20%20hideCopyLatexMenu(copyLatexItem)%3B%0A%20%20%20%20%7D%2C%20%7B%20once%3A%20true%20%7D)%3B%0A%20%20%7D%0A%7D)%3B%7D)()%3B
function createCopyLatexItem() {
const copyLatexItem = document.createElement('div');
copyLatexItem.textContent = 'Copy LaTeX';
copyLatexItem.style.cssText = `
position: absolute;
background-color: white;
color: black;
border: 1px solid #ccc;
padding: 4px 8px;
cursor: pointer;
z-index: 1000;
font-size: 12px;
`;
return copyLatexItem;
}
function showCopyLatexMenu(event, copyLatexItem) {
copyLatexItem.style.top = `${event.pageY}px`;
copyLatexItem.style.left = `${event.pageX}px`;
document.body.appendChild(copyLatexItem);
}
function hideCopyLatexMenu(copyLatexItem) {
if (document.body.contains(copyLatexItem)) {
document.body.removeChild(copyLatexItem);
}
}
document.addEventListener('contextmenu', (event) => {
if (event.target.closest('.mjx-math')) {
event.preventDefault();
const copyLatexItem = createCopyLatexItem();
showCopyLatexMenu(event, copyLatexItem);
copyLatexItem.addEventListener('click', () => {
const latexCode = event.target.closest('.mjx-math').getAttribute('aria-label');
navigator.clipboard.writeText(latexCode).then(() => {
console.log('LaTeX code copied to clipboard:', latexCode);
hideCopyLatexMenu(copyLatexItem);
});
});
document.addEventListener('click', () => {
hideCopyLatexMenu(copyLatexItem);
}, { once: true });
}
});
javascript:(function()%7Bfunction%20createCopyLatexItem()%20%7B%0A%20%20const%20copyLatexItem%20%3D%20document.createElement('div')%3B%0A%20%20copyLatexItem.textContent%20%3D%20'Copy%20LaTeX'%3B%0A%20%20copyLatexItem.style.cssText%20%3D%20%60%0A%20%20%20%20position%3A%20absolute%3B%0A%20%20%20%20background-color%3A%20white%3B%0A%20%20%20%20color%3A%20black%3B%0A%20%20%20%20border%3A%201px%20solid%20%23ccc%3B%0A%20%20%20%20padding%3A%204px%208px%3B%0A%20%20%20%20cursor%3A%20pointer%3B%0A%20%20%20%20z-index%3A%201000%3B%0A%20%20%20%20font-size%3A%2012px%3B%0A%20%20%60%3B%0A%20%20return%20copyLatexItem%3B%0A%7D%0A%0Afunction%20showCopyLatexMenu(event%2C%20copyLatexItem)%20%7B%0A%20%20copyLatexItem.style.top%20%3D%20%60%24%7Bevent.pageY%7Dpx%60%3B%0A%20%20copyLatexItem.style.left%20%3D%20%60%24%7Bevent.pageX%7Dpx%60%3B%0A%20%20document.body.appendChild(copyLatexItem)%3B%0A%7D%0A%0Afunction%20hideCopyLatexMenu(copyLatexItem)%20%7B%0A%20%20if%20(document.body.contains(copyLatexItem))%20%7B%0A%20%20%20%20document.body.removeChild(copyLatexItem)%3B%0A%20%20%7D%0A%7D%0A%0Adocument.addEventListener('contextmenu'%2C%20(event)%20%3D%3E%20%7B%0A%20%20if%20(event.target.closest('.mjx-math'))%20%7B%0A%20%20%20%20event.preventDefault()%3B%0A%20%20%20%20const%20copyLatexItem%20%3D%20createCopyLatexItem()%3B%0A%20%20%20%20showCopyLatexMenu(event%2C%20copyLatexItem)%3B%0A%0A%20%20%20%20copyLatexItem.addEventListener('click'%2C%20()%20%3D%3E%20%7B%0A%20%20%20%20%20%20const%20latexCode%20%3D%20event.target.closest('.mjx-math').getAttribute('aria-label')%3B%0A%20%20%20%20%20%20navigator.clipboard.writeText(latexCode).then(()%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20console.log('LaTeX%20code%20copied%20to%20clipboard%3A'%2C%20latexCode)%3B%0A%20%20%20%20%20%20%20%20hideCopyLatexMenu(copyLatexItem)%3B%0A%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%7D)%3B%0A%0A%20%20%20%20document.addEventListener('click'%2C%20()%20%3D%3E%20%7B%0A%20%20%20%20%20%20hideCopyLatexMenu(copyLatexItem)%3B%0A%20%20%20%20%7D%2C%20%7B%20once%3A%20true%20%7D)%3B%0A%20%20%7D%0A%7D)%3B%7D)()%3B
Output
300px
You can jump to the latest bin by adding /latest
to your URL
Keyboard Shortcuts
Shortcut | Action |
---|---|
ctrl + [num] | Toggle nth panel |
ctrl + 0 | Close focused panel |
ctrl + enter | Re-render output. If console visible: run JS in console |
Ctrl + l | Clear the console |
ctrl + / | Toggle comment on selected lines |
ctrl + ] | Indents selected lines |
ctrl + [ | Unindents selected lines |
tab | Code complete & Emmet expand |
ctrl + shift + L | Beautify code in active panel |
ctrl + s | Save & lock current Bin from further changes |
ctrl + shift + s | Open the share options |
ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts |
JS Bin URLs
URL | Action |
---|---|
/ | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
/edit | Edit the current bin |
/watch | Follow a Code Casting session |
/embed | Create an embeddable version of the bin |
/latest | Load the very latest bin (/latest goes in place of the revision) |
/[username]/last | View the last edited bin for this user |
/[username]/last/edit | Edit the last edited bin for this user |
/[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
/quiet | Remove analytics and edit button from rendered output |
.js | Load only the JavaScript for a bin |
.css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. |