Bug 20658: Move template JavaScript to the footer: Installer and onboarding
authorOwen Leonard <oleonard@myacpl.org>
Wed, 25 Apr 2018 16:28:18 +0000 (16:28 +0000)
committerNick Clemens <nick@bywatersolutions.com>
Fri, 15 Mar 2019 19:44:45 +0000 (19:44 +0000)
This patch updates the installer and onboarding templates so that
JavaScript is included in the footer instead of the header. A new
include file is added, installer-intranet-bottom.inc, so that only
required JS is being loaded.

Some markup changes are included to improve validity.

To test, apply the patch and start with a blank Koha database. Run
through the installer and onboarding processes and confirm that there
are no problems. Check especially JS-related interactions like
datepickers and fields which are validated via JS, like the password
inputs.

NOTE: The qa tool will flag this patch for not using the Asset plugin,
but it doesn't work correctly for installer files.

Signed-off-by: Claire Gravely <claire.gravely@bsz-bw.de>

Signed-off-by: Josef Moravec <josef.moravec@gmail.com>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>

koha-tmpl/intranet-tmpl/prog/en/includes/installer-doc-head-close.inc
koha-tmpl/intranet-tmpl/prog/en/includes/installer-intranet-bottom.inc [new file with mode: 0644]
koha-tmpl/intranet-tmpl/prog/en/modules/installer/auth.tt
koha-tmpl/intranet-tmpl/prog/en/modules/installer/step1.tt
koha-tmpl/intranet-tmpl/prog/en/modules/installer/step2.tt
koha-tmpl/intranet-tmpl/prog/en/modules/installer/step3.tt
koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep1.tt
koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep2.tt
koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep3.tt
koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep4.tt
koha-tmpl/intranet-tmpl/prog/en/modules/onboarding/onboardingstep5.tt

index d605fef..d634650 100644 (file)
@@ -2,23 +2,5 @@
 <link rel="shortcut icon" href="[% IF ( IntranetFavicon ) %][% IntranetFavicon | html %][% ELSE %][% interface | html %]/[% theme | html %]/img/favicon.ico[% END %]" type="image/x-icon" />
 <link rel="stylesheet" type="text/css" href="[% interface | html %]/lib/jquery/jquery-ui-1.11.4.min.css" />
 <link rel="stylesheet" type="text/css" href="[% interface | html %]/lib/bootstrap/bootstrap.min.css" />
-<link rel="stylesheet" type="text/css" href="[% interface | html %]/[% theme | html %]/css/installer.css" />
-
-<script type="text/javascript" src="[% interface | html %]/lib/jquery/jquery-2.2.3.min.js"></script>
-<script type="text/javascript" src="[% interface | html %]/lib/jquery/jquery-migrate-1.3.0.min.js"></script>
-<script type="text/javascript" src="[% interface | html %]/lib/jquery/jquery-ui-1.11.4.min.js"></script>
-<script type="text/javascript" src="[% interface | html %]/lib/bootstrap/bootstrap.min.js"></script>
-<script type="text/javascript" src="[% interface | html %]/lib/jquery/plugins/jquery.validate.min.js"></script>
-<script type="text/javascript">
-    function _(s) { return s } // dummy function for gettext
-    [%# Prevent XFS attacks -%]
-    $(document).ready(function() {
-       if (self === top) {
-           var antiClickjack = document.getElementById("antiClickjack");
-           antiClickjack.parentNode.removeChild(antiClickjack);
-       } else {
-           top.location = self.location;
-       }
-    });
-</script>
+<link rel="stylesheet" type="text/css" href="[% interface | html %]/[% theme %]/css/installer.css" />
 <style id="antiClickjack">body{display:none !important;}</style>
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/installer-intranet-bottom.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/installer-intranet-bottom.inc
new file mode 100644 (file)
index 0000000..7537e41
--- /dev/null
@@ -0,0 +1,20 @@
+        <script src="[% interface %]/lib/jquery/jquery-2.2.3.min.js"></script>
+        <script src="[% interface %]/lib/jquery/jquery-migrate-1.3.0.min.js"></script>
+        <script src="[% interface %]/lib/jquery/jquery-ui-1.11.4.min.js"></script>
+        <script src="[% interface %]/lib/bootstrap/bootstrap.min.js"></script>
+        <script src="[% interface %]/lib/jquery/plugins/jquery.validate.min.js"></script>
+        <script>
+            function _(s) { return s } // dummy function for gettext
+            [%# Prevent XFS attacks -%]
+            $(document).ready(function() {
+               if (self === top) {
+                   var antiClickjack = document.getElementById("antiClickjack");
+                   antiClickjack.parentNode.removeChild(antiClickjack);
+               } else {
+                   top.location = self.location;
+               }
+            });
+        </script>
+        [% jsinclude # Parse the page template's JavaScript block if necessary %]
+    </body>
+</html>
index 30d5a61..71cd268 100644 (file)
@@ -58,7 +58,8 @@
                         </fieldset>
                     </form>
                 [% END %]
-            </div>
-        </div>
+            </div> <!-- / #installer-login -->
+        </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% INCLUDE 'installer-intranet-bottom.inc' %]
index 120b45d..649d866 100644 (file)
     [% END %]
 </title>
 [% INCLUDE 'installer-doc-head-close.inc' %]
+</head>
 
-<div class="container-fluid">
-    <div class="row">
-        <div id="installer-step1" class="installer-main col-sm-8 col-sm-offset-2 col-md-8 col-md-offset-2">
 
-            <h1 id="logo"><a href="#">Koha</a></h1>
+<body id="installer" class="installer">
+    <div class="container-fluid">
+        <div class="row">
+            <div id="installer-step1" class="installer-main col-sm-8 col-sm-offset-2 col-md-8 col-md-offset-2">
 
-            [% UNLESS ( language ) %]
-                <h2>Web installer &rsaquo; Choose your language</h2>
-                <p>You are about to install Koha.</p>
+                <h1 id="logo"><a href="#">Koha</a></h1>
 
-                <p>Please pick your language from the following list. If your language is not listed, please inform your system administrator.</p>
+                [% UNLESS ( language ) %]
+                    <h2>Web installer &rsaquo; Choose your language</h2>
+                    <p>You are about to install Koha.</p>
 
-                <form name="language" method="post" action="install.pl">
-                    <div class="form-group">
-                        <label for="language">Select a language: </label>
-                        <select id="language" name="language">
-                            [% IF ( installer_languages_loop ) %]
-                                [% FOREACH installer_languages_loo IN installer_languages_loop %]
-                                    [% IF ( installer_languages_loo.plural ) %]
-                                        <optgroup label="[% installer_languages_loo.language | html %]">
-                                            [% FOREACH sublanguages_loo IN installer_languages_loo.sublanguages_loop %]
-                                                <option value="[% sublanguages_loo.rfc4646_subtag | html %]">[% IF ( sublanguages_loo.native_description ) %][% sublanguages_loo.native_description | html %][% ELSE %][% sublanguages_loo.rfc4646_subtag | html %][% END %]</option>
-                                            [% END %]
-                                        </optgroup>
-                                    [% ELSE %]
-                                        <option value="[% installer_languages_loo.rfc4646_subtag | html %]">[% IF ( installer_languages_loo.native_description ) %][% installer_languages_loo.native_description | html %][% ELSE %][% installer_languages_loo.rfc4646_subtag | html %][% END %]</option>
+                    <p>Please pick your language from the following list. If your language is not listed, please inform your system administrator.</p>
+
+                    <form name="language" method="post" action="install.pl">
+                        <div class="form-group">
+                            <label for="language">Select a language: </label>
+                            <select id="language" name="language">
+                                [% IF ( installer_languages_loop ) %]
+                                    [% FOREACH installer_languages_loo IN installer_languages_loop %]
+                                        [% IF ( installer_languages_loo.plural ) %]
+                                            <optgroup label="[% installer_languages_loo.language | html %]">
+                                                [% FOREACH sublanguages_loo IN installer_languages_loo.sublanguages_loop %]
+                                                    <option value="[% sublanguages_loo.rfc4646_subtag | html %]">[% IF ( sublanguages_loo.native_description ) %][% sublanguages_loo.native_description | html %][% ELSE %][% sublanguages_loo.rfc4646_subtag | html %][% END %]</option>
+                                                [% END %]
+                                            </optgroup>
+                                        [% ELSE %]
+                                            <option value="[% installer_languages_loo.rfc4646_subtag | html %]">[% IF ( installer_languages_loo.native_description ) %][% installer_languages_loo.native_description | html %][% ELSE %][% installer_languages_loo.rfc4646_subtag | html %][% END %]</option>
+                                        [% END %]
                                     [% END %]
                                 [% END %]
-                            [% END %]
-                        </select>
-                    </div>
-                    <p><input value="Continue to the next step" class="btn btn-primary" type="submit" /></p>
-                </form>
-            [% END %]
+                            </select>
+                        </div>
+                        <p><input value="Continue to the next step" class="btn btn-primary" type="submit" /></p>
+                    </form>
+                [% END %]
 
-            [% IF ( language ) %]
-                [% UNLESS ( checkmodule ) %]
-                    [% IF ( missing_modules ) %]
-                        <h2>Web installer &rsaquo; Perl modules missing</h2>
-                        <p>Some Perl modules are missing. <span class="label label-danger">Important: </span>Required modules must be installed before you may continue.<br />
-                        <ul>
-                            [% FOREACH missing_module IN missing_modules %]
-                                <li><strong>[% missing_module.name | html %]</strong> [% IF ( missing_module.require ) %]<span class="label label-danger">Required</span>[% END %]
-                                    <br /> Version: [% missing_module.version | html %]
-                                    <br /> Usage: [% missing_module.usage | html %]
-                                </li>
-                            [% END %]
-                        </ul>
-                    [% END %]
+                [% IF ( language ) %]
+                    [% UNLESS ( checkmodule ) %]
+                        [% IF ( missing_modules ) %]
+                            <h2>Web installer &rsaquo; Perl modules missing</h2>
+                            <p>Some Perl modules are missing. <span class="label label-danger">Important: </span>Required modules must be installed before you may continue.<br />
+                            <ul>
+                                [% FOREACH missing_module IN missing_modules %]
+                                    <li><strong>[% missing_module.name | html %]</strong> [% IF ( missing_module.require ) %]<span class="label label-danger">Required</span>[% END %]
+                                        <br /> Version: [% missing_module.version | html %]
+                                        <br /> Usage: [% missing_module.usage | html %]
+                                    </li>
+                                [% END %]
+                            </ul>
+                        [% END %]
 
-                    [% IF ( problems ) %]
-                        <h2>Web installer &rsaquo; Perl version too old</h2>
-                        <p>I encountered some problems.</p>
-                        <ul>
-                            [% IF ( perlversion ) %]
-                                <li>Your Perl version is out of date. Please upgrade to a newer version of Perl (at least version 5.10).</li>
-                            [% END %]
-                        </ul>
-                    [% END %]
+                        [% IF ( problems ) %]
+                            <h2>Web installer &rsaquo; Perl version too old</h2>
+                            <p>I encountered some problems.</p>
+                            <ul>
+                                [% IF ( perlversion ) %]
+                                    <li>Your Perl version is out of date. Please upgrade to a newer version of Perl (at least version 5.10).</li>
+                                [% END %]
+                            </ul>
+                        [% END %]
 
-                    <form name="checkmodules" action="install.pl">
-                        <input type="hidden" name="step" value="1" />
-                        <p> <input value="Recheck dependencies" class="btn btn-primary" type="submit" /></p>
-                    </form>
+                        <form name="checkmodules" action="install.pl">
+                            <input type="hidden" name="step" value="1" />
+                            <p> <input value="Recheck dependencies" class="btn btn-primary" type="submit" /></p>
+                        </form>
 
-                [% ELSE # IF checkmodule %]
-                    <h2>Web installer &rsaquo; Check Perl dependencies</h2>
-                    <p>All required Perl modules appear to be installed.</p>
-                    <p> All dependencies installed.</p>
+                    [% ELSE # IF checkmodule %]
+                        <h2>Web installer &rsaquo; Check Perl dependencies</h2>
+                        <p>All required Perl modules appear to be installed.</p>
+                        <p> All dependencies installed.</p>
 
-                    <form name="checkmodules" role="form" action="install.pl">
-                        <input type="hidden" name="step" value="2" />
-                        <p> <input value="Continue to the next step" class="btn btn-primary" type="submit" /> </p>
-                    </form>
-                [% END # IF checkmodule%]
-            [% END # IF language %]
-        </div> <!-- / #installer-step1 -->
-    </div> <!-- / .row -->
+                        <form name="checkmodules" role="form" action="install.pl">
+                            <input type="hidden" name="step" value="2" />
+                            <p> <input value="Continue to the next step" class="btn btn-primary" type="submit" /> </p>
+                        </form>
+                    [% END # IF checkmodule%]
+                [% END # IF language %]
+            </div> <!-- / #installer-step1 -->
+        </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% INCLUDE 'installer-intranet-bottom.inc' %]
index ec785a9..30a9209 100644 (file)
@@ -69,5 +69,6 @@
                 [% END # / IF dbconnection %]
             </div> <!-- / #installer-step2 -->
         </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% INCLUDE 'installer-intranet-bottom.inc' %]
index 2f5d45d..9f37a5a 100644 (file)
                [% END # / IF updatestructure %]
             </div> <!-- / #installer-step3 -->
         </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
 [% IF ( selectframeworks ) %]
-    <script type="text/javascript">
-        $(document).ready(function(){
-            $(".selectall,.deselectall").on("click",function(e){
-                e.preventDefault();
-                var container = $(this).parent().parent();
-                if( $(this).hasClass("selectall") ){
-                    var state = true;
-                } else {
-                    var state = false;
-                }
-                $( container ).find("input").prop("checked", state);
-                $( container ).find(".selectall,.deselectall").toggle();
+    [% MACRO jsinclude BLOCK %]
+        <script>
+            $(document).ready(function(){
+                $(".selectall,.deselectall").on("click",function(e){
+                    e.preventDefault();
+                    var container = $(this).parent().parent();
+                    if( $(this).hasClass("selectall") ){
+                        var state = true;
+                    } else {
+                        var state = false;
+                    }
+                    $( container ).find("input").prop("checked", state);
+                    $( container ).find(".selectall,.deselectall").toggle();
+                });
             });
-        });
-    </script>
+        </script>
+    [% END %]
 [% END %]
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% INCLUDE 'installer-intranet-bottom.inc' %]
index ebe91f7..ba5aaa3 100644 (file)
@@ -37,5 +37,6 @@
                 </form>
             </div> <!-- / #onboarding-step1 -->
         </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% INCLUDE 'installer-intranet-bottom.inc' %]
index 1fd91e0..4f7643c 100644 (file)
@@ -11,9 +11,6 @@
     <meta http-equiv="refresh" content="0; url=/cgi-bin/koha/installer/onboarding.pl?step=3">
 [% END %]
 [% INCLUDE 'installer-doc-head-close.inc' %]
-[% INCLUDE 'validator-strings.inc' %]
-[% INCLUDE 'installer-strings.inc' %]
-<script type="text/javascript" src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
 </head>
 
 <body id="installer" class="installer">
                 </form>
             </div> <!-- / #onboarding-step2 -->
         </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'validator-strings.inc' %]
+    [% INCLUDE 'installer-strings.inc' %]
+    <script src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
+[% END %]
+
+[% INCLUDE 'installer-intranet-bottom.inc' %]
\ No newline at end of file
index b96c30d..eed7068 100644 (file)
@@ -2,9 +2,6 @@
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Web installer &rsaquo; Create Koha administrator patron</title>
 [% INCLUDE 'installer-doc-head-close.inc' %]
-[% INCLUDE 'validator-strings.inc' %]
-[% INCLUDE 'installer-strings.inc' %]
-<script type="text/javascript" src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
 </head>
 
 <body id="installer" class="installer">
                 </form>
             </div> <!-- / #onboarding-step3 -->
         </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
+
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'validator-strings.inc' %]
+    [% INCLUDE 'installer-strings.inc' %]
+    <script src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
+    [% PROCESS 'password_check.inc' %]
+    [% PROCESS 'add_password_check' new_password => 'password' %]
+[% END %]
+
+[% INCLUDE 'installer-intranet-bottom.inc' %]
 
-[% INCLUDE 'intranet-bottom.inc' %]
-[% PROCESS 'password_check.inc' %]
-[% PROCESS 'add_password_check' new_password => 'password' %]
index 54274c0..ba41c63 100644 (file)
@@ -1,9 +1,6 @@
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Web installer &rsaquo; Create a new item type </title>
 [% INCLUDE 'installer-doc-head-close.inc' %]
-[% INCLUDE 'validator-strings.inc' %]
-[% INCLUDE 'installer-strings.inc' %]
-<script type="text/javascript" src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
 </head>
 
 <body id="installer" class="installer">
                 </form>
             </div> <!-- / #onboarding-step4 -->
         </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'validator-strings.inc' %]
+    [% INCLUDE 'installer-strings.inc' %]
+    <script src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
+[% END %]
+
+[% INCLUDE 'installer-intranet-bottom.inc' %]
\ No newline at end of file
index d6eb24e..b04013e 100644 (file)
@@ -7,9 +7,6 @@
     [% END %]
 </title>
 [% INCLUDE 'installer-doc-head-close.inc' %]
-[% INCLUDE 'validator-strings.inc' %]
-[% INCLUDE 'installer-strings.inc' %]
-<script type="text/javascript" src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
 </head>
 
 <body id="installer" class="installer">
                 [% END %]
             </div> <!-- / #onboarding-step5 -->
         </div> <!-- / .row -->
+    </div><!-- / .container-fluid -->
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'validator-strings.inc' %]
+    [% INCLUDE 'installer-strings.inc' %]
+    <script src="[% interface | html %]/[% theme | html %]/js/onboarding.js"></script>
+[% END %]
+
+[% INCLUDE 'installer-intranet-bottom.inc' %]
\ No newline at end of file