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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
|
<?php
use Fisharebest\Webtrees\I18N;
use Fisharebest\Webtrees\View;
?>
<h2><?= $title ?></h2>
<p class="mt-4 mb-1">
<?= I18N::translate('Drag the blocks to change their position.') ?>
</p>
<form method="post" action="<?= e($url_save) ?>" id="edit-blocks">
<?= csrf_field() ?>
<div class="card-deck" id="current-blocks">
<div class="card">
<div class="card-body" id="main-blocks">
<?php foreach ($main_blocks as $block_id => $block) : ?>
<?= view('edit-blocks-block', ['block_id' => $block_id, 'block' => $block]) ?>
<?php endforeach ?>
</div>
</div>
<div class="card">
<div class="card-body" id="side-blocks">
<?php foreach ($side_blocks as $block_id => $block) : ?>
<?= view('edit-blocks-block', ['block_id' => $block_id, 'block' => $block]) ?>
<?php endforeach ?>
</div>
</div>
</div>
<p class="mt-4 mb-1">
<?= I18N::translate('Add more blocks from the following list.') ?>
</p>
<div class="d-flex flex-wrap" id="available-blocks">
<?php foreach ($all_blocks as $block_id => $block) : ?>
<?= view('edit-blocks-block', ['block_id' => $block_id, 'block' => $block]) ?>
<?php endforeach ?>
</div>
<hr>
<div>
<button class="btn btn-primary" type="submit">
<?= view('icons/save') ?>
<?= I18N::translate('save') ?>
</button>
<a class="btn btn-secondary" href="<?= e($url_cancel) ?>">
<?= view('icons/cancel') ?>
<?= I18N::translate('cancel') ?>
</a>
<?php if ($can_reset) : ?>
<button class="btn btn-link" id="defaults" type="submit" name="defaults" value="on" data-confirm="<?= I18N::translate('Restore the default block layout') ?>" onclick="return confirm(this.dataset.confirm)">
<?= I18N::translate('Restore the default block layout') ?>
</button>
<?php endif ?>
</div>
</form>
<?php View::push('styles') ?>
<style>
#available-blocks .wt-icon-delete {
display: none;
}
#current-blocks .wt-icon-help {
display: none;
}
</style>
<?php View::endpush() ?>
<?php View::push('javascript') ?>
<script>
new Sortable(document.getElementById("main-blocks"), {
group: "blocks",
handle: ".wt-icon-drag-handle",
animation: 150,
pull: "clone",
});
new Sortable(document.getElementById("side-blocks"), {
group: "blocks",
handle: ".wt-icon-drag-handle",
animation: 150,
pull: "clone",
});
new Sortable(document.getElementById("available-blocks"), {
group: {
name: "blocks",
pull: "clone",
put: false,
},
handle: ".wt-icon-drag-handle",
animation: 150,
sort: false,
});
$("#current-blocks").on("click", ".wt-icon-delete", function () {
$(this).closest(".wt-block").remove();
});
$('#edit-blocks').submit(function () {
$('#main-blocks input').attr('name', 'main[]');
$('#side-blocks input').attr('name', 'side[]');
});
</script>
<?php View::endpush() ?>
|