Bug 19608: Move admin templates JavaScript to the footer: The rest
authorOwen Leonard <oleonard@myacpl.org>
Tue, 14 Nov 2017 16:13:56 +0000 (16:13 +0000)
committerJonathan Druart <jonathan.druart@bugs.koha-community.org>
Tue, 26 Dec 2017 15:52:33 +0000 (12:52 -0300)
This patch modifies the staff client administration templates so that
JavaScript is included in the footer instead of the header.

To test, apply the patch and test the JavaScript-driven features of the
modified templates: All button controls, DataTables functionality, tabs,
etc.

To test the changes to localization.tt you must have more than one
translation installed. Go to admin/itemtypes.pl, edit an itemtype, and
click the 'Translate into other languages' link.

To test the changes to sur_modmapping.tt, go to admin/z3950servers.pl
and create a new SRU server. Click the 'Modify' button next to 'SRU
Search fields mapping'

Signed-off-by: Claire Gravely <claire.gravely@bsz-bw.de>
Signed-off-by: Josef Moravec <josef.moravec@gmail.com>
Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
koha-tmpl/intranet-tmpl/prog/en/includes/popup-bottom.inc
koha-tmpl/intranet-tmpl/prog/en/modules/admin/clone-rules.tt
koha-tmpl/intranet-tmpl/prog/en/modules/admin/currency.tt
koha-tmpl/intranet-tmpl/prog/en/modules/admin/edi_accounts.tt
koha-tmpl/intranet-tmpl/prog/en/modules/admin/edi_ean_accounts.tt
koha-tmpl/intranet-tmpl/prog/en/modules/admin/itemtypes.tt
koha-tmpl/intranet-tmpl/prog/en/modules/admin/localization.tt
koha-tmpl/intranet-tmpl/prog/en/modules/admin/sru_modmapping.tt

index 308b1d0..37e9c91 100644 (file)
@@ -1,2 +1,6 @@
+    [% IF ( footerjs ) %]
+        [% INCLUDE js_includes.inc %]
+        [% jsinclude # Parse the page template's JavaScript block if necessary %]
+    [% END %]
 </body>
 </html>
index c42e256..394ee80 100644 (file)
@@ -1,4 +1,5 @@
 [% USE Branches %]
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Administration &rsaquo; Circulation and fine rules &rsaquo; Clone circulation and fine rules</title>
 [% INCLUDE 'doc-head-close.inc' %]
@@ -64,4 +65,5 @@
 [% INCLUDE 'admin-menu.inc' %]
 </div>
 </div>
+
 [% INCLUDE 'intranet-bottom.inc' %]
index d7285b8..9d73653 100644 (file)
@@ -1,6 +1,7 @@
 [% USE KohaDates %]
 [% USE ColumnsSettings %]
 [% USE HtmlTags %]
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Administration &rsaquo; Currencies &amp; Exchange rates &rsaquo;
 [% IF op == 'add_form' %][% IF currency %]Modify currency '[% currency.currency %]'[% ELSE %]New currency[% END %][% END %]
@@ -8,50 +9,12 @@
 [% IF op == 'list' %]Currencies[% END %]</title>
 [% INCLUDE 'doc-head-close.inc' %]
 <link rel="stylesheet" type="text/css" href="[% interface %]/[% theme %]/css/datatables.css" />
-[% INCLUDE 'datatables.inc' %]
-[% INCLUDE 'columns_settings.inc' %]
-<script type="text/javascript">
-//<![CDATA[
-
-    function check_currency(val) {
-        if ( val == 1.0 ) {
-            $("#active").prop('disabled', false);
-            $("#hint").html("");
-        } else {
-            $("#active").prop('checked', false);
-            $("#active").prop('disabled', true);
-            $("#hint").html(_("The active currency must have a rate of 1.0"));
-        }
-    }
-
-    $(document).ready(function() {
-        columns_settings = [% ColumnsSettings.GetColumns( 'admin', 'currency', 'currencies-table', 'json' ) %]
-        var issuest = KohaTable("#currencies-table", {
-            dom: 'B<"clearfix">t',
-            "columnDefs": [
-                { "aTargets": [ -1 ], "bSortable": false, "bSearchable": false },
-                { "sType": "title-string", "aTargets" : [ "title-string" ] }
-                ],
-        }, columns_settings );
-
-        // prevents users to check active with a currency != 1
-        $("#rate").keyup(function() {
-            check_currency( $(this).val() );
-        });
-        check_currency( $("#rate").val() );
-        $("#currency_code").on("blur",function(){
-            toUC(this);
-        });
-    });
-//]]>
-</script>
 </head>
+
 <body id="admin_currency" class="admin">
 [% INCLUDE 'header.inc' %]
 [% INCLUDE 'currencies-admin-search.inc' %]
 
-
-
 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/admin/admin-home.pl">Administration</a> &rsaquo;  <a href="/cgi-bin/koha/admin/currency.pl">Currencies &amp; Exchange rates</a> &rsaquo; [% IF op == 'add_form' %][% IF currency %]Modify currency '[% currency.currency %]'[% ELSE %]New currency[% END %][% END %]
 [% IF op == 'delete_confirm' %]Confirm deletion of currency [% currency.currency | $HtmlTags tag='span' attributes=>'class="ex"' %]
 [% ELSIF op == 'list' %]Currencies
 [% INCLUDE 'admin-menu.inc' %]
 </div>
 </div>
+
+[% MACRO jsinclude BLOCK %]
+    <script type="text/javascript" src="[% interface %]/[% theme %]/js/admin-menu.js"></script>
+    [% INCLUDE 'datatables.inc' %]
+    [% INCLUDE 'columns_settings.inc' %]
+    <script type="text/javascript">
+
+        function check_currency(val) {
+            if ( val == 1.0 ) {
+                $("#active").prop('disabled', false);
+                $("#hint").html("");
+            } else {
+                $("#active").prop('checked', false);
+                $("#active").prop('disabled', true);
+                $("#hint").html(_("The active currency must have a rate of 1.0"));
+            }
+        }
+
+        $(document).ready(function() {
+            columns_settings = [% ColumnsSettings.GetColumns( 'admin', 'currency', 'currencies-table', 'json' ) %]
+            var issuest = KohaTable("#currencies-table", {
+                dom: 'B<"clearfix">t',
+                "columnDefs": [
+                    { "aTargets": [ -1 ], "bSortable": false, "bSearchable": false },
+                    { "sType": "title-string", "aTargets" : [ "title-string" ] }
+                    ],
+            }, columns_settings );
+
+            // prevents users to check active with a currency != 1
+            $("#rate").keyup(function() {
+                check_currency( $(this).val() );
+            });
+            check_currency( $("#rate").val() );
+            $("#currency_code").on("blur",function(){
+                toUC(this);
+            });
+        });
+
+    </script>
+[% END %]
 [% INCLUDE 'intranet-bottom.inc' %]
index 1b9882f..c00f1e2 100644 (file)
@@ -1,3 +1,4 @@
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Administration &rsaquo; EDI accounts
 [% IF acct_form %]
     [% INCLUDE 'admin-menu.inc' %]
 </div>
 </div>
+
+[% MACRO jsinclude BLOCK %]
+    <script type="text/javascript" src="[% interface %]/[% theme %]/js/admin-menu.js"></script>
+[% END %]
 [% INCLUDE 'intranet-bottom.inc' %]
index 2620bf0..ee52187 100644 (file)
@@ -1,3 +1,4 @@
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Administration &rsaquo; Library EANs
 [% IF ean_form %]
     [% INCLUDE 'admin-menu.inc' %]
 </div>
 </div>
+
+[% MACRO jsinclude BLOCK %]
+    <script type="text/javascript" src="[% interface %]/[% theme %]/js/admin-menu.js"></script>
+[% END %]
 [% INCLUDE 'intranet-bottom.inc' %]
index 4062312..17ddd0b 100644 (file)
@@ -422,4 +422,5 @@ Item types administration
          });
     </script>
 [% END %]
+
 [% INCLUDE 'intranet-bottom.inc' %]
index 9d53e5c..345b42c 100644 (file)
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Localization</title>
 [% INCLUDE 'doc-head-close.inc' popup => 1 %]
 <link rel="stylesheet" type="text/css" href="[% interface %]/[% theme %]/css/datatables.css" />
-[% INCLUDE 'greybox.inc' %]
-[% INCLUDE 'datatables.inc' %]
-<script type="text/javascript">
-//<![CDATA[
-
-    function show_message( params ) {
-        var type = params.type;
-        var data = params.data;
-        var messages = $("#messages");
-        var message;
-        if ( type == 'success_on_update' ) {
-            message = $('<div class="dialog message"></div>');
-            message.text("Entity %s (code %s) for lang %s has correctly been updated with '%s'".format(data.entity, data.code, data.lang, data.translation));
-        } else if ( type == 'error_on_update' ) {
-            message = $('<div class="dialog alert"></div>');
-            if ( data.error_code == 'already_exists' ) {
-                message.text("A translation already exists for this language.");
-            } else {
-                message.text("An error occurred when updating this translation.");
-            }
-        } else if ( type == 'success_on_delete' ) {
-            message = $('<div class="dialog message"></div>');
-            message.text("The translation (id %s) has been removed successfully".format(data.id));
-        } else if ( type == 'error_on_delete' ) {
-            message = $('<div class="dialog alert"></div>');
-            message.text("An error occurred when deleting this translation");
-        } else if ( type == 'success_on_insert' ) {
-            message = $('<div class="dialog message"></div>');
-            message.text("Translation (id %s) has been added successfully".format(data.id));
-        } else if ( type == 'error_on_insert' ) {
-            message = $('<div class="dialog alert"></div>');
-            if ( data.error_code == 'already_exists' ) {
-                message.text("A translation already exists for this language.");
-            } else {
-                message.text("An error occurred when adding this translation");
-            }
-        }
-
-        $(messages).append(message);
-
-        setTimeout(function(){
-            message.hide()
-        }, 3000);
-    }
-
-    function send_update_request( data, cell ) {
-        $.ajax({
-            data: data,
-            type: 'PUT',
-            url: '/cgi-bin/koha/svc/localization',
-            success: function (data) {
-                if ( data.error ) {
-                    $(cell).css('background-color', '#FF0000');
-                    show_message({ type: 'error_on_update', data: data });
-                } else if ( data.is_changed == 1 ) {
-                    $(cell).css('background-color', '#00FF00');
-                    show_message({ type: 'success_on_update', data: data });
-                }
-
-                if ( $(cell).hasClass('lang') ) {
-                    $(cell).text(data.lang)
-                } else if ( $(cell).hasClass('translation') ) {
-                    $(cell).text(data.translation)
-                }
-            },
-            error: function (data) {
-                $(cell).css('background-color', '#FF0000');
-                if ( $(cell).hasClass('lang') ) {
-                    $(cell).text(data.lang)
-                } else if ( $(cell).hasClass('translation') ) {
-                    $(cell).text(data.translation)
-                }
-                show_message({ type: 'error_on_update', data: data });
-            },
-        });
-    }
-
-    function send_delete_request( id, cell ) {
-        $.ajax({
-            type: 'DELETE',
-            url: '/cgi-bin/koha/svc/localization/?id='+id,
-            success: function (data) {
-                $("#localization").DataTable().row( '#row_id_' + id ).remove().draw();
-                show_message({ type: 'success_on_delete', data: data });
-            },
-            error: function (data) {
-                $(cell).css('background-color', '#FF0000');
-                show_message({ type: 'error_on_delete', data: data });
-            },
-        });
-    }
-
-    $(document).ready(function() {
-        $(".dialog").hide();
-
-        var table = $("#localization").DataTable($.extend(true, {}, dataTablesDefaults, {
-            'bPaginate': false,
-        }));
-
-        var languages_select = $('<select name="lang"></select>');
-        [% FOR language IN languages %]
-            [% FOR sublanguage IN language.sublanguages_loop %]
-                var option;
-                [% IF language.plural %]
-                    option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] [% sublanguage.region_description %] ([% sublanguage.rfc4646_subtag %])</option>');
-                    $(languages_select).append(option);
-                [% ELSE %]
-                    option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] ([% sublanguage.rfc4646_subtag %])</option>');
-                [% END %]
-                $(languages_select).append(option);
-            [% END %]
-        [% END %]
-
-        $("td.translation").on('focus', function(){
-            $(this).css('background-color', '');
-        });
-        $("td.lang").on('click', function(){
-            var td = this;
-            var lang = $(td).text();
-            $(td).css('background-color', '');
-            var my_select = $(languages_select).clone();
-            $(my_select).find('option[value="' + lang + '"]').attr('selected', 'selected');
-            $(my_select).on('click', function(e){
-                e.stopPropagation();
-            });
-            $(my_select).on('change', function(){
-                var tr = $(this).parent().parent();
-                var id = $(tr).data('id');
-                var lang = $(this).find('option:selected').val();
-                var data = "id=" + encodeURIComponent(id) + "&lang=" + encodeURIComponent(lang);
-                send_update_request( data, td );
-            });
-            $(my_select).on('blur', function(){
-                $(td).html(lang);
-            });
-            $(this).html(my_select);
-        });
-
-        $("td.translation").on('blur', function(){
-            var tr = $(this).parent();
-            var id = $(tr).data('id');
-            var translation = $(this).text();
-            var data = "id=" + encodeURIComponent(id) + "&translation=" + encodeURIComponent(translation);
-            send_update_request( data, this );
-        });
-
-        $("a.delete").on('click', function(e){
-            e.preventDefault();
-            if ( confirm(_("Are you sure you want to delete this translation?")) ) {
-                var td = $(this).parent();
-                var tr = $(td).parent();
-                var id = $(tr).data('id');
-                send_delete_request( id, td );
-            }
-        });
-
-        $("#add_translation").on('submit', function(e){
-            e.preventDefault();
-            var entity = $(this).find('input[name="entity"]').val();
-            var code = $(this).find('input[name="code"]').val();
-            var lang = $(this).find('select[name="lang"] option:selected').val();
-            var translation = $(this).find('input[name="translation"]').val();
-            var data = "entity=" + encodeURIComponent(entity) + "&code=" + encodeURIComponent(code) + "&lang=" + encodeURIComponent(lang) + "&translation=" + encodeURIComponent(translation);
-            $.ajax({
-                data: data,
-                type: 'POST',
-                url: '/cgi-bin/koha/svc/localization',
-                success: function (data) {
-                    if ( data.error ) {
-                        show_message({ type: 'error_on_insert', data: data });
-                    } else {
-                        // FIXME Should append the delete link
-                        table.row.add( [ data.id, data.entity, data.code, data.lang, data.translation, "" ] ).draw();
-                        show_message({ type: 'success_on_insert', data: data });
-                    }
-                },
-                error: function (data) {
-                    show_message({ type: 'error_on_insert', data: data });
-                },
-            });
-        });
-
-     });
-//]]>
-</script>
 </head>
+
 <body id="admin_localization" class="admin">
 <div id="main">
 <form id="add_translation" method="post">
     </tbody>
 </table>
 </div>
-</body>
-</html>
+
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'datatables.inc' %]
+    <script type="text/javascript">
+
+        function show_message( params ) {
+            var type = params.type;
+            var data = params.data;
+            var messages = $("#messages");
+            var message;
+            if ( type == 'success_on_update' ) {
+                message = $('<div class="dialog message"></div>');
+                message.text("Entity %s (code %s) for lang %s has correctly been updated with '%s'".format(data.entity, data.code, data.lang, data.translation));
+            } else if ( type == 'error_on_update' ) {
+                message = $('<div class="dialog alert"></div>');
+                if ( data.error_code == 'already_exists' ) {
+                    message.text("A translation already exists for this language.");
+                } else {
+                    message.text("An error occurred when updating this translation.");
+                }
+            } else if ( type == 'success_on_delete' ) {
+                message = $('<div class="dialog message"></div>');
+                message.text("The translation (id %s) has been removed successfully".format(data.id));
+            } else if ( type == 'error_on_delete' ) {
+                message = $('<div class="dialog alert"></div>');
+                message.text("An error occurred when deleting this translation");
+            } else if ( type == 'success_on_insert' ) {
+                message = $('<div class="dialog message"></div>');
+                message.text("Translation (id %s) has been added successfully".format(data.id));
+            } else if ( type == 'error_on_insert' ) {
+                message = $('<div class="dialog alert"></div>');
+                if ( data.error_code == 'already_exists' ) {
+                    message.text("A translation already exists for this language.");
+                } else {
+                    message.text("An error occurred when adding this translation");
+                }
+            }
+
+            $(messages).append(message);
+
+            setTimeout(function(){
+                message.hide()
+            }, 3000);
+        }
+
+        function send_update_request( data, cell ) {
+            $.ajax({
+                data: data,
+                type: 'PUT',
+                url: '/cgi-bin/koha/svc/localization',
+                success: function (data) {
+                    if ( data.error ) {
+                        $(cell).css('background-color', '#FF0000');
+                        show_message({ type: 'error_on_update', data: data });
+                    } else if ( data.is_changed == 1 ) {
+                        $(cell).css('background-color', '#00FF00');
+                        show_message({ type: 'success_on_update', data: data });
+                    }
+
+                    if ( $(cell).hasClass('lang') ) {
+                        $(cell).text(data.lang)
+                    } else if ( $(cell).hasClass('translation') ) {
+                        $(cell).text(data.translation)
+                    }
+                },
+                error: function (data) {
+                    $(cell).css('background-color', '#FF0000');
+                    if ( $(cell).hasClass('lang') ) {
+                        $(cell).text(data.lang)
+                    } else if ( $(cell).hasClass('translation') ) {
+                        $(cell).text(data.translation)
+                    }
+                    show_message({ type: 'error_on_update', data: data });
+                },
+            });
+        }
+
+        function send_delete_request( id, cell ) {
+            $.ajax({
+                type: 'DELETE',
+                url: '/cgi-bin/koha/svc/localization/?id='+id,
+                success: function (data) {
+                    $("#localization").DataTable().row( '#row_id_' + id ).remove().draw();
+                    show_message({ type: 'success_on_delete', data: data });
+                },
+                error: function (data) {
+                    $(cell).css('background-color', '#FF0000');
+                    show_message({ type: 'error_on_delete', data: data });
+                },
+            });
+        }
+
+        $(document).ready(function() {
+            $(".dialog").hide();
+
+            var table = $("#localization").DataTable($.extend(true, {}, dataTablesDefaults, {
+                'bPaginate': false,
+            }));
+
+            var languages_select = $('<select name="lang"></select>');
+            [% FOR language IN languages %]
+                [% FOR sublanguage IN language.sublanguages_loop %]
+                    var option;
+                    [% IF language.plural %]
+                        option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] [% sublanguage.region_description %] ([% sublanguage.rfc4646_subtag %])</option>');
+                        $(languages_select).append(option);
+                    [% ELSE %]
+                        option = $('<option value="[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] ([% sublanguage.rfc4646_subtag %])</option>');
+                    [% END %]
+                    $(languages_select).append(option);
+                [% END %]
+            [% END %]
+
+            $("td.translation").on('focus', function(){
+                $(this).css('background-color', '');
+            });
+            $("td.lang").on('click', function(){
+                var td = this;
+                var lang = $(td).text();
+                $(td).css('background-color', '');
+                var my_select = $(languages_select).clone();
+                $(my_select).find('option[value="' + lang + '"]').attr('selected', 'selected');
+                $(my_select).on('click', function(e){
+                    e.stopPropagation();
+                });
+                $(my_select).on('change', function(){
+                    var tr = $(this).parent().parent();
+                    var id = $(tr).data('id');
+                    var lang = $(this).find('option:selected').val();
+                    var data = "id=" + encodeURIComponent(id) + "&lang=" + encodeURIComponent(lang);
+                    send_update_request( data, td );
+                });
+                $(my_select).on('blur', function(){
+                    $(td).html(lang);
+                });
+                $(this).html(my_select);
+            });
+
+            $("td.translation").on('blur', function(){
+                var tr = $(this).parent();
+                var id = $(tr).data('id');
+                var translation = $(this).text();
+                var data = "id=" + encodeURIComponent(id) + "&translation=" + encodeURIComponent(translation);
+                send_update_request( data, this );
+            });
+
+            $("a.delete").on('click', function(e){
+                e.preventDefault();
+                if ( confirm(_("Are you sure you want to delete this translation?")) ) {
+                    var td = $(this).parent();
+                    var tr = $(td).parent();
+                    var id = $(tr).data('id');
+                    send_delete_request( id, td );
+                }
+            });
+
+            $("#add_translation").on('submit', function(e){
+                e.preventDefault();
+                var entity = $(this).find('input[name="entity"]').val();
+                var code = $(this).find('input[name="code"]').val();
+                var lang = $(this).find('select[name="lang"] option:selected').val();
+                var translation = $(this).find('input[name="translation"]').val();
+                var data = "entity=" + encodeURIComponent(entity) + "&code=" + encodeURIComponent(code) + "&lang=" + encodeURIComponent(lang) + "&translation=" + encodeURIComponent(translation);
+                $.ajax({
+                    data: data,
+                    type: 'POST',
+                    url: '/cgi-bin/koha/svc/localization',
+                    success: function (data) {
+                        if ( data.error ) {
+                            show_message({ type: 'error_on_insert', data: data });
+                        } else {
+                            // FIXME Should append the delete link
+                            table.row.add( [ data.id, data.entity, data.code, data.lang, data.translation, "" ] ).draw();
+                            show_message({ type: 'success_on_insert', data: data });
+                        }
+                    },
+                    error: function (data) {
+                        show_message({ type: 'error_on_insert', data: data });
+                    },
+                });
+            });
+
+         });
+    </script>
+[% END %]
+[% INCLUDE 'popup-bottom.inc' %]
index 363ec5e..4f53077 100644 (file)
@@ -1,32 +1,7 @@
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; SRU search fields mapping</title>
 [% INCLUDE 'doc-head-close.inc' %]
-
-<script type="text/javascript">
-//<![CDATA[
-    $(document).ready(function() {
-        $("#form01").submit(function(event) {
-            if(window.opener) {
-                var newmap=allInputs();
-                window.opener.$('#show_sru_fields').val(newmap);
-                window.close();
-            } else {
-                // In this case not called as a popup. Just do nothing.
-                event.preventDefault();
-            }
-        });
-    });
-    function allInputs () {
-        var aInput= new Array();
-        $("form :input").each(function() {
-            if( this.id && $(this).val() ) {
-                aInput.push(this.id+'='+$(this).val());
-            }
-        });
-        return aInput.join(',');
-    }
-//]]>
-</script>
 </head>
 
 <body id="admin_sru_modmapping" class="admin">
         </form>
     </div>
 
-[% INCLUDE 'intranet-bottom.inc' %]
+[% MACRO jsinclude BLOCK %]
+    <script type="text/javascript" src="[% interface %]/[% theme %]/js/admin-menu.js"></script>
+    <script type="text/javascript">
+        $(document).ready(function() {
+            $("#form01").submit(function(event) {
+                if(window.opener) {
+                    var newmap=allInputs();
+                    window.opener.$('#show_sru_fields').val(newmap);
+                    window.close();
+                } else {
+                    // In this case not called as a popup. Just do nothing.
+                    event.preventDefault();
+                }
+            });
+        });
+        function allInputs () {
+            var aInput= new Array();
+            $("form :input").each(function() {
+                if( this.id && $(this).val() ) {
+                    aInput.push(this.id+'='+$(this).val());
+                }
+            });
+            return aInput.join(',');
+        }
+    </script>
+[% END %]
+
+[% INCLUDE 'popup-bottom.inc' %]