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