Update edit.html

edit.html

@@ -213,7 +213,41 @@ function render(){
   if(!ov)return;const old=ov.querySelector('.editing');
   if(old){const o=objs.find(x=>x.id===editing);if(o)o.draft=old.innerText.replace(/\n$/,'');old.onblur=null}
   ov.innerHTML='';ov.className='overlay '+(mode==='text'?'t':mode==='select'?'s':'c');if(tl)tl.classList.toggle('on',mode==='select');
-  if(mode==='text')for(const bk of blocks){const d=document.createElement('div');d.className='blk';d.title='Click to edit';d.style.cssText=`left:${bk.x*zoom}px;top:${(bk.y-ASC*bk.size)*zoom}px;width:${bk.w*zoom}px;height:${bk.size*1.2*zoom}px`;d.onpointerdown=e=>{e.stopPropagation();e.preventDefault();editBlock(bk)};ov.appendChild(d)}
+  if(mode==='text')for(const bk of blocks){
+    const d=document.createElement('div');d.className='blk';d.title='Click to edit · drag to move';
+    d.style.cssText=`left:${bk.x*zoom}px;top:${(bk.y-ASC*bk.size)*zoom}px;width:${bk.w*zoom}px;height:${bk.size*1.2*zoom}px`;
+    d.onpointerdown=e=>{
+      e.stopPropagation();e.preventDefault();
+      if(e.button!==0)return;
+      const sx=e.clientX,sy=e.clientY;let moved=false,created=null;
+      const mv=ev=>{
+        const dx=ev.clientX-sx,dy=ev.clientY-sy;
+        if(!moved&&Math.hypot(dx,dy)>4){
+          moved=true;
+          endEdit();
+          const key=page+':'+Math.round(bk.x)+':'+Math.round(bk.y);
+          created=objs.find(o=>o.key===key&&o.type==='text');
+          if(!created){editBlock(bk);created=objs.find(o=>o.key===key&&o.type==='text');editing=null}
+          if(created){snap();sel=created.id;d.style.opacity='.35'}
+        }
+        if(moved&&created){
+          created.x=Math.max(0,bk.x+dx/zoom);
+          created.y=Math.max(0,bk.y-BL(created.family||fam(bk))*bk.size+dy/zoom);
+          const item=ov.querySelector('.item[data-id="'+created.id+'"]');
+          if(item){item.style.left=created.x*zoom+'px';item.style.top=created.y*zoom+'px'}
+          syncFT();
+        }
+      };
+      const up=ev=>{
+        removeEventListener('pointermove',mv);removeEventListener('pointerup',up);removeEventListener('pointercancel',up);
+        d.style.opacity='';
+        if(moved&&created){render();toast('Text moved. Original position is covered.')}
+        else editBlock(bk);
+      };
+      addEventListener('pointermove',mv);addEventListener('pointerup',up);addEventListener('pointercancel',up);
+    };
+    ov.appendChild(d)
+  }
   for(const o of objs.filter(o=>o.page===page)){
     const el=document.createElement('div'),s=el.style;el.className='item '+o.type+(sel===o.id?' sel':'');el.dataset.id=o.id;s.left=o.x*zoom+'px';s.top=o.y*zoom+'px';
     if(o.type==='text'){
@@ -284,11 +318,27 @@ function setMode(m){endEdit();if(m===mode&&m!=='text')m='text';mode=m;if(m!=='te
 document.querySelectorAll('#tb [data-mode]').forEach(b=>b.onclick=()=>setMode(b.dataset.mode));
 $('imageInput').onchange=e=>{const f=e.target.files[0];if(!f)return;const r=new FileReader();r.onload=()=>{const im=new Image();im.onload=()=>{const k=Math.min(1,220/im.width);add({type:'image',x:40,y:40,w:im.width*k,h:im.height*k,src:r.result})};im.src=r.result};r.readAsDataURL(f);e.target.value=''};
 $('undoBtn').onclick=()=>{const s=undo.pop();if(s){objs=JSON.parse(s);sel=editing=null;render()}$('undoBtn').disabled=!undo.length};
-addEventListener('keydown',e=>{if(editing||/INPUT|SELECT/.test(document.activeElement.tagName))return;
+addEventListener('keydown',e=>{
+  const mod=e.ctrlKey||e.metaKey;
+  if(mod&&e.key.toLowerCase()==='v'&&clip&&doc&&mode==='text'){
+    e.preventDefault();e.stopPropagation();
+    const c=JSON.parse(clip);c.id=uid();c.page=page;delete c.key;delete c.orig;delete c.st;
+    const r=ov.getBoundingClientRect();
+    if(Number.isFinite(window.lastPointerX)&&Number.isFinite(window.lastPointerY)){
+      c.x=Math.max(0,(window.lastPointerX-r.left)/zoom);
+      c.y=Math.max(0,(window.lastPointerY-r.top)/zoom);
+    }else{c.x+=14;c.y+=14}
+    snap();objs.push(c);sel=c.id;editing=null;render();toast('Copied object pasted here.');return;
+  }
+  if(editing&&!(mod&&['c','x'].includes(e.key.toLowerCase())))return;
+  if(/INPUT|SELECT|TEXTAREA/.test(document.activeElement.tagName))return;
   if((e.key==='Delete'||e.key==='Backspace')&&sel){e.preventDefault();del()}
-  if((e.ctrlKey||e.metaKey)&&e.key==='z'){e.preventDefault();$('undoBtn').click()}
-  if((e.ctrlKey||e.metaKey)&&e.key==='c'&&sel){const o=cur();if(o){clip=JSON.stringify(o);try{if(o.type==='text'&&navigator.clipboard&&o.text)navigator.clipboard.writeText(o.text).catch(()=>{});}catch(_){}toast('Object copied. Use Ctrl+V to duplicate it on a page.')}}
-  if((e.ctrlKey||e.metaKey)&&e.key==='v'&&clip&&doc&&mode==='text'){e.preventDefault();const c=JSON.parse(clip);c.id=uid();c.page=page;delete c.key;delete c.orig;delete c.st;c.x+=14;c.y+=14;snap();objs.push(c);sel=c.id;clip=JSON.stringify(c);render()}});
+  if(mod&&e.key.toLowerCase()==='z'){e.preventDefault();$('undoBtn').click()}
+  if(mod&&e.key.toLowerCase()==='c'&&sel){
+    const o=cur();if(o){clip=JSON.stringify(o);e.preventDefault();toast('Object copied. Click the destination, then press Ctrl+V to paste.')}
+  }
+});
+document.addEventListener('pointermove',e=>{window.lastPointerX=e.clientX;window.lastPointerY=e.clientY},{passive:true});
 const go=n=>{if(n<1||n>pages)return;endEdit();page=n;sel=editing=null;draw()};
 $('prevBtn').onclick=()=>go(page-1);$('nextBtn').onclick=()=>go(page+1);
 $('zoomIn').onclick=()=>{endEdit();zoom=Math.min(3,zoom+.15);draw()};$('zoomOut').onclick=()=>{endEdit();zoom=Math.max(.5,zoom-.15);draw()};