forked/topola-viewer
1
0
Fork 0
mirror of https://github.com/PeWu/topola-viewer.git synced 2026-08-03 09:31:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added fancy tree as an experimental feature

Browse Source
This commit is contained in:
Przemek Wiech
2019-11-18 22:28:06 +01:00
parent d9bf68a4c3
commit c988f4180e
6 changed files with 60 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
package-lock.json generated
View File

@@ -3622,8 +3622,7 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
@@ -3644,14 +3643,12 @@
"balanced-match": { "balanced-match": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@@ -3666,20 +3663,17 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@@ -3796,8 +3790,7 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@@ -3809,7 +3802,6 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@@ -3824,7 +3816,6 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@@ -3832,14 +3823,12 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.3.5", "version": "2.3.5",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.2", "safe-buffer": "^5.1.2",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@@ -3858,7 +3847,6 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@@ -3939,8 +3927,7 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@@ -3952,7 +3939,6 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@@ -4038,8 +4024,7 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.2", "version": "5.1.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
@@ -4075,7 +4060,6 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",
@@ -4095,7 +4079,6 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
@@ -4139,14 +4122,12 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.3", "version": "3.0.3",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
} }
} }
}, },
@@ -7238,9 +7219,9 @@
"dev": true "dev": true
}, },
"handlebars": { "handlebars": {
"version": "4.5.1", "version": "4.5.3",
"resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.5.1.tgz", "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.5.3.tgz",
"integrity": "sha512-C29UoFzHe9yM61lOsIlCE5/mQVGrnIOrOq7maQl76L7tYPCgC1og0Ajt6uWnX4ZTxBPnjw+CUvawphwCfJgUnA==", "integrity": "sha512-3yPecJoJHK/4c6aZhSvxOyG4vJKDshV36VHp0iVCDVh7o9w2vwi3NSnL2MMPj3YdduqaBcu7cGbggJQM0br9xA==",
"dev": true, "dev": true,
"requires": { "requires": {
"neo-async": "^2.6.0", "neo-async": "^2.6.0",
@@ -8501,8 +8482,7 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
@@ -8523,14 +8503,12 @@
"balanced-match": { "balanced-match": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@@ -8545,20 +8523,17 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@@ -8675,8 +8650,7 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@@ -8688,7 +8662,6 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@@ -8703,7 +8676,6 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@@ -8711,14 +8683,12 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.3.5", "version": "2.3.5",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.2", "safe-buffer": "^5.1.2",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@@ -8737,7 +8707,6 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@@ -8818,8 +8787,7 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@@ -8831,7 +8799,6 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@@ -8917,8 +8884,7 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.2", "version": "5.1.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
@@ -8954,7 +8920,6 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",
@@ -8974,7 +8939,6 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
@@ -9018,14 +8982,12 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.3", "version": "3.0.3",
"bundled": true, "bundled": true,
"dev": true, "dev": true
"optional": true
} }
} }
} }
@@ -14596,9 +14558,9 @@
"dev": true "dev": true
}, },
"topola": { "topola": {
"version": "2.3.9", "version": "2.4.0",
"resolved": "https://registry.npmjs.org/topola/-/topola-2.3.9.tgz", "resolved": "https://registry.npmjs.org/topola/-/topola-2.4.0.tgz",
"integrity": "sha512-nrVs6QsyBJPpEoAwZkL2anV1G5CnFh5cxIE4uTJrXCL3curvST5OJxKDjA2RDkImzVMPrvRRZ9lDmXCQsp0QBg==", "integrity": "sha512-ncLg4eDFeF1UNXEcpJvrm8iMnNCtTVsDg8hWHJr83UMSfiV8EwcvklyhoKjB1uRsp/E+eSKOMJb44Acgn5BM1w==",
"requires": { "requires": {
"array-flat-polyfill": "^1.0.1", "array-flat-polyfill": "^1.0.1",
"d3": "^5.4.0", "d3": "^5.4.0",

2
package.json
View File

@@ -23,7 +23,7 @@
"react-router-dom": "^4.3.1", "react-router-dom": "^4.3.1",
"semantic-ui-css": "^2.4.1", "semantic-ui-css": "^2.4.1",
"semantic-ui-react": "^0.84.0", "semantic-ui-react": "^0.84.0",
"topola": "^2.3.9" "topola": "^2.4.0"
}, },
"devDependencies": { "devDependencies": {
"@types/array.prototype.flatmap": "^1.2.0", "@types/array.prototype.flatmap": "^1.2.0",

14
src/app.tsx
View File

@@ -40,11 +40,7 @@ interface ErrorPopupProps {
function ErrorPopup(props: ErrorPopupProps) { function ErrorPopup(props: ErrorPopupProps) {
return ( return (
<Portal open={props.open} onClose={props.onDismiss}> <Portal open={props.open} onClose={props.onDismiss}>
<Message <Message negative className="errorPopup" onDismiss={props.onDismiss}>
negative
className="errorPopup"
onDismiss={props.onDismiss}
>
<Message.Header> <Message.Header>
<FormattedMessage id="error.error" defaultMessage={'Error'} /> <FormattedMessage id="error.error" defaultMessage={'Error'} />
</Message.Header> </Message.Header>
@@ -230,9 +226,13 @@ export class App extends React.Component<RouteComponentProps, {}> {
const handleCors = getParam('handleCors') !== 'false'; // True by default. const handleCors = getParam('handleCors') !== 'false'; // True by default.
const standalone = getParam('standalone') !== 'false'; // True by default. const standalone = getParam('standalone') !== 'false'; // True by default.
const view = getParam('view'); const view = getParam('view');
const chartTypes = new Map<string | undefined, ChartType>([
['relatives', ChartType.Relatives],
['fancy', ChartType.Fancy],
]);
// Hourglass is the default view. // Hourglass is the default view.
const chartType = const chartType = chartTypes.get(view) || ChartType.Hourglass;
view === 'relatives' ? ChartType.Relatives : ChartType.Hourglass;
const gedcom = this.props.location.state && this.props.location.state.data; const gedcom = this.props.location.state && this.props.location.state.data;
const images = const images =

17
src/chart.tsx
View File

@@ -11,6 +11,8 @@ import {
DetailedRenderer, DetailedRenderer,
HourglassChart, HourglassChart,
RelativesChart, RelativesChart,
FancyChart,
CircleRenderer,
} from 'topola'; } from 'topola';
/** Called when the view is dragged with the mouse. */ /** Called when the view is dragged with the mouse. */
@@ -106,6 +108,7 @@ function canvasToBlob(canvas: HTMLCanvasElement, type: string) {
export enum ChartType { export enum ChartType {
Hourglass, Hourglass,
Relatives, Relatives,
Fancy,
} }
export interface ChartProps { export interface ChartProps {
@@ -125,12 +128,24 @@ export class Chart extends React.PureComponent<ChartProps, {}> {
return HourglassChart; return HourglassChart;
case ChartType.Relatives: case ChartType.Relatives:
return RelativesChart; return RelativesChart;
case ChartType.Fancy:
return FancyChart;
default: default:
// Fall back to hourglass chart. // Fall back to hourglass chart.
return HourglassChart; return HourglassChart;
} }
} }
private getRendererType() {
switch (this.props.chartType) {
case ChartType.Fancy:
return CircleRenderer;
default:
// Use DetailedRenderer by default.
return DetailedRenderer;
}
}
/** /**
* Renders the chart or performs a transition animation to a new state. * Renders the chart or performs a transition animation to a new state.
* If indiInfo is not given, it means that it is the initial render and no * If indiInfo is not given, it means that it is the initial render and no
@@ -142,7 +157,7 @@ export class Chart extends React.PureComponent<ChartProps, {}> {
this.chart = createChart({ this.chart = createChart({
json: this.props.data, json: this.props.data,
chartType: this.getChartType(), chartType: this.getChartType(),
renderer: DetailedRenderer, renderer: this.getRendererType(),
svgSelector: '#chart', svgSelector: '#chart',
indiCallback: (info) => this.props.onSelection(info), indiCallback: (info) => this.props.onSelection(info),
animate: true, animate: true,

7
src/top_bar.tsx
View File

@@ -326,6 +326,13 @@ export class TopBar extends React.Component<
defaultMessage="All relatives" defaultMessage="All relatives"
/> />
</Dropdown.Item> </Dropdown.Item>
<Dropdown.Item onClick={() => this.changeView('fancy')}>
<Icon name="users" />
<FormattedMessage
id="menu.fancy"
defaultMessage="Fancy tree (experimental)"
/>
</Dropdown.Item>
</Dropdown.Menu> </Dropdown.Menu>
</Dropdown> </Dropdown>

1
src/translations/pl.json
View File

@@ -9,6 +9,7 @@
"menu.view": "Widok", "menu.view": "Widok",
"menu.hourglass": "Wykres klepsydrowy", "menu.hourglass": "Wykres klepsydrowy",
"menu.relatives": "Wszyscy krewni", "menu.relatives": "Wszyscy krewni",
"menu.fancy": "Ozdobne drzewo (eksperymentalne)",
"menu.github": "Źródła na GitHub", "menu.github": "Źródła na GitHub",
"menu.powered_by": "Topola Genealogy", "menu.powered_by": "Topola Genealogy",
"menu.search.placeholder": "Szukaj osoby", "menu.search.placeholder": "Szukaj osoby",