Bug 21751: Replace fixFloat with HC-sticky to fix Chrome display
[koha_ffzg] / koha-tmpl / intranet-tmpl / prog / en / modules / tools / letter.tt
index c3c4b42..d9a201f 100644 (file)
@@ -1,32 +1,53 @@
+[% USE raw %]
+[% USE Asset %]
 [% USE Koha %]
 [% USE Branches %]
+[% USE ColumnsSettings %]
 [% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
 <title>Koha &rsaquo; Tools &rsaquo; Notices[% IF ( add_form or copy_form ) %][% IF ( modify ) %] &rsaquo; Modify notice[% ELSE %] &rsaquo; Add notice[% END %][% END %][% IF ( add_validate or copy_validate) %] &rsaquo; Notice added[% END %][% IF ( delete_confirm ) %] &rsaquo; Confirm deletion[% END %]</title>
 [% INCLUDE 'doc-head-close.inc' %]
-<link rel="stylesheet" type="text/css" href="[% interface %]/[% theme %]/css/datatables_[% KOHA_VERSION %].css" />
+[% Asset.css("css/datatables.css") | $raw %]
+<style>#preview_template .modal-dialog { width : 80%; } .spinner { display: none; } @media (max-width: 767px) { #preview_template { margin: 0; width : auto; } }</style>
 </head>
 
 <body id="tools_letter" class="tools">
 [% INCLUDE 'header.inc' %]
 [% INCLUDE 'letters-search.inc' %]
 
-<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo; [% IF ( add_form or copy_form) %][% IF ( modify ) %]<a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; Slips</a> &rsaquo; Modify notice[% ELSE %] <a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; Slips</a> &rsaquo; Add notice[% END %][% ELSE %][% IF ( add_validate or copy_validate) %] <a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; Slips</a> &rsaquo; Notice added[% ELSE %][% IF ( delete_confirm ) %] <a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; Slips</a> &rsaquo; Confirm deletion[% ELSE %]Notices &amp; Slips[% END %][% END %][% END %]</div>
+<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> &rsaquo; [% IF ( add_form or copy_form) %][% IF ( modify ) %]<a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; slips</a> &rsaquo; Modify notice[% ELSE %] <a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; slips</a> &rsaquo; Add notice[% END %][% ELSE %][% IF ( add_validate or copy_validate) %] <a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; slips</a> &rsaquo; Notice added[% ELSE %][% IF ( delete_confirm ) %] <a href="/cgi-bin/koha/tools/letter.pl">Notices &amp; slips</a> &rsaquo; Confirm deletion[% ELSE %]Notices &amp; slips[% END %][% END %][% END %]</div>
+
+<div id="preview_template" class="modal in" tabindex="-1" role="dialog" aria-labelledby="preview_template_label" aria-hidden="true">
+    <div class="modal-dialog modal-lg">
+    <div class="modal-content">
+    <div class="modal-header">
+        <button type="button" class="closebtn" data-dismiss="modal" aria-hidden="true">×</button>
+        <h3 id="preview_template_label">Preview notice template</h3>
+    </div>
+    <div class="modal-body">
+        <div id="loading"> <img src="[% interface | html %]/[% theme | html %]/img/spinner-small.gif" alt="" /> Loading </div>
+    </div>
+    <div class="modal-footer">
+        <!-- TODO <a href="#" class="btn btn-default" id="preview_template_button" role="button" data-toggle="modal">Convert using the Template Toolkit syntax</a>-->
+        <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button>
+    </div>
+    </div>
+    </div>
+</div>
 
 [% IF add_form or copy_form %]
     <div class="main container-fluid">
         <div class="row">
             <div class="col-md-8 col-md-offset-2">
 [% ELSE %]
-    <div id="doc3" class="yui-t2">
-        <div id="bd">
-            <div id="yui-main">
-                <div class="yui-b">
+    <div class="main container-fluid">
+        <div class="row">
+            <div class="col-sm-10 col-sm-push-2">
+                <main>
 [% END %]
 
-
 [% IF ( no_op_set ) %]
-    <h1>Notices and Slips</h1>
+    <h1>Notices &amp; slips</h1>
     <form method="get" action="/cgi-bin/koha/tools/letter.pl" id="selectlibrary">
       <input type="hidden" name="searchfield" value="[% searchfield | html %]" />
     [% UNLESS independant_branch %]
@@ -51,7 +72,7 @@
             [% select_for_copy = BLOCK %]
             <select name="branchcode">
                 [% FOREACH l IN Branches.all() %]
-                <option value="[% l.branchcode %]">Copy to [% l.branchname %]</option>
+                <option value="[% l.branchcode | html %]">Copy to [% l.branchname | html %]</option>
                 [% END %]
             </select>
             [% END %]
               [% FOREACH lette IN letter %]
                 [% can_edit = lette.branchcode || !independant_branch %]
                 <tr>
-                  <td>[% IF lette.branchname %][% lette.branchname %][% ELSE %](All libraries)[% END %]</td>
-                  <td>[% lette.module %]</td>
-                  <td>[% lette.code %]</td>
-                  <td>[% lette.name %]</td>
+                  <td>[% IF lette.branchname %][% lette.branchname | html %][% ELSE %](All libraries)[% END %]</td>
+                  <td>
+                      [% SWITCH lette.module %]
+                          [% CASE 'acquisition' %]<span>Acquisition</span>
+                          [% CASE 'catalogue' %]<span>Catalog</span>
+                          [% CASE 'circulation' %]<span>Circulation</span>
+                          [% CASE 'orderacquisition' %]<span>Order acquisition</span>
+                          [% CASE 'claimacquisition' %]<span>Claim acquisition</span>
+                          [% CASE 'claimissues' %]<span>Claim serial issue</span>
+                          [% CASE 'reserves' %]<span>Holds</span>
+                          [% CASE 'members' %]<span>Patrons</span>
+                          [% CASE 'serial' %]<span>Serials (new issue)</span>
+                          [% CASE 'suggestions' %]<span>Suggestions</span>
+                          [% CASE %]<span>[% lette.module | html %]</span>
+                      [% END %]
+                  </td>
+                  <td>[% lette.code | html %]</td>
+                  <td>[% lette.name | html %]</td>
                   <td class="actions">
                     [% IF !independant_branch || !lette.branchcode %]
                       <form method="post" action="/cgi-bin/koha/tools/letter.pl">
                         <input type="hidden" name="op" value="copy_form" />
-                        <input type="hidden" name="oldbranchcode" value="[% lette.branchcode %]" />
-                        <input type="hidden" name="module" value="[% lette.module %]" />
-                        <input type="hidden" name="code" value="[% lette.code %]" />
+                        <input type="hidden" name="oldbranchcode" value="[% lette.branchcode | html %]" />
+                        <input type="hidden" name="module" value="[% lette.module | html %]" />
+                        <input type="hidden" name="code" value="[% lette.code | html %]" />
                         [% IF independant_branch %]
-                          <input type="hidden" name="branchcode" value="[% independant_branch %]" />
+                          <input type="hidden" name="branchcode" value="[% independant_branch | html %]" />
                         [% ELSE %]
-                          [% select_for_copy %]
+                          [% select_for_copy | $raw %]
                         [% END %]
                         <button class="btn btn-default btn-xs"><i class="fa fa-clone"></i> Copy</button>
                       </form>
                   </td>
                   <td class="actions">
                     [% IF can_edit %]
-                      <a class="btn btn-default btn-xs" href="/cgi-bin/koha/tools/letter.pl?op=add_form&amp;branchcode=[% lette.branchcode %]&amp;module=[% lette.module %]&amp;code=[% lette.code %]"><i class="fa fa-pencil"></i> Edit</a>
+                      <a class="btn btn-default btn-xs" href="/cgi-bin/koha/tools/letter.pl?op=add_form&amp;branchcode=[% lette.branchcode | html %]&amp;module=[% lette.module | html %]&amp;code=[% lette.code | html %]"><i class="fa fa-pencil"></i> Edit</a>
                     [% END %]
                     [% IF !lette.protected && can_edit %]
-                      <a class="btn btn-default btn-xs" href="/cgi-bin/koha/tools/letter.pl?op=delete_confirm&amp;branchcode=[%lette.branchcode %]&amp;module=[% lette.module %]&amp;code=[% lette.code %]"><i class="fa fa-trash"></i> Delete</a>
+                      <a class="btn btn-default btn-xs" href="/cgi-bin/koha/tools/letter.pl?op=delete_confirm&amp;branchcode=[% lette.branchcode | html %]&amp;module=[% lette.module | html %]&amp;code=[% lette.code | html %]"><i class="fa fa-trash"></i> Delete</a>
                     [% END %]
                   </td>
                 </tr>
                <input type="hidden" name="add" value="1" />
                [% END %]
                <fieldset class="rows">
-            <input type="hidden" name="oldbranchcode" value="[% oldbranchcode %]" />
+            <input type="hidden" name="oldbranchcode" value="[% oldbranchcode | html %]" />
             <ol>
             [% IF independant_branch %]
-                <input type="hidden" name="branchcode" value="[% independant_branch %]" />
+                <input type="hidden" name="branchcode" value="[% independant_branch | html %]" />
             [% ELSE %]
             <li>
 
                     </select>
                 [% ELSE %]
                     <span class="label">Library:</span>
-                    <input type="hidden" id="branch" name="branchcode" value="[% branchcode %]" />
+                    <input type="hidden" id="branch" name="branchcode" value="[% branchcode | html %]" />
                     [% IF ( branchcode ) %]
-                       [% Branches.GetName( branchcode ) %]
+                       [% Branches.GetName( branchcode ) | html %]
                     [% ELSE %]
                         All libraries
                     [% END %]
             [% END %]
                        <li>
                                <label for="module">Koha module:</label>
-                               <input type="hidden" name="oldmodule" value="[% module %]" />
+                               <input type="hidden" name="oldmodule" value="[% module | html %]" />
                 [% IF adding  %]
                   <select name="module" id="newmodule">
                 [% ELSE %]
                                       <option value="reserves">Holds</option>
                                     [% END %]
                                     [% IF ( module == "members" ) %]
-                                      <option value="members" selected="selected">Members</option>
+                                      <option value="members" selected="selected">Patrons</option>
                                     [% ELSE %]
-                                      <option value="members">Members</option>
+                                      <option value="members">Patrons</option>
                                     [% END %]
                                     [% IF ( module == "serial" ) %]
-                                      <option value="serial" selected="selected">Serials (routing list)</option>
+                                      <option value="serial" selected="selected">Serials (new issue)</option>
                                     [% ELSE %]
-                                      <option value="serial">Serials (routing list)</option>
+                                      <option value="serial">Serials (new issue)</option>
                                     [% END %]
                                     [% IF ( module == "suggestions" ) %]
                                       <option value="suggestions" selected="selected">Suggestions</option>
                   <span class="required">Required</span>
               [% ELSE %]
                   <span class="label">Code:</span>
-                  <input type="hidden" id="code" name="code" value="[% code %]" />
-                  [% code %]
+                  <input type="hidden" id="code" name="code" value="[% code | html %]" />
+                  [% code | html %]
               [% END %]
             </li>
             <li>
               <label for="name" class="required">Name:</label>
-              <input type="text" id="name" name="name" size="60" value="[% letter_name %]" required="required" />
+              <input type="text" id="name" name="name" size="60" value="[% letter_name | html %]" required="required" />
               <span class="required">Required</span>
             </li>
+            [% IF code and preview_is_available%]
+                <li>
+                    <label for="name">Data for preview:</label>
+                    [% SWITCH code %]
+                    [% CASE 'CHECKIN' %]
+                        <input type="text" id="data_preview" name="data_preview" value="" placeholder="barcode" />
+                    [% CASE 'CHECKOUT' %]
+                        <input type="text" id="data_preview" name="data_preview" value="" placeholder="barcode|borrowernumber" />
+                    [% CASE 'HOLD_SLIP' %]
+                        <input type="text" id="data_preview" name="data_preview" value="" placeholder="biblionumber|borrowernumber" />
+                    [% CASE %]
+                        Not supported yet.
+                    [% END %]
+                    </li>
+            [% END %]
         </ol>
     </fieldset>
         [% IF Koha.Preference('TranslateNotices') %]
                     [% FOR language IN languages %]
                         [% FOR sublanguage IN language.sublanguages_loop %]
                             [% IF language.plural %]
-                                <li><a href="#lang_[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] [% sublanguage.region_description %] ([% sublanguage.rfc4646_subtag %])</a></li>
+                                <li><a href="#lang_[% sublanguage.rfc4646_subtag | uri %]">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</a></li>
                             [% ELSE %]
-                                <li><a href="#lang_[% sublanguage.rfc4646_subtag %]">[% sublanguage.native_description %] ([% sublanguage.rfc4646_subtag %])</a></li>
+                                <li><a href="#lang_[% sublanguage.rfc4646_subtag | uri %]">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</a></li>
                             [% END %]
                         [% END %]
                     [% END %]
         [% END %]
 
         [% FOREACH lang IN letters.keys %]
-            <div id="lang_[% lang %]">
+            <div id="lang_[% lang | html %]">
         <div class="transport-types" style="clear:both">
         [% FOR mtt IN letters.$lang.templates.keys.sort %]
             [% SET letter = letters.$lang.templates.$mtt %]
                 [% CASE 'phone' %]
                   Phone
                 [% CASE %]
-                  [% letter.message_transport_type %]
+                  [% letter.message_transport_type | html %]
                 [% END %]
             </h3>
             [% IF letter.message_transport_type == "sms" and not Koha.Preference("SMSSendDriver") %]
-              <fieldset class="rows mtt" id="[% letter.message_transport_type %]_[% lang %]" disabled="disabled">
+              <fieldset class="rows mtt" id="[% letter.message_transport_type | html %]_[% lang | html %]" disabled="disabled">
                 <div class="dialog message">You should enable the SMSSendDriver preference to use the SMS templates.</div>
             [% ELSIF letter.message_transport_type == "phone" and not Koha.Preference("TalkingTechItivaPhoneNotification") %]
-              <fieldset class="rows mtt" id="[% letter.message_transport_type %]_[% lang %]" disabled="disabled">
+              <fieldset class="rows mtt" id="[% letter.message_transport_type | html %]_[% lang | html %]" disabled="disabled">
                 <div class="dialog message">You should enable the TalkingTechItivaPhoneNotification preference to use the phone templates.</div>
             [% ELSE %]
-              <fieldset class="rows mtt" id="[% letter.message_transport_type %]_[% lang %]">
+              <fieldset class="rows mtt" id="[% letter.message_transport_type | html %]_[% lang | html %]">
             [% END %]
               <ol>
                 <li>
-                  <input type="hidden" name="message_transport_type" value="[% letter.message_transport_type %]" />
-                  <input type="hidden" name="lang" value="[% lang %]" />
-                  <label for="is_html_[% letter.message_transport_type %]_[% lang %]">HTML message:</label>
+                  <input type="hidden" name="message_transport_type" value="[% letter.message_transport_type | html %]" />
+                  <input type="hidden" name="lang" value="[% lang | html %]" />
+                  <label for="is_html_[% letter.message_transport_type | html %]_[% lang | html %]">HTML message:</label>
                   [% IF letter.is_html %]
-                    <input type="checkbox" name="is_html_[% letter.message_transport_type %]" id="is_html_[% letter.message_transport_type %]_[% lang %]" value="1" checked="checked" />
+                    <input type="checkbox" name="is_html_[% letter.message_transport_type | html %]" id="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" value="1" checked="checked" />
                   [% ELSE %]
-                    <input type="checkbox" name="is_html_[% letter.message_transport_type %]" id="is_html_[% letter.message_transport_type %]_[% lang %]" value="1" />
+                    <input type="checkbox" name="is_html_[% letter.message_transport_type | html %]" id="is_html_[% letter.message_transport_type | html %]_[% lang | html %]" value="1" />
                   [% END %]
                 </li>
                 <li>
-                  <label for="title_[% letter.message_transport_type %]_[% lang %]">Message subject:</label><input type="text" id="title_[% letter.message_transport_type %]_[% lang %]" name="title" size="60" value="[% letter.title %]" />
+                  <label for="title_[% letter.message_transport_type | html %]_[% lang | html %]">Message subject:</label><input type="text" id="title_[% letter.message_transport_type | html %]_[% lang | html %]" name="title" size="60" value="[% letter.title | html %]" />
                 </li>
                 <li>
-                  <label for="SQLfieldname_[% letter.message_transport_type %]_[% lang %]">Message body:</label>
+                  <label for="SQLfieldname_[% letter.message_transport_type | html %]_[% lang | html %]">Message body:</label>
                   [% IF letter.message_transport_type == 'sms' %]
-                    <span class="sms_counter" id="sms_counter_[% lang %]">[% IF letter.content && letter.content.length > 0 %][% letter.content.length %][% ELSE %]0[% END %]/160 characters</span>
+                    <span class="sms_counter" id="sms_counter_[% lang | html %]">[% IF letter.content && letter.content.length > 0 %][% letter.content.length | html %][% ELSE %]0[% END %]/160 characters</span>
                   [% END %]
                   <table>
                     <tr>
                       <td>
-                        <select name="SQLfieldname" id="SQLfieldname_[% letter.message_transport_type %]_[% lang %]" multiple="multiple" size="9">
+                        <select name="SQLfieldname" id="SQLfieldname_[% letter.message_transport_type | html %]_[% lang | html %]" multiple="multiple" size="9">
                           [% FOREACH SQLfieldname IN SQLfieldnames %]
-                            <option value="[% SQLfieldname.value %]">[% SQLfieldname.text %]</option>
+                            <option value="[% SQLfieldname.value | html %]">[% SQLfieldname.text | html %]</option>
                           [% END %]
                         </select>
                       </td>
                         <td class="actions">
-                            <button type="button" data-containerid="[% letter.message_transport_type %]_[% lang %]" class="btn btn-default btn-sm insert">Insert <i class="fa fa-long-arrow-right"></i></button>
+                            <button type="button" data-containerid="[% letter.message_transport_type | html %]_[% lang | html %]" class="btn btn-default btn-sm insert">Insert <i class="fa fa-long-arrow-right"></i></button>
                         </td>
-                      <td><textarea name="content" data-lang="[% lang %]" class="content_[% letter.message_transport_type %]" id="content_[% letter.message_transport_type %]_[% lang %]" cols="80" rows="15">[% letter.content %]</textarea></td>
+                      <td><textarea name="content" data-lang="[% lang | html %]" class="content_[% letter.message_transport_type | html %]" id="content_[% letter.message_transport_type | html %]_[% lang | html %]" cols="80" rows="15">[% letter.content | html %]</textarea></td>
                     </tr>
                   </table>
                 </li>
+                [% IF preview_is_available %]
+                    <li>
+                        <a href="/cgi-bin/koha/svc/letters/preview" class="preview_template btn btn-default btn-xs" title="Preview this notice template" data-mtt="[% letter.message_transport_type | html %]" data-lang="[% lang | html %]"><i class="fa fa-eye"></i> Preview</a>
+                    </li>
+                [% END %]
               </ol>
             </fieldset>
             [% END %]
         [% IF code.search('DGST') %] <span class="overdue">Warning, this is a template for a Digest, as such, any references to branch data ( e.g. branches.branchname ) will refer to the borrower's home branch.</span> [% END %]
 
         <input type="hidden" id="redirect" name="redirect" value="" />
-        <input type="hidden" name="searchfield" value="[% searchfield %]" />
+        <input type="hidden" name="searchfield" value="[% searchfield | html %]" />
     </form>
 [% END %]
 
 [% IF ( add_validate or copy_validate) %]
        Data recorded
-       <form action="[% action %]" method="post">
+       <form action="[% action | html %]" method="post">
        <input type="submit" value="OK" />
        </form>
 [% END %]
             </tr>
             </thead>
             <tr>
-                <td>[% IF letter.branchcode %][% Branches.GetName( letter.branchcode ) %][% ELSE %](All libraries)[% END %]</td>
-                <td>[% letter.module %]</td>
-                <td>[% letter.code %]</td>
-                <td>[% letter.name %]</td>
+                <td>[% IF letter.branchcode %][% Branches.GetName( letter.branchcode ) | html %][% ELSE %](All libraries)[% END %]</td>
+                <td>[% letter.module | html %]</td>
+                <td>[% letter.code | html %]</td>
+                <td>[% letter.name | html %]</td>
             </tr>
         </table>
-            <form action="[% action %]" method="post">
+            <form action="[% action | html %]" method="post">
             <input type="hidden" name="op" value="delete_confirmed">
-            <input type="hidden" name="branchcode" value="[% letter.branchcode %]" />
-            <input type="hidden" name="code" value="[% letter.code %]" />
-            <input type="hidden" name="module" value="[% letter.module %]" />
+            <input type="hidden" name="branchcode" value="[% letter.branchcode | html %]" />
+            <input type="hidden" name="code" value="[% letter.code | html %]" />
+            <input type="hidden" name="module" value="[% letter.module | html %]" />
             <button type="submit" class="approve"><i class="fa fa-check"></i> Yes, delete</button>
         </form>
 
-        <form action="[% action %]" method="get">
+        <form action="[% action | html %]" method="get">
             <button type="submit" class="deny"><i class="fa fa-times"></i> No, do not delete</button>
         </form>
     </div>
 
 [% IF ( delete_confirmed ) %]
        Data deleted
-       <form action="[% action %]" method="post">
+       <form action="[% action | html %]" method="post">
        <input type="submit" value="OK" />
        </form>
 [% END %]
 
-</div>
-</div>
-[% UNLESS add_form or copy_form %]
-    <div class="yui-b noprint">
-        [% INCLUDE 'tools-menu.inc' %]
-    </div>
+[% IF add_form or copy_form %]
+        </div> <!-- /.col-md-8 -->
+    </div> <!-- /.row -->
+[% ELSE %]
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
+
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
+                [% INCLUDE 'tools-menu.inc' %]
+            </aside>
+        </div> <!-- /.col-sm-2.col-sm-pull-10 -->
+    </div> <!-- /.row -->
 [% END %]
-</div>
 
 [% MACRO jsinclude BLOCK %]
-    <script type="text/javascript" src="[% interface %]/[% theme %]/js/tools-menu_[% KOHA_VERSION %].js"></script>
+    [% Asset.js("js/tools-menu.js") | $raw %]
     [% INCLUDE 'datatables.inc' %]
-    <script type="text/javascript" src="[% interface %]/lib/jquery/plugins/jquery.fixFloat_[% KOHA_VERSION %].js"></script>
-    <script type="text/javascript" src="[% interface %]/lib/jquery/plugins/jquery.insertatcaret_[% KOHA_VERSION %].js"></script>
-    <script type="text/javascript">
-        $(document).ready(function() {
-            [% IF add_form or copy_form %]
-                $('#toolbar').fixFloat();
-            [% END %]
-            $("#lettert:has(tbody tr)").dataTable($.extend(true, {}, dataTablesDefaults, {
-                "sDom": 't',
-                "aoColumnDefs": [
-                    { "bSortable": false, "bSearchable": false, 'aTargets': [ 'nosort' ] }
-                ],
-                "bPaginate": false
-            }));
-            [% IF no_op_set %]
-                $('#branch').change(function() {
-                    $('#op').val("");
-                    $('#selectlibrary').submit();
-                });
-                $('#newnotice').click(function() {
-                    $('#op').val("add_form");
-                    return true;
-                });
-            [% END %]
-
-            $("#newmodule").on("change",function(){
-                if( $("#branch").val() == ""){
-                    var branchcode = "*";
-                } else {
-                    var branchcode = $("#branch").val();
-                }
-                window.location.href = "/cgi-bin/koha/tools/letter.pl?op=add_form&module=" + $(this).val() + "&branchcode=" + branchcode;
-            });
-
-            $("#submit_form").click( function(event) {
-                event.preventDefault();
-                var at_least_one_exists = 0;
-                var are_valid = 1;
-                $("fieldset.mtt").each( function(){
-                    var title = $(this).find('input[name="title"]').val();
-                    var content = $(this).find('textarea[name="content"]').val();
-                    if (
-                            ( title.length == 0 && content.length > 0 )
-                         || ( title.length > 0 && content.length == 0 )
-                    ) {
-                        var mtt = $(this).find('input[name="message_transport_type"]').val();
-                        var msg = _("Please specify title and content for %s");
-                        msg = msg.replace( "%s", mtt );
-                        at_least_one_exists = 1;
-                        alert(msg);
-                        return are_valid = false;
-                    } else if ( title.length > 0 && content.length > 0 ) {
-                        at_least_one_exists = 1;
-                    }
-                } );
-                if ( ! at_least_one_exists ) {
-                    alert( _("Please fill at least one template.") );
-                    return false;
-                }
-                if ( ! are_valid ) {
-                    return false;
-                }
-
-                // Test if code already exists in DB
-                var new_lettercode = $("#code").val();
-                var new_branchcode = $("#branch").val();
-                [% IF ( add_form and code ) # IF edit %]
-                    if ( new_lettercode != '[% code %]' ) {
-                [% END %]
-                    $.ajax({
-                        data: { code: new_lettercode, branchcode: new_branchcode },
-                        type: 'GET',
-                        url: '/cgi-bin/koha/svc/letters/',
-                        success: function (data) {
-                             if ( data.letters.length > 0 ) {
-                                 if( new_branchcode == '' ) {
-                                     alert( _("A default letter with the code '%s' already exists.").format(new_lettercode) );
-                                 } else {
-                                     alert( _("A letter with the code '%s' already exists for '%s'.").format(new_lettercode, new_branchcode) );
-                                 }
-                                 return false;
-                             } else {
-                                 $("#add_notice").submit();
-                             }
-                        },
-                    });
-                [% IF ( add_form and code ) %]
-                    } else {
-                        $("#add_notice").submit();
-                    }
-                [% END %]
-            });
-
-            var sms_limit = 160;
-            $(".content_sms").on("keyup", function(){
-                var length = $(this).val().length;
-                var sms_counter = ("#sms_counter_" + $(this).data('lang'));
-                $(sms_counter).html(length + "/" + sms_limit + _(" characters"));
-                if ( length  > sms_limit ) {
-                    $(sms_counter).css("color", "red");
-                } else {
-                    $(sms_counter).css("color", "black");
-                }
-            });
-            $( ".transport-types" ).accordion({ collapsible: true, active:false, animate: 200 });
-            $(".insert").on("click",function(){
-                var containerid = $(this).data("containerid");
-                insertValueQuery( containerid );
-            })
-
-            $("#tabs").tabs();
-
-            $("#saveandcontinue").on("click",function(e){
-                e.preventDefault();
-                $("#redirect").val("just_save");
-                $("#submit_form").click();
-            });
-
-        });
-        [% IF add_form or copy_form %]
-            function cancel(f) {
-                $('#op').val("");
-                f.method = "get";
-                f.submit();
-            }
-
-            function isNotNull(f,noalert) {
-              if (f.value.length ==0) {
-                  return false;
-              }
-              return true;
-            }
-
-            function isNum(v,maybenull) {
-                var n = new Number(v.value);
-                if (isNaN(n)) {
-                    return false;
-                }
-                if (maybenull==0 && v.value==''){
-                  return false;
-                }
-                return true;
-            }
-            function insertValueQuery(containerid) {
-                var fieldset = $("#" + containerid);
-                var myQuery = $(fieldset).find('textarea[name="content"]');
-                var myListBox = $(fieldset).find('select[name="SQLfieldname"]');
-
-                if($(myListBox).find('option').length > 0) {
-                    $(myListBox).find('option').each( function (){
-                        if ( $(this).attr('selected') && $(this).val().length > 0 ) {
-                            $(myQuery).insertAtCaret("<<" + $(this).val() + ">>");
-                        }
-                    });
-                }
-            }
-        [% END %]
-    </script>
+    [% INCLUDE 'columns_settings.inc' %]
+    [% Asset.js("lib/hc-sticky.js") | $raw %]
+    [% Asset.js("lib/jquery/plugins/jquery.insertatcaret.js") | $raw %]
+    <script>
+        var no_op_set = '[% no_op_set | html %]';
+        var interface = '[% interface | html %]';
+        var theme = '[% theme | html %]';
+        var add_form = '[% add_form | html %]';
+        var copy_form = '[% copy_form | html %]';
+        var code = '[% code | html %]';
+        var new_lettercode = '[% new_lettercode | html %]';
+        var new_branchcode = '[% new_branchcode | html %]';
+        var MSG_CODE_EXISTS = _("A default letter with the code '%s' already exists.");
+        var MSG_CODE_EXISTS_FOR_LIBRARY = _("A letter with the code '%s' already exists for '%s'.");
+        var MSG_EMPTY_TITLE_AND_CONTENT = _("Please specify title and content for %s");
+        var MSG_EMPTY_TEMPLATES = _("Please fill at least one template.");
+        var MSG_LOADING = _("Loading");
+        var MSG_NO_NOTICE_FOUND = _("No matching notices found");
+        var columns_settings = [% ColumnsSettings.GetColumns( 'tools', 'notices', 'lettert', 'json' ) | $raw %];
+     </script>
+    [% Asset.js("js/letter.js") | $raw %]
 [% END %]
 
 [% INCLUDE 'intranet-bottom.inc' %]