mirror/Part-DB.Part-DB-server
1
0
Fork 1
mirror of https://github.com/Part-DB/Part-DB-server.git synced 2025-06-24 18:58:46 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Readd tab remember function to improve UX.

Browse source
This commit is contained in:
Jan Böhmer 2022-07-29 22:52:58 +02:00
parent 9cc5208223
commit 47130846a2
7 changed files with 40 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

64
assets/js/tab_remember.js
View file

@ -5,42 +5,46 @@
* that tab on reload. That means that if the user changes something, he does not have to switch back to the tab
* where he was before submit.
*/
let TabRememberHelper = new class {
class TabRememberHelper {
constructor() {
document.addEventListener("turbo:load", () => {
//Determine which tab should be shown (use hash if specified, otherwise use localstorage)
var $activeTab = null;
if (location.hash) {
$activeTab = $('a[href=\'' + location.hash + '\']');
} else if (localStorage.getItem('activeTab')) {
$activeTab = $('a[href="' + localStorage.getItem('activeTab') + '"]');
}
document.addEventListener("turbo:load", this.onLoad);
}
if ($activeTab) {
//Findout if the tab has any parent tab we have to show before
var parents = $($activeTab).parents('.tab-pane');
parents.each(function (n) {
$('a[href="#' + $(this).attr('id') + '"]').tab('show');
});
//Finally show the active tab itself
$activeTab.tab('show');
}
$('body').on('click', 'a[data-toggle=\'tab\']', function (e) {
e.preventDefault()
var tab_name = this.getAttribute('href')
if (history.replaceState) {
history.replaceState(null, null, tab_name)
} else {
location.hash = tab_name
}
localStorage.setItem('activeTab', tab_name)
onLoad(event) {
//Determine which tab should be shown (use hash if specified, otherwise use localstorage)
let $activeTab = null;
if (location.hash) {
$activeTab = $('a[href=\'' + location.hash + '\']');
} else if (localStorage.getItem('activeTab')) {
$activeTab = $('a[href="' + localStorage.getItem('activeTab') + '"]');
}
$(this).tab('show');
return false;
if ($activeTab) {
//Findout if the tab has any parent tab we have to show before
var parents = $($activeTab).parents('.tab-pane');
parents.each(function (n) {
$('a[href="#' + $(this).attr('id') + '"]').tab('show');
});
//Finally show the active tab itself
$activeTab.tab('show');
}
$('body').on('click', 'a[data-bs-toggle=\'tab\']', function (e) {
e.preventDefault()
var tab_name = this.getAttribute('href')
if (history.replaceState) {
history.replaceState(null, null, tab_name)
} else {
location.hash = tab_name
}
localStorage.setItem('activeTab', tab_name)
$(this).tab('show');
return false;
});
}
}
//export default new TabRememberHelper();
export default new TabRememberHelper();