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