diff --git a/administrator/components/com_templates/tmpl/template/default_folders.php b/administrator/components/com_templates/tmpl/template/default_folders.php index 52973e3593d..86cb9a94bab 100644 --- a/administrator/components/com_templates/tmpl/template/default_folders.php +++ b/administrator/components/com_templates/tmpl/template/default_folders.php @@ -15,7 +15,7 @@ files as $key => $value) : ?>
  • - + escape(end($explodeArray)); ?> diff --git a/administrator/components/com_templates/tmpl/template/default_tree.php b/administrator/components/com_templates/tmpl/template/default_tree.php index c1004e68a45..09ec3fb825e 100644 --- a/administrator/components/com_templates/tmpl/template/default_tree.php +++ b/administrator/components/com_templates/tmpl/template/default_tree.php @@ -50,7 +50,7 @@ ?>
  • - +  escape(end($explodeArray)); ?> diff --git a/administrator/templates/khonsu/scss/blocks/_treeselect.scss b/administrator/templates/khonsu/scss/blocks/_treeselect.scss index 359a6adc9fc..6415866ae91 100644 --- a/administrator/templates/khonsu/scss/blocks/_treeselect.scss +++ b/administrator/templates/khonsu/scss/blocks/_treeselect.scss @@ -87,6 +87,13 @@ position: relative; display: block; list-style: none; + line-height: 25px; + + a { + &.folder-url { + padding-left: 5px; + } + } &::before { position: absolute; @@ -117,8 +124,9 @@ } } .has-subtree { + .directory-tree { - margin-left: ($treeselect-indent - 15px); + margin-left: ($treeselect-indent - 10px); margin-top: -5px; li { &:first-child { @@ -129,4 +137,4 @@ } } } -} \ No newline at end of file +} diff --git a/build/media_source/com_templates/js/admin-templates-default.es6.js b/build/media_source/com_templates/js/admin-templates-default.es6.js index 46c4b9ab417..c7b3c191ae2 100644 --- a/build/media_source/com_templates/js/admin-templates-default.es6.js +++ b/build/media_source/com_templates/js/admin-templates-default.es6.js @@ -9,8 +9,7 @@ const folders = [].slice.call(document.querySelectorAll('.folder-url, .component-folder-url, .plugin-folder-url, .layout-folder-url')); const innerLists = [].slice.call(document.querySelectorAll('.folder ul, .component-folder ul, .plugin-folder ul, .layout-folder ul')); const openLists = [].slice.call(document.querySelectorAll('.show > ul')); - const fileModalFolders = [].slice.call(document.querySelectorAll('#fileModal .folder-url')); - const folderModalFolders = [].slice.call(document.querySelectorAll('#folderModal .folder-url')); + // Hide all the folders when the page loads innerLists.forEach((innerList) => { innerList.style.display = 'none'; @@ -37,38 +36,65 @@ }); // File modal tree selector - fileModalFolders.forEach((fileModalFolder) => { - fileModalFolder.addEventListener('click', (event) => { - event.preventDefault(); + document.getElementById('fileModal').addEventListener('joomla.modal.show', () => { + const fileModalFolders = [].slice.call(document.querySelectorAll('#fileModal .folder-url')); - fileModalFolders.forEach((fileModalFold) => { - fileModalFold.classList.remove('selected'); - }); + fileModalFolders.forEach((fileModalFolder) => { + fileModalFolder.addEventListener('click', (event) => { + event.preventDefault(); - event.target.classList.add('selected'); + fileModalFolders.forEach((fileModalFold) => { + fileModalFold.classList.remove('selected'); + }); - const listElsAddressToAdd = [].slice.call(document.querySelectorAll('#fileModal input.address')); + event.target.classList.add('selected'); - listElsAddressToAdd.forEach((element) => { - element.value = event.target.getAttribute('data-id'); + const listElsAddressToAdd = [].slice.call(document.querySelectorAll('#fileModal input.address')); + + listElsAddressToAdd.forEach((element) => { + element.value = event.target.getAttribute('data-id'); + }); + + // Expand/collapse folder + const children = fileModalFolder.nextElementSibling; + if (typeof children.style.display !== 'undefined') { + if (children.style.display === '' || children.style.display === 'block') { + children.style.display = 'none'; + } else { + children.style.display = 'block'; + } + } }); }); }); // Folder modal tree selector - folderModalFolders.forEach((folderModalFolder) => { - folderModalFolder.addEventListener('click', (event) => { - event.preventDefault(); - - folderModalFolders.forEach((folderModalFldr) => { - folderModalFldr.classList.remove('selected'); - }); - - event.target.classList.add('selected'); - const listElsAddressToAdd = [].slice.call(document.querySelectorAll('#folderModal input.address')); - - listElsAddressToAdd.forEach((element) => { - element.value = event.target.getAttribute('data-id'); + document.getElementById('folderModal').addEventListener('joomla.modal.show', () => { + const folderModalFolders = [].slice.call(document.querySelectorAll('#folderModal .folder-url')); + folderModalFolders.forEach((folderModalFolder) => { + folderModalFolder.addEventListener('click', (event) => { + event.preventDefault(); + + folderModalFolders.forEach((folderModalFldr) => { + folderModalFldr.classList.remove('selected'); + }); + + event.target.classList.add('selected'); + const listElsAddressToAdd = [].slice.call(document.querySelectorAll('#folderModal input.address')); + + listElsAddressToAdd.forEach((element) => { + element.value = event.target.getAttribute('data-id'); + }); + + // Expand/collapse folder + const children = folderModalFolder.nextElementSibling; + if (typeof children.style.display !== 'undefined') { + if (children.style.display === '' || children.style.display === 'block') { + children.style.display = 'none'; + } else { + children.style.display = 'block'; + } + } }); }); });