From a68f6e0ace2e92138021ad8f3c75b092095df542 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Wed, 25 Sep 2019 17:10:46 +0000 Subject: [PATCH] Bug 23566: Continue on device - with QR codes This patch adds the option to show a QR code on the OPAC bibliographic detail page. The URL of the page is encoded in the image so that scanning it will take the user to that page on their device. The feature is controlled by a new system preference, OPACDetailQRCode, which is disabled by default. The QR Code is generated by a JavaScript library, "kjua" (https://github.com/lrsjng/kjua), which has been added to the "About" page in the staff client. To test, apply the patch and run the database update. Rebuild the OPAC CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). - In the staff client, go to Administration -> System preferences. - Locate the OPACDetailQRCode system preferences under OPAC -> Features. It should be disabled. - Enable the preference and switch to the OPAC. - Locate a title in the catalog and view the detail page. - In the sidebar menu there should be a "Send to device" link. - Clicking the link should display a QR Code. - Scan the code using a QR Code-capable device. - The URL should be correct. - Disable the system preference and confirm that the "Send to device" link no longer appears on the OPAC detail page. --- installer/data/mysql/atomicupdate/bug_23566.perl | 11 +++ koha-tmpl/intranet-tmpl/prog/en/modules/about.tt | 3 + .../prog/en/modules/admin/preferences/opac.pref | 6 ++ koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss | 14 ++++ .../bootstrap/en/includes/opac-detail-sidebar.inc | 8 ++ .../opac-tmpl/bootstrap/en/modules/opac-detail.tt | 27 ++++++ koha-tmpl/opac-tmpl/bootstrap/images/sprite.png | Bin 2561 -> 8286 bytes koha-tmpl/opac-tmpl/lib/kjua/kjua.js | 18 ++++ koha-tmpl/opac-tmpl/lib/kjua/kjua.min.js | 2 + koha-tmpl/opac-tmpl/lib/kjua/lib/defaults.js | 50 +++++++++++ koha-tmpl/opac-tmpl/lib/kjua/lib/dom.js | 32 ++++++++ koha-tmpl/opac-tmpl/lib/kjua/lib/draw.js | 48 +++++++++++ koha-tmpl/opac-tmpl/lib/kjua/lib/draw_mode.js | 47 +++++++++++ koha-tmpl/opac-tmpl/lib/kjua/lib/draw_rounded.js | 91 +++++++++++++++++++++ koha-tmpl/opac-tmpl/lib/kjua/lib/qrcode.js | 42 ++++++++++ 15 files changed, 399 insertions(+) create mode 100644 installer/data/mysql/atomicupdate/bug_23566.perl create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/kjua.js create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/kjua.min.js create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/lib/defaults.js create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/lib/dom.js create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/lib/draw.js create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/lib/draw_mode.js create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/lib/draw_rounded.js create mode 100644 koha-tmpl/opac-tmpl/lib/kjua/lib/qrcode.js diff --git a/installer/data/mysql/atomicupdate/bug_23566.perl b/installer/data/mysql/atomicupdate/bug_23566.perl new file mode 100644 index 00000000000..5f01c70d823 --- /dev/null +++ b/installer/data/mysql/atomicupdate/bug_23566.perl @@ -0,0 +1,11 @@ +$DBversion = 'XXX'; # will be replaced by the RM + +if( CheckVersion( $DBversion ) ) { + $dbh->do(q| + INSERT IGNORE INTO systempreferences ( `variable`, `value`, `options`, `explanation`, `type` ) VALUES + ('OPACDetailQRCode','0','','Enable the display of a QR Code on the OPAC detail page','YesNo'); + |); + + SetVersion( $DBversion ); + print "Upgrade to $DBversion done (Bug 23566 - Add OPACDetailQRCode system preference)\n"; +} diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt index 5b8c1c431e1..38c90b90b9c 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/about.tt @@ -701,6 +701,9 @@

HC Sticky

HC Sticky by Some Web Media is a JavaScript library that makes any element on your page visible while you scroll, licensed under the MIT license.

+ +

kjua

+

kjua by Lars Jung is a JavaScript library that generates QR codes, licensed under the MIT license.

diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref index a078939dfc3..e9f31f5d388 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref @@ -403,6 +403,12 @@ OPAC: no: "Don't show" - patron images on the patron information page in the OPAC. - + - pref: OPACDetailQRCode + choices: + yes: Enable + no: "Don't enable" + - the option to show a QR Code on the OPAC bibliographic detail page. + - - pref: OPACFinesTab choices: yes: Allow diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss index f2fea4ab62b..3ada4df06ff 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss @@ -259,6 +259,12 @@ a { &.removefromlist { @extend %initial_icon; } + + &.show_qrcode { + @extend %initial_icon; + background-position: 0 -1164px; /* QR Code */ + padding-left: 35px; + } } h1 { @@ -3210,5 +3216,13 @@ $star-selected: #EDB867; /* END jQuery Bar Rating plugin for star ratings */ +#qrcode { + margin-left: 35px; + + img, + canvas { + margin-top: 1em; + } +} @import "responsive"; diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-detail-sidebar.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-detail-sidebar.inc index 9384e9416cd..9bb2f2c8192 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-detail-sidebar.inc +++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-detail-sidebar.inc @@ -40,6 +40,14 @@ [% END %] + + [% IF ( Koha.Preference('OPACDetailQRCode' ) ) %] +
  • + Send to device + +
    • + [% END %] + [% SET export_options = Koha.Preference('OpacExportOptions').split(',') %] [% IF export_options.size %]
  • diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt index 8afe1b76a51..cd4c5da7760 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt @@ -1392,6 +1392,9 @@ [% IF ( OpacStarRatings != 'disable' ) %][% Asset.js("lib/jquery/plugins/jquery.barrating.min.js") | $raw %][% END %] [% IF ( OpacHighlightedWords ) %][% Asset.js("lib/jquery/plugins/jquery.highlight-3.js") | $raw %][% END %] +[% IF ( Koha.Preference('OPACDetailQRCode') ) %] + [% Asset.js("lib/kjua/kjua.min.js") | $raw %] +[% END %]