1*0f5fd22fSGreg Roach<?php 2*0f5fd22fSGreg Roach 3*0f5fd22fSGreg Roachuse Fisharebest\Webtrees\Individual; 4*0f5fd22fSGreg Roachuse Fisharebest\Webtrees\Module\ModuleTabInterface; 5*0f5fd22fSGreg Roachuse Fisharebest\Webtrees\View; 6*0f5fd22fSGreg Roachuse Illuminate\Support\Collection; 7*0f5fd22fSGreg Roach 8*0f5fd22fSGreg Roach/** 9*0f5fd22fSGreg Roach * @var Individual $record 10*0f5fd22fSGreg Roach * @var Collection<ModuleTabInterface> $tabs 11*0f5fd22fSGreg Roach */ 12*0f5fd22fSGreg Roach?> 13*0f5fd22fSGreg Roach 14*0f5fd22fSGreg Roach<div class="wt-tabs-individual" id="individual-tabs"> 15*0f5fd22fSGreg Roach <ul class="nav nav-tabs flex-wrap" role="tablist"> 16*0f5fd22fSGreg Roach <?php foreach ($tabs as $tab) : ?> 17*0f5fd22fSGreg Roach <li class="nav-item" role="presentation"> 18*0f5fd22fSGreg Roach <a class="nav-link<?= $tab->isGrayedOut($record) ? ' text-muted' : '' ?>" data-toggle="tab" role="tab" data-href="<?= e(route('module', ['module' => $tab->name(), 'action' => 'Tab', 'tree' => $record->tree()->name(), 'xref' => $record->xref()])) ?>" href="#<?= $tab->name() ?>"> 19*0f5fd22fSGreg Roach <?= $tab->tabTitle() ?> 20*0f5fd22fSGreg Roach </a> 21*0f5fd22fSGreg Roach </li> 22*0f5fd22fSGreg Roach <?php endforeach ?> 23*0f5fd22fSGreg Roach </ul> 24*0f5fd22fSGreg Roach 25*0f5fd22fSGreg Roach <div class="tab-content"> 26*0f5fd22fSGreg Roach <?php foreach ($tabs as $tab) : ?> 27*0f5fd22fSGreg Roach <div id="<?= $tab->name() ?>" class="tab-pane fade wt-ajax-load" role="tabpanel"><?php if (!$tab->canLoadAjax()) : 28*0f5fd22fSGreg Roach ?><?= $tab->getTabContent($record) ?><?php 29*0f5fd22fSGreg Roach endif ?></div> 30*0f5fd22fSGreg Roach <?php endforeach ?> 31*0f5fd22fSGreg Roach </div> 32*0f5fd22fSGreg Roach</div> 33*0f5fd22fSGreg Roach 34*0f5fd22fSGreg Roach<?php View::push('javascript') ?> 35*0f5fd22fSGreg Roach<script> 36*0f5fd22fSGreg Roach "use strict"; 37*0f5fd22fSGreg Roach 38*0f5fd22fSGreg Roach // Bootstrap tabs - load content dynamically using AJAX 39*0f5fd22fSGreg Roach $('a[data-toggle="tab"][data-href]').on('show.bs.tab', function () { 40*0f5fd22fSGreg Roach let target = $(this.hash + ':empty'); 41*0f5fd22fSGreg Roach if (target.length > 0) { 42*0f5fd22fSGreg Roach // Start the download immediately... 43*0f5fd22fSGreg Roach let download = fetch(this.dataset.href); 44*0f5fd22fSGreg Roach 45*0f5fd22fSGreg Roach // ...but don't insert it until the tab is ready. 46*0f5fd22fSGreg Roach $(this).one('shown.bs.tab', () => { 47*0f5fd22fSGreg Roach download 48*0f5fd22fSGreg Roach .then(data => data.text()) 49*0f5fd22fSGreg Roach .then(data => target.html(data)); 50*0f5fd22fSGreg Roach }); 51*0f5fd22fSGreg Roach } 52*0f5fd22fSGreg Roach }); 53*0f5fd22fSGreg Roach 54*0f5fd22fSGreg Roach // If the URL contains a fragment, then activate the corresponding tab. 55*0f5fd22fSGreg Roach // Use a prefix on the fragment, to prevent scrolling to the element. 56*0f5fd22fSGreg Roach let target = window.location.hash.replace("tab-", ""); 57*0f5fd22fSGreg Roach let tab = $("#individual-tabs .nav-link[href='" + target + "']"); 58*0f5fd22fSGreg Roach // If not, then activate the first tab. 59*0f5fd22fSGreg Roach if (tab.length === 0) { 60*0f5fd22fSGreg Roach tab = $("#individual-tabs .nav-link:first"); 61*0f5fd22fSGreg Roach } 62*0f5fd22fSGreg Roach tab.tab("show"); 63*0f5fd22fSGreg Roach 64*0f5fd22fSGreg Roach // If the user selects a tab, update the URL to reflect this 65*0f5fd22fSGreg Roach $('#individual-tabs a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 66*0f5fd22fSGreg Roach window.location.hash = "tab-" + e.target.href.substring(e.target.href.indexOf('#') + 1); 67*0f5fd22fSGreg Roach }); 68*0f5fd22fSGreg Roach</script> 69*0f5fd22fSGreg Roach<?php View::endpush() ?> 70