SYNC: scrollable exported diagram

This commit is contained in:
SPRINX0\prochazka
2025-04-01 12:36:47 +02:00
committed by Diflow
parent b37d0eba04
commit 78d9b48854

View File

@@ -22,17 +22,10 @@ const getDiagramExport = (html, css, themeType, themeClassName, watermark) => {
<link rel="stylesheet" href='https://cdn.jsdelivr.net/npm/@mdi/font@6.5.95/css/materialdesignicons.css' /> <link rel="stylesheet" href='https://cdn.jsdelivr.net/npm/@mdi/font@6.5.95/css/materialdesignicons.css' />
<script> <script>
function dragScroll(node, onScroll) {
if (!onScroll) return;
let lastX = null; let lastX = null;
let lastY = null; let lastY = null;
let sumMoved = 0;
const handleMoveDown = e => { const handleMoveDown = e => {
if (e.button != 2) return;
lastX = e.clientX; lastX = e.clientX;
lastY = e.clientY; lastY = e.clientY;
document.addEventListener('mousemove', handleMoveMove, true); document.addEventListener('mousemove', handleMoveMove, true);
@@ -42,8 +35,8 @@ const getDiagramExport = (html, css, themeType, themeClassName, watermark) => {
const handleMoveMove = e => { const handleMoveMove = e => {
e.preventDefault(); e.preventDefault();
document.scrollLeft -= e.clientX - lastX; document.body.scrollLeft -= e.clientX - lastX;
document.scrollTop -= e.clientY - lastY; document.body.scrollTop -= e.clientY - lastY;
lastX = e.clientX; lastX = e.clientX;
lastY = e.clientY; lastY = e.clientY;
@@ -62,7 +55,7 @@ const getDiagramExport = (html, css, themeType, themeClassName, watermark) => {
</script> </script>
</head> </head>
<body class='${themeType == 'dark' ? 'theme-type-dark' : 'theme-type-light'} ${themeClassName}'> <body class='${themeType == 'dark' ? 'theme-type-dark' : 'theme-type-light'} ${themeClassName}' style='user-select:none; cursor:pointer'>
${html} ${html}
${watermarkHtml} ${watermarkHtml}
</body> </body>