12 | * @license https://opensource.org/licenses/GPL-3.0 GNU General Public License v3.0
13 | * @link https://github.com/magicsunday/webtrees-descendants-chart/
14 | */
15 | export default class Overlay
16 | {
17 | /**
18 | * Constructor.
19 | *
20 | * @param {Selection} parent The selected D3 parent element container
21 | */
22 | constructor(parent)
23 | {
24 | // Create the tooltip overlay container
25 | this._element = parent
26 | .append("div")
27 | .attr("class", "overlay")
28 | .style("opacity", 1e-6);
29 | }
30 |
31 | /**
32 | * Stop any pending transition and hide overlay immediately.
33 | *
34 | * @param {string} text Text to display in overlay
35 | * @param {number} duration Duration of transition in msec
36 | * @param {Function} callback Callback method to execute on end of transition
37 | */
38 | show(text, duration = 0, callback = null)
39 | {
40 | // Remove any previously added element
41 | this._element
42 | .select("p")
43 | .remove();
44 |
45 | this._element
46 | .append("p")
47 | .attr("class", "tooltip")
48 | .text(text);
49 |
50 | this._element
51 | .transition()
52 | .duration(duration)
53 | .style("opacity", 1)
54 | .on("end", () => {
55 | if (typeof callback === "function") {
56 | callback();
57 | }
58 | });
59 | }
60 |
61 | /**
62 | * Stop any pending transition and hide overlay immediately.
63 | *
64 | * @param {number} delay Delay in milliseconds to wait before transition should start
65 | * @param {number} duration Duration of transition in milliseconds
66 | */
67 | hide(delay = 0, duration = 0)
68 | {
69 | this._element
70 | .transition()
71 | .delay(delay)
72 | .duration(duration)
73 | .style("opacity", 1e-6);
74 | }
75 |
76 | /**
77 | * Returns the internal element.
78 | *
79 | * @returns {Selection}
80 | */
81 | get()
82 | {
83 | return this._element;
84 | }
85 | }
86 |
--------------------------------------------------------------------------------
/.github/workflows/ci.yml:
--------------------------------------------------------------------------------
1 | name: CI
2 |
3 | on:
4 | push:
5 | pull_request:
6 |
7 | jobs:
8 | build:
9 | runs-on: ubuntu-latest
10 |
11 | strategy:
12 | fail-fast: false
13 | matrix:
14 | php: [ '8.3', '8.4' ]
15 |
16 | steps:
17 | - id: checkout
18 | name: Checkout
19 | uses: actions/checkout@v4
20 |
21 | - id: setup_php
22 | name: Set up PHP version ${{ matrix.php }}
23 | uses: shivammathur/setup-php@v2
24 | with:
25 | php-version: ${{ matrix.php }}
26 | tools: composer:v2
27 |
28 | - name: Validate composer.json and composer.lock
29 | run: composer validate
30 |
31 | - id: composer-cache-vars
32 | name: Composer Cache Vars
33 | run: |
34 | echo "dir=$(composer config cache-files-dir)" >> $GITHUB_OUTPUT
35 | echo "timestamp=$(date +"%s")" >> $GITHUB_OUTPUT
36 |
37 | - id: composer-cache-dependencies
38 | name: Cache Composer dependencies
39 | uses: actions/cache@v4
40 | with:
41 | path: ${{ steps.composer-cache-vars.outputs.dir }}
42 | key: ${{ runner.os }}-composer-${{ matrix.php }}-${{ steps.composer-cache-vars.outputs.timestamp }}
43 | restore-keys: |
44 | ${{ runner.os }}-composer-${{ matrix.php }}-
45 | ${{ runner.os }}-composer-
46 |
47 | - id: install
48 | name: Install dependencies
49 | run: |
50 | composer validate
51 | composer install --no-progress
52 |
53 | - id: lint
54 | name: Lint
55 | if: ${{ always() && steps.install.conclusion == 'success' }}
56 | run: |
57 | composer ci:test:php:lint
58 |
59 | - id: cgl
60 | name: CGL
61 | if: ${{ always() && steps.install.conclusion == 'success' }}
62 | run: |
63 | composer ci:cgl -- --dry-run
64 |
65 | - id: phpstan
66 | name: PHPStan
67 | if: ${{ always() && steps.install.conclusion == 'success' }}
68 | run: |
69 | composer ci:test:php:phpstan -- --error-format=github
70 |
71 | - id: rector
72 | name: Rector
73 | if: ${{ always() && steps.install.conclusion == 'success' }}
74 | run: |
75 | composer ci:test:php:rector
76 |
--------------------------------------------------------------------------------
/resources/views/modules/components/buttonbar/svg-export-button.phtml:
--------------------------------------------------------------------------------
1 |
15 |
16 |
35 |
--------------------------------------------------------------------------------
/rollup.config.js:
--------------------------------------------------------------------------------
1 | import pkg from "./package.json" with {type: "json"};
2 | import resolve from "@rollup/plugin-node-resolve";
3 | import terser from "@rollup/plugin-terser";
4 | import license from "rollup-plugin-license";
5 |
6 | export default [
7 | // descendants-chart.js
8 | {
9 | input: "resources/js/modules/index.js",
10 | output: [
11 | {
12 | name: "WebtreesDescendantsChart",
13 | file: "resources/js/descendants-chart-" + pkg.version + ".js",
14 | format: "umd"
15 | }
16 | ],
17 | plugins: [
18 | resolve(),
19 | license({
20 | banner: `
21 | This file is part of the package magicsunday/<%= pkg.name %>.
22 |
23 | For the full copyright and license information, please read the
24 | LICENSE file that was distributed with this source code.
25 |
26 | Generated: <%= moment().format('YYYY-MM-DD HH:mm:ss') %>
27 | Version: <%= pkg.version %>`
28 | })
29 | ]
30 | },
31 | {
32 | input: "resources/js/modules/index.js",
33 | output: [
34 | {
35 | name: "WebtreesDescendantsChart",
36 | file: "resources/js/descendants-chart-" + pkg.version + ".min.js",
37 | format: "umd"
38 | }
39 | ],
40 | plugins: [
41 | resolve(),
42 | terser({
43 | mangle: true,
44 | compress: true,
45 | module: true,
46 | output: {
47 | comments: false
48 | }
49 | }),
50 | license({
51 | banner: `
52 | This file is part of the package magicsunday/<%= pkg.name %>.
53 |
54 | For the full copyright and license information, please read the
55 | LICENSE file that was distributed with this source code.
56 |
57 | Generated: <%= moment().format('YYYY-MM-DD HH:mm:ss') %>
58 | Version: <%= pkg.version %>`
59 | })
60 | ]
61 | },
62 |
63 | // descendants-chart-storage.js
64 | {
65 | input: "resources/js/modules/lib/storage.js",
66 | output: [
67 | {
68 | name: "WebtreesDescendantsChart",
69 | file: "resources/js/descendants-chart-storage.js",
70 | format: "umd"
71 | }
72 | ],
73 | plugins: [
74 | resolve()
75 | ]
76 | },
77 | {
78 | input: "resources/js/modules/lib/storage.js",
79 | output: [
80 | {
81 | name: "WebtreesDescendantsChart",
82 | file: "resources/js/descendants-chart-storage.min.js",
83 | format: "umd"
84 | }
85 | ],
86 | plugins: [
87 | resolve(),
88 | terser({
89 | mangle: true,
90 | compress: true,
91 | module: true,
92 | output: {
93 | comments: false
94 | }
95 | })
96 | ]
97 | }
98 | ];
99 |
--------------------------------------------------------------------------------
/resources/js/modules/custom/hierarchy.js:
--------------------------------------------------------------------------------
1 | /**
2 | * This file is part of the package magicsunday/webtrees-descendants-chart.
3 | *
4 | * For the full copyright and license information, please read the
5 | * LICENSE file distributed with this source code.
6 | */
7 |
8 | import * as d3 from "../lib/d3";
9 | import OrientationTopBottom from "../lib/chart/orientation/orientation-topBottom.js";
10 | import OrientationBottomTop from "../lib/chart/orientation/orientation-bottomTop.js";
11 | import {LAYOUT_VERTICAL_NODE_HEIGHT_OFFSET} from "../lib/constants.js";
12 |
13 | /**
14 | * This class handles the hierarchical data.
15 | *
16 | * @author Rico Sonntag
17 | * @license https://opensource.org/licenses/GPL-3.0 GNU General Public License v3.0
18 | * @link https://github.com/magicsunday/webtrees-descendants-chart/
19 | */
20 | export default class Hierarchy
21 | {
22 | /**
23 | * Constructor.
24 | *
25 | * @param {Configuration} configuration The application configuration
26 | */
27 | constructor(configuration)
28 | {
29 | this._configuration = configuration;
30 | this._nodes = null;
31 | this._root = null;
32 | }
33 |
34 | /**
35 | * Initialize the hierarchical chart data.
36 | *
37 | * @param {object} data The JSON encoded chart data
38 | */
39 | init(data)
40 | {
41 | // Adjust box height if we are going to display the alternative names
42 | if (this._configuration.showAlternativeName) {
43 | if ((this._configuration.orientation instanceof OrientationTopBottom)
44 | || (this._configuration.orientation instanceof OrientationBottomTop)
45 | ) {
46 | this._configuration.orientation.boxHeight += LAYOUT_VERTICAL_NODE_HEIGHT_OFFSET;
47 | }
48 | }
49 |
50 | // // Declares a tree layout and assigns the size
51 | // const treeLayout = d3.tree()
52 | // .nodeSize([this._configuration.orientation.nodeWidth, 0])
53 | // .separation(this.separation);
54 |
55 | // Construct root node from the hierarchical data
56 | this._root = d3.hierarchy(data);
57 |
58 | // Map the root node data to the tree layout
59 | // treeLayout(this._root);
60 |
61 | // Assign a unique ID to each node
62 | this._root.descendants().forEach((d, i) => {
63 | d.id = i;
64 | });
65 |
66 | // this._nodes = treeLayout(root);
67 | // this._nodes = this._root.descendants();
68 | //
69 | // // Remove the pseudo root node
70 | // this._nodes.shift();
71 | }
72 |
73 | /**
74 | * Returns the nodes.
75 | *
76 | * @returns {Individual[]}
77 | *
78 | * @public
79 | */
80 | get nodes()
81 | {
82 | return this._nodes;
83 | }
84 |
85 | /**
86 | * Returns the root note.
87 | *
88 | * @returns {Individual}
89 | *
90 | * @public
91 | */
92 | get root()
93 | {
94 | return this._root;
95 | }
96 | }
97 |
--------------------------------------------------------------------------------
/resources/js/modules/lib/chart/box.js:
--------------------------------------------------------------------------------
1 | /**
2 | * This file is part of the package magicsunday/webtrees-descendants-chart.
3 | *
4 | * For the full copyright and license information, please read the
5 | * LICENSE file distributed with this source code.
6 | */
7 |
8 | import Image from "./box/image";
9 | import Text from "./box/text";
10 |
11 | /**
12 | * A person box.
13 | *
14 | * @author Rico Sonntag
15 | * @license https://opensource.org/licenses/GPL-3.0 GNU General Public License v3.0
16 | * @link https://github.com/magicsunday/webtrees-descendants-chart/
17 | */
18 | export default class Box
19 | {
20 | /**
21 | * Constructor.
22 | *
23 | * @param {Orientation} orientation The current orientation
24 | */
25 | constructor(orientation)
26 | {
27 | // The default corner radius
28 | this._cornerRadius = 20;
29 | this._orientation = orientation;
30 |
31 | // Calculate values
32 | this._x = -(orientation.boxWidth / 2);
33 | this._y = -(orientation.boxHeight / 2);
34 | this._rx = this._cornerRadius;
35 | this._ry = this._cornerRadius;
36 | this._width = orientation.boxWidth;
37 | this._height = orientation.boxHeight;
38 |
39 | this._image = new Image(orientation, this._cornerRadius);
40 | }
41 |
42 | /**
43 | * Returns the X-coordinate of the center of the box.
44 | *
45 | * @returns {number}
46 | */
47 | get x()
48 | {
49 | return this._x;
50 | }
51 |
52 | /**
53 | * Returns the Y-coordinate of the center of the box.
54 | *
55 | * @returns {number}
56 | */
57 | get y()
58 | {
59 | return this._y;
60 | }
61 |
62 | /**
63 | * Returns the horizontal corner radius of the box.
64 | *
65 | * @returns {number}
66 | */
67 | get rx()
68 | {
69 | return this._rx;
70 | }
71 |
72 | /**
73 | * Returns the vertical corner radius of the box.
74 | *
75 | * @returns {number}
76 | */
77 | get ry()
78 | {
79 | return this._ry;
80 | }
81 |
82 | /**
83 | * Returns the width of the box.
84 | *
85 | * @returns {number}
86 | */
87 | get width()
88 | {
89 | return this._width;
90 | }
91 |
92 | /**
93 | * Returns the height of the box.
94 | *
95 | * @returns {number}
96 | */
97 | get height()
98 | {
99 | return this._height;
100 | }
101 |
102 | /**
103 | * Returns the image container.
104 | *
105 | * @returns {Image}
106 | */
107 | get image()
108 | {
109 | return this._image;
110 | }
111 |
112 | /**
113 | * Returns the text container instance.
114 | *
115 | * @returns {Text}
116 | */
117 | get text()
118 | {
119 | return new Text(
120 | this._orientation,
121 | this._image
122 | );
123 | }
124 | }
125 |
--------------------------------------------------------------------------------
/resources/views/modules/descendants-chart/config.phtml:
--------------------------------------------------------------------------------
1 |
24 |
25 | [route(ControlPanel::class) => I18N::translate('Control panel'), route(ModulesAllPage::class) => I18N::translate('Modules'), $title]]) ?>
26 |
27 |
28 |
29 |
30 |
85 |
--------------------------------------------------------------------------------
/resources/js/modules/lib/chart/box/text.js:
--------------------------------------------------------------------------------
1 | /**
2 | * This file is part of the package magicsunday/webtrees-descendants-chart.
3 | *
4 | * For the full copyright and license information, please read the
5 | * LICENSE file distributed with this source code.
6 | */
7 |
8 | import OrientationLeftRight from "../orientation/orientation-leftRight";
9 | import OrientationRightLeft from "../orientation/orientation-rightLeft";
10 | import OrientationTopBottom from "../orientation/orientation-topBottom";
11 | import OrientationBottomTop from "../orientation/orientation-bottomTop";
12 |
13 | /**
14 | * The person text box container.
15 | *
16 | * @author Rico Sonntag
17 | * @license https://opensource.org/licenses/GPL-3.0 GNU General Public License v3.0
18 | * @link https://github.com/magicsunday/webtrees-descendants-chart/
19 | */
20 | export default class Text
21 | {
22 | /**
23 | * Constructor.
24 | *
25 | * @param {Orientation} orientation The current orientation
26 | * @param {null|Image} image The image
27 | */
28 | constructor(orientation, image = null)
29 | {
30 | this._orientation = orientation;
31 | this._image = image;
32 | this._textPaddingX = 15;
33 | this._textPaddingY = 15;
34 |
35 | if ((this._orientation instanceof OrientationTopBottom)
36 | || (this._orientation instanceof OrientationBottomTop)
37 | ) {
38 | this._textPaddingX = 5;
39 | this._textPaddingY = 15;
40 | }
41 |
42 | // Calculate values
43 | this._x = this.calculateX();
44 | this._y = this.calculateY();
45 | this._width = this.calculateWidth();
46 | }
47 |
48 | /**
49 | * Returns the calculated X-coordinate.
50 | *
51 | * @returns {number}
52 | */
53 | calculateX()
54 | {
55 | return -(this._orientation.boxWidth / 2) + this._textPaddingX;
56 | }
57 |
58 | /**
59 | * Returns the calculated Y-coordinate.
60 | *
61 | * @returns {number}
62 | */
63 | calculateY()
64 | {
65 | if ((this._orientation instanceof OrientationLeftRight)
66 | || (this._orientation instanceof OrientationRightLeft)
67 | ) {
68 | return -this._textPaddingY;
69 | }
70 |
71 | return this._image.y + this._image.height + (this._textPaddingY * 2);
72 | }
73 |
74 | /**
75 | * Calculate the available text width.
76 | *
77 | * @returns {number}
78 | */
79 | calculateWidth()
80 | {
81 | // Width of the text minus the right/left padding
82 | return this._orientation.boxWidth - (this._textPaddingX * 2);
83 | }
84 |
85 | /**
86 | * Returns the X-coordinate of the text start.
87 | *
88 | * @returns {number}
89 | */
90 | get x()
91 | {
92 | return this._x;
93 | }
94 |
95 | /**
96 | * Returns the Y-coordinate of the text start.
97 | *
98 | * @returns {number}
99 | */
100 | get y()
101 | {
102 | return this._y;
103 | }
104 |
105 | /**
106 | * Returns the width of the text.
107 | *
108 | * @returns {number}
109 | */
110 | get width()
111 | {
112 | return this._width;
113 |
114 | }
115 | }
116 |
--------------------------------------------------------------------------------
/resources/views/modules/descendants-chart/form/layout.phtml:
--------------------------------------------------------------------------------
1 |
20 |
21 |
22 |
23 |
24 |
25 |
26 | 'hideSpouses',
29 | 'label' => I18N::translate('Hide the spouses associated with an individual'),
30 | 'checked' => $configuration->getHideSpouses(),
31 | 'unchecked' => '0',
32 | ])
33 | ?>
34 |
35 |
36 | 'showMarriedNames',
39 | 'label' => I18N::translate('Show married names'),
40 | 'checked' => $configuration->getShowMarriedNames(),
41 | 'unchecked' => '0',
42 | ])
43 | ?>
44 |
45 |
46 |
47 |
48 |
49 |
50 | 'openNewTabOnClick',
53 | 'label' => I18N::translate('Open individual in new browser window/tab'),
54 | 'checked' => $configuration->getOpenNewTabOnClick(),
55 | 'unchecked' => '0',
56 | ])
57 | ?>
58 |
59 |
60 |
61 |
62 |
63 |
64 | 'showAlternativeName',
67 | 'label' => I18N::translate('Show alternative name of individual'),
68 | 'checked' => $configuration->getShowAlternativeName(),
69 | 'unchecked' => '0',
70 | ])
71 | ?>
72 |
73 |
74 |
75 |
76 |
77 |