Koha/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-auth.tt
Owen Leonard 9cb89b4639 Bug 20168: Update of the OPAC bootstrap template to bootstrap v4
This patch updates the version of Bootstrap in the OPAC from 2.3.1 to
4.5.0. The Bootstrap JavaScript files have been replaced with custom
builds of the 4.5.0 JavaScript source files. The Bootstrap CSS is now
built into the OPAC CSS by loading the required Bootstrap 4.5.0 SCSS
files in node_modules.

OPAC SCSS now starts with Bootstrap customizations:

/* Bootstrap variable customizations */
$headings-color: #727272;
...

Followed by loading the necessary Bootstrap SCSS files:

/* Bootstrap imports */
@import "../../../../../node_modules/bootstrap/scss/functions";
@import "../../../../../node_modules/bootstrap/scss/variables";
...

Followed by our CSS. The build process for generating compiled CSS now
creates a file which bundles Bootstrap CSS and ours. Removed from the
Koha source: Bootstrap CSS files, Bootstrap "glyphicons" images.

The upgrade to Bootstrap 4 involved a lot of markup changes to conform
with new Bootstrap classes, especially in classes related to the grid.
Besides duplicating the grid we used before, this upgrade adds some new
features made possible by Bootstrap 4.5's use of flexbox as a layout
tool. This includes custom ordering of columns based on class names:
https://getbootstrap.com/docs/4.5/layout/grid/#order-classes.

Other areas where the most changes have been made: Navigation menus,
breadcrumb menus, buttons, dropdowns.

Bootstrap's JavaScript file is now "bootstrap.bundle.min.js" to reflect
the fact that a required JavaScript asset is now distributed separately
in Bootstrap 4. The "bundle" version includes Popper.js.

Unrelated changes: Indentation corrections, removal of invalid
"//<![CDATA[" markers, removal of invalid script type attributes.

To test, apply the patch and run 'yarn install' to install Bootstrap as
an npm module. Run 'yarn build --view opac' to regenerate the OPAC CSS.

Test as many aspect of the OPAC as possible, viewing pages at various
browser widths to confirm that everything adjusts well. Test with
various OPAC interface system preferences enabled and disabled.

Test self checkout and self checkin.

Known issues: RTL support has not been updated.

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
2020-09-09 14:13:03 +02:00

235 lines
14 KiB
Text

[% USE raw %]
[% USE Koha %]
[% USE Categories %]
[% USE KohaNews %]
[% PROCESS 'html_helpers.inc' %]
[% SET OpacLoginInstructions = KohaNews.get( location => "OpacLoginInstructions", lang => lang, library => branchcode ) %]
[% INCLUDE 'doc-head-open.inc' %]
<title>[% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog &rsaquo;
[% IF Koha.Preference( 'opacuserlogin' ) == 1 %]
Log in to your account
[% ELSE %]
Catalog login disabled
[% END %]</title>
[% INCLUDE 'doc-head-close.inc' %]
[% BLOCK cssinclude %][% END %]
</head>
[% INCLUDE 'bodytag.inc' bodyid='opac-login-page' bodyclass='scrollto' %]
[% INCLUDE 'masthead.inc' %]
<div class="main">
<nav aria-label="breadcrumb">
<ul class="breadcrumb">
<li class="breadcrumb-item">
<a href="/cgi-bin/koha/opac-main.pl">Home</a>
</li>
<li class="breadcrumb-item active" aria-current="page">
<a href="#">Log in</a>
</li>
</ul>
</nav>
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-md-10 col-lg-6">
<div id="opac-auth" class="maincontent">
<!--CONTENT-->
[% IF Koha.Preference( 'opacuserlogin' ) == 1 %]
[% IF ( nopermission ) %]
<!-- This is what is displayed if user doesn't have permission -->
<div class="alert alert-warning">
<h2>Access denied</h2>
<p>Sorry, the system doesn't think you have permission to access this page. </p>
[% IF SCO_login %]
<p><a href="/cgi-bin/koha/sco/sco-main.pl?logout.x=1">Log out and try again with a different user.</a></p>
[% ELSIF SCI_login %]
<p><a href="/cgi-bin/koha/sci/sci-main.pl?logout.x=1">Log out and try again with a different user.</a></p>
[% END %]
</div>
[% END %]
[% IF ( loginprompt ) %]
<!-- login prompt time-->
<h2>Log in to your account</h2>
[% IF ( timed_out ) %]
<!-- This is what is displayed if login has timed out -->
<div class="alert alert-info">
<p>Sorry, your session has timed out. Please log in again.</p>
</div>
[% END %]
[% IF ( different_ip ) %]
<!-- This is what is displayed if user doesn't have permission -->
<div class="alert alert-info">
<p>You are logging from a different IP address. Please log in again.</p>
</div>
[% END %]
[% IF invalid_username_or_password || too_many_login_attempts %]
<!-- This is what is displayed if user doesn't have permission or account is locked. (Do not expose more information than needed.) -->
<div class="alert alert-info">
<p>You entered an incorrect username or password. Please try again! But note that passwords are case sensitive[% IF Koha.Preference('FailedLoginAttempts') %] and that your account will be locked out after a fixed number of failed login attempts[% END %]. Please contact a library staff member if you continue to have problems.</p>
</div>
[% END %]
[% IF ( shibbolethAuthentication ) %]
[% IF ( invalidShibLogin ) %]
<!-- This is what is displayed if shibboleth login has failed to match a koha user -->
<div class="alert alert-info">
<p>Sorry, your Shibboleth identity does not match a valid library identity.</p>
[% IF ( casAuthentication ) %]
[% IF ( invalidCasLogin ) %]
<!-- This is what is displayed if cas login has failed -->
<p>Sorry, the CAS login also failed. If you have a local login you may use that below.</p>
[% ELSE %]
<p>If you have a CAS account, you may use that below.</p>
[% END %]
[% ELSE %]
<p>If you have a local account, you may use that below.</p>
[% END %]
</div>
[% ELSE %]
<h3>Shibboleth Login</h3>
<p><a href="[% shibbolethLoginUrl | $raw %]">If you have a Shibboleth account, please click here to log in.</a></p>
[% END # /IF invalidShibLogin %]
[% IF ( casAuthentication ) %]
<h3>CAS login</h3>
<p>If you do not have a Shibboleth account, but you do have a CAS account, you can use CAS.</p>
[% ELSE %]
<h3>Local login</h3>
<p>If you do not have a Shibboleth account, but you do have a local login, then you may login below.</p>
[% END %]
[% END # /IF shibbolethAuthentication %]
[% IF ( casAuthentication ) %]
[% IF ( shibbolethAuthentication ) %]
[% IF ( casServerUrl ) %]
<p><a href="[% casServerUrl | $raw %]">Please click here to log in.</a><p>
[% END %]
[% IF ( casServersLoop ) %]
<p>Please choose against which one you would like to authenticate: </p>
<ul>
[% FOREACH casServer IN casServersLoop %]
<li><a href="[% casServer.value | $raw %]">[% casServer.name | html %]</a></li>
[% END %]
</ul>
[% END %]
[% ELSE %]
<h3>CAS login</h3>
[% IF ( invalidCasLogin ) %]
<!-- This is what is displayed if cas login has failed -->
<p>Sorry, the CAS login failed.</p>
[% END %]
[% IF ( casServerUrl ) %]
<p><a href="[% casServerUrl | $raw %]">If you have a CAS account, please click here to log in.</a><p>
[% END %]
[% IF ( casServersLoop ) %]
<p>If you have a CAS account, please choose against which one you would like to authenticate:</p>
<ul>
[% FOREACH casServer IN casServersLoop %]
<li><a href="[% casServer.value | $raw %]">[% casServer.name | html %]</a></li>
[% END %]
</ul>
[% END %]
[% END # /IF shibbolethAuthentication %]
[% IF ( shibbolethAuthentication ) %]
<p>Nothing</p>
[% ELSE %]
<h3>Local login</h3>
<p>If you do not have a CAS account, but do have a local account, you can still log in: </p>
[% END %]
[% END # / IF casAuthentication %]
[% IF ( Koha.Preference('GoogleOpenIDConnect') == 1 ) %]
[% IF ( invalidGoogleOpenIDConnectLogin ) %]
<h3>Google login</h3>
<p>Sorry, your Google login failed. <span class="error">[% invalidGoogleOpenIDConnectLogin | html %]</span></p>
<p>Please note that the Google login will only work if you are using the e-mail address registered with this library.</p>
<p>If you want to, you can try to <a href="/cgi-bin/koha/svc/auth/googleopenidconnect?reauthenticate=select_account">log in using a different account</a>
[% END %]
<a href="/cgi-bin/koha/svc/auth/googleopenidconnect" class="btn btn-primary" id="openid_connect">Log in with Google</a>
<p>If you do not have a Google account, but do have a local account, you can still log in: </p>
[% END # /IF GoogleOpenIDConnect %]
[% IF SCO_login %]
<form action="/cgi-bin/koha/sco/sco-main.pl" name="auth" id="auth" method="post" autocomplete="off">
[% ELSIF SCI_login %]
<form action="/cgi-bin/koha/sci/sci-main.pl" name="auth" id="auth" method="post" autocomplete="off">
[% ELSE %]
<form action="[% script_name | html %]" name="auth" id="auth" method="post" autocomplete="off">
[% END %]
<input type="hidden" name="koha_login_context" value="opac" />
<fieldset class="brief">
[% FOREACH INPUT IN INPUTS %]
[% NEXT IF INPUT.name == 'logout.x' %]
<input type="hidden" name="[% INPUT.name | html %]" value="[% INPUT.value | html %]" />
[% END %]
<div class="form-group">
<label for="userid">Login</label>
<input class="form-control" type="text" size="25" id="userid" name="userid" />
</div>
<div class="form-group">
<label for="password">Password</label>
<input class="form-control" type="password" size="25" id="password" name="password" />
</div>
<fieldset class="action">
<input type="submit" value="Log in" class="btn btn-primary" />
</fieldset>
</fieldset>
[% IF Koha.Preference('OpacPasswordChange') && Categories.can_any_reset_password %]
<div id="forgotpassword">
<a href="/cgi-bin/koha/opac-password-recovery.pl">Forgot your password?</a>
</div>
[% END %]
<div id="nologininstructions">
[% IF Koha.Preference('OpacLoginInstructions') %]
[% Koha.Preference('OpacLoginInstructions') | $raw %]
[% ELSE %]
<h3>Don't have a password yet?</h3>
<p>If you don't have a password yet, stop by the circulation desk the next time you're in the library. We'll happily set one up for you.</p>
<h3>Don't have a library card?</h3>
<p>If you don't have a library card, stop by your local library to sign up.</p>
[% END # / IF Koha.Preference('OpacLoginInstructions') %]
[% IF PatronSelfRegistration && PatronSelfRegistrationDefaultCategory %]
<span id="registrationinstructions">
<a href="/cgi-bin/koha/opac-memberentry.pl">You may register here.</a>
</span>
[% END %]
</div>
</form>
[% END # / IF loginprompt %]
[% ELSE %]
<h2>Logging on to the catalog has not been enabled by the library.</h2>
<ul>
<li>To report this error, you can email the Koha Administrator.<a href="mailto:[% admin | uri %]">Email</a></li>
<li>Use top menu bar to navigate to another part of Koha.</li>
</ul>
[% END # / IF opacuserlogin %]
</div> <!-- /.opac-auth -->
</div> <!-- /.col-md-10 col-lg-6 -->
</div> <!-- /.row -->
</div> <!-- /.container-fluid -->
</div> <!-- /.main -->
[% INCLUDE 'opac-bottom.inc' %]
[% BLOCK jsinclude %]
<script>
// Hide circular 'Log in to Your Account' link in opac-auth.pl
$(document).ready(function() {
if ( $("#auth" ) ) { $("#members ul li a").hide(); }
});
</script>
[% END %]