diff --git a/core/static/tabs.css b/core/static/tabs.css deleted file mode 100644 index 44bf303..0000000 --- a/core/static/tabs.css +++ /dev/null @@ -1,7 +0,0 @@ -#tab-content div { - display: none; -} - -#tab-content div.is-active { - display: block; -} \ No newline at end of file diff --git a/core/static/tabs.js b/core/static/tabs.js index 2b1b3b3..5508491 100644 --- a/core/static/tabs.js +++ b/core/static/tabs.js @@ -1,35 +1,36 @@ - // tabbed browsing for the modal - function initTabs() { - TABS.forEach((tab) => { - tab.addEventListener('click', (e) => { - let selected = tab.getAttribute('data-tab'); - updateActiveTab(tab); - updateActiveContent(selected); - }) - }) - } - - function updateActiveTab(selected) { - TABS.forEach((tab) => { - if (tab && tab.classList.contains(ACTIVE_CLASS)) { - tab.classList.remove(ACTIVE_CLASS); - } - }); - selected.classList.add(ACTIVE_CLASS); - } - - function updateActiveContent(selected) { - CONTENT.forEach((item) => { - if (item && item.classList.contains(ACTIVE_CLASS)) { - item.classList.remove(ACTIVE_CLASS); - } - let data = item.getAttribute('data-content'); - if (data === selected) { - item.classList.add(ACTIVE_CLASS); - } - }); - } -var TABS = [...document.querySelectorAll('#tabs li')]; -var CONTENT = [...document.querySelectorAll('#tab-content div')]; -var ACTIVE_CLASS = 'is-active'; -initTabs(); \ No newline at end of file +function initTabs(unique) { + var tabs_selector = '#tabs-'+unique+' li'; + var TABS = [...document.querySelectorAll(tabs_selector)]; + var CONTENT = [...document.querySelectorAll('#tab-content-'+unique+' div')]; + var ACTIVE_CLASS = 'is-active'; + TABS.forEach((tab) => { + tab.addEventListener('click', (e) => { + let selected = tab.getAttribute('data-tab'); + updateActiveTab(TABS, ACTIVE_CLASS, tab); + updateActiveContent(CONTENT, ACTIVE_CLASS, selected); + }) + }) + } + +function updateActiveTab(TABS, ACTIVE_CLASS, selected) { + TABS.forEach((tab) => { + if (tab && tab.classList.contains(ACTIVE_CLASS)) { + tab.classList.remove(ACTIVE_CLASS); + } + }); + selected.classList.add(ACTIVE_CLASS); +} + +function updateActiveContent(CONTENT, ACTIVE_CLASS, selected) { + CONTENT.forEach((item) => { + if (item && item.classList.contains(ACTIVE_CLASS)) { + item.classList.remove(ACTIVE_CLASS); + } + let data = item.getAttribute('data-content'); + if (data === selected) { + item.classList.add(ACTIVE_CLASS); + } + }); +} + +// initTabs(); \ No newline at end of file diff --git a/core/templates/modals/context.html b/core/templates/modals/context.html index 2db476c..19a58ef 100644 --- a/core/templates/modals/context.html +++ b/core/templates/modals/context.html @@ -2,8 +2,6 @@ {% load static %} - - +