From 0fe471dc8c9afee6dd00f8dd7dbeba010d23d7c5 Mon Sep 17 00:00:00 2001 From: corsacca Date: Thu, 28 May 2026 10:13:51 -0500 Subject: [PATCH] Maps: Fly, share, bug fixes (#8) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * maps on pray adopt and home pages * translation of titles * "Fixed more info button url mapping, fixed legend gets translated fields from api using language code from parent site passed as prop, fixed legend numbers for engagement mapped to propper field" * MERGE MAP REPOS AS PUBLIC PLUGINS * Doxa-life is now a monorepo -> embeddables built inline -> Doxa-life /public/js serves as static CDN for serving map widgets to partner DOXA sites. UNLOCKS people of the day widget. * Launch v1 Doxa Research Maps * Add Go Pin Indicator 2 Research Map 2 Make Disciples * Add Go Pin Indicator 2 Research Map 2 Make Disciples - fix map slots * Research map: parse dialects from language field; add dialect tab + selection - Parse "Arabic, Sudanese" (comma-inverted) and "Pakistan Sign Language" (suffix-grouped) into base language + dialect; dedup Languages tab to one row per base language. - Move dialect rows under base languages via expandable carat in Tab 1 (family tree) and Tab 2 (languages). Tab 3 (Dialects) shows flat "Language, Dialect" list. - New mapStore.selectedDialect ({ key, originalLabels }) drives dialect highlight + exact-match pin filter. Selecting a dialect dims sibling dialects + non-matching pins; selecting a language keeps its expanded dialect children visible (lft-row-child-active). - _raw.primary_language is the reliable source for the comma-inverted label (p.language gets overwritten by useMapData). Co-Authored-By: Claude Opus 4.7 (1M context) * Research map iter-1: Dialects/Varieties tab, parent-display title, per-map geocoder placeholder - LegendFamilyTree: add "Dialects/Varieties" as the 3rd default tab so users can actually reach Tab 3 from the legend bar (was only reachable via state). - LegendFamilyTree: title row now surfaces the parent of the selected child (e.g. "Parent: Afro-Asiatic" when Arabic is selected on the Languages tab, "Parent: Arabic" when "Arabic, Sudanese" is selected) — solves the "what family does Arabic belong to?" problem without leaving the tab. - LegendFamilyTree: bump dialect indent (28→40px) and add a vertical guide line on child rows so the hierarchical nesting is visibly clear. - GeocoderComponent: watch the effective placeholder and patch the DOM input directly so the per-map prop can change as the active tab switches (Mapbox geocoder has no public placeholder updater). - research-map: pass per-tab placeholder. On the Language Families tab the search bar reads "Search language family, language, dialect/variety"; other tabs keep the i18n default. Co-Authored-By: Claude Opus 4.7 (1M context) * Research map iter-2: search → tab navigation for language-family + dialect kinds useDoxaSearch.js - Add base-language + dialect parsing (mirrors LegendFamilyTree's SUFFIX_GROUPS). - buildIndex now derives baseLang and dialectLabel per entry; reads the comma- inverted label from _raw.primary_language first (p.language gets overwritten by useMapData). - buildAggregates: new `families` bucket (keyed by familyDerived from langFamilyByLanguage), `languages` rebased on baseLang (so "Arabic" appears once, not "Arabic, Sudanese" + "Arabic, Levantine"), and new `dialects` bucket keyed by base+dialect with originalLabels accumulated. - makeAggregateFeature emits doxa-language-family / doxa-dialect place_types with EMOJI_FAMILY (🌳) and EMOJI_DIALECT (💬). Dialect features carry familyDerived/baseLang/dialectLabel/originalLabels for downstream wiring. - search() output ordering: family → language → dialect (semantic-tree top-down) before places/religions. GeocoderComponent.vue - Forward doxa-language-family + doxa-dialect place_types as aggregate-result events; thread originalLabels + familyDerived + baseLang + dialectLabel. - Clear selectedDialect too on "All DOXA Data" click (bidirectional sync). research-map.vue - onGeocoderAggregateResult handles 'language-family' (selectFamily + setActiveLegendTab('family')), 'language' (with comma-prefix + suffix- contains pin filter so "Arabic" catches "Arabic, Sudanese" and "Sign Language" catches "Pakistan Sign Language"), and 'dialect' (exact-match via originalLabels + selectDialect with legend-matching key "familyKey__baseLang__dialect" so the row indicator lights up). - onGeocoderClear also clears selectedDialect. Co-Authored-By: Claude Opus 4.7 (1M context) * Research map iter-3: tab info popovers (ⓘ buttons with definitions) LegendFamilyTree.vue - Each tab in the default tabLabels now carries an `info` field (per-tab plain-English definition). Definitions stay generic to the tab id, so future maps using the same component can pass their own. - Added a small ⓘ button next to each tab label. Click toggles a popover showing the definition; click again or click outside closes; Escape closes. Switching tabs also closes the popover. - Click-outside uses event.composedPath() — required for correctness across the shadow-DOM boundary (otherwise event.target is rewritten to the host element and the contains-check would always fail, closing on every click). - Default copy: "A language family is a group of languages descended from a common ancestor (e.g. Indo-European, Afro-Asiatic).", "A language is a system of communication used by a people…", "A dialect/variety is a regional or social form of a language…". - Tab CSS: tab button + ⓘ now share a flex wrapper (.lft-tab-info-wrap) with position:relative so the popover anchors to the tab cell. Co-Authored-By: Claude Opus 4.7 (1M context) * Research map: revert iter-3 tab info popovers Per-tab ⓘ buttons + popovers duplicated the existing toolbar HelpButton (?) and added clutter the eventual mobile rewrite would have to undo. Removing: - ⓘ button + popover template wrapper - info field on tabLabels default - openInfoTab ref + toggleInfo + onDocClick + onEsc handlers - onMounted/onBeforeUnmount document listeners + composedPath() click-outside - .lft-tab-info-wrap / .lft-tab-info-btn / .lft-tab-info-popover CSS Tab definitions belong in the toolbar HelpButton's "About this map" modal, not inline on the legend. Co-Authored-By: Claude Opus 4.7 (1M context) * Research map: 3 bug fixes from screenshot QA 1. Sign Language duplicated in Languages tab — readFamily now consults SUFFIX_GROUPS as a final fallback. Pins where imb_language_family is null AND lookupFamilyFromLanguageLabel misses (e.g. "Pakistan Sign Language" not in langFamilyByLanguage.json) used to fall through to "Unknown", creating an Unknown__Sign Language bucket alongside the existing Sign Language__Sign Language one — same display label, two rows. Both highlighted on select because the selected-row check is by label, not key. Now any pin matching " sign language$" returns "Sign Language" as the family, collapsing both buckets into one. 2. X deselect button overlapped the population badge. Moved from right:6px (inside the inner pill) to right:-22px (into the empty right caret column, grid column -1). Bumped contrast (dark bg + white icon, theme-inverted in dark mode) so it reads as a proper close affordance. 3. Tab 3 (Dialects/Varieties) flat rows had no dialect styling — looked identical to Tab 2 language rows. Added lft-row-dialect + lft-name-dialect classes so they get the 40px indent, italic font, and vertical guide-line that distinguish dialects from base languages. Co-Authored-By: Claude Opus 4.7 (1M context) * Research map: QA building-round-1 R2 fixes (5 items) 1. Sign-language LANGUAGES are kept distinct per QA R2 A1 — partial revert of e26e7cd which collapsed every "X Sign Language" into one base "Sign Language" row. SUFFIX_GROUPS renamed to FAMILY_SUFFIXES and applied ONLY in the family-resolution path. baseLang/dialect parsing leaves the full label intact: "Pakistan Sign Language" → family "Sign Language", base "Pakistan Sign Language", dialect null. Each variant gets its own Languages-tab row. Both useLanguageFamilyLegendData.js and useDoxaSearch.js updated in lockstep. 2. X deselect button now lives in its OWN grid column, not absolute-positioned inside the inner pill. Added --lft-deselect-col (24px) and used it as the trailing column of .lft-items grid. The X is a sibling of .lft-item (which uses display:contents, so its inner div participates in row grid columns 2 to -2; the X lands cleanly in column -1). No overlap with badges, no negative-margin overflow into nothing. 3. Children of selected family no longer dim (Bug 5): added lft-row-child-active to (a) child language rows under a selected family on Tab 1, and (b) dialect grandchildren under either a selected family OR a selected child language. The existing CSS rule .lft-has-selection .lft-row-child-active … {opacity:1} handles the visual exception. 4. Title-row "Field: Parent" pattern (Bug 6): replaces "Parent: X" with level-specific labels — "Family: Afro-Asiatic" when a language is selected, "Language: Arabic" when a dialect is selected, "Family: Sign Language" when the family itself is selected. Default per-tab labels when nothing is selected. 5. Cross-tab geocoder clear (Bug 11): switchTab now calls _clearGeocoderProgrammatic() so the previous tab's search query doesn't leak. Programmatic clear bypasses onGeocoderClear so legend selection stays intact (only the geocoder INPUT TEXT resets). Deferred per QA queue: Bug 7/8 count mismatches (data edge cases), Bug 9 case-insensitive search (needs repro), Bug 10 auto-collapse + scroll (bigger UX work), file rename to SemanticTreeLegend.vue. Co-Authored-By: Claude Opus 4.7 (1M context) * Research map: QA building-round-1 R3 fixes (5 items, cherry-picked from PPLR SemanticTreeLegend) Per the user's "merge their patterns into ours, keep our rounded edges" call — cherry-picking from /Map-Framework/05-apps/PPLR-MAPS/.../SemanticTreeLegend.vue rather than full port. Preserves the doxa app aesthetic. 1. Bug 13 — Parent → child selection swap now works immediately. selectFamily() and selectLanguage() now clear the OTHER legend levels (mutually exclusive at the store layer). Watchers in research-map.vue gate the clear-cascade: when selectedFamily transitions to null, only fire applyDimFilter({kind:null}) if NO other level is set — otherwise the cascade-clear from a swap would erase the new selection via clearAllHighlights. 2. X button — now visually attached to the pill with no gap. Margin-left:-6px eats the row's column-gap so the button left-edge sits flush with the pill's right edge. Border-radius rounds only the right corners (matches pill's right side). Stretches to row height; the chip "sticks out" from the pill into the reserved trailing column. No absolute positioning, no overlap with badges. 3. Cross-tab geocoder clear — wrapped behind FEATURES.geocoderPersistAcrossTabs (default false). Flip to true to keep the geocoder query when returning to a previously visited tab. 4. Auto-collapse + scroll-into-view on geocoder selection (Bug 10). research-map.vue dispatches a `legend:reveal-selected` window event after driving mapStore.selectFamily/Language/Dialect via geocoder result. LegendFamilyTree listens, computes the ancestor-chain keys for the selected row, and calls setExpansionToOnly(keys) — collapsing every other family. After nextTick, scrollIntoView(behavior:smooth, block:center) on the .lft-row-selected element. The reveal is geocoder-only — direct legend clicks leave the user's manual expansion state alone. 5. useLanguageFamilyLegendData exposes setExpansionToOnly(keys) — generic helper that resets the expansion map to only the listed keys. Used by the reveal handler above; callable by any consumer that needs to drive expansion programmatically. Co-Authored-By: Claude Opus 4.7 (1M context) * Research map: replace LegendFamilyTree with ported PPLR SemanticTreeLegend Per QA building-round-1 R4 user directive — "take their legend pretty much word for word, archive ours" — the PPLR competitor's legend ships nearly every Round-1-3 fix in one component. Cherry-pick gave way to full port: - src/components/SemanticTreeLegend.vue (NEW): PPLR's component ported word-for-word (.stl-* class names + script + template + CSS). Adaptations: * Outer .stl-panel + .stl-collapse-btn + .stl-reopen rounded-pill REMOVED. LegendDesktop's existing collapse-to-circle (the rounded aesthetic the user explicitly called out as missing from PPLR's pill style) wraps and drives collapse via the #title-caret slot. *