I believe Owen was working on something similar for the cataloguing editor - adding him CC. This is what I was playing around with: https://zivotdesign.com/p/#1/15223413373574 The section links would float along with the toolbar. There were some issues with it that I was still working out, so I'll have to rebase and take another look if it's interesting to folks. Created attachment 83770 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. I can't apply the patch. Applying: Bug 22045: Cataloging UX enhancement - Improve access to tabs fatal: sha1 information is lacking or useless (koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss). error: could not build fake ancestor Patch failed at 0001 Bug 22045: Cataloging UX enhancement - Improve access to tabs Hi Maryse, this bug depends on bug 21751, it needs to be applied and tested first. Created attachment 84728 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Created attachment 84896 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Signed-off-by: Mikaël Olangcay Brisebois <mikael.olangcay-brisebois@inLibro.com> It's a really nice UX enhancement, only thing I would modify is the numbering. It should start from 0 instead of 1. (In reply to Mikaël Olangcay Brisebois from comment #8) > It's a really nice UX enhancement, only thing I would modify is the > numbering. It should start from 0 instead of 1. My intention was to make the number more user-friendly, since normal people don't start counting at zero. However, I didn't consider that the MARC framework editor would have to be changed at the same time, so I'll have to save that for another bug. Created attachment 84984 [details] [review] Bug 22045: (follow-up) Revert change to numbering of tabs I wanted the tabs to be numbered like humans count, starting from 1. But if the MARC framework setup isn't changed as well it doesn't make sense. This patch removes the change. Also fixed: Some missing template filters, an errant console.log() removed. To test, apply the patch and open a new or existing record for editing. The tabs (now "Sections") should be labeled from 0-9. Created attachment 84985 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Signed-off-by: Mikaël Olangcay Brisebois <mikael.olangcay-brisebois@inLibro.com> Created attachment 84986 [details] [review] Bug 22045: (follow-up) Revert change to numbering of tabs I wanted the tabs to be numbered like humans count, starting from 1. But if the MARC framework setup isn't changed as well it doesn't make sense. This patch removes the change. Also fixed: Some missing template filters, an errant console.log() removed. To test, apply the patch and open a new or existing record for editing. The tabs (now "Sections") should be labeled from 0-9. Created attachment 84993 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Signed-off-by: Mikaël Olangcay Brisebois <mikael.olangcay-brisebois@inLibro.com> Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Created attachment 84994 [details] [review] Bug 22045: (follow-up) Revert change to numbering of tabs I wanted the tabs to be numbered like humans count, starting from 1. But if the MARC framework setup isn't changed as well it doesn't make sense. This patch removes the change. Also fixed: Some missing template filters, an errant console.log() removed. To test, apply the patch and open a new or existing record for editing. The tabs (now "Sections") should be labeled from 0-9. Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Created attachment 84995 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Signed-off-by: Mikaël Olangcay Brisebois <mikael.olangcay-brisebois@inLibro.com> Signed-off-by: David Nind <david@davidnind.com> Created attachment 84996 [details] [review] Bug 22045: (follow-up) Revert change to numbering of tabs I wanted the tabs to be numbered like humans count, starting from 1. But if the MARC framework setup isn't changed as well it doesn't make sense. This patch removes the change. Also fixed: Some missing template filters, an errant console.log() removed. To test, apply the patch and open a new or existing record for editing. The tabs (now "Sections") should be labeled from 0-9. Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Created attachment 84997 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Signed-off-by: Mikaël Olangcay Brisebois <mikael.olangcay-brisebois@inLibro.com> Signed-off-by: David Nind <david@davidnind.com> Created attachment 84998 [details] [review] Bug 22045: (follow-up) Revert change to numbering of tabs I wanted the tabs to be numbered like humans count, starting from 1. But if the MARC framework setup isn't changed as well it doesn't make sense. This patch removes the change. Also fixed: Some missing template filters, an errant console.log() removed. To test, apply the patch and open a new or existing record for editing. The tabs (now "Sections") should be labeled from 0-9. Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Apologies, I couldn't figure out how to git rid of "John Doe" for attachment 84998 [details] [review]. Sometimes we have frameworks with some sections empty, this UI adapts well, but I can't change the tabs on biblio with such framework. Otherwise it looks good and much cleaner the before. I like it Created attachment 85567 [details] [review] Bug 22045: (follow-up) Fix tab-switching when some tab numbers are missing This patch changes the way tab-switching is done so that it switching tabs based on tab id rather than tab index. Using tab index doesn't work when the tab number doesn't match the tab index. To test, apply the patch and load a record or blank editor using a MARC framework which doesn't include one or more tabs (for instance, by deleting the entries in the framework for one tab: DELETE FROM marc_subfield_structure WHERE frameworkcode = 'KT' AND tab = 4; ...backup first). In the MARC editor the numbered tabs should exclude that number. Tab-switching should work correctly. Created attachment 85578 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Signed-off-by: Mikaël Olangcay Brisebois <mikael.olangcay-brisebois@inLibro.com> Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Maryse Simard <maryse.simard@inlibro.com> Created attachment 85579 [details] [review] Bug 22045: (follow-up) Revert change to numbering of tabs I wanted the tabs to be numbered like humans count, starting from 1. But if the MARC framework setup isn't changed as well it doesn't make sense. This patch removes the change. Also fixed: Some missing template filters, an errant console.log() removed. To test, apply the patch and open a new or existing record for editing. The tabs (now "Sections") should be labeled from 0-9. Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Maryse Simard <maryse.simard@inlibro.com> Created attachment 85580 [details] [review] Bug 22045: (follow-up) Fix tab-switching when some tab numbers are missing This patch changes the way tab-switching is done so that it switching tabs based on tab id rather than tab index. Using tab index doesn't work when the tab number doesn't match the tab index. To test, apply the patch and load a record or blank editor using a MARC framework which doesn't include one or more tabs (for instance, by deleting the entries in the framework for one tab: DELETE FROM marc_subfield_structure WHERE frameworkcode = 'KT' AND tab = 4; ...backup first). In the MARC editor the numbered tabs should exclude that number. Tab-switching should work correctly. Signed-off-by: Maryse Simard <maryse.simard@inlibro.com> Created attachment 85581 [details]
ILL cataloguing framework
This is framework we are using for ILL records, it has only two tabs ;)
This is the one I used to testing. But it is only in Czech
Created attachment 85582 [details]
Variant of tabs - maybe future enhancement
I just try this, now I generated it by adding this code to intranetuserjs:
$(document).ready(function() {
$(".toolbar-tabs-container a[href='#tab0XX'], #tab0XX h3").text("Control and coded fields");
$(".toolbar-tabs-container a[href='#tab1XX'], #tab1XX h3").text("Main entry");
$(".toolbar-tabs-container a[href='#tab2XX'], #tab2XX h3").text("Title and edition");
$(".toolbar-tabs-container a[href='#tab3XX'], #tab3XX h3").text("Physical description");
$(".toolbar-tabs-container a[href='#tab4XX'], #tab4XX h3").text("Series");
$(".toolbar-tabs-container a[href='#tab5XX'], #tab5XX h3").text("Notes");
$(".toolbar-tabs-container a[href='#tab6XX'], #tab6XX h3").text("Subject Access");
$(".toolbar-tabs-container a[href='#tab7XX'], #tab7XX h3").text("Added and linking entry");
$(".toolbar-tabs-container a[href='#tab8XX'], #tab8XX h3").text("Series added entry and electronic access");
$(".toolbar-tabs-container a[href='#tab9XX'], #tab9XX h3").text("Koha related");
});
Created attachment 85583 [details] [review] Bug 22045: Cataloging UX enhancement - Improve access to tabs This patch makes style changes to the standard MARC editor with the goal of both making it more responsive and making it easier to navigate among tabs and tags. Tabs are now part of the page's toolbar, which floats as the page scrolls. In addition to the numbered tabs, there is also a section showing in-page links to the MARC tags which are available on that page. To test, apply the patch, regenerate the staff client CSS, and clear your browser cache if necessary. Open a blank or existing record in the standard cataloging editor. Test the redesigned tabs, the floating toolbar, and the in-page tag links. Confirm that everything works well at various browser widths. Signed-off-by: Mikaël Olangcay Brisebois <mikael.olangcay-brisebois@inLibro.com> Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Maryse Simard <maryse.simard@inlibro.com> Signed-off-by: Josef Moravec <josef.moravec@gmail.com> Created attachment 85584 [details] [review] Bug 22045: (follow-up) Revert change to numbering of tabs I wanted the tabs to be numbered like humans count, starting from 1. But if the MARC framework setup isn't changed as well it doesn't make sense. This patch removes the change. Also fixed: Some missing template filters, an errant console.log() removed. To test, apply the patch and open a new or existing record for editing. The tabs (now "Sections") should be labeled from 0-9. Signed-off-by: John Doe <you@example.com> Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Maryse Simard <maryse.simard@inlibro.com> Signed-off-by: Josef Moravec <josef.moravec@gmail.com> Created attachment 85585 [details] [review] Bug 22045: (follow-up) Fix tab-switching when some tab numbers are missing This patch changes the way tab-switching is done so that it switching tabs based on tab id rather than tab index. Using tab index doesn't work when the tab number doesn't match the tab index. To test, apply the patch and load a record or blank editor using a MARC framework which doesn't include one or more tabs (for instance, by deleting the entries in the framework for one tab: DELETE FROM marc_subfield_structure WHERE frameworkcode = 'KT' AND tab = 4; ...backup first). In the MARC editor the numbered tabs should exclude that number. Tab-switching should work correctly. Signed-off-by: Maryse Simard <maryse.simard@inlibro.com> Signed-off-by: Josef Moravec <josef.moravec@gmail.com> (In reply to Josef Moravec from comment #26) > I just try this, now I generated it by adding this code to intranetuserjs: > > $(document).ready(function() { > $(".toolbar-tabs-container a[href='#tab0XX'], #tab0XX h3").text("Control > and coded fields"); > .... It would be nice to be able to add these custom labels directly in the MARC framework configuration. (In reply to Owen Leonard from comment #30) > (In reply to Josef Moravec from comment #26) > > I just try this, now I generated it by adding this code to intranetuserjs: > > > > $(document).ready(function() { > > $(".toolbar-tabs-container a[href='#tab0XX'], #tab0XX h3").text("Control > > and coded fields"); > > .... > > It would be nice to be able to add these custom labels directly in the MARC > framework configuration. That is what I have in mind... ;) Awesome work all! Pushed to master for 19.05 Enhancement will not be backported to 18.11.x series. This bug broke keyboard shortcuts because of following change:
--- a/koha-tmpl/intranet-tmpl/prog/js/staff-global.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/staff-global.js
@@ -31,7 +31,7 @@ $.fn.tabIndex = function () {
return $(this).parent().children('div').index(this);
};
$.fn.selectTabByID = function (tabID) {
- $(this).tabs("option", "active", $(tabID).tabIndex());
+ $(this).tabs("option", "active", $( "#" + tabID ).tabIndex());
};
$(document).ready(function() {
without modification to calling which also prefix tabID with #, thus creating invalid ##tabID
Changing the status of this to reflect that it has been pushed to master and won't be backported. Bug 22768 will address Comment 34. *** Bug 17148 has been marked as a duplicate of this bug. *** |
Created attachment 83473 [details] vertical displaying tabs it would be nice if on the cat_addbiblio page the ui-tabs-nav (0-9 tabs) were either fixed OR also available at the bottom of the page so catalogers don't have to scroll all the way back up to the top of the page each time they want to switch tabs. I have experimented with displaying them vertical instead of horizontal, with a position of fixed.