diff --git a/frontend/js/svg-draw.js b/frontend/js/svg-draw.js index d3fd6fb..a79c810 100644 --- a/frontend/js/svg-draw.js +++ b/frontend/js/svg-draw.js @@ -46,7 +46,7 @@ linear-gradient(45deg,#f8fafc 25%,transparent 25%),linear-gradient(-45deg,#f8fafc 25%,transparent 25%), linear-gradient(45deg,transparent 75%,#f8fafc 75%),linear-gradient(-45deg,transparent 75%,#f8fafc 75%); background-size:18px 18px; background-position:0 0,0 9px,9px -9px,-9px 0; } - .svgd-canvas { display:block; width:100%; height:auto; touch-action:none; cursor:crosshair; } + .svgd-canvas { display:block; width:100%; height:auto; touch-action:none; cursor:crosshair; user-select:none; -webkit-user-select:none; -webkit-user-drag:none; } .svgd-canvas.tool-select { cursor:default; } .svgd-sel { outline:none; } .svgd-selbox { fill:none; stroke:#8b5cf6; stroke-width:1.5; stroke-dasharray:5 4; vector-effect:non-scaling-stroke; pointer-events:none; } @@ -294,6 +294,9 @@ } svg.addEventListener('pointerup', endDraw); svg.addEventListener('pointercancel', endDraw); + // Block native HTML5 drag (the lesson block-card is draggable=true; without + // this, pressing on the canvas drags the whole block instead of drawing). + svg.addEventListener('dragstart', function (e) { e.preventDefault(); }); function isTiny(el) { const b = el.getBBox(); diff --git a/frontend/lesson-editor.html b/frontend/lesson-editor.html index 41ccdf7..2976211 100644 --- a/frontend/lesson-editor.html +++ b/frontend/lesson-editor.html @@ -1320,6 +1320,8 @@ // drag and drop card.setAttribute('draggable', 'true'); card.addEventListener('dragstart', e => { + // не перехватывать холст SVG-рисовалки — там пользователь рисует + if (e.target.closest && e.target.closest('.svgdraw-host')) { e.preventDefault(); return; } e.dataTransfer.setData('text/plain', bid); card.classList.add('dragging'); });