xref: /webtrees/resources/views/modules/fanchart/chart.phtml (revision 36de22acf6348b1059dac63e3cd19589574906ac) 
1<?php
2
3/**
4 * @var string $areas
5 * @var int    $fanh
6 * @var int    $fanw
7 * @var string $html
8 * @var string $png
9 * @var string $title
10 */
11
12assert(is_string($areas));
13assert(is_int($fanh));
14assert(is_int($fanw));
15assert(is_string($html));
16assert(is_string($png));
17assert(is_string($title));
18
19?>
20<?= $html ?>
21
22<map id="fan-chart-map" name="fan-chart-map">
23	<?= $areas ?>
24</map>
25
26<div class="text-center">
27	<img class="wt-chart-fan-img" src="data:image/png;base64,<?= base64_encode($png) ?>" width="<?= $fanw ?>" height="<?= $fanh ?>" alt="<?= strip_tags($title) ?>" usemap="#fan-chart-map">
28</div>
29
30<script>
31  jQuery("area")
32    .click(function (e) {
33      e.stopPropagation();
34      e.preventDefault();
35      let target = jQuery(this.hash);
36      // position the menu centered immediately above the mouse click position and
37      // make sure it doesn’t end up off the screen
38      target
39        .css({
40          left: Math.max(0, e.pageX - (target.outerWidth() / 2)),
41          top:  Math.max(0, e.pageY - target.outerHeight())
42        })
43        .toggle()
44        .siblings(".fan_chart_menu").hide();
45    });
46  jQuery(".fan_chart_menu")
47    .on("click", "a", function (e) {
48      e.stopPropagation();
49    });
50  jQuery("#fan_chart")
51    .click(function () {
52      jQuery(".fan_chart_menu").hide();
53    });
54</script>
55