188de55fdSRico Sonntag<?php 2d70512abSGreg Roach 388de55fdSRico Sonntagdeclare(strict_types=1); 488de55fdSRico Sonntag 588de55fdSRico Sonntaguse Fisharebest\Webtrees\View; 6d70512abSGreg Roach 77c2c99faSGreg Roach/** 87c2c99faSGreg Roach * @var array<string,string> $tabs 97c2c99faSGreg Roach * @var string $title 107c2c99faSGreg Roach */ 117c2c99faSGreg Roach 1288de55fdSRico Sonntag?> 1388de55fdSRico Sonntag 149b5537c3SGreg Roach<h2 class="wt-page-title"> 159b5537c3SGreg Roach <?= $title ?> 169b5537c3SGreg Roach</h2> 179b5537c3SGreg Roach 189b5537c3SGreg Roach<div class="wt-page-content wt-chart wt-statistics-chart" id="statistics-tabs"> 199b5537c3SGreg Roach <ul class="nav nav-tabs" role="tablist"> 209b5537c3SGreg Roach <?php foreach ($tabs as $label => $url) : ?> 216a4003b9SGreg Roach <li class="nav-item" role="presentation"> 22d4786c66SGreg Roach <a class="nav-link" href="#tab-<?= e(md5($url)) ?>" data-bs-toggle="tab" data-wt-href="<?= e($url) ?>" role="tab"> 239b5537c3SGreg Roach <?= $label ?> 249b5537c3SGreg Roach </a> 259b5537c3SGreg Roach </li> 269b5537c3SGreg Roach <?php endforeach ?> 279b5537c3SGreg Roach </ul> 289b5537c3SGreg Roach 299b5537c3SGreg Roach <div class="tab-content"> 30*c5402244SGreg Roach <?php foreach ($tabs as $url) : ?> 319b5537c3SGreg Roach <div class="tab-pane fade wt-ajax-load" role="tabpanel" id="tab-<?= e(md5($url)) ?>"></div> 329b5537c3SGreg Roach <?php endforeach ?> 339b5537c3SGreg Roach </div> 349b5537c3SGreg Roach</div> 359b5537c3SGreg Roach 369b5537c3SGreg Roach<?php View::push('javascript') ?> 379b5537c3SGreg Roach<script> 38ffb44950SGreg Roach 'use strict'; 399b5537c3SGreg Roach 409b5537c3SGreg Roach // Bootstrap tabs - load content dynamically using AJAX 41d4786c66SGreg Roach $('a[data-bs-toggle="tab"][data-wt-href]').on('show.bs.tab', function () { 42d4786c66SGreg Roach $(this.getAttribute('href') + ':empty').load(this.dataset.wtHref); 439b5537c3SGreg Roach }); 449b5537c3SGreg Roach 459b5537c3SGreg Roach // If the URL contains a fragment, then activate the corresponding tab. 469b5537c3SGreg Roach // Use a prefix on the fragment, to prevent scrolling to the element. 47315eb316SGreg Roach let target = window.location.hash.replace("tab-", ""); 48315eb316SGreg Roach let tab = document.querySelector("#statistics-tabs .nav-link[href='" + target + "']"); 499b5537c3SGreg Roach // If not, then activate the first tab. 50315eb316SGreg Roach tab = tab ?? document.querySelector("#statistics-tabs .nav-link"); 51315eb316SGreg Roach tab.click(); 529b5537c3SGreg Roach 539b5537c3SGreg Roach // If the user selects a tab, update the URL to reflect this 54315eb316SGreg Roach $('#statistics-tabs a[data-bs-toggle="tab"]').on('shown.bs.tab', function (e) { 5588de55fdSRico Sonntag window.location.hash = "tab-" + e.target.href.substring(e.target.href.indexOf('#') + 1); 569b5537c3SGreg Roach }); 579b5537c3SGreg Roach</script> 589b5537c3SGreg Roach<?php View::endpush() ?> 59