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