Bug 24224: Convert OpacNavBottom system preference to additional content
[srvgit] / koha-tmpl / opac-tmpl / bootstrap / en / modules / opac-messaging.tt
index 801389c..2cb15b6 100644 (file)
@@ -1,6 +1,9 @@
 [% USE Koha %]
+[% USE AdditionalContents %]
+[% SET OpacNav = AdditionalContents.get( location => "OpacNav", lang => lang, library => logged_in_user.branchcode, blocktitle => 0 ) %]
+[% SET OpacNavBottom = AdditionalContents.get( location => "OpacNavBottom", lang => lang, library => logged_in_user.branchcode, blocktitle => 0 ) %]
 [% INCLUDE 'doc-head-open.inc' %]
-<title>[% IF ( LibraryNameTitle ) %][% IF ( LibraryNameTitle ) %][% LibraryNameTitle %][% ELSE %]Koha online[% END %][% ELSE %]Koha online[% END %] catalog &rsaquo; Your messaging settings</title>
+<title>Your messaging settings &rsaquo; [% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog</title>
 [% INCLUDE 'doc-head-close.inc' %]
 [% BLOCK cssinclude %][% END %]
 </head>
 [% INCLUDE 'masthead.inc' %]
 
 <div class="main">
-    <ul class="breadcrumb">
-        <li><a href="/cgi-bin/koha/opac-main.pl">Home</a> <span class="divider">&rsaquo;</span></li>
-        <li><a href="/cgi-bin/koha/opac-user.pl">[% BORROWER_INFO.firstname %] [% BORROWER_INFO.surname %]</a> <span class="divider">&rsaquo;</span></li>
-        <li><a href="#">Your messaging settings</a></li>
-    </ul>
+    <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumbs">
+        <ol class="breadcrumb">
+            <li class="breadcrumb-item">
+                <a href="/cgi-bin/koha/opac-main.pl">Home</a>
+            </li>
+            <li class="breadcrumb-item">
+                <a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' patron = logged_in_user %]</a>
+            </li>
+            <li class="breadcrumb-item active">
+                <a href="#" aria-current="page">Your messaging settings</a>
+            </li>
+        </ol>
+    </nav> <!-- /#breadcrumbs -->
 
     <div class="container-fluid">
-        <div class="row-fluid">
-            <div class="span2">
+        <div class="row">
+            <div class="col col-lg-2 order-2 order-lg-1">
                 <div id="navigation">
                     [% INCLUDE 'navigation.inc' IsPatronPage=1 %]
                 </div>
             </div>
-            <div class="span10">
+            <div class="col-md-12 col-lg-10 order-1">
+
                 [% IF Koha.Preference( 'EnhancedMessagingPreferencesOPAC' )  %]
-                <div id="usermessaging">
-                    <h3>Your messaging settings</h3>
-                    [% IF ( settings_updated ) %]
-                        <div class="alert alert-success"><h4>Settings updated</h4></div>
-                    [% END %]
-                    <form action="/cgi-bin/koha/opac-messaging.pl" method="get" name="opacmessaging">
-                        <input type="hidden" name="modify" value="yes" />
-
-                            <table class="table table-bordered table-condensed table-striped">
-                                <thead>
-                                    <tr>
-                                        <th>&nbsp;</th>
-                                        <th>Days in advance</th>
-                                        [% IF ( SMSSendDriver ) %]<th>SMS</th>[% END %]
-                                        [% IF ( TalkingTechItivaPhone ) %]<th>Phone</th>[% END %]
-                                        <th>Email</th>
-                                        <th>Digests only <i id="info_digests" data-toggle="tooltip" title="You can ask for a digest to reduce the number of messages. Messages will be saved and sent as a single message." data-placement="right" class="icon icon-info-sign"></i></th>
-                                        <!-- <th>RSS</th> --><th>Do not notify</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                [% FOREACH messaging_preference IN messaging_preferences %]
-                                    <tr>
-                                        <td>[% IF ( messaging_preference.Item_Due ) %]Item due
-                                              [% ELSIF ( messaging_preference.Advance_Notice ) %]Advance notice
-                                              [% ELSIF ( messaging_preference.Upcoming_Events ) %]Upcoming events
-                                              [% ELSIF ( messaging_preference.Hold_Filled ) %]Hold filled
-                                              [% ELSIF ( messaging_preference.Item_Check_in ) %]Item check-in
-                                              [% ELSIF ( messaging_preference.Item_Checkout ) %]Item checkout
-                                              [% ELSE %]Unknown [% END %]</td>
-                                        [% IF ( messaging_preference.takes_days ) %]
-                                            <td><select class="input-mini" name="[% messaging_preference.message_attribute_id %]-DAYS">
-                                            [% FOREACH select_day IN messaging_preference.select_days %]
-                                                [% IF ( select_day.selected ) %]
-                                                    <option value="[% select_day.day %]" selected="selected">[% select_day.day %]</option>
+                    <div id="usermessaging" class="maincontent">
+                        <h1>Your messaging settings</h1>
+                        [% IF ( settings_updated ) %]
+                        <div class="alert alert-success"><p><strong>Settings updated</strong></p></div>
+                        [% END %]
+                        <form action="/cgi-bin/koha/opac-messaging.pl" method="post" name="opacmessaging">
+                            <input type="hidden" name="csrf_token" value="[% csrf_token | html %]" />
+                            <input type="hidden" name="modify" value="yes" />
+
+                                <table class="table table-bordered table-condensed table-striped">
+                                    <caption class="sr-only">Your messaging settings</caption>
+                                    <thead>
+                                        <tr>
+                                            <th>&nbsp;</th>
+                                            <th>Days in advance</th>
+                                            [% IF ( SMSSendDriver ) %]<th>SMS</th>[% END %]
+                                            [% IF ( TalkingTechItivaPhone ) %]<th>Phone</th>[% END %]
+                                            [% IF Koha.Preference('PhoneNotification') %]<th>Phone</th>[% END %]
+                                            <th>Email</th>
+                                            <th>Digests only <i id="info_digests" data-toggle="tooltip" title="You can ask for a digest to reduce the number of messages. Messages will be saved and sent as a single message." data-placement="right" class="fa fa-info-circle"></i></th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                    [% FOREACH messaging_preference IN messaging_preferences %]
+                                        [% NEXT IF !Koha.Preference( 'ILLModule' ) && messaging_preference.message_name.match('^Ill_') %]
+                                        [% NEXT IF messaging_preference.Auto_Renewals && Koha.Preference('AutoRenewalNotices') != 'preferences' %]
+                                        <tr>
+                                            <td>[% IF ( messaging_preference.Item_Due ) %]Item due
+                                                [% ELSIF ( messaging_preference.Advance_Notice ) %]Advance notice
+                                                [% ELSIF ( messaging_preference.Hold_Filled ) %]Hold filled
+                                                [% ELSIF ( messaging_preference.Hold_Reminder ) %]Hold reminder
+                                                [% ELSIF ( messaging_preference.Item_Check_in ) %]Item check-in
+                                                [% ELSIF ( messaging_preference.Item_Checkout ) %]
+                                                    [% IF Koha.Preference( 'RenewalSendNotice' ) %]
+                                                        Item checkout and renewal
+                                                    [% ELSE %]
+                                                        Item checkout
+                                                    [% END %]
+                                                [% ELSIF ( messaging_preference.Ill_ready ) %]Interlibrary loan ready
+                                                [% ELSIF ( messaging_preference.Ill_unavailable ) %]Interlibrary loan unavailable
+                                                [% ELSIF ( messaging_preference.Auto_Renewals ) %]Auto renewal
+                                                [% ELSE %]Unknown [% END %]</td>
+                                            [% IF ( messaging_preference.takes_days ) %]
+                                                <td><select class="input-mini" name="[% messaging_preference.message_attribute_id | html %]-DAYS">
+                                                [% FOREACH select_day IN messaging_preference.select_days %]
+                                                    [% IF ( select_day.selected ) %]
+                                                        <option value="[% select_day.day | html %]" selected="selected">[% select_day.day | html %]</option>
+                                                    [% ELSE %]
+                                                        <option value="[% select_day.day | html %]">[% select_day.day | html %]</option>
+                                                    [% END %]
+                                                [% END %]
+                                                </select></td>
+                                            [% ELSE %]
+                                                <td>-</td>
+                                            [% END %]
+                                            [% IF ( SMSSendDriver ) %]
+                                                [% IF ( messaging_preference.transport_sms ) %]
+                                                    <td class="selectcol">
+                                                        [% IF ( messaging_preference.transports_sms ) %]
+                                                        <input type="checkbox" class="pmp_sms" id="sms[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="sms" checked="checked" />
+                                                        [% ELSE %]
+                                                            <input type="checkbox" class="pmp_sms" id="sms[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="sms" />
+                                                        [% END %]
+                                                    </td>
                                                 [% ELSE %]
-                                                    <option value="[% select_day.day %]">[% select_day.day %]</option>
+                                                    <td>-</td>
                                                 [% END %]
                                             [% END %]
-                                            </select></td>
-                                        [% ELSE %]
-                                            <td>-</td>
-                                        [% END %]
-                                        [% IF ( SMSSendDriver ) %]
-                                            [% IF ( messaging_preference.transport_sms ) %]
-                                                <td>
-                                                    [% IF ( messaging_preference.transports_sms ) %]
-                                                      <input type="checkbox" id="sms[% messaging_preference.message_attribute_id %]" name="[% messaging_preference.message_attribute_id %]" value="sms" checked="checked" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
+                                            [% IF Koha.Preference('PhoneNotification') %]
+                                                [% IF ( messaging_preference.transport_phone ) %]
+                                                    <td class="selectcol">
+                                                        [% IF ( messaging_preference.transports_phone ) %]
+                                                            <input type="checkbox"
+                                                                   class="phone"
+                                                                   id="phone[% messaging_preference.message_attribute_id | html %]"
+                                                                   name="[% messaging_preference.message_attribute_id | html %]"
+                                                                   value="phone" checked="checked" />
+                                                        [% ELSE %]
+                                                            <input type="checkbox"
+                                                                   class="phone"
+                                                                   id="phone[% messaging_preference.message_attribute_id | html %]"
+                                                                   name="[% messaging_preference.message_attribute_id | html %]"
+                                                                   value="phone" />
+                                                        [% END %]
+                                                    </td>
+                                                [% ELSE %]
+                                                    <td>-</td>
+                                                [% END %]
+                                            [% END %]
+                                            [% IF ( TalkingTechItivaPhone ) %]
+                                                [% IF ( messaging_preference.transport_itiva ) %]
+                                                <td class="selectcol">
+                                                [% IF ( messaging_preference.transports_itiva ) %]
+                                                <input type="checkbox"
+                                                            class="itiva"
+                                                            id="itiva[% messaging_preference.message_attribute_id | html %]"
+                                                            name="[% messaging_preference.message_attribute_id | html %]"
+                                                            value="itiva" checked="checked" />
+                                                [% ELSE %]
+                                                <input type="checkbox"
+                                                            class="itiva"
+                                                            id="itiva[% messaging_preference.message_attribute_id | html %]"
+                                                            name="[% messaging_preference.message_attribute_id | html %]"
+                                                            value="itiva" />
+                                                [% END %]
+                                                </td>
+                                                [% ELSE %]
+                                                    <td>-</td>
+                                                [% END %]
+                                            [% END %]
+
+                                            [% IF ( messaging_preference.transport_email ) %]
+                                                <td class="selectcol">
+                                                    [% IF ( messaging_preference.transports_email ) %]
+                                                        <input type="checkbox" class="pmp_email" id="email[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="email" checked="checked" />
                                                     [% ELSE %]
-                                                        <input type="checkbox" id="sms[% messaging_preference.message_attribute_id %]" name="[% messaging_preference.message_attribute_id %]" value="sms" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
+                                                        <input type="checkbox" class="pmp_email" id="email[% messaging_preference.message_attribute_id | html %]" name="[% messaging_preference.message_attribute_id | html %]" value="email" />
                                                     [% END %]
                                                 </td>
                                             [% ELSE %]
                                                 <td>-</td>
                                             [% END %]
-                                        [% END %]
-                                        [% IF ( TalkingTechItivaPhone ) %]
-                                            [% IF ( messaging_preference.transport_phone ) %]
-                                            <td>
-                                              [% IF ( messaging_preference.transports_phone ) %]
-                                              <input type="checkbox"
-                                                         id="phone[% messaging_preference.message_attribute_id %]"
-                                                         name="[% messaging_preference.message_attribute_id %]"
-                                                         value="phone" checked="checked" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
-                                              [% ELSE %]
-                                              <input type="checkbox"
-                                                         id="phone[% messaging_preference.message_attribute_id %]"
-                                                         name="[% messaging_preference.message_attribute_id %]"
-                                                         value="phone" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
-                                              [% END %]
-                                            </td>
+
+                                            [% IF ( messaging_preference.has_digest ) %]
+                                                <td class="selectcol">
+                                                    [% IF ( messaging_preference.digest ) %]
+                                                        <input type="checkbox" id="digest[% messaging_preference.message_attribute_id | html %]" value="[% messaging_preference.message_attribute_id | html %]" name="digest" checked="checked" data-toggle="tooltip" title="You must select a digestible transport to select digests" />
+                                                    [% ELSE %]
+                                                        <input type="checkbox" id="digest[% messaging_preference.message_attribute_id | html %]" value="[% messaging_preference.message_attribute_id | html %]" name="digest" data-toggle="tooltip" title="You must select a digestible transport to select digests" />
+                                                    [% END %]
+                                                </td>
                                             [% ELSE %]
-                                                <td>-</td>
+                                            <td>-</td>
                                             [% END %]
-                                        [% END %]
 
-                                        [% IF ( messaging_preference.transport_email ) %]
-                                            <td>
-                                                [% IF ( messaging_preference.transports_email ) %]
-                                                    <input type="checkbox" id="email[% messaging_preference.message_attribute_id %]" name="[% messaging_preference.message_attribute_id %]" value="email" checked="checked" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
-                                                [% ELSE %]
-                                                    <input type="checkbox" id="email[% messaging_preference.message_attribute_id %]" name="[% messaging_preference.message_attribute_id %]" value="email" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
-                                                [% END %]
-                                            </td>
-                                        [% ELSE %]
-                                            <td>-</td>
-                                        [% END %]
+                                        </tr>
+                                    [% END # / FOREACH messaging_preferences%]
+                                </tbody>
+                            </table>
 
-                                        [% IF ( messaging_preference.has_digest ) %]
-                                            <td>
-                                                [% IF ( messaging_preference.digest ) %]
-                                                    <input type="checkbox" id="digest[% messaging_preference.message_attribute_id %]" value="[% messaging_preference.message_attribute_id %]" name="digest" checked="checked" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
-                                                [% ELSE %]
-                                                    <input type="checkbox" id="digest[% messaging_preference.message_attribute_id %]" value="[% messaging_preference.message_attribute_id %]" name="digest" onclick = "document.opacmessaging.none[% messaging_preference.message_attribute_id %].checked=false;" />
-                                                [% END %]
-                                            </td>
-                                        [% ELSE %]
-                                        <td>-</td>
-                                        [% END %]
-
-                                        <td><input type="checkbox" class="none" id="none[% messaging_preference.message_attribute_id %]" /></td>
-                                    </tr>
-                                [% END # / FOREACH messaging_preferences%]
-                            </tbody>
-                        </table>
-
-                        <fieldset class="rows">
-                            [% IF ( SMSSendDriver ) %]
-                                <ol><li><label>Notice:</label>Some charges for text messages may be incurred when using this service. Please check with your mobile service provider if you have questions.</li></ol>
-                                <ol><li>
-                                    <label for="SMSnumber">SMS number:</label> <input type="text" id="SMSnumber" name="SMSnumber" value="[% SMSnumber %]" />
-                                    <i>Please enter numbers only. <b>(123) 456-7890</b> would be entered as <b>1234567890</b>.</i>
-                                </li></ol>
-                            [% END %]
-
-                            [% IF ( SMSSendDriver == 'Email' ) %]
-                                <ol><li>
-                                    <label for="sms_provider_id">SMS provider:</label>
-                                    <select id="sms_provider_id" name="sms_provider_id"/>
-                                        <option value="">Unknown</option>
-                                        [% FOREACH s IN sms_providers %]
-                                            [% IF s.id == sms_provider_id %]
-                                                <option value="[% s.id %]" selected="selected">[% s.name %]</option>
-                                            [% ELSE %]
-                                                <option value="[% s.id %]">[% s.name %]</option>
-                                            [% END %]
-                                        [% END %]
-                                    </select>
-                                    <i>Please contact a library staff member if you are unsure of your mobile service provider, or you do not see your provider in this list.</i>
-                                </li></ol>
-                            [% END %]
-                        </fieldset>
-
-                        <fieldset class="action">
-                          <input type="submit" value="Submit changes" class="btn" /> <a class="cancel" href="/cgi-bin/koha/opac-user.pl">Cancel</a>
-                        </fieldset>
-                    </form>
-                </div> <!-- / #usermessaging -->
+                            [% IF ( SMSSendDriver || Koha.Preference('TranslateNotices') ) %]
+                                <fieldset class="rows">
+                                    <ol>
+                                        [% IF ( SMSSendDriver ) %]
+                                            <li>
+                                                <strong>Notice:</strong> Some charges for text messages may be incurred when using this service. Please check with your mobile service provider if you have questions.
+                                            </li>
+                                            <li>
+                                                <label for="SMSnumber">SMS number:</label>
+                                                <input type="text" id="SMSnumber" name="SMSnumber" value="[% SMSnumber | html %]" pattern="^(\+[1-9]\d{0,2})?\d{1,12}$" />
+                                                <span class="hint sms_number_help">Please enter numbers only. Prefix the number with + if including the country code.</span>
+                                            </li>
+
+                                            [% IF ( SMSSendDriver == 'Email' ) %]
+                                                <li>
+                                                    <label for="sms_provider_id">SMS provider:</label>
+                                                    <select id="sms_provider_id" name="sms_provider_id">
+                                                        <option value="">Unknown</option>
+                                                        [% FOREACH s IN sms_providers %]
+                                                            [% IF s.id == sms_provider_id %]
+                                                                <option value="[% s.id | html %]" selected="selected">[% s.name | html %]</option>
+                                                            [% ELSE %]
+                                                                <option value="[% s.id | html %]">[% s.name | html %]</option>
+                                                            [% END %]
+                                                        [% END %]
+                                                    </select>
+                                                    <div class="hint">Please contact a library staff member if you are unsure of your mobile service provider, or you do not see your provider in this list.</div>
+                                                </li>
+                                            [% END # /IF ( SMSSendDriver == 'Email' ) %]
+                                        [% END # /IF SMSSendDriver %]
+
+                                        [% IF Koha.Preference('TranslateNotices') %]
+                                            <li>
+                                                <label for="lang">Preferred language for notices: </label>
+                                                <select id="lang" name="lang">
+                                                    <option value="default">Default</option>
+                                                    [% FOR language IN languages %]
+                                                        [% FOR sublanguage IN language.sublanguages_loop %]
+                                                            [% IF language.plural %]
+                                                                [% IF sublanguage.rfc4646_subtag == patron_lang %]
+                                                                    <option value="[% sublanguage.rfc4646_subtag | html %]" selected="selected">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
+                                                                [% ELSE %]
+                                                                    <option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] [% sublanguage.region_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
+                                                                [% END %]
+                                                            [% ELSE %]
+                                                                [% IF sublanguage.rfc4646_subtag == patron_lang %]
+                                                                    <option value="[% sublanguage.rfc4646_subtag | html %]" selected="selected">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
+                                                                [% ELSE %]
+                                                                    <option value="[% sublanguage.rfc4646_subtag | html %]">[% sublanguage.native_description | html %] ([% sublanguage.rfc4646_subtag | html %])</option>
+                                                                [% END %]
+                                                            [% END # /IF language.plural %]
+                                                        [% END # /FOR sublanguage %]
+                                                    [% END #/FOR language %]
+                                                </select> <!-- /#lang -->
+                                            </li>
+                                        [% END #/IF Koha.Preference('TranslateNotices') %]
+                                    </ol>
+                                </fieldset>
+                            [% END #/IF SMSSendDriver || Koha.Preference('TranslateNotices') %]
+
+                            <fieldset class="action">
+                                <input type="submit" value="Submit changes" class="btn btn-primary" />
+                                <a class="cancel" href="/cgi-bin/koha/opac-user.pl">Cancel</a>
+                            </fieldset>
+                        </form>
+                    </div> <!-- / #usermessaging -->
                 [% ELSE %]
-                    <h4>You are not allowed to call this page directly</h4>
-                [% END %]
-           </div> <!-- / .span10 -->
-        </div> <!-- / .row-fluid -->
+                <p><strong>You are not allowed to call this page directly</strong></p>
+                [% END # /IF Koha.Preference( 'EnhancedMessagingPreferencesOPAC' ) %]
+           </div> <!-- / .col-lg-10 -->
+        </div> <!-- / .row -->
     </div> <!-- / .container-fluid -->
 </div> <!-- / .main -->
 
 [% INCLUDE 'opac-bottom.inc' %]
 [% BLOCK jsinclude %]
-<script type="text/javascript">//<![CDATA[
-  $(document).ready(function(){
-    $(".none").click(function(){
-      if($(this).attr("checked")){
-        var rowid = $(this).attr("id");
-        newid = Number(rowid.replace("none",""))
-          $("#sms"+newid).removeAttr("checked");
-          $("#email"+newid).removeAttr("checked");
-          $("#digest"+newid).removeAttr("checked");
-          $("#rss"+newid).removeAttr("checked");
-      }
-    });
-    $("#info_digests").tooltip();
-  });
-//]]>
-</script>
+    <script>
+        $(document).ready(function(){
+            $("#info_digests").tooltip();
+
+            function toggle_digest(id){
+                if ( $("#email"+id).prop("checked") || $("#sms"+id).prop("checked") ) {
+                    $("#digest"+id).attr("disabled", false).tooltip('disable');
+                } else {
+                    $("#digest"+id).attr("disabled", true).prop("checked",false).tooltip('enable');
+                }
+
+            }
+            // At load time, we want digest disabled if no digest using transport is enabled
+            $(".pmp_email").each(function(){
+                toggle_digest(Number($(this).attr("id").replace("email", "")));
+            });
+
+            // If user clears all digest using transports for a notice, disable digest checkbox
+            $(".pmp_email").click(function(){
+                toggle_digest(Number($(this).attr("id").replace("email", "")));
+            });
+            $(".pmp_sms").click(function(){
+                toggle_digest(Number($(this).attr("id").replace("sms", "")));
+            });
+
+        });
+
+        function normalizeSMS(value){
+            let has_plus = value.charAt(0) === '+';
+            let new_value = value.replace(/\D/g,'');
+            if ( has_plus ) new_value = '+' + new_value;
+            return new_value;
+        }
+
+        var sms_input = document.getElementById('SMSnumber');
+
+        if (typeof sms_input !== 'undefined' && sms_input !== null) {
+            sms_input.addEventListener('keyup', function(){
+                var field = sms_input.value;
+                sms_input.value = normalizeSMS(field);
+            });
+
+            sms_input.addEventListener('paste', function(event) {
+                let paste = (event.clipboardData || window.clipboardData).getData('text');
+                setTimeout(function () {
+                sms_input.value = normalizeSMS(paste);
+                }, 100);
+            });
+        }
+    </script>
 [% END %]