xref: /webtrees/resources/views/modules/hourglass-chart/chart.phtml (revision e11ffd0c922a07c13f23d38c7d9c82edce5298f5)
1<div class="position-relative" id="hourglass_chart" style="width:98%; z-index:1;">
2	<table>
3		<tr>
4			<td style="vertical-align:middle">
5				<?= $descendants ?>
6			</td>
7			<td style="vertical-align:middle">
8				<?= $ancestors ?>
9			</td>
10		</tr>
11	</table>
12</div>
13
14<script>
15(function() {
16  function sizeLines() {
17    $('.tvertline').each(function(i,e) {
18      var pid = e.id.split('_').pop();
19      e.style.height = Math.abs($('#table_' + pid)[0].offsetHeight - ($('#table2_' + pid)[0].offsetTop + <?= $bhalfheight ?>)) + 'px';
20    });
21
22    $('.bvertline').each(function(i,e) {
23      var pid = e.id.split('_').pop();
24      e.style.height = $('#table_' + pid)[0].offsetTop + $('#table2_' + pid)[0].offsetTop + <?= $bhalfheight ?> + 'px';
25    });
26
27    $('.pvline').each(function(i,e) {
28      var el = $(e);
29      el.height(Math.floor(el.parent().height()/2));
30    });
31  }
32
33  $('#spouse-child-links').on('click', function(e) {
34    e.preventDefault();
35    $('#childbox').slideToggle('fast');
36  });
37  $('.hourglassChart').on('click', '.wt-icon-arrow-start, .wt-icon-arrow-end', function (e) {
38    e.preventDefault();
39    e.stopPropagation();
40
41    var route   = this.parentNode.dataset.route;
42    var spouses = this.parentNode.dataset.spouses;
43    var tree    = this.parentNode.dataset.tree;
44    var xref    = this.parentNode.dataset.xref;
45
46    $('#td_' + xref).load('index.php', {
47      generations:  1,
48      route:        'module',
49      module:       <?= json_encode($module_name) ?>,
50      action:       route,
51      show_spouses: spouses,
52      ged:          tree,
53      xref:         xref
54    }, function() {
55      sizeLines();
56    });
57  });
58
59  sizeLines();
60})();
61</script>
62