xref: /webtrees/resources/views/edit/reorder-children.phtml (revision dc124885db241fd8521088b8689a0a0d42b43764)
1dd6b2bfcSGreg Roach<?php use Fisharebest\Webtrees\FontAwesome; ?>
2dd6b2bfcSGreg Roach<?php use Fisharebest\Webtrees\I18N; ?>
3dd6b2bfcSGreg Roach<?php use Fisharebest\Webtrees\View; ?>
4dd6b2bfcSGreg Roach
5dd6b2bfcSGreg Roach<h2 class="wt-page-title"><?= $title ?></h2>
6dd6b2bfcSGreg Roach
7dd6b2bfcSGreg Roach<form class="wt-page-content" method="post">
8dd6b2bfcSGreg Roach    <?= csrf_field() ?>
9dd6b2bfcSGreg Roach    <div class="wt-sortable-list">
10dd6b2bfcSGreg Roach        <?php foreach ($family->getFacts('CHIL') as $fact) : ?>
11*dc124885SGreg Roach            <div class="card mb-2 wt-sortable-item" data-sortbydate="<?= $fact->target()->getBirthDate()->julianDay() ?>">
12dd6b2bfcSGreg Roach                <input type="hidden" name="order[]" value="<?= $fact->getFactId() ?>">
13dd6b2bfcSGreg Roach                <h3 class="card-header">
14dd6b2bfcSGreg Roach                    <?= FontAwesome::semanticIcon('drag-handle', '') ?>
15*dc124885SGreg Roach                    <?= $fact->target()->getFullName() ?>
16dd6b2bfcSGreg Roach                </h3>
17dd6b2bfcSGreg Roach                <div class="card-body">
18*dc124885SGreg Roach                    <?= $fact->target()->formatFirstMajorFact(WT_EVENTS_BIRT, 2) ?>
19*dc124885SGreg Roach                    <?= $fact->target()->formatFirstMajorFact(WT_EVENTS_DEAT, 2) ?>
20dd6b2bfcSGreg Roach                </div>
21dd6b2bfcSGreg Roach            </div>
22dd6b2bfcSGreg Roach        <?php endforeach ?>
23dd6b2bfcSGreg Roach    </div>
24dd6b2bfcSGreg Roach
25dd6b2bfcSGreg Roach    <p>
26dd6b2bfcSGreg Roach        <button class="btn btn-primary" type="submit">
27dd6b2bfcSGreg Roach            <?= FontAwesome::decorativeIcon('save') ?>
28dd6b2bfcSGreg Roach            <?= /* I18N: A button label. */ I18N::translate('save') ?>
29dd6b2bfcSGreg Roach        </button>
30dd6b2bfcSGreg Roach
31dd6b2bfcSGreg Roach        <button class="btn btn-secondary" id="btn-default-order" type="button">
32dd6b2bfcSGreg Roach            <?= FontAwesome::decorativeIcon('sort') ?>
33dd6b2bfcSGreg Roach            <?= /* I18N: A button label. */ I18N::translate('sort by date of birth') ?>
34dd6b2bfcSGreg Roach        </button>
35dd6b2bfcSGreg Roach
36dd6b2bfcSGreg Roach        <a class="btn btn-secondary" href="<?= e($family->url()) ?>">
37dd6b2bfcSGreg Roach            <?= FontAwesome::decorativeIcon('cancel') ?>
38dd6b2bfcSGreg Roach            <?= /* I18N: A button label. */ I18N::translate('cancel') ?>
39dd6b2bfcSGreg Roach        </a>
40dd6b2bfcSGreg Roach    </p>
41dd6b2bfcSGreg Roach</form>
42dd6b2bfcSGreg Roach
43dd6b2bfcSGreg Roach<?php View::push('javascript') ?>
44dd6b2bfcSGreg Roach<script>
45dd6b2bfcSGreg Roach  new Sortable(document.querySelector(".wt-sortable-list"), {});
46dd6b2bfcSGreg Roach
47dd6b2bfcSGreg Roach  $("#btn-default-order").on("click", function() {
48dd6b2bfcSGreg Roach    $(".wt-sortable-list .wt-sortable-item").sort(function(x, y) {
49dd6b2bfcSGreg Roach      return Math.sign(x.dataset.sortbydate - y.dataset.sortbydate);
50dd6b2bfcSGreg Roach    }).appendTo(".wt-sortable-list");
51dd6b2bfcSGreg Roach  });
52dd6b2bfcSGreg Roach</script>
53dd6b2bfcSGreg Roach<?php View::endpush() ?>
54