archaeopteryx 3.20.0 → 3.21.0

package/README.md

@@ -166,7 +166,7 @@ using `viewer.destroy()` to switch trees in place.
 ## Using the visualizations
 
 A tree opens **already coloured** by its most informative field — the viewer
-inspects what the tree carries (taxonomy, sequence fields, custom properties)
+inspects what the tree carries (taxonomy, sequence fields, metadata)
 and decides by itself what is worth showing. There is nothing to configure.
 
 * The **Color** and **Shape** menus (top of the control panel) list every
@@ -1072,7 +1072,7 @@ a popup any more, and nothing fails silently.
 | **Newick** / New Hampshire (`.nwk`, `.nh`, `.tre`) | in / out | The base tree: topology, names, branch lengths, and bracketed confidence values. | [1] |
 | **NHX** — New Hampshire eXtended | in | `[&&NHX:...]` tags riding on Newick: taxonomy (`S=`, `T=`), sequence (`GN=`, `AC=`), support (`B=`), duplication/speciation events (`D=`). | [2] |
 | **Nexus** (`.nex`, `.nexus`) | in / out | One file for the tree(s) and, in a `CHARACTERS`/`DATA` block, an aligned protein/DNA/RNA matrix (sequential or interleaved) — the tree and its alignment together. | [3] |
-| **phyloXML** (`.xml`) | in / out | The richest native format: taxonomy, sequences and alignments, dates, confidences, branch colours and arbitrary custom properties. | [4] |
+| **phyloXML** (`.xml`) | in / out | The richest native format: taxonomy, sequences and alignments, dates, confidences, branch colours and arbitrary metadata (custom properties). | [4] |
 | **Auspice / Nextstrain** `dataset.json` (v2) | in | Phylodynamic builds: sampling dates and their confidence, cumulative divergence, and discrete traits (country, clade, host, ...) with their posterior distributions. | [5] |
 | **BEAST** / BEAST 2 / TreeAnnotator annotations | in (embedded in Newick/Nexus) | `[&posterior=...,height_95%_HPD={lo,hi},rate=...]`-style blobs: posterior clade support, node-age confidence intervals, per-branch rates and other traits. FigTree's `!color` is read the same way. | [6, 7] |
 | **MrBayes** annotations | in (embedded in Newick/Nexus) | `prob=`/`prob.stddev=` blobs: posterior-probability clade support. | [8] |
@@ -1379,8 +1379,8 @@ copy-pastable JSON.
 | `layout` | `'rectangular'` | The starting layout: `'rectangular'`, `'circular'`, or `'unrooted'`. |
 | `ladderizeTree` | `true` | Ladderize the tree on load: at each node, the larger clade first (any number of children, so a polytomy sorts too). |
 | `showMsa` | tree-derived | Open with the alignment track shown. Default: on when the tree carries an aligned `mol_seq`, off otherwise — an explicit `true`/`false` overrides that. |
-| `showProperties` | tree-derived | Open with the nodes' property values in their labels. Default: off, unless the file's figure setting (`show.SHOW_PROPERTIES=true`) says on. See [Properties in the label](#properties-in-the-label). |
-| `labelProperties` | tree-derived | Which properties the label shows, in order, as an array of refs (`['BVBRC:species', 'BVBRC:host_name']`). Default: the figure setting's `labelprops`, else `null` — every property but the heat map's columns. |
+| `showProperties` | tree-derived | Open with the nodes' metadata (their phyloXML properties) in their labels — the **Metadata** checkbox. Default: off, unless the file's figure setting (`show.SHOW_PROPERTIES=true`) says on. See [Metadata in the label](#metadata-in-the-label). |
+| `labelProperties` | tree-derived | Which metadata fields the label shows, in order, as an array of refs (`['BVBRC:species', 'BVBRC:host_name']`). Default: the figure setting's `labelprops`, else `null` — every property but the heat map's columns. |
 | `showMsaLogo` | `false` | Open with the alignment summarised as a sequence logo instead of a conservation bar: a stack of letters per column, as tall as its information content, over the tips currently on screen. Only drawn while the alignment track is shown. |
 | `showHeatmap` | tree-derived | Open with the heat map shown. Offered whenever the tree carries two or more numeric per-tip fields, but off unless asked for — almost any annotated tree has such fields, so turning it on by itself would be an opinion about the tree rather than a service — or unless the file's own figure setting (`aptx:figure`, see [Heat maps](#heat-maps)) draws them as a matrix. |
 | `heatmapColumnOrder` | tree-derived | How the heat map's columns are ordered: `'document'` (as the file lists them), `'clustered'` (Euclidean), `'clustered-presence'` (Bray–Curtis), `'alphabetical'`, `'frequency'`. The clustered modes also draw the dendrogram. Default: a **clustered** order, with the distance chosen from the values — Bray–Curtis where the matrix has zeros to ignore and nothing negative, Euclidean otherwise. An explicit value always wins and is never re-derived. |
@@ -1877,24 +1877,26 @@ rather than 300 identical "Influenz.." labels).
 Both menus live in the single control panel, above Display Data, which is where
 the desktop puts them.
 
-### Properties in the label
+### Metadata in the label
 
 A tip's other fields — a species, a host, a country, anything a node carries
-as a `<property>` — can go into its label, as on the desktop. **Properties**
-under Display Data (offered when nodes carry properties, off by default) adds
-their **values** after the rest of the label, joined by ` | ` as the rest of the
+as a `<property>` — are its **metadata**, and they can go into its label, as
+on the desktop. **Metadata** under Display Data (offered when nodes carry
+any, off by default) adds the **values** after the rest of the label, joined by ` | ` as the rest of the
 label is: `255457.3 | Brucella lupini | host`, or `Brucella lupini` alone with
 Node Name off. (The desktop joins them with `, `; a pipe was chosen here
 because values often contain commas — a host such as `Bottlenose dolphin,
-Tursiops truncatus`.) A unit follows its value. With nothing chosen, every property shows in the
-node's own order, except the heat map's columns while it is shown — a field
-has one display role. **Label fields…** picks which properties, and in what
-order; picking one turns Properties on. The checkbox and the fields travel in
-a shared view (`show=…,properties`, `labelFields=`), and the config keys are
+Tursiops truncatus`.) A unit follows its value. With nothing chosen, every
+field shows in the node's own order, except the heat map's columns while it is
+shown — a field has one display role. **Metadata fields…** picks which fields
+(tick them; **All** and **None** tick and untick the lot) and in what order
+(drag a row, or use its arrows); Apply keeps the ticked ones in the order
+shown, and picking a field turns Metadata on. The checkbox and the fields
+travel in a shared view (`show=…,properties`, `labelFields=`), and the config keys are
 `showProperties` and `labelProperties`.
 
 A file can choose for itself: the desktop's figure setting (`aptx:figure`,
-see [Heat maps](#heat-maps)) carries `labelprops=` (the properties, in order)
+see [Heat maps](#heat-maps)) carries `labelprops=` (the fields, in order)
 and the display switches `show.SHOW_PROPERTIES=true` and
 `show.SHOW_NODE_NAMES=false`, and a tree opens labelled that way in both
 programs. The config wins over the file.
@@ -2178,7 +2180,7 @@ child arrangement and `ladderizeTree` rewrites it — measured, one file once ga
 only mode that is **not** normalised first — being left alone is the whole point
 of it. It is set by the **Reorder columns…** dialog, which drags or arrow-keys a
 list of the columns as drawn; applying it writes `heatmapManualOrder` and sets
-the mode, exactly as the desktop's Annotation Fields arrows switch a tab to
+the mode, exactly as the desktop's Metadata Fields arrows switch a tab to
 Manual. (Theirs also chooses which fields are columns and of what type; ours
 takes every numeric field automatically, so the dialog is about order alone.)
 Choosing Manual from the menu with nothing arranged yet freezes the order on

package/archaeopteryx.js

@@ -20,7 +20,7 @@
  *
  */
 
-// v 3.20.0
+// v 3.21.0
 // 2026-09-17
 //
 // Archaeopteryx.js is a software tool for the visualization and
@@ -103,7 +103,7 @@ function (root, d3, forester, phyloXml) {
     // IIFE's own function name -- a plain object says what it is.)
     let archaeopteryx = {};
 
-    const VERSION = '3.20.0';
+    const VERSION = '3.21.0';
     const WEBSITE = 'https://cmzmasek.github.io/archaeopteryx-js/';
     const DESKTOP_WEBSITE = 'https://cmzmasek.github.io/archaeopteryx/';
     const SOURCE_WEBSITE = 'https://github.com/cmzmasek/archaeopteryx-js';
@@ -9227,6 +9227,63 @@ function (root, d3, forester, phyloXml) {
     // The same rule as the desktop's resolveEdited, minus its "did the order
     // actually change" test, which it needs only because its dialog does other
     // things too.
+    // Drag a row of a reorder list -- the heat map's columns, the label's
+    // metadata fields -- to a new place. The LIVE node is moved rather than
+    // the list redrawn (a redraw would replace the element the drag is
+    // following), its position read back from the DOM each time, and
+    // `working` moved with it; `draw` runs once the pointer is released. A
+    // press on a control in the row (an arrow, a checkbox) is not a drag.
+    // Shared, so that both dialogs drag the same way: the rows' cursor
+    // promised a drag the fields chooser did not have (Christian, 2026-10-01).
+    function attachReorderDrag(list, row, working, draw) {
+        function rowAt(y) {
+            let rows = Array.prototype.slice.call(list.children);
+            for (let i = 0; i < rows.length; ++i) {
+                let b = rows[i].getBoundingClientRect();
+                if (y < b.top + (b.height / 2)) {
+                    return i;
+                }
+            }
+            return rows.length;
+        }
+        row.addEventListener('pointerdown', function (event) {
+            if (event.target.closest('button, input')) {
+                return;
+            }
+            event.preventDefault();
+            row.classList.add('aptx-reorder-dragging');
+            let onMove = function (ev) {
+                let kids = Array.prototype.slice.call(list.children);
+                let from = kids.indexOf(row);
+                let to = rowAt(ev.clientY);
+                if (to > from) {
+                    to -= 1;   // taking the row out shifts everything after it up one
+                }
+                if (to === from || to < 0 || to >= kids.length) {
+                    return;
+                }
+                working.splice(to, 0, working.splice(from, 1)[0]);
+                let others = kids.filter(function (k) {
+                    return k !== row;
+                });
+                list.insertBefore(row, others[to] || null);
+                Array.prototype.slice.call(list.children).forEach(function (r, k) {
+                    let btns = r.querySelectorAll('.aptx-reorder-move');
+                    btns[0].disabled = (k === 0);
+                    btns[1].disabled = (k === list.children.length - 1);
+                });
+            };
+            let onUp = function () {
+                row.classList.remove('aptx-reorder-dragging');
+                window.removeEventListener('pointermove', onMove);
+                window.removeEventListener('pointerup', onUp);
+                draw();
+            };
+            window.addEventListener('pointermove', onMove);
+            window.addEventListener('pointerup', onUp);
+        });
+    }
+
     function showHeatmapReorderDialog() {
         let ordered = heatmapOrdered();
         if (!ordered || ordered.columns.length < 2) {
@@ -9239,17 +9296,6 @@ function (root, d3, forester, phyloXml) {
         let list = repsElement(body, 'div', 'aptx-reorder');
         let working = ordered.columns.slice();
 
-        function rowAt(y) {
-            let rows = Array.prototype.slice.call(list.children);
-            for (let i = 0; i < rows.length; ++i) {
-                let b = rows[i].getBoundingClientRect();
-                if (y < b.top + (b.height / 2)) {
-                    return i;
-                }
-            }
-            return rows.length;
-        }
-
         function move(from, to) {
             if (to < 0 || to >= working.length || from === to) {
                 return false;
@@ -9296,49 +9342,7 @@ function (root, d3, forester, phyloXml) {
                         list.children[i + d].focus();
                     }
                 });
-                row.addEventListener('pointerdown', function (event) {
-                    if (event.target.classList.contains('aptx-reorder-move')) {
-                        return;   // the arrows are not a drag handle
-                    }
-                    event.preventDefault();
-                    row.classList.add('aptx-reorder-dragging');
-                    // The LIVE node is moved rather than the list redrawn: a
-                    // redraw would replace the element this drag is following.
-                    // Its position is read back from the DOM each time instead
-                    // of being tracked in a variable -- the first cut kept an
-                    // index, updated it, and then used it to work out where to
-                    // insert, by which point it no longer meant what the
-                    // calculation assumed.
-                    let onMove = function (ev) {
-                        let kids = Array.prototype.slice.call(list.children);
-                        let from = kids.indexOf(row);
-                        let to = rowAt(ev.clientY);
-                        if (to > from) {
-                            to -= 1;   // taking the row out shifts everything after it up one
-                        }
-                        if (to === from || to < 0 || to >= kids.length) {
-                            return;
-                        }
-                        working.splice(to, 0, working.splice(from, 1)[0]);
-                        let others = kids.filter(function (k) {
-                            return k !== row;
-                        });
-                        list.insertBefore(row, others[to] || null);
-                        Array.prototype.slice.call(list.children).forEach(function (r, k) {
-                            let btns = r.querySelectorAll('.aptx-reorder-move');
-                            btns[0].disabled = (k === 0);
-                            btns[1].disabled = (k === list.children.length - 1);
-                        });
-                    };
-                    let onUp = function () {
-                        row.classList.remove('aptx-reorder-dragging');
-                        window.removeEventListener('pointermove', onMove);
-                        window.removeEventListener('pointerup', onUp);
-                        draw();
-                    };
-                    window.addEventListener('pointermove', onMove);
-                    window.addEventListener('pointerup', onUp);
-                });
+                attachReorderDrag(list, row, working, draw);
             });
         }
         draw();
@@ -13777,7 +13781,7 @@ function (root, d3, forester, phyloXml) {
     }
 
     // Which properties the label shows, and in what order: each field ticked
-    // or not, and moved with the arrows (or the arrow keys). Apply keeps the ticked
+    // or not, and moved by dragging, with the arrows, or with the arrow keys. Apply keeps the ticked
     // ones in the order shown; picking a field that was not shown turns the
     // Properties label on, as the desktop does, since otherwise choosing it
     // would visibly do nothing. "All" goes back to every field.
@@ -13810,10 +13814,10 @@ function (root, d3, forester, phyloXml) {
         }).map(function (w) {
             return w.ref;
         });
-        let shell = makeDialogShell(LABEL_FIELDS_DIALOG, 'Label fields', 340);
+        let shell = makeDialogShell(LABEL_FIELDS_DIALOG, 'Metadata fields', 340);
         let body = shell.body;
         repsElement(body, 'div', 'aptx-reps-lead',
-            'Tick the properties the labels show, and set their order with the arrows.');
+            'Tick the metadata fields the labels show; drag a field, or use the arrows, to set their order.');
         let list = repsElement(body, 'div', 'aptx-reorder');
 
         function move(from, to) {
@@ -13830,6 +13834,7 @@ function (root, d3, forester, phyloXml) {
             working.forEach(function (w, i) {
                 let row = repsElement(list, 'div', 'aptx-reorder-row');
                 row.tabIndex = 0;
+                repsElement(row, 'span', 'aptx-reorder-grip', '≡');
                 let box = repsElement(row, 'input', 'aptx-reorder-check');
                 box.type = 'checkbox';
                 box.checked = w.on;
@@ -13871,15 +13876,26 @@ function (root, d3, forester, phyloXml) {
                         list.children[i + d].focus();
                     }
                 });
+                attachReorderDrag(list, row, working, draw);
             });
         }
         draw();
 
         let actions = repsElement(body, 'div', 'aptx-reps-actions');
+        // All and None tick the boxes and leave the dialog open for Apply --
+        // All used to mean "back to the default" and close at once, which
+        // read as the dialog vanishing (Christian, 2026-10-01)
+        let tickAll = function (on) {
+            working.forEach(function (w) {
+                w.on = on;
+            });
+            draw();
+        };
         repsButton(actions, 'All', false, function () {
-            _state.labelProperties = null;
-            shell.dialog.close();
-            scheduleUpdate();
+            tickAll(true);
+        });
+        repsButton(actions, 'None', false, function () {
+            tickAll(false);
         });
         repsButton(actions, 'Cancel', false, function () {
             shell.dialog.close();
@@ -14100,7 +14116,7 @@ function (root, d3, forester, phyloXml) {
         }
         let part = subtreeExtentNote();
         items.push({heading: part ? 'Tree: ' + part : 'Tree'});
-        items.push({label: 'phyloXML', detail: 'keeps everything the tree carries: taxonomy, sequences, dates, properties',
+        items.push({label: 'phyloXML', detail: 'keeps everything the tree carries: taxonomy, sequences, dates, metadata',
             action: entry(PHYLOXML_EXPORT_FORMAT)});
         items.push({label: 'Newick', detail: 'names, branch lengths and support values only',
             action: entry(NH_EXPORT_FORMAT)});
@@ -14111,7 +14127,7 @@ function (root, d3, forester, phyloXml) {
         // Fasta entries) -- on any other tree the download would be empty
         items.push({heading: part ? 'Tip data: ' + part : 'Tip data'});
         items.push({label: 'TSV', detail: 'a table, one row per tip: names, taxonomy, sequence names, '
-            + 'branch lengths and every property', action: entry(TSV_EXPORT_FORMAT)});
+            + 'branch lengths and every metadata field', action: entry(TSV_EXPORT_FORMAT)});
         if (_basicTreeProperties && _basicTreeProperties.maxMolSeqLength > 0) {
             items.push({label: 'FASTA', detail: 'every molecular sequence the tips carry',
                 action: entry(FASTA_EXPORT_FORMAT)});
@@ -15874,7 +15890,7 @@ function (root, d3, forester, phyloXml) {
                 }
             }
             if (rows) {
-                text += 'Properties<br>' + rows;
+                text += 'Metadata<br>' + rows;
             }
         }
         return text;
@@ -16290,7 +16306,7 @@ function (root, d3, forester, phyloXml) {
             carries('Events', true, parts.join(', '));
         }
         st.propertyRefs.forEach(function (r) {
-            carries('Property ' + r.ref, true, statOf(r.nodes, st.nodes, 'nodes'));
+            carries('Metadata ' + r.ref, true, statOf(r.nodes, st.nodes, 'nodes'));
         });
         if (carried === 0) {
             treePropRow(box, 'Annotations', 'none, names and topology only');
@@ -17152,8 +17168,10 @@ function (root, d3, forester, phyloXml) {
                 labels.push(makeCheckboxItem('Sequence', SEQUENCE_CB, 'to show/hide node sequence information'));
             }
             if (labelFields().length > 0) {
-                labels.push(makeCheckboxItem('Properties', PROPERTIES_CB, 'to show/hide the nodes\' property values'
-                    + ' (Label fields… chooses which, and in what order)'));
+                // "Metadata", not phyloXML's "properties" (Christian, 2026-10-01):
+                // the word the users' own tools use for these fields
+                labels.push(makeCheckboxItem('Metadata', PROPERTIES_CB, 'to show/hide the nodes\' metadata (phyloXML'
+                    + ' properties: species, host, …) in their labels; Metadata fields… chooses which, and in what order'));
             }
             if (_nodeLabels) {
                 for (const [key, value] of Object.entries(_nodeLabels)) {
@@ -17238,9 +17256,9 @@ function (root, d3, forester, phyloXml) {
             h = h.concat(makeCheckboxGroup('Labels', labels));
             if (labelFields().length > 0) {
                 h = h.concat('<div class="aptx-domrow"><span class="aptx-domlabel"></span>'
-                    + '<input type="button" class="aptx-widebtn" value="Label fields…" name="' + LABEL_FIELDS_BUTTON
-                    + '" id="' + LABEL_FIELDS_BUTTON + '" title="choose which properties the labels show, and in what'
-                    + ' order"></div>');
+                    + '<input type="button" class="aptx-widebtn" value="Metadata fields…" name="' + LABEL_FIELDS_BUTTON
+                    + '" id="' + LABEL_FIELDS_BUTTON + '" title="choose which metadata fields the labels show, and in'
+                    + ' what order"></div>');
             }
             h = h.concat(makeCheckboxGroup('Nodes', nodes));
             h = h.concat(makeCheckboxGroup('Options', opts));
@@ -17500,12 +17518,12 @@ function (root, d3, forester, phyloXml) {
             h = h.concat('<fieldset>');
             h = h.concat('<legend>Visualizations</legend>');
             if (hasColorVisualizations()) {
-                h = h.concat(makeSelectMenu('Color by:', '<br>', LABEL_COLOR_SELECT_MENU, 'colorize the node label and the node itself according to a property'));
+                h = h.concat(makeSelectMenu('Color by:', '<br>', LABEL_COLOR_SELECT_MENU, 'colorize the node label and the node itself by a field the tree carries'));
                 h = h.concat('<br>');
                 h = h.concat('<br>');
             }
             if (hasShapeVisualizations()) {
-                h = h.concat(makeSelectMenu('Shape:', '<br>', NODE_SHAPE_SELECT_MENU, 'change the node shape according to a property'));
+                h = h.concat(makeSelectMenu('Shape:', '<br>', NODE_SHAPE_SELECT_MENU, 'change the node shape by a field the tree carries'));
                 h = h.concat('<br>');
             }
             h = h.concat('</fieldset>');

package/forester.js

@@ -20,7 +20,7 @@
  *
  */
 
-// v 3.20.0
+// v 3.21.0
 // 2026-09-17
 //
 // forester.js is a general suite for dealing with phylogenetic trees.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "archaeopteryx",
-  "version": "3.20.0",
+  "version": "3.21.0",
   "description": "Archaeopteryx.js is a software tool for the visualization and analysis of highly annotated phylogenetic trees.",
   "main": "archaeopteryx.js",
   "types": "archaeopteryx.d.ts",