Bugzilla – Attachment 177873 Details for
Bug 7508
Collapsable items on items tab
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 7508: Collapsable items on items tab
Bug-7508-Collapsable-items-on-items-tab.patch (text/plain), 8.99 KB, created by
Owen Leonard
on 2025-02-12 13:37:56 UTC
(
hide
)
Description:
Bug 7508: Collapsable items on items tab
Filename:
MIME Type:
Creator:
Owen Leonard
Created:
2025-02-12 13:37:56 UTC
Size:
8.99 KB
patch
obsolete
>From b406de55a2db90dbdb9c1bee8f3681bd72c71fe9 Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Tue, 18 Jun 2024 18:47:08 +0000 >Subject: [PATCH] Bug 7508: Collapsable items on items tab > >Since we recently updated the patron entry form in the staff interface >to have more visibly-collapsible sections I thought there might be >interest in picking up this old bug. > >The patch implements collapsible sections on the item detail page, >allowing the user to hide sections by clicking the item barcode header. >The patch includes relocation of some JS code from the authority and >MARC editors into the global JS file. This is the code that helps jump >the user to a certain scroll point on the page. > >To test, apply the patch and clear your browser cache. > >- In the staff interface, locate a bibliographic record with items and > view the detail page. >- Click the "Items" tab in the sidebar. >- On the item detail page, each section should have an icon indicating > that they are expanded. Hovering your mouse over the section heading > should highlight the clickable area. >- Test that each section collapses correctly and that the next section > is moved into view. > >- Go to Cataloging -> New record. Test that the links to specific tags > under the main tab bar still work to jump you to the correct part of > the page. >- Go to Authorities -> New authority and perform the same test. > >Sponsored-by: Athens County Public Libraries >Signed-off-by: Brendan Lawlor <blawlor@clamsnet.org> >Signed-off-by: David Nind <david@davidnind.com> > >Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> >--- > .../en/modules/authorities/authorities.tt | 21 ------- > .../prog/en/modules/catalogue/moredetail.tt | 59 ++++++++++++++++--- > .../prog/en/modules/cataloguing/addbiblio.tt | 20 ------- > .../intranet-tmpl/prog/js/staff-global.js | 20 +++++++ > 4 files changed, 70 insertions(+), 50 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/authorities/authorities.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/authorities/authorities.tt >index 1a617b61ec5..00a28b46740 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/authorities/authorities.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/authorities/authorities.tt >@@ -178,27 +178,6 @@ > $(".tag_anchors_" + tabid ).addClass("tab_selected").show(); > } > >- /** >- * Returns a roughly ideal position to scroll an element into view >- * @param {string} target - The HTML id of the element to scroll into view >- * @param {string} elemid - The HTML id of the element which might obscure >- * the view of the target element e.g. a floating toolbar >- * @return {number} - The y-coordinate to pass to window.scrollTo() >- */ >- function getScrollto( target, elemid ){ >- var dest = $("#" + target ); >- var yoffset = dest.offset(); >- >- if( elemid != "" ){ >- var element = $("#" + elemid ); >- var elem_height = element.outerHeight(); >- } else { >- elem_height = 0; >- } >- return yoffset.top - elem_height - 20; >- } >- >- > /** > * check if z3950 mandatories are set or not > */ >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/moredetail.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/moredetail.tt >index 0943da4f426..56b0f47951f 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/moredetail.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/catalogue/moredetail.tt >@@ -15,11 +15,31 @@ > [% END %]</title > > > [% INCLUDE 'doc-head-close.inc' %] >-<style> >- .listgroup .rows { >- margin-left: 1em; >- } >-</style> >+[% FILTER collapse %] >+ <style> >+ .listgroup .rows { >+ margin-left: 1em; >+ } >+ h3 { >+ background-color: #fff; >+ border: 1px solid #fff; >+ margin-bottom: 0; >+ padding: 1rem; >+ } >+ h3:hover { >+ border: 1px solid #6faf44; >+ cursor: pointer; >+ } >+ h3 i { >+ color: #4c7aa8; >+ font-size: 80%; >+ padding-right: 0.2rem; >+ } >+ h3.collapsed i.fa.fa-caret-down::before { >+ content: "\f0da"; >+ } >+ </style> >+[% END %] > </head> > <body id="catalog_moredetail" class="catalog"> > [% USE KohaDates %] >@@ -112,6 +132,10 @@ > [% END %] > > [% FOREACH ITEM_DAT IN ITEM_DATA %] >+ <h3 id="item[% ITEM_DAT.itemnumber | html %]" class="expanded"> >+ <i class="fa fa-caret-down" title="Collapse this section"></i> >+ Barcode [% ITEM_DAT.barcode | html %] [% IF not_for_loan %][% not_for_loan_description | html %][% END %] >+ </h3> > <div class="page-section clearfix"> > [% SET not_for_loan = 0 %] > [% IF ITEM_DAT.notforloan || ITEM_DAT.effective_itemtype.notforloan %] >@@ -119,8 +143,6 @@ > [% SET not_for_loan_description = AuthorisedValues.GetDescriptionByKohaField( kohafield => 'items.notforloan', authorised_value => item.notforloan ) %] > [% END %] > <div class="listgroup"> >- <h3 id="item[% ITEM_DAT.itemnumber | html %]"> Barcode [% ITEM_DAT.barcode | html %] [% IF not_for_loan %][% not_for_loan_description | html %][% END %] </h3> >- > <h4> > Item information > [% UNLESS ( ITEM_DAT.nomod ) %] >@@ -553,8 +575,27 @@ > [% Asset.js("js/modals/add_catalog_concern.js") | $raw %] > [% END %] > <script> >- var browser = KOHA.browser('[% searchid | html %]', parseInt('[% biblionumber | html %]', 10)); >- browser.show(); >+ $(document).ready(function(){ >+ var browser = KOHA.browser('[% searchid | html %]', parseInt('[% biblionumber | html %]', 10)); >+ browser.show(); >+ $(".collapsed, .expanded").on("click",function(e){ >+ e.preventDefault(); >+ var linkid = this.id; >+ window.scrollTo( 0, getScrollto( linkid, "" ) ); >+ togglePanel( $(this) ); >+ }); >+ }); >+ >+ function togglePanel( node ){ >+ var panel = node.next( ".page-section" ); >+ if(panel.is(":visible")){ >+ node.addClass("collapsed").removeClass("expanded").attr("title", __("Click to expand this section") ); >+ panel.hide(); >+ } else { >+ node.addClass("expanded").removeClass("collapsed").attr("title", __("Click to collapse this section") ); >+ panel.show(); >+ } >+ } > </script> > [% END %] > [% INCLUDE 'intranet-bottom.inc' %] >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt >index ff3fe9f8d86..0748c11ee72 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/addbiblio.tt >@@ -212,26 +212,6 @@ > $(".tag_anchors_" + tabid ).addClass("tab_selected").show(); > } > >- /** >- * Returns a roughly ideal position to scroll an element into view >- * @param {string} target - The HTML id of the element to scroll into view >- * @param {string} elemid - The HTML id of the element which might obscure >- * the view of the target element e.g. a floating toolbar >- * @return {number} - The y-coordinate to pass to window.scrollTo() >- */ >- function getScrollto( target, elemid ){ >- var dest = $("#" + target ); >- var yoffset = dest.offset(); >- >- if( elemid != "" ){ >- var element = $("#" + elemid ); >- var elem_height = element.outerHeight(); >- } else { >- elem_height = 0; >- } >- return yoffset.top - elem_height - 20; >- } >- > function redirect(dest){ > $("#redirect").attr("value",dest); > return Check(); >diff --git a/koha-tmpl/intranet-tmpl/prog/js/staff-global.js b/koha-tmpl/intranet-tmpl/prog/js/staff-global.js >index 864239293e2..226e5352eaa 100644 >--- a/koha-tmpl/intranet-tmpl/prog/js/staff-global.js >+++ b/koha-tmpl/intranet-tmpl/prog/js/staff-global.js >@@ -966,3 +966,23 @@ function toggleBtnIcon(element, start, replacement) { > }); > }); > } >+ >+/** >+ * Returns a roughly ideal position to scroll an element into view >+ * @param {string} target - The HTML id of the element to scroll into view >+ * @param {string} elemid - The HTML id of the element which might obscure >+ * the view of the target element e.g. a floating toolbar >+ * @return {number} - The y-coordinate to pass to window.scrollTo() >+ */ >+function getScrollto(target, elemid) { >+ var dest = $("#" + target); >+ var yoffset = dest.offset(); >+ >+ if (elemid != "") { >+ var element = $("#" + elemid); >+ var elem_height = element.outerHeight(); >+ } else { >+ elem_height = 0; >+ } >+ return yoffset.top - elem_height - 20; >+} >-- >2.39.5
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 7508
:
88025
|
169102
|
170575
|
174993
|
175064
|
175065
|
176632
|
176633
| 177873 |
177874