diff --git a/public/css/teach.css b/public/css/teach.css index fca1291..828a62c 100644 --- a/public/css/teach.css +++ b/public/css/teach.css @@ -1362,8 +1362,10 @@ body.hc .am-reset,body.hc .am-reset-row{border:1.5px solid #000; background:var( +- of bordenknop, waardoor "steeds" het bordenpaneel of +-menu (→ afbeeldingenscherm) opende. Nu ligt de tekenbalk in een eigen laag bóven de knoppenrij (hij groeit omhoog, dus dit klopt bij elke - schermbreedte), en houden + en borden de onderrand voor zichzelf. */ - #hud{left:8px; right:8px; bottom:88px; transform:none; max-width:none; justify-content:center;} + schermbreedte), en houden + en borden de onderrand voor zichzelf. + Gecentreerd op inhoudsbreedte (geen vaste randen), zodat de balk + geminimaliseerd ook echt smal is. */ + #hud{bottom:88px; max-width:calc(100vw - 16px);} /* beheerpaneel: dichte rijen worden gestapeld i.p.v. verdrukt */ .am-row{flex-direction:column; align-items:stretch;} diff --git a/public/js/board.js b/public/js/board.js index c7f43c0..fdabac9 100644 --- a/public/js/board.js +++ b/public/js/board.js @@ -508,7 +508,9 @@ function refreshPenbar(){ penbar.querySelector('[data-picker="sizes"] .pen-current').title = T("penSize"); const currentBg = penbar.querySelector(".pen-current-bg"); currentBg.className = "pen-current-bg bg-"+BOARD.bg; - penbar.querySelector('[data-picker="backgrounds"] .pen-current').title = T(PEN_BGS.find(x=>x[0]===BOARD.bg)[1]); + /* onbekende (oude/corrupte) bg-waarde mag nooit de hele hydrate laten + crashen - dat logde de gebruiker stilletjes uit bij het verversen */ + penbar.querySelector('[data-picker="backgrounds"] .pen-current').title = T((PEN_BGS.find(x=>x[0]===BOARD.bg) || PEN_BGS[0])[1]); penbar.querySelector('[data-picker="extras"] .pen-current').title = T("penExtras"); penbar.querySelector(".pen-recent-label").textContent = T("recentColors"); penbar.querySelector(".pen-palette-label").textContent = T("paletteColors"); diff --git a/public/js/core.js b/public/js/core.js index 9c0db0c..726cf2f 100644 --- a/public/js/core.js +++ b/public/js/core.js @@ -2,7 +2,7 @@ "use strict"; /* version — shown until /api/version resolves (or if the fetch fails, e.g. offline). Kept in sync by hand with the VERSION file at the repo root on every release. */ -const VERSION = "0.3.63-beta"; +const VERSION = "0.3.64-beta"; (function(){ const tag = document.getElementById("verTag"); tag.textContent = "v"+VERSION; diff --git a/public/js/widgets/anchor.js b/public/js/widgets/anchor.js index 76b2124..60076da 100644 --- a/public/js/widgets/anchor.js +++ b/public/js/widgets/anchor.js @@ -121,21 +121,13 @@ function mountAnchor(root, initState, opts){ setPic(pic, wPic); }else{ /* no automatic match (or not tried yet) - stays empty, but doubles as a - shortcut to manually pick a picture instead of showing a fake anchor icon */ + shortcut to manually pick a picture instead of showing a fake anchor icon. + Geen eigen pointer/click-handlers meer: die blokkeerden het pannen en + openden de kiezer bij elke veeg die op dit vak begon (op telefoons was + dat vrijwel elke aanraking). De tik loopt nu via de stage-logica + hieronder, mét de sleep-drempel. */ pic.classList.add("an-pic-empty"); - if(!readonly){ - pic.title = T("pickPic"); - pic.addEventListener("pointerdown", ev=>ev.stopPropagation()); - pic.addEventListener("click", ev=>{ - ev.stopPropagation(); - openPicPicker(normWord, chosen=>{ - S.pics[normWord] = chosen; - syncSource(); - render(); - persistWords(); - }); - }); - } + if(!readonly) pic.title = T("pickPic"); } c.appendChild(pic); const span = document.createElement("span"); @@ -180,7 +172,8 @@ function mountAnchor(root, initState, opts){ stage.setPointerCapture(e.pointerId); const sc = stage.getBoundingClientRect().width / stage.offsetWidth; pd = { x:e.clientX/sc, y:e.clientY/sc, px:S.pan.x, py:S.pan.y, - moved:false, target:e.target.closest(".an-cell"), sc }; + moved:false, target:e.target.closest(".an-cell"), + pic:e.target.closest(".an-pic-empty"), sc }; }); stage.addEventListener("pointermove", e=>{ if(!pd) return; @@ -190,10 +183,25 @@ function mountAnchor(root, initState, opts){ }); stage.addEventListener("pointerup", ()=>{ if(!pd) return; - const {moved, target} = pd; + const {moved, target, pic} = pd; pd = null; if(moved){ render(); return; } - if(target && !readonly) editCell(target); + if(readonly || !target) return; + /* stilstaande tik op een leeg plaatjesvak: plaatje kiezen voor dat woord */ + if(pic){ + const cell = S.cells[key(+target.dataset.gx, +target.dataset.gy)]; + const normWord = cell && cell.t && cell.t.trim().toLowerCase(); + if(normWord){ + openPicPicker(normWord, chosen=>{ + S.pics[normWord] = chosen; + syncSource(); + render(); + persistWords(); + }); + return; + } + } + editCell(target); }); stage.addEventListener("pointercancel", ()=>{ const moved = pd && pd.moved;