mirror of
https://github.com/PeWu/topola-viewer.git
synced 2026-10-16 18:54:05 +00:00
f04e987df6
* Fix PDF export sizing chart to zoomed viewport downloadPdf() read the PDF page size from getSvgDimensions(), which returns the live #chartSvg width/height attributes. Those carry the on-screen zoomed size (chart_wrapper.ts writes size * scale on every d3-zoom event), not the true chart size. The SVG drawn into the page instead carried the true dimensions (getStrippedSvg divides by the zoom scale), so the PDF page and its contents mismatched: zooming in produced a giant page with the tree in one corner, zooming out produced a truncated strip. See issues #260 and #18. Fix: have getSvgContentsWithInlinedImages() return the chart's true width and height (read from the single stripped SVG clone it already builds), and have downloadPdf() consume those for both the jsPDF page format and the draw target. downloadSvg()/downloadPng() were already correct and only need to destructure contents from the new return shape. The buggy helper getSvgDimensions() is removed. * Add regression test for PDF export page size Zooms the chart, exports a PDF and asserts the PDF MediaBox matches the chart's true (unscaled) dimensions and not the live zoomed ones. Verified to fail on the pre-fix code (pdfW == liveW) and pass after the fix (pdfW == trueW). * Apply prettier formatting to chart_export.spec.ts
Source Directory (src)
This directory contains the main source code for the Topola Viewer application. It includes the application entry point, main layout components, chart rendering logic, data source adapters, menus, side panel, translations, and utilities.
Subdirectories
- datasource: Implements data sources for loading GEDCOM files, URLs, WikiTree API data, and embedded data.
- menu: Contains components for the top navigation bar, search bar, and various menus (upload, URL, WikiTree).
- sidepanel: Contains components for the side panel, which shows individual details and chart configuration settings.
- translations: Contains JSON files with translations for supported languages.
- util: Contains utility functions for dates, GEDCOM data, analytics, and responsive design.
Files
- app.tsx: The main application component that manages state, routing, data loading orchestration, and high-level layout.
- changelog.tsx: Component that fetches and displays the recent changes in a modal dialog when the app is updated.
- chart.tsx: The primary chart rendering component using D3 and
the
topolalibrary. It handles zoom, pan, and export actions. - donatso-chart.tsx: An alternative chart view
utilizing the
family-chartlibrary. - index.tsx: The entry point of the application. It sets up polyfills, internationalization, and renders the app root.
- intro.tsx: The landing page component shown when no data is loaded. It provides instructions, examples, and privacy information.
- webmcp.ts: Model Context Protocol (MCP) implementation to expose viewer state and action handlers for dynamic AI model interactions and tool definitions.
- webmcp_definitions.ts: Defines custom schemas and descriptions for various registration tools (such as person search, ancestry detail fetch, navigation triggers, etc.) exposed through the WebMCP protocol.
- webmcp_types.ts: Common TypeScript type annotations and structures used within the WebMCP engine layer.
Assets
- index.css: Global CSS styles for the application.
- topola.jpg: Image asset for the Topola logo.
Type Definitions
- family-chart.d.ts: Type definitions for the
family-chartlibrary. - imports.d.ts: Type definitions for non-code assets (e.g., CSS imports).
- javascript-natural-sort.d.ts: Type
definitions for the
javascript-natural-sortlibrary. - lunr-languages.d.ts: Type definitions for
lunr-languagesplugins. - parse-gedcom.d.ts: Type definitions for the
parse-gedcomlibrary. - react-app-env.d.ts: Type definitions for React application environment.
- react-linkify.d.ts: Type definitions for the
react-linkifylibrary. - vite-env.d.ts: Type definitions for Vite environment variables.