archaeopteryx 3.12.0 → 3.14.0

package/archaeopteryx.js

@@ -20,7 +20,7 @@
  *
  */
 
-// v 3.12.0
+// v 3.14.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.12.0';
+    const VERSION = '3.14.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';
@@ -414,6 +414,7 @@ function (root, d3, forester, phyloXml) {
     const BRANCH_SCALE_TIME_BUTTON = 'branch_scale_time_b';
     const BRANCH_SCALE_DIV_BUTTON = 'branch_scale_div_b';
     const ABOUT_DIALOG = 'aptx_about';
+    const TREE_PROPERTIES_DIALOG = 'aptx_tree_props';
     const PROG_NAME = 'progname';
     const PROGNAMELINK = 'prognamelink';
     const TREE_DESC = 'tree_desc';
@@ -423,8 +424,6 @@ function (root, d3, forester, phyloXml) {
     const RETURN_TO_SUPERTREE_BUTTON_BY_ONE = 'ret1_b';
     const SEARCH_FIELD_0 = 'sf0';
     const SEARCH_FIELD_1 = 'sf1';
-    const SEARCH_B_WRAP = 'search_b_wrap';
-    const SEARCH_B_TOGGLE = 'search_b_tgl';
     const SEARCH_NAV_ROW = 'searchnavrow';
     const SEARCH_NAV_PREV = 'searchnavprev';
     const SEARCH_NAV_NEXT = 'searchnavnext';
@@ -4088,8 +4087,15 @@ function (root, d3, forester, phyloXml) {
     };
 
 
+    // A branch length of ZERO is a length and gets a label. Testing the
+    // number for truthiness read 0 as "no branch length", so the one branch
+    // whose length is worth pointing out -- two identical sequences, a
+    // multifurcation written out as a run of zero-length branches -- was the
+    // one drawn bare. Same mistake the phyloXML writer was making until
+    // phyloxml 1.1.1; the desktop cannot make it at all, because it marks an
+    // absent length with a sentinel (-1024) rather than with zero.
     let makeBranchLengthLabel = function (phynode) {
-        if (phynode.branch_length) {
+        if (phynode.branch_length !== undefined && phynode.branch_length !== null) {
             if (_state.phylogram && _state.minBranchLengthValueToShow && phynode.branch_length < _state.minBranchLengthValueToShow) {
                 return;
             }
@@ -4117,7 +4123,9 @@ function (root, d3, forester, phyloXml) {
         if (_state.showConfidenceValues && support.length > 0
             && (!_state.minConfidenceValueToShow || support.some(function (c) { return c.value >= _state.minConfidenceValueToShow; }))) {
             support.forEach(function (c) {
-                if (c.value) {
+                // a support of 0 is a support value, and a telling one: the
+                // MAD branch above already tested it this way
+                if (typeof c.value === 'number' && isFinite(c.value)) {
                     parts.push(+c.value.toFixed(CONFIDENCE_VALUE_DIGITS_DEFAULT));
                 }
             });
@@ -7358,8 +7366,11 @@ function (root, d3, forester, phyloXml) {
                 msaScrollTo(Infinity);
             });
 
-            // "column [ 1234 ] - 1357 of 30,000": the box is the left edge of
-            // the window and takes a column to jump to; the rest reads back
+            // "column [ 1234 ] 1357 of 30,000": the box is the left edge of
+            // the window and takes a column to jump to; the rest reads back.
+            // No dash between them -- the box's own border already separates
+            // the two numbers, and a dash sitting against it read as a minus
+            // sign on the number after it.
             let read = document.createElement('span');
             read.className = 'aptx-msa-nav-read';
             let lbl = document.createElement('span');
@@ -7409,7 +7420,7 @@ function (root, d3, forester, phyloXml) {
                 _msaNav._jump.value = String(offset + 1);
             }
             _msaNav._jump.max = String(total);
-            _msaNav._tail.textContent = '\u2013 ' + (offset + visible).toLocaleString()
+            _msaNav._tail.textContent = (offset + visible).toLocaleString()
                 + ' of ' + total.toLocaleString();
             let atStart = offset <= 0;
             let atEnd = offset >= total - visible;
@@ -9291,9 +9302,6 @@ function (root, d3, forester, phyloXml) {
         if (want.value) {
             openPanelSection('Search');   // a view carrying a search shows it
         }
-        if (idx === 1 && want.value) {
-            showSearchB();
-        }
     }
 
     // The panel's controls from the state, after applyViewState
@@ -9568,6 +9576,7 @@ function (root, d3, forester, phyloXml) {
         {key: 'g', label: 'G', shift: true, what: 'Previous search hit', run: function () { stepToFoundNode(-1); }, typing: true},
         {key: ',', label: '<', aliases: ['<'], shift: true, what: 'Previous tree of the file', run: function () { stepTree(-1); }},
         {key: '.', label: '>', aliases: ['>'], shift: true, what: 'Next tree of the file', run: function () { stepTree(1); }},
+        {key: 'i', label: 'I', what: 'Tree properties and statistics', run: showTreePropertiesDialog},
         {key: '/', label: '/', aliases: ['?'], what: 'This list', run: showShortcutsDialog, typing: true}
     ];
 
@@ -10429,30 +10438,6 @@ function (root, d3, forester, phyloXml) {
         });
     }
 
-    // Search B starts hidden to keep the panel compact; one click (or a
-    // configured initial value) reveals it, and it stays revealed.
-    // Search B is folded away until wanted: the '+ Search B' link (which
-    // focuses it) or a view that carries a second search.
-    function showSearchB() {
-        openPanelSection('Search');
-        let wrap = byId(SEARCH_B_WRAP);
-        if (wrap) {
-            wrap.style.display = '';
-        }
-        let tgl = byId(SEARCH_B_TOGGLE);
-        if (tgl) {
-            tgl.style.display = 'none';
-        }
-    }
-
-    function revealSearchB() {
-        showSearchB();
-        let f = byId(SEARCH_FIELD_1);
-        if (f) {
-            f.focus();
-        }
-    }
-
     // ===================== Time axis =====================
     // The desktop's time overlays, drawn beneath a rectangular PHYLOGRAM of
     // a dated tree: the two-band ICS geologic axis with a "Ma before
@@ -11441,8 +11426,6 @@ function (root, d3, forester, phyloXml) {
         }
         if (_state.searchBinitialValue) {
             setValue(SEARCH_FIELD_1, _state.searchBinitialValue);
-            revealSearchB();
-
         } else {
             setValue(SEARCH_FIELD_1, '');
         }
@@ -11757,7 +11740,7 @@ function (root, d3, forester, phyloXml) {
         if (matches.length > SUGGEST_MAX_ROWS) {
             let more = document.createElement('div');
             more.className = 'aptx-suggest-more';
-            more.textContent = (matches.length - SUGGEST_MAX_ROWS) + ' more — keep typing';
+            more.textContent = (matches.length - SUGGEST_MAX_ROWS) + ' more, keep typing';
             box.appendChild(more);
         }
         document.body.appendChild(box);
@@ -12184,7 +12167,7 @@ function (root, d3, forester, phyloXml) {
         }
         item.classList.toggle('aptx-check-active', !!active);
         item.title = active
-            ? item.dataset.baseTitle + ' — hiding now: 1 in ' + _dynahide_factor + ' labels shown'
+            ? item.dataset.baseTitle + ', hiding now: 1 in ' + _dynahide_factor + ' labels shown'
             : item.dataset.baseTitle;
     }
 
@@ -12539,7 +12522,13 @@ function (root, d3, forester, phyloXml) {
             let open = panelSections(panel).filter(function (s) {
                 return !s.fieldset.classList.contains('aptx-collapsed') && s.name !== justOpened;
             });
-            if (open.length === 0) {
+            // Never the one just opened -- that is the one the user asked
+            // for -- and never the last one standing. Without the second
+            // clause a container dragged short enough empties the panel down
+            // to a stack of legends, taking away the section being worked in.
+            // (justOpened is itself open and excluded from this list, so when
+            // it is set the last one standing is already protected above.)
+            if (open.length === 0 || (!justOpened && open.length === 1)) {
                 return;
             }
             open.sort(function (a, b) {
@@ -12808,6 +12797,15 @@ function (root, d3, forester, phyloXml) {
     }
 
     // The theme toggle, showing the theme it will switch TO.
+    // A circled "i": the tree-properties button. The stem is a stroke and the
+    // tittle a filled dot, so both keep their shape at the 20px the header
+    // button draws them at.
+    function glyphInfo() {
+        return '<circle cx="50" cy="50" r="40"/>'
+            + glyphLine(50, 45, 50, 71)
+            + glyphDot(50, 29, 5.5);
+    }
+
     function glyphSun() {
         let s = glyphDot(50, 50, 20);
         for (let i = 0; i < 8; ++i) {
@@ -12875,6 +12873,7 @@ function (root, d3, forester, phyloXml) {
             case 'uncollapse_all': sw = 8.5; cap = 'round'; body = glyphUncollapseAll(); break;
             case 'tree_prev': sw = 9; cap = 'round'; body = glyphChevron(false); break;
             case 'tree_next': sw = 9; cap = 'round'; body = glyphChevron(true); break;
+            case 'info': sw = 7; cap = 'round'; body = glyphInfo(); break;
             case 'sun': body = glyphSun(); break;
             case 'moon': body = glyphMoon(); break;
             default: throw new Error('unknown control-panel glyph: ' + kind);
@@ -13013,7 +13012,14 @@ function (root, d3, forester, phyloXml) {
             + '@media (prefers-reduced-motion:reduce){ .aptx-busy-dot { animation:none;'
             + '  border-color:var(--p-accent); } }'
             + '.aptx-busy-sub { color:var(--p-muted); }'
+            // The same frosted glass as the node menu and the suggestion list:
+            // --p-bg is deliberately translucent (0.86) so panels float over
+            // the tree, but without the blur a dialog puts dense text straight
+            // on top of whatever is behind it -- and over an alignment or a
+            // heat map that is a rainbow. The menus had the blur from the
+            // start; the dialogs were simply missed.
             + '.aptx-dialog { padding:0; border:1px solid var(--p-line-strong); border-radius:12px;'
+            + '  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);'
             + '  background:var(--p-bg); color:var(--p-ink); max-width:92vw;'
             + '  box-shadow:0 24px 48px -16px rgba(23,34,46,0.45),0 4px 12px -4px rgba(23,34,46,0.22);'
             + '  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;'
@@ -13058,6 +13064,9 @@ function (root, d3, forester, phyloXml) {
             + '.aptx-dialog-key { flex:0 0 42%; color:var(--p-muted); }'
             + '.aptx-dialog-val { flex:1 1 auto; min-width:0; overflow-wrap:anywhere; }'
             // the shortcuts cheat sheet: key chips in the key column
+            + '.aptx-props .aptx-props-head { font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--p-muted); margin:12px 0 3px; }'
+            + '.aptx-props > div:first-child { margin-top:0; }'
+            + '.aptx-props .aptx-dialog-key { flex-basis:46%; }'
             + '.aptx-shortcuts .aptx-dialog-key { flex-basis:38%; display:flex; align-items:center; }'
             + '.aptx-shortcuts .aptx-dialog-val { align-self:center; }'
             + '.aptx-keys { display:inline-flex; gap:3px; flex-wrap:wrap; }'
@@ -13212,7 +13221,7 @@ function (root, d3, forester, phyloXml) {
             + '.aptx-panel .aptx-seg:has(> input:checked) { background:var(--p-accent); color:#fff; }'
             + '.aptx-panel .aptx-seg:has(> input:disabled) { opacity:0.4; cursor:default; }'
             + '.aptx-panel .aptx-actions { margin-left:auto; display:flex; align-items:center; gap:5px; }'
-            + '.aptx-panel .aptx-theme-btn { flex:none; width:20px; height:20px; display:grid; place-items:center; padding:0; border:1px solid var(--p-line-strong); border-radius:6px; background:var(--p-surface2); color:var(--p-muted); cursor:pointer; font-size:12px; line-height:1; }'
+            + '.aptx-panel .aptx-theme-btn, .aptx-panel .aptx-info-btn { flex:none; width:20px; height:20px; display:grid; place-items:center; padding:0; border:1px solid var(--p-line-strong); border-radius:6px; background:var(--p-surface2); color:var(--p-muted); cursor:pointer; font-size:12px; line-height:1; }'
             + '.aptx-panel .aptx-theme-btn:hover { background:var(--p-accent-weak); color:var(--p-accent-ink); border-color:var(--p-accent); }'
             + '.aptx-panel input[type=range] { -webkit-appearance:none; appearance:none; display:block; width:100%; height:15px; margin:2px 0 9px; padding:0; background:transparent; cursor:pointer; }'
             + '.aptx-panel input[type=range]::-webkit-slider-runnable-track { height:4px; border-radius:999px; background:var(--p-line-strong); }'
@@ -13246,8 +13255,6 @@ function (root, d3, forester, phyloXml) {
             + '.aptx-panel .aptx-slider-row { display:flex; align-items:center; gap:7px; margin:3px 0; }'
             + '.aptx-panel .aptx-slider-row label { flex:0 0 42px; font-size:10px; color:var(--p-muted); }'
             + '.aptx-panel .aptx-slider-row input[type=range] { flex:1 1 auto; min-width:0; margin:0; }'
-            + '.aptx-panel .aptx-linkbtn { background:none; border:0; padding:1px 0 2px; margin:0; font:inherit; font-size:10px; color:var(--p-accent); cursor:pointer; display:block; }'
-            + '.aptx-panel .aptx-linkbtn:hover { text-decoration:underline; }'
             // one row, its buttons sharing it evenly, its edges on the zoom rows'
             + '.aptx-panel .aptx-toolrow { margin-top:5px; display:flex; gap:3px; }'
             + '.aptx-panel .aptx-toolrow .aptx-gbtn { flex:1 1 0; min-width:0; padding:0; margin:2px 0; }'
@@ -13369,6 +13376,24 @@ function (root, d3, forester, phyloXml) {
             let actions = document.createElement('div');
             actions.className = 'aptx-actions';
 
+            let infoBtn = document.createElement('button');
+            infoBtn.type = 'button';
+            // NOT aptx-theme-btn: applyPanelTheme repaints the innerHTML of
+            // every element carrying that class with the sun/moon, so
+            // borrowing it for the chrome replaced this glyph the instant a
+            // theme was applied. The two share their styling through the CSS
+            // selector instead, which is all the class was wanted for.
+            infoBtn.className = 'aptx-info-btn';
+            infoBtn.title = 'Tree properties and statistics ('
+                + (IS_MAC ? '\u2318I' : 'Ctrl+I') + ')';
+            infoBtn.setAttribute('aria-label', 'Tree properties and statistics');
+            infoBtn.innerHTML = makeGlyph('info');
+            infoBtn.addEventListener('click', function (e) {
+                e.stopPropagation();
+                showTreePropertiesDialog();
+            });
+            actions.appendChild(infoBtn);
+
             let progName = header.querySelector('.' + PROGNAMELINK);
             if (progName) {
                 // Clicking the title used to navigate away to the project site;
@@ -13455,6 +13480,20 @@ function (root, d3, forester, phyloXml) {
         // spare, since the user opened none of them just now.
         fitPanelSections(panel, null);
 
+        // ... and again whenever the room changes. The panel is held to its
+        // container's height, so a window dragged shorter (or a host resizing
+        // the div around us) can push an arrangement that fitted a moment ago
+        // into a scrollbar. Watching the CONTAINER, not the panel: folding a
+        // section changes the panel's height and would re-enter the observer.
+        // One-way on purpose -- growing the window back does NOT reopen what
+        // was folded. What is open is the user's choice; only running out of
+        // room may overrule it, and then only far enough to fit.
+        if (typeof ResizeObserver !== 'undefined' && panel.parentElement) {
+            new ResizeObserver(function () {
+                fitPanelSections(panel, null);
+            }).observe(panel.parentElement);
+        }
+
         // Apply the current light/dark choice to this (and every) panel.
         applyPanelTheme();
     }
@@ -13599,7 +13638,8 @@ function (root, d3, forester, phyloXml) {
         if (d.name) {
             text += 'Name: ' + d.name + '<br>';
         }
-        if (d.branch_length && !(unrooted && d.children)) {
+        if (d.branch_length !== undefined && d.branch_length !== null
+            && !(unrooted && d.children)) {
             text += (unrooted ? 'Branch length: ' : 'Distance to parent: ') + d.branch_length + '<br>';
         }
         let date = dateText(d.date);
@@ -13927,6 +13967,257 @@ function (root, d3, forester, phyloXml) {
         shell.dialog.showModal();
     }
 
+    // ===================== Tree properties =====================
+    // What the tree IS and what it carries: the desktop's View > Tree
+    // Properties, read-only (Christian, 2026-09-23 -- the editable half waits
+    // for demand). Nothing else in the viewer answers "what is actually in
+    // this file", which is the first question a tree raises.
+    //
+    // Computed FRESH every time it opens rather than cached: the whole of
+    // collectBasicTreeProperties costs 7ms on the 13,246-tip H5N1 demo, and a
+    // cache would go stale the moment the user re-roots or enters a subtree.
+    // It describes what is ON SCREEN, so in a subtree it describes the
+    // subtree, and says so.
+    //
+    // Every value goes in through textContent. Tree names, descriptions and
+    // identifiers are file data, and file data never becomes markup.
+
+    function treePropRow(parent, label, value) {
+        if (value === null || value === undefined || value === '') {
+            return;
+        }
+        let line = document.createElement('div');
+        line.className = 'aptx-dialog-line';
+        let k = document.createElement('span');
+        k.className = 'aptx-dialog-key';
+        k.textContent = label;
+        let v = document.createElement('span');
+        v.className = 'aptx-dialog-val';
+        v.textContent = String(value);
+        line.appendChild(k);
+        line.appendChild(v);
+        parent.appendChild(line);
+    }
+
+    function treePropSection(body, title) {
+        let h = document.createElement('div');
+        h.className = 'aptx-props-head';
+        h.textContent = title;
+        body.appendChild(h);
+        let box = document.createElement('div');
+        body.appendChild(box);
+        return box;
+    }
+
+    function countNumber(n) {
+        return (typeof n === 'number' && isFinite(n)) ? n.toLocaleString() : null;
+    }
+
+    // A number for a fact row: thousands separators for counts, and enough
+    // significant digits for a branch length, which can be 5e-9.
+    function statNumber(v, digits) {
+        if (typeof v !== 'number' || !isFinite(v)) {
+            return null;
+        }
+        if (v === 0 || (Math.abs(v) >= 0.001 && Math.abs(v) < 1e7)) {
+            return String(forester.roundNumber(v, digits === undefined ? 6 : digits));
+        }
+        return v.toExponential(3);
+    }
+
+    // "1,234 of 5,678 tips", the desktop's coverage phrasing.
+    function statOf(part, whole, noun) {
+        if (!(whole > 0)) {
+            return null;
+        }
+        return countNumber(part) + ' of ' + countNumber(whole) + (noun ? (' ' + noun) : '');
+    }
+
+    // n / minimum / median / maximum / mean, the block Christian asked for in
+    // place of a histogram. One shape, used for branch lengths and for each
+    // kind of support, so the two read the same way.
+    function statSpread(box, d, digits) {
+        treePropRow(box, 'Minimum', statNumber(d.min, digits));
+        treePropRow(box, 'Median', statNumber(d.median, digits));
+        treePropRow(box, 'Maximum', statNumber(d.max, digits));
+        treePropRow(box, 'Mean', statNumber(d.mean, digits));
+    }
+
+    function showTreePropertiesDialog() {
+        if (!_root) {
+            return;
+        }
+        let shell = makeDialogShell(TREE_PROPERTIES_DIALOG, 'Tree properties', 420);
+        shell.body.classList.add('aptx-props');
+        // A description is free text and can be a paragraph, and the coverage
+        // section grows with the annotations, so the body scrolls rather than
+        // running off the screen.
+        shell.body.style.maxHeight = '66vh';
+        shell.body.style.overflowY = 'auto';
+        let st = forester.treeStatistics(_root);
+        let bp = forester.collectBasicTreeProperties(_root);
+        let time = forester.timeAxisInfo(_root);
+        let phy = _treeData || {};
+
+        // --- what the tree says it is ---------------------------------
+        let box = treePropSection(shell.body, 'Tree');
+        treePropRow(box, 'Name', phy.name);
+        treePropRow(box, 'Description', phy.description);
+        if (phy.id && phy.id.value) {
+            treePropRow(box, 'Identifier', phy.id.provider
+                ? (phy.id.value + '  (' + phy.id.provider + ')') : phy.id.value);
+        }
+        treePropRow(box, 'Type', phy.type);
+        treePropRow(box, 'Branch-length unit', phy.branch_length_unit);
+        // Only when the FILE said so. phyloXML has a rooted attribute and a
+        // Nexus tree statement has [&R]/[&U]; plain Newick says nothing, and a
+        // properties dialog that answered "yes" there would be reporting our
+        // writing default as though the file had stated it.
+        if (typeof phy.rooted === 'boolean') {
+            treePropRow(box, 'Rooted', phy.rooted ? 'yes' : 'no');
+        }
+        if (typeof phy.rerootable === 'boolean') {
+            treePropRow(box, 'Rerootable', phy.rerootable ? 'yes' : 'no');
+        }
+        if (_trees && _trees.length > 1) {
+            treePropRow(box, 'In this file', 'tree ' + (_treeIndex + 1) + ' of ' + _trees.length);
+        }
+        if (_in_subtree) {
+            treePropRow(box, 'Showing', 'a subtree, not the whole tree');
+        }
+        if (!box.firstChild) {
+            treePropRow(box, 'Name', '(the tree carries no name or metadata)');
+        }
+
+        // --- shape ----------------------------------------------------
+        box = treePropSection(shell.body, 'Structure');
+        treePropRow(box, 'Tips', countNumber(st.tips));
+        treePropRow(box, 'Internal nodes', countNumber(st.internal));
+        treePropRow(box, 'Nodes, total', countNumber(st.nodes));
+        treePropRow(box, 'Branches', countNumber(st.branches));
+        treePropRow(box, 'Branching', st.polytomies === 0 ? 'fully binary'
+            : (countNumber(st.polytomies) + (st.polytomies === 1 ? ' polytomy' : ' polytomies')
+                + ', widest ' + countNumber(st.maxChildren) + ' children'));
+        treePropRow(box, 'Depth', countNumber(st.depth) + ' (root to deepest tip)');
+        // ours, not the desktop's, and worth keeping: the label width is what
+        // decides how much room the tree needs, and whether internal nodes are
+        // named decides whether their labels are worth turning on
+        treePropRow(box, 'Longest tip label', bp.longestNodeName > 0
+            ? (countNumber(bp.longestNodeName)
+                + (bp.longestNodeName === 1 ? ' character' : ' characters')) : null);
+        treePropRow(box, 'Internal nodes named', st.internal > 0
+            ? (st.namedInternal > 0 ? statOf(st.namedInternal, st.internal) : 'none') : null);
+
+        // --- branch lengths -------------------------------------------
+        box = treePropSection(shell.body, 'Branch lengths');
+        if (st.branchLengths) {
+            treePropRow(box, 'Branches with a length',
+                statOf(st.branchLengths.n, st.branches));
+            statSpread(box, st.branchLengths);
+            treePropRow(box, 'Sum', statNumber(st.branchLengths.sum) + ' (total tree length)');
+            treePropRow(box, 'Height', statNumber(st.height) + ' (root to farthest tip)');
+            if (st.branchLengths.zero > 0) {
+                treePropRow(box, 'Zero-length', countNumber(st.branchLengths.zero));
+            }
+            if (st.branchLengths.negative > 0) {
+                treePropRow(box, 'Negative', countNumber(st.branchLengths.negative)
+                    + ' (not drawn to scale)');
+            }
+            treePropRow(box, 'Ultrametric', st.ultrametric
+                ? 'yes (every tip the same distance from the root)' : 'no');
+        } else {
+            treePropRow(box, 'Branches with a length', 'none, the tree has no lengths');
+        }
+
+        // --- support, one section per kind ----------------------------
+        // A bootstrap and a posterior on the same branch are not on one scale,
+        // so they are never pooled: each type gets its own n and spread.
+        st.support.forEach(function (d) {
+            // 'unknown' is what the Newick and Nexus readers put on a bare
+            // [95]: those formats have one support slot and nowhere to name
+            // what it is, so it is an absence of type rather than a type
+            // called unknown, and it should not head a section as one.
+            let untyped = !d.type || d.type === 'unknown';
+            let title = (st.support.length === 1 && untyped)
+                ? 'Support values' : ('Support: ' + (untyped ? 'untyped' : d.type));
+            let sbox = treePropSection(shell.body, title);
+            treePropRow(sbox, 'Branches with support', statOf(d.n, st.branches));
+            statSpread(sbox, d);
+        });
+
+        // --- what came with it ----------------------------------------
+        box = treePropSection(shell.body, 'The tree carries');
+        let carried = 0;
+        function carries(label, present, detail) {
+            if (!present) {
+                return;
+            }
+            ++carried;
+            treePropRow(box, label, detail || 'yes');
+        }
+        carries('Taxonomies', st.tipsWithTaxonomy > 0, statOf(st.tipsWithTaxonomy, st.tips, 'tips')
+            + (st.distinctTaxonomies > 0 ? (', ' + countNumber(st.distinctTaxonomies) + ' distinct') : ''));
+        carries('Taxonomy identifiers', st.tipsWithTaxonomyId > 0,
+            statOf(st.tipsWithTaxonomyId, st.tips, 'tips'));
+        carries('Sequences', st.tipsWithSequence > 0, statOf(st.tipsWithSequence, st.tips, 'tips'));
+        // alignedMolSeqs starts TRUE and is only ever set false, so it means
+        // "no UNALIGNED sequence was seen" -- a tree carrying no sequences at
+        // all reports true. Read alone it told the flu and ammonite demos they
+        // had an alignment. Every other reader in this file pairs it with a
+        // length for the same reason.
+        carries('Molecular sequences', st.tipsWithMolSeq > 0,
+            statOf(st.tipsWithMolSeq, st.tips, 'tips')
+            + (bp.alignedMolSeqs && bp.maxMolSeqLength > 0
+                ? (', aligned, ' + countNumber(bp.maxMolSeqLength) + ' columns') : ''));
+        carries('Domain architectures', st.tipsWithDomains > 0,
+            statOf(st.tipsWithDomains, st.tips, 'tips')
+            + (bp.maxDomainArchitectureLength > 0
+                ? (', up to ' + countNumber(bp.maxDomainArchitectureLength) + ' residues') : ''));
+        carries('Dates', st.nodesWithDate > 0, statOf(st.nodesWithDate, st.nodes, 'nodes'));
+        carries('Distributions', st.tipsWithDistribution > 0,
+            statOf(st.tipsWithDistribution, st.tips, 'tips'));
+        carries('MAD values', bp.madValues);
+        carries('Branch colours', bp.branchColors);
+        if (st.nodesWithEvents > 0) {
+            let parts = [];
+            if (st.duplications > 0) {
+                parts.push(countNumber(st.duplications)
+                    + (st.duplications === 1 ? ' duplication' : ' duplications'));
+            }
+            if (st.speciations > 0) {
+                parts.push(countNumber(st.speciations)
+                    + (st.speciations === 1 ? ' speciation' : ' speciations'));
+            }
+            parts.push(statOf(st.nodesWithEvents, st.nodes, 'nodes'));
+            carries('Events', true, parts.join(', '));
+        }
+        st.propertyRefs.forEach(function (r) {
+            carries('Property ' + r.ref, true, statOf(r.nodes, st.nodes, 'nodes'));
+        });
+        if (carried === 0) {
+            treePropRow(box, 'Annotations', 'none, names and topology only');
+        }
+
+        // --- time -----------------------------------------------------
+        if (time && (time.type || time.dated)) {
+            box = treePropSection(shell.body, 'Time');
+            treePropRow(box, 'Dates', time.type === 'geologic'
+                ? 'geologic ages' : (time.type === 'calendar' ? 'calendar years' : 'yes'));
+            treePropRow(box, 'Dated nodes', statOf(st.nodesWithDate, st.nodes, 'nodes')
+                + (time.dated ? ' (a dated tree)' : ''));
+            if (time.type === 'geologic' && time.rootAge > 0) {
+                treePropRow(box, 'Oldest node', statNumber(time.rootAge, 4) + ' Ma');
+            }
+            if (time.type === 'calendar' && time.presentDate > 0) {
+                treePropRow(box, 'Most recent tip', statNumber(time.presentDate, 4));
+            }
+            treePropRow(box, 'Confidence intervals',
+                (time.hasInternalIntervals || time.hasExternalIntervals) ? 'yes' : null);
+        }
+
+        shell.dialog.showModal();
+    }
+
     // The About box behind the panel's title. Everything here is fixed text and
     // fixed URLs -- no tree data reaches it -- so the links are built as real
     // elements rather than markup.
@@ -14241,7 +14532,6 @@ function (root, d3, forester, phyloXml) {
         on(CONFIDENCE_VALUES_CB, 'click', confidenceValuesCbClicked);
         on(SUPPORT_DOTS_CB, 'click', supportDotsCbClicked);
         on(MAD_VALUES_CB, 'click', madValuesCbClicked);
-        on(SEARCH_B_TOGGLE, 'click', revealSearchB);
         on(SEARCH_NAV_PREV, 'click', function () {
             stepToFoundNode(-1);
         });
@@ -14985,14 +15275,14 @@ function (root, d3, forester, phyloXml) {
             h = h.concat('<fieldset>');
             h = h.concat('<legend>Search</legend>');
             h = h.concat(makeSearchBox('Search A', 0));
-            // Search B starts hidden, one click away: the second box (and the
-            // Combine control it brings) is rarely needed, and the panel is
-            // long enough without it
-            h = h.concat('<button type="button" class="aptx-linkbtn" id="' + SEARCH_B_TOGGLE
-                + '" title="add a second search box, combinable with the first">+ Search B</button>');
-            h = h.concat('<div id="' + SEARCH_B_WRAP + '" style="display:none">');
+            // Search B used to sit behind a '+ Search B' link, to keep 45px out
+            // of the panel. That link was a second, weaker disclosure mechanism
+            // nested inside the section fold: it was forgotten on every reload
+            // (the fold is remembered), it was one-way -- nothing put B back --
+            // and it defeated the fit rule, since revealing B grew a section
+            // that had just been fitted without it, leaving the panel to
+            // scroll. The fold IS the disclosure. B is simply here.
             h = h.concat(makeSearchBox('Search B', 1));
-            h = h.concat('</div>');
             h = h.concat('<div class="aptx-searchnav" id="' + SEARCH_NAV_ROW + '" style="display:none">');
             h = h.concat('<button type="button" class="aptx-gbtn" id="' + SEARCH_NAV_PREV
                 + '" title="center the previous search hit">&#9664;</button>');
@@ -15207,7 +15497,6 @@ function (root, d3, forester, phyloXml) {
         }
         if (_state.searchBinitialValue) {
             setValue(SEARCH_FIELD_1, _state.searchBinitialValue);
-            revealSearchB();
         }
     }