From b72a828b25a61e968ea33c1192a667bb1760504b Mon Sep 17 00:00:00 2001 From: Unni Kohonen Date: Wed, 30 Aug 2023 11:15:17 +0300 Subject: [PATCH] Update sidebar twig template --- resource/js/tab-alpha.js | 16 ++-- src/view/sidebar.inc | 164 +++++---------------------------- tests/VocabularyConfigTest.php | 2 +- 3 files changed, 34 insertions(+), 148 deletions(-) diff --git a/resource/js/tab-alpha.js b/resource/js/tab-alpha.js index d4c70dee6..99fcb7923 100644 --- a/resource/js/tab-alpha.js +++ b/resource/js/tab-alpha.js @@ -10,15 +10,15 @@ const tabAlphaApp = Vue.createApp({ } }, mounted () { - // load alphabetical index if aplha tab is active when the page is first opened (otherwise only load the index when the tab is clicked) + // load alphabetical index if alphabetical tab is active when the page is first opened (otherwise only load the index when the tab is clicked) // this should probably be done differently - if (document.querySelector('#alpha > a').classList.contains('active')) { + if (document.querySelector('#alphabetical > a').classList.contains('active')) { this.loadLetters() } }, methods: { loadLetters () { - // only load index the first time the page is opened or the alpha tab is clicked + // only load index the first time the page is opened or the alphabetical tab is clicked if (this.indexLetters.length === 0) { fetch('rest/v1/' + SKOSMOS.vocab + '/index/?lang=' + SKOSMOS.lang) .then(data => { @@ -44,22 +44,22 @@ const tabAlphaApp = Vue.createApp({ } }, template: ` -
+
` }) /* Custom directive used to add an event listener on clicks on an element outside of this component */ -tabAlphaApp.directive('click-tab-alpha', { +tabAlphaApp.directive('click-tab-alphabetical', { beforeMount: (el, binding) => { el.clickTabEvent = event => { binding.value() // calling the method given as the attribute value (loadLetters) } - document.querySelector('#alpha').addEventListener('click', el.clickTabEvent) // registering an event listener on clicks on the alpha nav-item element + document.querySelector('#alphabetical').addEventListener('click', el.clickTabEvent) // registering an event listener on clicks on the alphabetical nav-item element }, unmounted: el => { - document.querySelector('#alpha').removeEventListener('click', el.clickTabEvent) + document.querySelector('#alphabetical').removeEventListener('click', el.clickTabEvent) } }) @@ -182,4 +182,4 @@ tabAlphaApp.component('tab-alpha', { ` }) -tabAlphaApp.mount('#tab-alpha') +tabAlphaApp.mount('#tab-alphabetical') diff --git a/src/view/sidebar.inc b/src/view/sidebar.inc index 40cf4b801..4d9f6d049 100644 --- a/src/view/sidebar.inc +++ b/src/view/sidebar.inc @@ -2,151 +2,37 @@