diff --git a/VERSION b/VERSION
index 9b6937f..591d9ab 100644
--- a/VERSION
+++ b/VERSION
@@ -1 +1 @@
-0.3.62-beta
+0.3.63-beta
diff --git a/public/css/teach.css b/public/css/teach.css
index 926ee41..7a4d52e 100644
--- a/public/css/teach.css
+++ b/public/css/teach.css
@@ -460,6 +460,16 @@
}
.dock-item:hover{background:var(--surface-2); transform:translateY(-2px);}
.dock-item .di{font-size:16px; line-height:1;}
+ /* sluitknop op de dock-pil: geminimaliseerde widgets zijn direct te sluiten */
+ .dock-item .dock-close{
+ display:flex; align-items:center; justify-content:center;
+ width:20px; height:20px; margin:-2px -6px -2px 0; border-radius:7px;
+ font-size:11px; color:var(--muted); line-height:1;
+ }
+ .dock-item .dock-close:hover{background:var(--red-soft); color:var(--red);}
+ @media (pointer:coarse){
+ .dock-item .dock-close{width:28px; height:28px;}
+ }
.widget-head{
display:flex; align-items:center; gap:10px; padding:10px 14px;
background:rgba(255,255,255,.4); border-bottom:1px solid rgba(150,170,200,.28);
diff --git a/public/js/board.js b/public/js/board.js
index ff191f6..f7fa4cc 100644
--- a/public/js/board.js
+++ b/public/js/board.js
@@ -60,12 +60,24 @@ const REGISTRY = [
];
const WIDGET_CATS = [["favorites","galleryFavorites"],["taal","catTaal"],["rekenen","catRekenen"],["class","catClass"],["tools","catTools"],["media","catMedia"]];
-/* houdt een (opgeslagen of standaard) widgetgrootte binnen het bord - zonder
- dit passen desktop-formaten (tot 760px breed) niet op een telefoon/tablet */
+/* houdt een (opgeslagen of standaard) widgetgrootte binnen het bord. Op een
+ telefoon is de beschikbare ruimte leidend: een desktop-minimum van bv.
+ 640px mag daar niet alsnog horizontale overflow afdwingen. */
+function widgetSizeBounds(def, left=0, top=0){
+ const maxW = Math.max(1, board.clientWidth - left - 8);
+ const maxH = Math.max(1, board.clientHeight - top - 8);
+ return {
+ minW: Math.min(def.minW || 240, maxW),
+ minH: Math.min(def.minH || 180, maxH),
+ maxW, maxH,
+ };
+}
function clampWidgetSize(w, h, def){
- const fw = Math.max(def.minW || 240, Math.min(w, board.clientWidth));
- const fh = Math.max(def.minH || 180, Math.min(h, board.clientHeight));
- return { w: fw, h: fh };
+ const {minW,minH,maxW,maxH} = widgetSizeBounds(def);
+ return {
+ w: Math.max(minW, Math.min(w, maxW)),
+ h: Math.max(minH, Math.min(h, maxH)),
+ };
}
/* stabiel widget-instantie-id, zelfde patroon als genBoardId() verderop - nodig
@@ -148,9 +160,14 @@ function makeWidget(def, saved){
win.style.display = "none";
pill = document.createElement("button");
pill.className = "dock-item";
- pill.innerHTML = `${def.icon}`;
+ pill.innerHTML = `${def.icon}✕`;
pill.querySelector(".dl").textContent = T("wg_"+def.id);
pill.title = T("wMax");
+ /* ook een geminimaliseerde widget is direct te sluiten, zonder hem
+ eerst terug op het bord te hoeven zetten */
+ const x = pill.querySelector(".dock-close");
+ x.title = T("close");
+ x.addEventListener("click", e=>{ e.stopPropagation(); removeWidget(); });
pill.addEventListener("click", ()=>setMin(false));
dock.appendChild(pill);
}else if(!m && pill){
@@ -206,7 +223,11 @@ function makeWidget(def, saved){
minBtn.title = T("wMin");
maxBtn.title = T(win.dataset.max==="1" ? "wUnfull" : "wFull");
zBtn.title = T("wZoom");
- if(pill){ pill.querySelector(".dl").textContent = T("wg_"+def.id); pill.title = T("wMax"); }
+ if(pill){
+ pill.querySelector(".dl").textContent = T("wg_"+def.id);
+ pill.title = T("wMax");
+ pill.querySelector(".dock-close").title = T("close");
+ }
};
setTitle();
document.addEventListener("langchange", setTitle);
@@ -233,11 +254,13 @@ function makeWidget(def, saved){
dupBtn.title=T("widgetDuplicate");dupBtn.setAttribute("aria-label",dupBtn.title);previewBtn.title=T("widgetPreview");previewBtn.setAttribute("aria-label",previewBtn.title);
dupBtn.addEventListener("click",()=>makeWidget(def,{x:win.offsetLeft+28,y:win.offsetTop+28,w:win.offsetWidth,h:win.offsetHeight,wz:+win.dataset.wz||1,state:api.getState?structuredClone(api.getState()):null}));
instances.add(inst);
- close.addEventListener("click", ()=>{
+ /* gedeeld sluitpad voor de ✕ in de widgetkop én de ✕ op de dock-pil */
+ function removeWidget(){
markBoardChange();
if(pill){ pill.remove(); pill = null; }
instances.delete(inst); win.remove(); updateEmptyHint();
- });
+ }
+ close.addEventListener("click", removeWidget);
updateEmptyHint();
markBoardChange();
return inst;
diff --git a/public/js/core.js b/public/js/core.js
index c84debb..9c0db0c 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.62-beta";
+const VERSION = "0.3.63-beta";
(function(){
const tag = document.getElementById("verTag");
tag.textContent = "v"+VERSION;