This patch makes changes to the OPAC Cart's CSS and JS so that the cart
pop-up message display more consistently. The CSS is changed to use
position "fixed" instead of "absolute." This allows the message to
display without recalculating the position every time, and keeps the
appearance we expect.
The z-index of the message is also increase to prevent it from being
hidden behind a floating toolbar.
To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).
- Perform a catalog search in the OPAC which will return multiple
results.
- In the list of search results, click the "Add to cart" link next to
several search results. Each time you should see a message appear in
the upper left corner of the screen, "The item has been added to the
cart."
- The position of the messages should be consistent no matter how far
down the page you scroll.
- Test again after adding content to the OpacHeader region. One way to
do this is to add the following to the OpacUserJS preference:
$(document).ready(function(){
$("#wrapper").prepend('<img src="https://generative-placeholders.glitch.me/image?width=900&height=200&style=triangles&gap=30">');
});
- Test at various browser widths, from a phone-sized screen width up to
wide desktop-sized.
Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This patch corrects eslint errors in the OPAC copy of basket.js:
Indentation inconsistencies, undeclared variables, unused functions,
etc.
To test, apply the patch and test the "Cart" functionality in the
OPAC:
- In the OPAC, add an item to the cart.
- A popup message should appear telling you the item has been added.
- The "Add to cart" link should update to read "In your cart."
- The count if cart items in the header should be updated.
- The "In your cart (remove)" link should work correctly.
- Test this process from both the search results and
detail pages.
- Open the cart.
- The cart should open correctly.
- In the cart, test all the controls:
- More details
- Send
- Download
- Empty and close
- Hide window
- Print
- Select all / clear all
- With checked items:
- Remove
- Add to list
- Place hold
- Tag
The following unused functions were removed: readCookieValue,
AllAreChecked, SelectAll, and quit. A search of the Koha codebase should
return no results from the opac-tmpl directory.
Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This patch adds the necessary JavaScript includes to the OPAC to
enable translation of strings in JavaScript. It also updates the
translation of cart-related strings by removing the strings from
opac-bottom.inc and putting them in basket.js where they are used.
To test, apply the patch and test that the correct strings are
translatable. In this example I'm testing fr-FR:
- Update a translation:
> cd misc/translator
> perl translate update fr-FR
- Open the corresponding .po file for the strings pulled from
JavaScript e.g. misc/translator/po/fr-FR-messages-js.po
- Locate strings pulled from bootstrap/js/basket.js for
translation, e.g.:
#: koha-tmpl/opac-tmpl/bootstrap/js/basket.js:89
msgid "Your cart is currently empty"
msgstr ""
- Edit the "msgstr" string however you want (it's just for testing)
- Install the updated translation:
> perl translate install fr-FR
In the OPAC, switch to the language you're testing. Confirm that your
translated string appears. In the above example, by clicking the "Cart"
icon in the header when there are no items in the cart.
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This patch removes the now-unused downloadBasket function from
basket.js. The patch should have no effect on the functionality of the
download process.
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This patch replaces CSS-based background image icons with Font Awesome
icons. This will eliminate the use of sprite.png altogether.
To test, apply the patch and regenerate the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).
Because JavaScript events are often triggered by class, the changes made
in this patch require testing of JavaScript-driven behavior as well as
visual confirmation of the changes.
Enable OPAC features to expose them for testing: Login, Holds, Article
requests, Tags, Cart, Search term highlighting.
- Perform a search in the OPAC
- In the header at the top of the search results, check the
'Unhighlight/Highlight' link.
- Select some search results and verify that the multi-item controls
are enabled: Add to cart/Lists; Place hold; Tag. Check that these
controls work correctly.
- Verify that the following links look correct and work correctly:
'Place hold,' 'Request article,' 'Log in to add tags,' 'Add to
cart.'
- Log in to the OPAC and return to the search results page. Check the
'Add tag' and 'Save to lists' links.
- View the lists page
- Test the 'Edit' and 'Delete' controls.
- View the contents of a list. Test the following:
- Controls at the top of the table of results ('New list,'
'Download list,' 'Send list,' 'Print list,' 'Edit list,' and
'Delete list').
- Multi-selection operations: 'Place hold,' 'Tag,' and 'Remove
from list.'
- Controls for each item on the list: 'Place hold,' 'Add tag,'
'Save to another list,' 'Remove from this list,' and 'Add to
cart.'
- View the bibliographic detail page for any search result
- In the right-hand sidebar menu, verify that these controls look
correct and work correctly: 'Place hold,' 'Print,' 'Request
article,' 'Save to your lists,' 'Add to your cart,'
'Unhighlight,' 'Send to device,' 'Save record,' and 'More
searches.'
- Test the shelf browser by clicking 'Browse shelf' under the call
number for any of the holdings.
- Test the 'Next' and 'Previous' controls.
- Check the tabs for switching between 'Normal,' 'MARC,' and 'ISBD'
views and verify that they look correct on each of those pages.
- Add some items to the Cart and open the Cart
- Test the cart controls at the top: 'More details/Brief display,'
'Send,' 'Download,' 'Empty and close,' 'Hide window,' 'Print.'
- Test the multiple-selection controls: 'Remove,' 'Add to list,'
'Place hold,' and 'Tag.'
- Log in to the OPAC as a user who has items checked out which can be
renewed. On the 'Your summary' page, on the 'Checked out' tab, test
the 'Renew selected' and 'Renew all' links.
Signed-off-by: Liz Rea <wizzyrea@gmail.com>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
The 'Items in your cart' message is obsolete with the cart dropdown
box being removed.
Therefore the assignment of this text into the
MSG_IN_YOUR_CART variable (which is done in the opac-bottom.inc), and
the use of the MSG_IN_YOUR_CART variable in the updateBasket() function
(in the OPAC's basket.js) has been removed.
Sponsored-By: Toi Ohomai Institute of Technology, New Zealand
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
Feedback from the Koha mailing list in Aug 2018 showed there was
widespread concensus for making the default behaviour of the OPAC cart
to be to open with one click, rather than clicking on the cart icon then
on the dropdown box to load the cart popup.
This commit is a combination of Owen Leonard's alternative patch
(slightly changing the markup in masthead.inc) and my
work to remove the dropdown elements from the template and basket.js
Test plan:
1. In Koha OPAC click on the cart icon (making sure to have items in the
cart and the dropdown box 'Items in your cart:..' appears.
2. Click this dropdown and the cart popup appears.
3. Confirm you can successfully remove items from and empty the
cart
4. Apply patch
5. Restart memcached, and plack
6. Click on the cart icon (making sure to have items in the cart) and
notice no 'Items in your: ..' dropdown appears
instead the cart popup loads straight away.
7. Confirm the items in your cart are displayed by the cart popup
8. Confirm you can remove items from/empty the cart, and that as you do
this the number of cart items shown by the number to the right of the
cart icon changes accordingly
Sponsored-By: Toi Ohomai Institute of Technology, New Zealand
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
This patch changes the way biblionumbers are passed to the cart script
for adding and removing single items. The title's biblionumber is now
stored in a data-attribute on the links for adding and removing. This
should be a more robust, unified way to handle these single-item
operations.
To test, apply the patch and enable the opacbookbag system preference.
Test adding and removing items from the cart from various pages using
various methods:
- By clicking an "Add to your cart" / "Remove" link in search results
- By clicking an "Add to your cart" / "Remove" link on a detail page
- By checking boxes in search results and adding via the dropdown
Each operation should work correctly.
Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
This is caused by bib_list not being deleted.
The path was not explicitly set.
This patch adds path=/ explicitly to ensure it
does get deleted.
TEST PLAN
---------
1) search for 'the' in OPAC
2) add several items to cart.
3) look at your cart.
4) empty and close the cart, select all->remove
-- either way window closes and it looks empty.
5) refresh the page
-- cart comes back.
-- in chromium inspecting the page, specifically
the "Application" area, bib_list is shown as
a cookie still.
6) apply patch
7) restart_all and empty cache forcing JS reload
8) repeat steps 1-5
-- this time cart stays empty.
-- and the bib_list cookie is gone
Signed-off-by: Roch D'Amour <roch.damour@inlibro.com> using firefox 59.0.2
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This removes a lot of useless code relating to the print function from opac-basket.tt, opac-basket.pl and opac/basket.js.
It also fixes the CSS so that no extra blank page is printed.
To test:
0) Add an item to your cart
1) Print your basket
Note the appearance of the page. There will be an extra blank page.
2) Apply patch
3) Reload basket
4) Print your basket
The appearce should be identical. The extra blank page is gone.
This only affects the OPAC.
Signed-off-by: Tomás Cohen Arazi <tomascohen@theke.io>
Signed-off-by: claude <claude.brayer@cea.fr>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This corrects the cookie path in bootstrap/js/basket.js. It used to take
the default value (current page path), but will now be "/"
Test plan:
0) Visit the OPAC, add a book to your basket
1) Navigate to the OPAC's homepage (www.domain.com, without the
/cgi-bin/koha)
-> The basket will display as empty
2) Apply patch
3) Clear your cookies and your cache
4) Redo step 1)
-> Basket will display correctly
Patch applies without issue and functions as descibed.
Signed-off-by: Dilan Johnpullé <dilan@calyx.net.au>
Signed-off-by: Josef Moravec <josef.moravec@gmail.com>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Bug 12233 removes the declaration of the showListsUpdate JS function for
the OPAC.
It results in a JS error (ReferenceError: showListsUpdate is not
defined) when a user tries to add selected titles to a list if no title
is selected.
Test plan:
Launch a catalogue search
Select a list in the "Select titles to" dropdown list
=> Without this patch you will get the JS error
=> With this patch you will get a JS alert "No item was selected"
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Signed-off-by: Marcel de Rooy <m.de.rooy@rijksmuseum.nl>
Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
If you select items in your cart and choose to add them to a list, upon
completion of the transaction the pop-up window, which was originally
opened for the cart, is closed. Instead you should be returned to the
Cart view.
Test plan:
Confirm the expected behavior.
Confirmed.
Signed-off-by: Marc Veron <veron@veron.ch>
Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@gmail.com>
The goal of this theme is to provide a fully-responsive OPAC which
offers a high level of functionality across multiple devices with varied
viewport sizes. Its style is based on the CCSR theme, with elements of
the Bootstrap framework providing default styling of buttons, menus,
modals, etc.
The Bootstrap grid is used everywhere, but Bootstrap's default
responsive breakpoints have been expanded to allow for better
flexibility for our needs.
All non-translation-depended files are in the root directory of this new
theme:
css, images, itemtypeimg, js, less, and lib. Languages.pm has been
modified to ignore the new directories when parsing the theme language
directories.
This theme introduces the use of LESS (http://lesscss.org/) to build
CSS. Three LESS files can be found in the "less" directory: mixins.less,
opac.less, and responsive.less. These three files are compiled into one
CSS file for production: opac.css. "Base" theme styles are found in
opac.less. A few "mixins" (http://lesscss.org/#-mixins) are found in
mixins.less. Any CSS which is conditional on specific media queries is
found in responsive.less.
At the template level some general sturctural changes have been made.
For the most part JavaScript is now at the end of each template as is
recommended for performance reasons. JavaScript formerly in
doc-head-close.inc is now in opac-bottom.inc.
In order to be able to maintain this structure and accommodate
page-specific scripts at the same time the use of BLOCK and PROCESS are
added. By default opac-bottom.inc will PROCESS a "jsinclude" block:
[% PROCESS jsinclude %]
Each page template in the theme must contain this block, even if it is
empty:
[% BLOCK jsinclude %][% END %]
Pages which require that page-specific JavaScript be inserted can add it
to the jsinclude block and it will appear correctly at the bottom of the
rendered page.
The same is true for page-specific CSS. Each page contains a cssinclude
block:
[% BLOCK cssinclude %][% END %]
...which is processed in doc-head-close.inc:
[% PROCESS cssinclude %]
Using these methods helps us maintain a strict separation of CSS links
and blocks (at the top of each page) and JavaScript (at the bottom). A
few exceptions are made for some JavaScript which must be processed
sooner: respond.js (https://github.com/scottjehl/Respond, conditionally
applied to Internet Explorer versions < 9 to allow for layout
responsiveness), the _() function required for JS translatability, and
Modernizr (http://modernizr.com/, a script which detects browser
features and allows us to conditionally load JavaScript based on
available features--or lack thereof).
Another new JavaScript dependency in this theme is enquire.js
(http://wicky.nillia.ms/enquire.js/), which lets us trigger JavaScript
events based on viewport size.
I have made an effort to re-indent the templates in a sane way,
eliminating trailing spaces and tabs. However, I have not wrapped lines
at a specific line length. In order to improve template legibility I
have also tried to insert comments indicating the origin of closing tags
like <div> or template directives like [% END %]:
</div> <!-- / .container-fluid -->
[% END # / IF ( OpacBrowseResults && busc ) %]
TESTING
Proper testing of this theme is no easy task: Every template has been
touched. Each page should work reasonable well at a variety of screen
dimensions. Pages should be tested under many conditions which are
controlled by toggling OPAC system preferences on and off. A variety of
devices, platforms, and browsers should be tested.
Signed-off-by: Galen Charlton <gmc@esilibrary.com>
