Bug 28179 - Use a lightbox gallery to display the images - detail page, staff interface
Summary: Use a lightbox gallery to display the images - detail page, staff interface
Status: Pushed to master
Alias: None
Product: Koha
Classification: Unclassified
Component: Cataloging (show other bugs)
Version: master
Hardware: All All
: P5 - low enhancement (vote)
Assignee: Jonathan Druart
QA Contact: Testopia
URL:
Keywords: release-notes-needed
Depends on: 28178
Blocks: 28180
  Show dependency treegraph
 
Reported: 2021-04-20 14:10 UTC by Jonathan Druart
Modified: 2021-05-12 15:01 UTC (History)
3 users (show)

See Also:
Change sponsored?: Sponsored
Patch complexity: Medium patch
Text to go in the release notes:
Version(s) released in:
21.05.00


Attachments
Bug 28179: Add the Chocolat gallery lightbox JS library (45.01 KB, patch)
2021-04-20 14:38 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface (12.98 KB, patch)
2021-04-20 14:38 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Adjust chocolat.js to display href (1.23 KB, patch)
2021-04-20 14:38 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: (follow-up) Updates to styling of lightbox controls (5.16 KB, patch)
2021-04-23 14:05 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 28179: Add the Chocolat gallery lightbox JS library (45.02 KB, patch)
2021-04-28 07:54 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface (13.02 KB, patch)
2021-04-28 07:54 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Adjust chocolat.js to display href (1.23 KB, patch)
2021-04-28 07:54 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: (follow-up) Updates to styling of lightbox controls (5.22 KB, patch)
2021-04-28 07:54 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Add the Chocolat gallery lightbox JS library (44.29 KB, patch)
2021-05-03 18:15 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface (13.03 KB, patch)
2021-05-03 18:15 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 28179: Adjust chocolat.js to display href (1.28 KB, patch)
2021-05-03 18:15 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 28179: (follow-up) Updates to styling of lightbox controls (5.28 KB, patch)
2021-05-03 18:15 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 28179: (follow-up) Remove console.log (1.48 KB, patch)
2021-05-03 18:15 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 28179: Add the Chocolat gallery lightbox JS library (45.22 KB, patch)
2021-05-04 13:34 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface (13.22 KB, patch)
2021-05-04 13:34 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Adjust chocolat.js to display href (1.44 KB, patch)
2021-05-04 13:35 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: (follow-up) Updates to styling of lightbox controls (5.43 KB, patch)
2021-05-04 13:35 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: (follow-up) Remove console.log (1.64 KB, patch)
2021-05-04 13:35 UTC, Jonathan Druart
Details | Diff | Splinter Review
Bug 28179: Add the Chocolat gallery lightbox JS library (44.56 KB, patch)
2021-05-09 11:23 UTC, Katrin Fischer
Details | Diff | Splinter Review
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface (13.29 KB, patch)
2021-05-09 11:23 UTC, Katrin Fischer
Details | Diff | Splinter Review
Bug 28179: Adjust chocolat.js to display href (1.49 KB, patch)
2021-05-09 11:23 UTC, Katrin Fischer
Details | Diff | Splinter Review
Bug 28179: (follow-up) Updates to styling of lightbox controls (5.49 KB, patch)
2021-05-09 11:23 UTC, Katrin Fischer
Details | Diff | Splinter Review
Bug 28179: (follow-up) Remove console.log (1.69 KB, patch)
2021-05-09 11:24 UTC, Katrin Fischer
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Jonathan Druart 2021-04-20 14:10:04 UTC

    
Comment 1 Jonathan Druart 2021-04-20 14:38:34 UTC
Created attachment 119914 [details] [review]
Bug 28179: Add the Chocolat gallery lightbox JS library

Chocolat is a lightbox JS library.
https://chocolat.insipi.de
https://github.com/nicolas-t/Chocolat
https://chocolat.gitbook.io

Why Chocolat? It's released under the GPL v3 license, easy to use,
configure and extend, and is still maintained/active.

(and it has a nice name)

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 2 Jonathan Druart 2021-04-20 14:38:38 UTC
Created attachment 119915 [details] [review]
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface

This patch adds the ability to display the cover images of a
bibliographic record in a gallery. Cover images attached to items can
also be displayed in separated galleries.

Test plan:
All the cover images are affected, all the different sources will be
tested.
All the steps will be done on the same bibliographic record.
1. Local cover images
 a. Turn on LocalCoverImages and AllowMultipleCovers
 b. Add several local cover images to a bibliographic record
 c. Add several local cover images to an item
 d. Click on an image and confirm that it is displayed in a gallery and
 you can navigate see all the images attached to the bibliographic
 record
 e. Same for items
2. Adlibris
 a. Turn on AdlibrisCoversEnabled
 b. Edit the biliographic record and add an ISBN that will return a
 cover image for this service (9780670026623 for instance)
 c. Display the cover images in the gallery
 d. Note the link to the adlibris.com website at the bottom
3. Amazon
 a. Turn on AmazonCoverImages
 b. Display the cover images in the gallery
4. Coce
 a. Turn on IntranetCoce, set CoceHost to "http://coce.tamil.fr:8080"
 and select some values for CoceProviders.
 b. Display the cover images in the gallery
5. Custom cover images
 a. Turn on CustomCoverImages and set CustomCoverImagesURL to https://covers.openlibrary.org/b/isbn/{isbn}-M.jpg
 of anything else meaningful
 b. Display the cover images in the gallery

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 3 Jonathan Druart 2021-04-20 14:38:42 UTC
Created attachment 119916 [details] [review]
Bug 28179: Adjust chocolat.js to display href

In order to display link in the description we need to adjust
chocolat.js

Maybe this needs to be reported upstream

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 4 Owen Leonard 2021-04-20 19:52:11 UTC
This works really well overall, but there is a problem when there is a language toolbar in the footer. The toolbar completely obscures the footer for the gallery.

I have some CSS update suggestions but I'm not sure what is the best way to modify the CSS... Change the original, since we're already using a modified version of the JS? Add a second CSS file to override? Use a copy of the original which we track separately?
Comment 5 David Cook 2021-04-22 07:00:51 UTC
The purpose of this change isn't clearly defined, but I think that I get the premise and it sounds interesting!

I assume that this is a solution to the multiple cover problem? It would put the multiple book covers into a gallery that either manually or automatically scrolls on a per-row/biblio basis?
Comment 6 Jonathan Druart 2021-04-22 09:34:25 UTC
(In reply to Owen Leonard from comment #4)
> This works really well overall, but there is a problem when there is a
> language toolbar in the footer. The toolbar completely obscures the footer
> for the gallery.
> 
> I have some CSS update suggestions but I'm not sure what is the best way to
> modify the CSS... Change the original, since we're already using a modified
> version of the JS? Add a second CSS file to override? Use a copy of the
> original which we track separately?

Good catch, thanks!
I would add it to the same file, at the bottom, with a comment saying it's some specific for us.
What CSS suggestions do you have?

(In reply to David Cook from comment #5)
> The purpose of this change isn't clearly defined, but I think that I get the
> premise and it sounds interesting!
> 
> I assume that this is a solution to the multiple cover problem? It would put
> the multiple book covers into a gallery that either manually or
> automatically scrolls on a per-row/biblio basis?

Here the need is simply to display all the different cover images of a bibliographic record (or items) in a gallery.
Comment 7 David Cook 2021-04-22 23:37:45 UTC
(In reply to Jonathan Druart from comment #6)
> Here the need is simply to display all the different cover images of a
> bibliographic record (or items) in a gallery.

Ah I see just on the detail page and not the search results.
Comment 8 Owen Leonard 2021-04-23 14:05:57 UTC
Created attachment 120108 [details] [review]
Bug 28179: (follow-up) Updates to styling of lightbox controls

This patch fixes a bug and adds some style changes which I think are
nice. The bugfix is to change the z-index of the lightbox footer so that
it isn't hidden when there is a language menu in the footer.

The cosmetic changes replace the Chocolat image icons with new SVG
assets based on Bootstrap Icons (https://icons.getbootstrap.com/). The
color changes I think help the controls to be more visible.

License information about Bootstrap Icons has been added to the About
page.
Comment 9 Jonathan Druart 2021-04-28 07:53:29 UTC
This patch is working great, thanks Owen!
Comment 10 Jonathan Druart 2021-04-28 07:54:41 UTC
Created attachment 120253 [details] [review]
Bug 28179: Add the Chocolat gallery lightbox JS library

Chocolat is a lightbox JS library.
https://chocolat.insipi.de
https://github.com/nicolas-t/Chocolat
https://chocolat.gitbook.io

Why Chocolat? It's released under the GPL v3 license, easy to use,
configure and extend, and is still maintained/active.

(and it has a nice name)

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 11 Jonathan Druart 2021-04-28 07:54:47 UTC
Created attachment 120254 [details] [review]
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface

This patch adds the ability to display the cover images of a
bibliographic record in a gallery. Cover images attached to items can
also be displayed in separated galleries.

Test plan:
All the cover images are affected, all the different sources will be
tested.
All the steps will be done on the same bibliographic record.
1. Local cover images
 a. Turn on LocalCoverImages and AllowMultipleCovers
 b. Add several local cover images to a bibliographic record
 c. Add several local cover images to an item
 d. Click on an image and confirm that it is displayed in a gallery and
 you can navigate see all the images attached to the bibliographic
 record
 e. Same for items
2. Adlibris
 a. Turn on AdlibrisCoversEnabled
 b. Edit the biliographic record and add an ISBN that will return a
 cover image for this service (9780670026623 for instance)
 c. Display the cover images in the gallery
 d. Note the link to the adlibris.com website at the bottom
3. Amazon
 a. Turn on AmazonCoverImages
 b. Display the cover images in the gallery
4. Coce
 a. Turn on IntranetCoce, set CoceHost to "http://coce.tamil.fr:8080"
 and select some values for CoceProviders.
 b. Display the cover images in the gallery
5. Custom cover images
 a. Turn on CustomCoverImages and set CustomCoverImagesURL to https://covers.openlibrary.org/b/isbn/{isbn}-M.jpg
 of anything else meaningful
 b. Display the cover images in the gallery

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 12 Jonathan Druart 2021-04-28 07:54:51 UTC
Created attachment 120255 [details] [review]
Bug 28179: Adjust chocolat.js to display href

In order to display link in the description we need to adjust
chocolat.js

Maybe this needs to be reported upstream

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 13 Jonathan Druart 2021-04-28 07:54:56 UTC
Created attachment 120256 [details] [review]
Bug 28179: (follow-up) Updates to styling of lightbox controls

This patch fixes a bug and adds some style changes which I think are
nice. The bugfix is to change the z-index of the lightbox footer so that
it isn't hidden when there is a language menu in the footer.

The cosmetic changes replace the Chocolat image icons with new SVG
assets based on Bootstrap Icons (https://icons.getbootstrap.com/). The
color changes I think help the controls to be more visible.

License information about Bootstrap Icons has been added to the About
page.

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Comment 14 Owen Leonard 2021-05-03 18:15:42 UTC
Created attachment 120409 [details] [review]
Bug 28179: Add the Chocolat gallery lightbox JS library

Chocolat is a lightbox JS library.
https://chocolat.insipi.de
https://github.com/nicolas-t/Chocolat
https://chocolat.gitbook.io

Why Chocolat? It's released under the GPL v3 license, easy to use,
configure and extend, and is still maintained/active.

(and it has a nice name)

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 15 Owen Leonard 2021-05-03 18:15:46 UTC
Created attachment 120410 [details] [review]
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface

This patch adds the ability to display the cover images of a
bibliographic record in a gallery. Cover images attached to items can
also be displayed in separated galleries.

Test plan:
All the cover images are affected, all the different sources will be
tested.
All the steps will be done on the same bibliographic record.
1. Local cover images
 a. Turn on LocalCoverImages and AllowMultipleCovers
 b. Add several local cover images to a bibliographic record
 c. Add several local cover images to an item
 d. Click on an image and confirm that it is displayed in a gallery and
 you can navigate see all the images attached to the bibliographic
 record
 e. Same for items
2. Adlibris
 a. Turn on AdlibrisCoversEnabled
 b. Edit the biliographic record and add an ISBN that will return a
 cover image for this service (9780670026623 for instance)
 c. Display the cover images in the gallery
 d. Note the link to the adlibris.com website at the bottom
3. Amazon
 a. Turn on AmazonCoverImages
 b. Display the cover images in the gallery
4. Coce
 a. Turn on IntranetCoce, set CoceHost to "http://coce.tamil.fr:8080"
 and select some values for CoceProviders.
 b. Display the cover images in the gallery
5. Custom cover images
 a. Turn on CustomCoverImages and set CustomCoverImagesURL to https://covers.openlibrary.org/b/isbn/{isbn}-M.jpg
 of anything else meaningful
 b. Display the cover images in the gallery

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)
Comment 16 Owen Leonard 2021-05-03 18:15:49 UTC
Created attachment 120411 [details] [review]
Bug 28179: Adjust chocolat.js to display href

In order to display link in the description we need to adjust
chocolat.js

Maybe this needs to be reported upstream

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)

Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 17 Owen Leonard 2021-05-03 18:15:53 UTC
Created attachment 120412 [details] [review]
Bug 28179: (follow-up) Updates to styling of lightbox controls

This patch fixes a bug and adds some style changes which I think are
nice. The bugfix is to change the z-index of the lightbox footer so that
it isn't hidden when there is a language menu in the footer.

The cosmetic changes replace the Chocolat image icons with new SVG
assets based on Bootstrap Icons (https://icons.getbootstrap.com/). The
color changes I think help the controls to be more visible.

License information about Bootstrap Icons has been added to the About
page.

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>

Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 18 Owen Leonard 2021-05-03 18:15:57 UTC
Created attachment 120413 [details] [review]
Bug 28179: (follow-up) Remove console.log

This patch removes a "console.log" from detail.tt and replaces it with
similar output to the user. It will probably never be triggered, but
better to handle it gracefully than have a hidden log.

Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Comment 19 Jonathan Druart 2021-05-04 13:34:51 UTC
Created attachment 120459 [details] [review]
Bug 28179: Add the Chocolat gallery lightbox JS library

Chocolat is a lightbox JS library.
https://chocolat.insipi.de
https://github.com/nicolas-t/Chocolat
https://chocolat.gitbook.io

Why Chocolat? It's released under the GPL v3 license, easy to use,
configure and extend, and is still maintained/active.

(and it has a nice name)

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>
Comment 20 Jonathan Druart 2021-05-04 13:34:56 UTC
Created attachment 120460 [details] [review]
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface

This patch adds the ability to display the cover images of a
bibliographic record in a gallery. Cover images attached to items can
also be displayed in separated galleries.

Test plan:
All the cover images are affected, all the different sources will be
tested.
All the steps will be done on the same bibliographic record.
1. Local cover images
 a. Turn on LocalCoverImages and AllowMultipleCovers
 b. Add several local cover images to a bibliographic record
 c. Add several local cover images to an item
 d. Click on an image and confirm that it is displayed in a gallery and
 you can navigate see all the images attached to the bibliographic
 record
 e. Same for items
2. Adlibris
 a. Turn on AdlibrisCoversEnabled
 b. Edit the biliographic record and add an ISBN that will return a
 cover image for this service (9780670026623 for instance)
 c. Display the cover images in the gallery
 d. Note the link to the adlibris.com website at the bottom
3. Amazon
 a. Turn on AmazonCoverImages
 b. Display the cover images in the gallery
4. Coce
 a. Turn on IntranetCoce, set CoceHost to "http://coce.tamil.fr:8080"
 and select some values for CoceProviders.
 b. Display the cover images in the gallery
5. Custom cover images
 a. Turn on CustomCoverImages and set CustomCoverImagesURL to https://covers.openlibrary.org/b/isbn/{isbn}-M.jpg
 of anything else meaningful
 b. Display the cover images in the gallery

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>
Comment 21 Jonathan Druart 2021-05-04 13:35:00 UTC
Created attachment 120461 [details] [review]
Bug 28179: Adjust chocolat.js to display href

In order to display link in the description we need to adjust
chocolat.js

Maybe this needs to be reported upstream

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>
Comment 22 Jonathan Druart 2021-05-04 13:35:06 UTC
Created attachment 120462 [details] [review]
Bug 28179: (follow-up) Updates to styling of lightbox controls

This patch fixes a bug and adds some style changes which I think are
nice. The bugfix is to change the z-index of the lightbox footer so that
it isn't hidden when there is a language menu in the footer.

The cosmetic changes replace the Chocolat image icons with new SVG
assets based on Bootstrap Icons (https://icons.getbootstrap.com/). The
color changes I think help the controls to be more visible.

License information about Bootstrap Icons has been added to the About
page.

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>
Comment 23 Jonathan Druart 2021-05-04 13:35:10 UTC
Created attachment 120463 [details] [review]
Bug 28179: (follow-up) Remove console.log

This patch removes a "console.log" from detail.tt and replaces it with
similar output to the user. It will probably never be triggered, but
better to handle it gracefully than have a hidden log.

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>
Comment 24 Jonathan Druart 2021-05-04 13:35:50 UTC
Signed-off-by patches attached on behalf of the sponsor.
Comment 25 Katrin Fischer 2021-05-09 11:23:40 UTC
Created attachment 120731 [details] [review]
Bug 28179: Add the Chocolat gallery lightbox JS library

Chocolat is a lightbox JS library.
https://chocolat.insipi.de
https://github.com/nicolas-t/Chocolat
https://chocolat.gitbook.io

Why Chocolat? It's released under the GPL v3 license, easy to use,
configure and extend, and is still maintained/active.

(and it has a nice name)

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 26 Katrin Fischer 2021-05-09 11:23:44 UTC
Created attachment 120732 [details] [review]
Bug 28179: Add a lightbox gallery to display cover images - detail page, staff interface

This patch adds the ability to display the cover images of a
bibliographic record in a gallery. Cover images attached to items can
also be displayed in separated galleries.

Test plan:
All the cover images are affected, all the different sources will be
tested.
All the steps will be done on the same bibliographic record.
1. Local cover images
 a. Turn on LocalCoverImages and AllowMultipleCovers
 b. Add several local cover images to a bibliographic record
 c. Add several local cover images to an item
 d. Click on an image and confirm that it is displayed in a gallery and
 you can navigate see all the images attached to the bibliographic
 record
 e. Same for items
2. Adlibris
 a. Turn on AdlibrisCoversEnabled
 b. Edit the biliographic record and add an ISBN that will return a
 cover image for this service (9780670026623 for instance)
 c. Display the cover images in the gallery
 d. Note the link to the adlibris.com website at the bottom
3. Amazon
 a. Turn on AmazonCoverImages
 b. Display the cover images in the gallery
4. Coce
 a. Turn on IntranetCoce, set CoceHost to "http://coce.tamil.fr:8080"
 and select some values for CoceProviders.
 b. Display the cover images in the gallery
5. Custom cover images
 a. Turn on CustomCoverImages and set CustomCoverImagesURL to https://covers.openlibrary.org/b/isbn/{isbn}-M.jpg
 of anything else meaningful
 b. Display the cover images in the gallery

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 27 Katrin Fischer 2021-05-09 11:23:49 UTC
Created attachment 120733 [details] [review]
Bug 28179: Adjust chocolat.js to display href

In order to display link in the description we need to adjust
chocolat.js

Maybe this needs to be reported upstream

Sponsored-by: Gerhard Sondermann Dialog e.K. (presseplus.de, presseshop.at, presseshop.ch)

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 28 Katrin Fischer 2021-05-09 11:23:54 UTC
Created attachment 120734 [details] [review]
Bug 28179: (follow-up) Updates to styling of lightbox controls

This patch fixes a bug and adds some style changes which I think are
nice. The bugfix is to change the z-index of the lightbox footer so that
it isn't hidden when there is a language menu in the footer.

The cosmetic changes replace the Chocolat image icons with new SVG
assets based on Bootstrap Icons (https://icons.getbootstrap.com/). The
color changes I think help the controls to be more visible.

License information about Bootstrap Icons has been added to the About
page.

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 29 Katrin Fischer 2021-05-09 11:24:02 UTC
Created attachment 120735 [details] [review]
Bug 28179: (follow-up) Remove console.log

This patch removes a "console.log" from detail.tt and replaces it with
similar output to the user. It will probably never be triggered, but
better to handle it gracefully than have a hidden log.

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Rasmus Leißner <rasmus.leissner@solutions-factory.de>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 30 Katrin Fischer 2021-05-09 11:24:12 UTC
Overall this works pretty great, but I am seeing something confusing in my testing:

I've uploaded 2 local bib level covers.
I've activated AdLibris covers.

Looking at the detail page, I have 3 dots below the first cover and can swith back and forth, so far so good.

When I click on the "second" dot, that is the second local cover and the one before the Adlibris one there is a "loading" icon that is not going away.

I've tried changing the sequence of covers and services, it appears to remain showing on the "last" local cover one. And it's only on record level, not on the item level covers.

... And it remains without the patch set, so I am inclined to move this forward, but maybe worth looking at?
Comment 31 Jonathan Druart 2021-05-10 07:07:59 UTC
I have noticed that as well. Actually it's not a matter of position, but it depends on the size of the image. If the image is small you will see the loading image in the background.
It's worth to open a new bug report.

Thanks for the QA stamp!
Comment 32 Jonathan Druart 2021-05-10 14:18:50 UTC
Pushed to master for 21.05, thanks to everybody involved!
Comment 33 Jonathan Druart 2021-05-10 14:19:18 UTC
After discussion with Katrin and Owen I have decided to push this one for 21.05.

It will help us to get feedbacks for the OPAC implementation (bug 28180) and eventually improve it for 21.11.
Comment 34 Katrin Fischer 2021-05-10 21:48:03 UTC
(In reply to Jonathan Druart from comment #31)
> I have noticed that as well. Actually it's not a matter of position, but it
> depends on the size of the image. If the image is small you will see the
> loading image in the background.
> It's worth to open a new bug report.

Done: bug 28314
Comment 35 Fridolin Somers 2021-05-12 15:01:25 UTC
Enhancement not pushed to 20.11.x