Files
myaac/system/templates/admin.menus.js.html.twig
slawkens 4d7589a934 [WIP] Add access option to Menus
Thanks @joelslamospersson for idea
2025-12-03 23:53:00 +01:00

96 lines
2.5 KiB
Twig

<link type="text/css" rel="stylesheet" href="{{ constant('BASE_URL') }}tools/ext/jquery-ui/themes/base/jquery-ui.min.css">
<script>
let last_id = [];
let colors = [];
{% for cat, menu in menus %}
{% if config('menu_categories')[cat] is not empty %}
last_id[{{ cat }}] = {{ last_id[cat] }};
{% endif %}
{% endfor %}
{% set menuDefaultLinksColor = config('menu_default_links_color') %}
{% for cat, options in config('menu_categories') %}
colors[{{ cat }}] = '{{ options['default_links_color'] ?? (menuDefaultLinksColor ?? config('menu_default_color')) }}';
{% endfor %}
function confirmRemoveMenuItem(that)
{
let id = $(that).attr("id");
if (confirm('Are you sure, that you want to remove this element?')) {
$('#list-' + id.replace('remove-button-', '')).remove();
}
}
$(function () {
const $sortable = $(".sortable");
$sortable.sortable();
$sortable.disableSelection();
$(".remove-button").on('click', function () {
confirmRemoveMenuItem(this);
});
$(".add-button").on('click', function () {
let cat = $(this).attr("id").replace('add-button-', '');
let id = last_id[cat];
last_id[cat]++;
const color = colors[cat];
let copy = $('.ui-state-default:first').clone();
copy.attr('id', 'list-' + cat + '-' + id);
copy.find('.menu-name').val('').attr('name', 'menu[' + cat + '][]');
copy.find('.menu-link').val('').attr('name', 'menu_link[' + cat + '][]');
copy.find('.menu-access').val('0').attr('name', 'menu_access[' + cat + '][]');
copy.find('.menu-color').val(color).attr('name', 'menu_color[' + cat + '][]');
copy.find('.menu-blank').attr('name', 'menu_blank[' + cat + '][]');
copy.find('.menu-blank-checkbox').prop('checked', false);
copy.find('.remove-button').attr('id', 'remove-button-' + cat + '-' + id);
$('#sortable-' + cat).append(copy);
$('#remove-button-' + cat + '-' + id).on('click', function () {
confirmRemoveMenuItem(this);
});
});
$("#menus-form").on('submit', function (e) {
$('.menu-blank-checkbox:not(:checked)').each(function (i, obj) {
$(obj).parent().prev().val("off");
});
$('.menu-blank-checkbox:checked').each(function (i, obj) {
$(obj).parent().prev().val("on");
});
});
});
</script>
<style>
.sortable {
list-style-type: none;
margin: 0;
padding: 0;
width: 100%;
}
.remove-button, .add-button {
cursor: pointer;
}
.ui-sortable-handle {
padding: 10px;
}
.label_menu_name, .label_menu_link {
width: 45%;
}
.menu-name, .menu-link {
width: 100%;
}
</style>