v0.3.31-beta: geef ankerdiagrammen een prominentere plek

- Ankerwidget staat nu vooraan in de widgetbibliotheek (eerste kaart)
- Nieuw ⚓-item in het ＋-menu: plaatst direct een ankerdiagram op het bord
- Duidelijkere uitleg wat een ankerdiagram is (woordweb voor
  woordenschatonderwijs: woorden in samenhang rond een themawoord leren),
  in de bibliotheekkaart, de widget-hint en het ＋-menu-label (nl/en)

VERSION

@@ -1 +1 @@
-0.3.30-beta
+0.3.31-beta

public/index.html

@@ -44,6 +44,7 @@
 </div>
 <div id="fabmenu">
   <button class="fab-item" data-f="widgets"><span class="fi">🧩</span><span class="fl"></span></button>
+  <button class="fab-item" data-f="anchor"><span class="fi">⚓</span><span class="fl"></span></button>
   <button class="fab-item" data-f="draw"><span class="fi">✏️</span><span class="fl"></span></button>
   <button class="fab-item" data-f="mind"><span class="fi">🕸️</span><span class="fl"></span></button>
   <button class="fab-item" data-f="img"><span class="fi">🖼️</span><span class="fl"></span></button>

public/js/board.js

@@ -27,11 +27,13 @@ let zTop = 10, widgetCount = 0;
 const instances = new Set();
 
 const REGISTRY = [
+  /* het ankerwidget staat bewust vooraan: het woordweb voor woordenschat-
+     onderwijs is de kern van de taalkant en verdient de prominentste plek */
+  { id:"anchor", cat:"taal", icon:"⚓", w:680, h:500, minW:440, minH:340, mount:mountAnchor },
   { id:"letters", cat:"taal", icon:"🔤", w:760, h:640, minW:640, minH:540, mount:mountLetterGame },
   { id:"flits", cat:"taal", icon:"⚡", w:520, h:430, minW:400, minH:330, mount:mountFlits },
   { id:"hak",   cat:"taal", icon:"✂️", w:540, h:440, minW:420, minH:340, mount:mountHak },
   { id:"ball",  cat:"taal", icon:"🎈", w:620, h:560, minW:480, minH:440, mount:mountBall },
-  { id:"anchor", cat:"taal", icon:"⚓", w:680, h:500, minW:440, minH:340, mount:mountAnchor },
   { id:"sentence", cat:"taal", icon:"🧩", w:620, h:520, minW:400, minH:360, mount:mountSentence },
   { id:"madd", cat:"rekenen", icon:"➕", w:460, h:620, minW:380, minH:520, mount:(r,s,o)=>mountMath(r,s,"add",o) },
   { id:"msub", cat:"rekenen", icon:"➖", w:460, h:620, minW:380, minH:520, mount:(r,s,o)=>mountMath(r,s,"sub",o) },
@@ -843,6 +845,7 @@ const fab = document.getElementById("fab");
 const fabMenu = document.getElementById("fabmenu");
 function refreshFab(){
   fabMenu.querySelector('[data-f="widgets"] .fl').textContent = T("fabWidgets");
+  fabMenu.querySelector('[data-f="anchor"] .fl').textContent = T("fabAnchor");
   fabMenu.querySelector('[data-f="draw"] .fl').textContent = T("fabDraw");
   fabMenu.querySelector('[data-f="mind"] .fl').textContent = T("fabMind");
   fabMenu.querySelector('[data-f="img"] .fl').textContent = T("fabImg");
@@ -865,6 +868,10 @@ fabMenu.querySelector('[data-f="widgets"]').addEventListener("click", ()=>{
   fabMenu.classList.remove("open"); fab.classList.remove("open");
   renderTemplates(); renderGallery(); galleryWrap.classList.add("open");
 });
+fabMenu.querySelector('[data-f="anchor"]').addEventListener("click", ()=>{
+  fabMenu.classList.remove("open"); fab.classList.remove("open");
+  makeWidget(REGISTRY.find(d=>d.id==="anchor"));
+});
 fabMenu.querySelector('[data-f="draw"]').addEventListener("click", ()=>{
   fabMenu.classList.remove("open"); fab.classList.remove("open");
   setPen(!document.body.classList.contains("pen"));

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.30-beta";
+const VERSION = "0.3.31-beta";
 (function(){
   const tag = document.getElementById("verTag");
   tag.textContent = "v"+VERSION;
@@ -106,7 +106,8 @@ const I18N = {
     wg_hak:"Hakken & plakken", wg_hak_d:"Woorden in klanken hakken en weer plakken, met voorlezen.",
     hakChop:"✂️ Hak", hakGlue:"🔗 Plak", hakSay:"🔊 Lees voor",
     wg_ball:"Ballonnenwoord", wg_ball_d:"Raad het woord letter voor letter voordat de ballonnen knappen.",
-    wg_anchor:"Ankerwoorden", wg_anchor_d:"Onbeperkt woordraster rond een thema: elk woord hoort bij de woorden eromheen.",
+    wg_anchor:"Ankerwoorden", wg_anchor_d:"Woordweb voor woordenschatonderwijs: leer woorden in samenhang rond een themawoord (het anker), met plaatjes. Elk woord verankert aan de woorden eromheen.",
+    fabAnchor:"Ankerdiagram (woordweb)",
     wg_birthday:"Verjaardagstaart", wg_birthday_d:"Maak een persoonlijke taart met naam, leeftijd, kleuren, lagen, versiering en kaarsjes.",
     birthdayName:"naam van de jarige", birthdayAge:"Leeftijd", birthdayLayers:"Lagen", birthdayCakeColor:"Taart", birthdayIcing:"Glazuur", birthdayPlate:"Bord",
     birthdayCandles:"Kaarsjes", birthdayCelebrate:"🎉 Vieren!", birthdayTitle:"Er is er één jarig!", birthdayFor:"Hoera voor {name}!",
@@ -126,7 +127,7 @@ const I18N = {
     wg_sentence:"Zinsbouwer", wg_sentence_d:"Bouw zinnen met kleurgecodeerde zinsdelen en voeg eigen woorden toe.",
     sentence_who:"Wie?", sentence_does:"Doet wat?", sentence_what:"Wat of waar?", sentenceHint:"Kies woorden om een zin te maken…",
     sentenceAdd:"eigen woord of zinsdeel…", sentenceClear:"Wissen", sentenceSpeak:"🔊 Lees voor", sentenceRemove:"Verwijder woord",
-    anchorPh:"thema…", anchorHint:"Tik op een vak en typ · sleep de achtergrond om te schuiven",
+    anchorPh:"thema…", anchorHint:"Woordweb: zet het themawoord in het midden en bouw eromheen · tik op een vak en typ · sleep om te schuiven",
     anchorHintReadonly:"Sleep de achtergrond om te schuiven",
     anchorColor:"Kleur: klik om te wisselen (verbind woorden met dezelfde kleur)",
     ballWin:"Geraden! 🎉", ballLose:"Helaas! Het woord was:",
@@ -289,7 +290,8 @@ const I18N = {
     wg_hak:"Chop & blend", wg_hak_d:"Chop words into sounds and blend them back, with read-aloud.",
     hakChop:"✂️ Chop", hakGlue:"🔗 Blend", hakSay:"🔊 Read aloud",
     wg_ball:"Balloon word", wg_ball_d:"Guess the word letter by letter before the balloons pop.",
-    wg_anchor:"Anchor words", wg_anchor_d:"Unlimited word grid around a theme: every word relates to its neighbours.",
+    wg_anchor:"Anchor words", wg_anchor_d:"Word web for vocabulary teaching: learn words in meaningful clusters around a theme word (the anchor), with pictures. Every word anchors to its neighbours.",
+    fabAnchor:"Anchor diagram (word web)",
     wg_birthday:"Birthday cake", wg_birthday_d:"Create a personal cake with a name, age, colours, layers, decorations and candles.",
     birthdayName:"birthday person's name", birthdayAge:"Age", birthdayLayers:"Layers", birthdayCakeColor:"Cake", birthdayIcing:"Icing", birthdayPlate:"Plate",
     birthdayCandles:"Candles", birthdayCelebrate:"🎉 Celebrate!", birthdayTitle:"Someone has a birthday!", birthdayFor:"Hooray for {name}!",
@@ -309,7 +311,7 @@ const I18N = {
     wg_sentence:"Sentence builder", wg_sentence_d:"Build sentences with colour-coded parts and add your own words.",
     sentence_who:"Who?", sentence_does:"Does what?", sentence_what:"What or where?", sentenceHint:"Choose words to build a sentence…",
     sentenceAdd:"your own word or phrase…", sentenceClear:"Clear", sentenceSpeak:"🔊 Read aloud", sentenceRemove:"Remove word",
-    anchorPh:"theme…", anchorHint:"Tap a cell and type · drag the background to pan",
+    anchorPh:"theme…", anchorHint:"Word web: put the theme word in the middle and build around it · tap a cell and type · drag to pan",
     anchorHintReadonly:"Drag the background to pan",
     anchorColor:"Colour: click to cycle (connect words with the same colour)",
     ballWin:"You got it! 🎉", ballLose:"Oh no! The word was:",