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