Skip to content

Instantly share code, notes, and snippets.

@escherize
Created January 3, 2024 18:00
Show Gist options
  • Save escherize/3a0b4f8b14e1f89b019853ffbf9a48ad to your computer and use it in GitHub Desktop.
Save escherize/3a0b4f8b14e1f89b019853ffbf9a48ad to your computer and use it in GitHub Desktop.
javascript:(function(){ if (window.whiteboardActive) { var existingTpdiv = document.getElementById('transparentWhiteboardDiv'); if (existingTpdiv) {existingTpdiv.remove();} var existingCanvas = document.getElementById('transparentWhiteboardCanvas'); if (existingCanvas) { existingCanvas.remove();} window.whiteboardActive = false; return; } var tpdiv = document.createElement('div'); tpdiv.id = 'transparentWhiteboardDiv'; tpdiv.style.position = 'fixed'; tpdiv.style.top = '0'; tpdiv.style.left = '0'; tpdiv.style.width = '100%'; tpdiv.style.height = '100%'; tpdiv.style.zIndex = '999999'; tpdiv.style.pointerEvents = 'none'; tpdiv.style.background = 'rgba(255, 231, 210, 0.4)'; document.body.appendChild(tpdiv); var canvas = document.createElement('canvas'); canvas.style.position = 'fixed'; canvas.style.top = '0'; canvas.style.left = '0'; canvas.width = window.innerWidth; canvas.height = window.innerHeight; canvas.style.zIndex = '999999'; canvas.style.pointerEvents = 'auto'; canvas.style.cursor = 'crosshair'; canvas.id = 'transparentWhiteboardCanvas'; document.body.appendChild(canvas); var ctx = canvas.getContext('2d'); ctx.strokeStyle = '#0F3325';%20%20%20%20%20ctx.lineWidth%20=%203;%20%20%20%20%20%20var%20isDrawing%20=%20false;%20%20%20%20%20var%20prevX%20=%200,%20prevY%20=%200;%20%20%20%20%20%20canvas.addEventListener('mousedown',%20function(e){%20%20%20%20%20%20%20%20%20isDrawing%20=%20true;%20%20%20%20%20%20%20%20%20prevX%20=%20e.clientX;%20%20%20%20%20%20%20%20%20prevY%20=%20e.clientY;%20%20%20%20%20});%20%20%20%20%20%20canvas.addEventListener('mousemove',%20function(e){%20%20%20%20%20%20%20%20%20if%20(!isDrawing)%20return;%20%20%20%20%20%20%20%20%20ctx.beginPath();%20%20%20%20%20%20%20%20%20ctx.moveTo(prevX,%20prevY);%20%20%20%20%20%20%20%20%20ctx.lineTo(e.clientX,%20e.clientY);%20%20%20%20%20%20%20%20%20ctx.stroke();%20%20%20%20%20%20%20%20%20prevX%20=%20e.clientX;%20%20%20%20%20%20%20%20%20prevY%20=%20e.clientY;%20%20%20%20%20});%20%20%20%20%20%20canvas.addEventListener('mouseup',%20function(){%20%20%20%20%20%20%20%20%20isDrawing%20=%20false;%20%20%20%20%20});%20%20%20%20%20%20window.whiteboardActive%20=%20true;%20})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment