murph/murph-core
murph/murph-core
1
1
Fork 0
Code Issues Pull requests Packages Projects Releases 22 Wiki Activity

add blur when several modals are opened

Browse source
This commit is contained in:
Simon Vieille 2022-03-18 16:56:30 +01:00
parent 2655088ee6
commit b686fd5285
3 changed files with 32 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/core/Resources/assets/css/admin.scss
View file

@ -540,6 +540,10 @@ form {
margin-right: auto;
}
.modal.show.blur {
filter: blur(4px);
}
.output {
&-console {
background: #073642;

32
src/core/Resources/assets/js/modules/modal.js
View file

@ -9,10 +9,10 @@ const openModal = function (url, createModal) {
let container = $(`#${id}`)
const body = $('body')
let doTrigger = true
const doTrigger = true
if (!container.length) {
let doTrigger = false
const doTrigger = false
container = $(`<div id="${id}" class="modal">`)
body.append(container)
@ -30,19 +30,39 @@ const openModal = function (url, createModal) {
loader.remove()
if (doTrigger) {
container.trigger('shown.bs.modal')
container.trigger('shown.bs.modal')
}
})
}
const onShownAndHide = () => {
$('.modal-backdrop.show').each((key, value) => {
if (key) {
$(value).remove()
}
})
const modals = $('.modal.show')
modals.each((key, value) => {
value.classList.toggle('blur', (key + 1) < modals.length)
})
}
module.exports = function () {
let click = 0
const body = $('body')
body.on('shown.bs.modal', '.modal', onShownAndHide)
body.on('hidden.bs.modal', '.modal', (e) => {
$(e.target).remove()
if ($('.modal.show').length) {
$('body').addClass('modal-open')
}
onShownAndHide()
})
body.on('click', '*[data-modal]', (e) => {
@ -60,9 +80,9 @@ module.exports = function () {
click = 0
let element = $(e.target).is('[data-modal]') ? $(e.target) : $(e.target).parents('*[data-modal]').first()
let url = element.attr('data-modal')
let createModal = element.is('[data-modal-create]')
const element = $(e.target).is('[data-modal]') ? $(e.target) : $(e.target).parents('*[data-modal]').first()
const url = element.attr('data-modal')
const createModal = element.is('[data-modal-create]')
openModal(url, createModal)
}, 250)

4
src/core/Resources/views/file_manager/info.html.twig
View file

@ -134,11 +134,11 @@
{% if context == 'tinymce' %}
{% if not isLocked %}
{% if splInfo.isDir %}
<button form="form-file-delete" class="btn btn-sm btn-primary" data-modal="{{ path('admin_file_manager_directory_rename', {file: splInfo.relativePathname, ajax: ajax}) }}">
<button form="form-file-delete" class="btn btn-sm btn-primary" data-modal="{{ path('admin_file_manager_directory_rename', {file: splInfo.relativePathname, ajax: ajax}) }}" data-modal-create>
{{ 'Rename'|trans }}
</button>
{% else %}
<button form="form-file-delete" class="btn btn-sm btn-primary" data-modal="{{ path('admin_file_manager_file_rename', {file: splInfo.relativePathname, ajax: ajax}) }}">
<button form="form-file-delete" class="btn btn-sm btn-primary" data-modal="{{ path('admin_file_manager_file_rename', {file: splInfo.relativePathname, ajax: ajax}) }}" data-modal-create>
{{ 'Rename'|trans }}
</button>
{% endif %}