Bug 15774: Add additional fields to order baskets
[srvgit] / koha-tmpl / intranet-tmpl / prog / en / modules / serials / subscription-add.tt
index f206802..e2f6949 100644 (file)
+[% USE raw %]
+[% USE Asset %]
 [% USE KohaDates %]
-
+[% USE Branches %]
+[% USE Koha %]
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
-<title>Koha &rsaquo; Serials &rsaquo; [% IF ( modify ) %][% bibliotitle |html %] &rsaquo; Modify subscription[% ELSE %]New subscription[% END %]</title>
+<title>Koha &rsaquo; Serials &rsaquo; [% IF ( modify ) %][% bibliotitle | html %] &rsaquo; Modify subscription[% ELSE %]New subscription[% END %]</title>
 [% INCLUDE 'doc-head-close.inc' %]
-[% INCLUDE 'calendar.inc' %]
-<style type="text/css">
+<style>
 fieldset.rows li.radio { width: 100%; } /* override staff-global.css */
-.yui-u li p label.widelabel {
-    width: 300px;  /* not enough for IE7 apparently */
-}
 </style>
-<script type="text/javascript">
-//<![CDATA[
-
-var globalnumpatterndata;
-var globalfreqdata;
-var advancedpatternlocked;
-var patternneedtobetested = 0;
-
-function check_issues(){
-    if (globalfreqdata.unit.length >0) {
-        if (document.f.subtype.value == globalfreqdata.unit){
-            document.f.issuelengthcount.value=(document.f.sublength.value*globalfreqdata.issuesperunit)/globalfreqdata.unitsperissue;
-        } else if (document.f.subtype.value != "issues"){
-            alert(_("Frequency and subscription length provided doesn't combine well. Please consider entering an issue count rather than a time period."));
-        }
-    }
-}
-
-function addbiblioPopup(biblionumber) {
-    var destination = "/cgi-bin/koha/cataloguing/addbiblio.pl?mode=popup";
-    if(biblionumber){
-        destination += "&biblionumber="+biblionumber;
-    }
-    window.open(destination,'AddBiblioPopup','width=1024,height=768,toolbar=no,scrollbars=yes');
-}
-
-function Plugin(f)
-{
-    window.open('subscription-bib-search.pl','FindABibIndex','width=800,height=400,toolbar=no,scrollbars=yes');
-}
-
-function FindAcqui(f)
-{
-    window.open('acqui-search.pl','FindASupplier','width=800,height=400,toolbar=no,scrollbars=yes');
-}
-
-function Find_ISSN(f)
-{
-    window.open('issn-search.pl','FindABibIndex','width=800,height=400,toolbar=no,scrollbars=yes');
-}
-
-function Clear(id) {
-    $("#"+id).val('');
-}
-
-function Check_page1() {
-    if ( $("#aqbooksellerid").val().length == 0) {
-        input_box = confirm(_("If you wish to claim late or missing issues you must link this subscription to a vendor. Click OK to ignore or Cancel to return and enter a vendor"));
-        if (input_box==false) {
-            return false;
-        }
-    }
-    if ($("#biblionumber").val().length == 0) {
-        alert(_("You must choose or create a biblio"));
-        return false;
-    }
-
-    return true;
-}
-
-function Check_page2(){
-    [% UNLESS (more_than_one_serial) %]
-      if($("#acqui_date").val().length == 0){
-          alert(_("You must choose a first publication date"));
-          return false;
-      }
-    [% END %]
-    if($("#frequency").val().length == 0){
-        alert(_("You must choose a frequency"));
-        return false;
-    }
-    if($("input[name='startdate']").val().length == 0){
-        alert(_("You must choose a start date"));
-        return false;
-    }
-    if($("#sublength").val().length == 0 && $("input[name='enddate']").val().length == 0){
-        alert(_("You must choose a subscription length or an end date."));
-        return false;
-    }
-    if($("#numberpattern").val().length == 0){
-        alert(_("You must choose a numbering pattern"));
-        return false;
-    }
-    if(advancedpatternlocked == 0){
-        alert(_("You have modified the advanced prediction pattern. Please save your work or cancel modifications."));
-        return false;
-    }
-    if(patternneedtobetested){
-        alert(_("Please click on 'Test prediction pattern' before saving subscription."));
-        return false;
-    }
-
-    return true;
-}
-
-function frequencyload(){
-    $.getJSON("subscription-frequency.pl",{"frequency_id":document.f.frequency.value,ajax:'true'},
-        function(freqdata){
-            globalfreqdata=freqdata;
-            if ( globalfreqdata.unit.length == 0 ) {
-                var option = $("#subtype option[value='issues']");
-                $(option).attr('selected', 'selected');
-                $("#subtype option[value!='issues']").attr('disabled', 'disabled')
-            } else {
-                $("#subtype option").attr('disabled', false)
-            }
-        }
-    )
-}
-
-function numberpatternload(){
-    $.getJSON("subscription-numberpattern.pl",{"numberpattern_id":document.f.numbering_pattern.value,ajax:'true'},
-        function(numpatterndata){
-            globalnumpatterndata=numpatterndata;
-            if (globalnumpatterndata==undefined){
-                return false;
-            }
-            displaymoreoptions();
-            restoreAdvancedPattern();
-        }
-    );
-}
-
-function displaymoreoptions() {
-    if(globalnumpatterndata == undefined){
-        $("#moreoptionst").hide();
-        return false;
-    }
-
-    var X = 0, Y = 0, Z = 0;
-    var numberingmethod = unescape(globalnumpatterndata.numberingmethod);
-    if(numberingmethod.match(/{X}/)) X = 1;
-    if(numberingmethod.match(/{Y}/)) Y = 1;
-    if(numberingmethod.match(/{Z}/)) Z = 1;
-
-    if(X || Y || Z) {
-        $("#moreoptionst").show();
-    } else {
-        $("#moreoptionst").hide();
-    }
-
-    if(X) {
-        if(globalnumpatterndata.label1) {
-            $("#headerX").html(unescape(globalnumpatterndata.label1));
-        } else {
-            $("#headerX").html("X");
-        }
-        $("#headerX").show();
-        $("#beginsX").show();
-        $("#innerX").show();
-    } else {
-        $("#headerX").hide();
-        $("#beginsX").hide();
-        $("#innerX").hide();
-        $("#lastvaluetemp1").val('');
-        $("#innerlooptemp1").val('');
-    }
-    if(Y) {
-        if(globalnumpatterndata.label2) {
-            $("#headerY").html(unescape(globalnumpatterndata.label2));
-        } else {
-            $("#headerY").html("Y");
-        }
-        $("#headerY").show();
-        $("#beginsY").show();
-        $("#innerY").show();
-    } else {
-        $("#headerY").hide();
-        $("#beginsY").hide();
-        $("#innerY").hide();
-        $("#lastvaluetemp2").val('');
-        $("#innerlooptemp2").val('');
-    }
-    if(Z) {
-        if(globalnumpatterndata.label3) {
-            $("#headerZ").html(unescape(globalnumpatterndata.label3));
-        } else {
-            $("#headerZ").html("Z");
-        }
-        $("#headerZ").show();
-        $("#beginsZ").show();
-        $("#innerZ").show();
-    } else {
-        $("#headerZ").hide();
-        $("#beginsZ").hide();
-        $("#innerZ").hide();
-        $("#lastvaluetemp3").val('');
-        $("#innerlooptemp3").val('');
-    }
-}
-
-function toggleAdvancedPattern() {
-    $("#advancedpredictionpattern").toggle();
-}
-
-function modifyAdvancedPattern() {
-    $("#patternname").attr("readonly", false).val('');
-    $("#numberingmethod").attr("readonly", false);
-
-    $("#advancedpredictionpatternt input").each(function() {
-        $(this).attr("readonly", false);
-    });
-    $("#advancedpredictionpatternt select").each(function() {
-        $(this).attr("disabled", false);
-    });
-
-    $("#restoreadvancedpatternbutton").show();
-    $("#saveadvancedpatternbutton").show();
-    $("#modifyadvancedpatternbutton").hide();
-
-    advancedpatternlocked = 0;
-}
-
-function restoreAdvancedPattern() {
-    $("#patternname").attr("readonly", true).val(unescape(globalnumpatterndata.label));
-    $("#numberingmethod").attr("readonly", true).val(unescape(globalnumpatterndata.numberingmethod));
-
-    $("#advancedpredictionpatternt input").each(function() {
-        $(this).attr("readonly", true);
-        var id = $(this).attr('id');
-        if(id.match(/lastvalue/) || id.match(/innerloop/)) {
-            var tempid = id.replace(/(\d)/, "temp$1");
-            $(this).val($("#"+tempid).val());
-        } else {
-            $(this).val(unescape(globalnumpatterndata[id]));
-        }
-    });
-    $("#advancedpredictionpatternt select").each(function() {
-        $(this).attr("disabled", true);
-        var id = $(this).attr('id');
-        $(this).val(unescape(globalnumpatterndata[id]));
-    });
-
-    $("#restoreadvancedpatternbutton").hide();
-    $("#saveadvancedpatternbutton").hide();
-    $("#modifyadvancedpatternbutton").show();
-
-    advancedpatternlocked = 1;
-}
-
-function testPredictionPattern() {
-    var frequencyid = $("#frequency").val();
-    var acquidate;
-    var error = 0;
-    var error_msg = "";
-    if(frequencyid == undefined || frequencyid == ""){
-        error_msg += _("- Frequency is not defined") + "\n";
-        error ++;
-    }
-    acquidate = $("#acqui_date").val();
-    if(acquidate == undefined || acquidate == ""){
-        error_msg += _("- First publication date is not defined") + "\n";
-        error ++;
-    }
-    [% IF (more_than_one_serial) %]
-      var nextacquidate = $("#nextacquidate").val();
-      if(nextacquidate == undefined || nextacquidate == ""){
-        error_msg += _("- Next issue publication date is not defined") + "\n";
-        error ++;
-      }
-    [% END %]
-
-    if(error){
-        alert(_("Cannot test prediction pattern for the following reason(s):") + "\n\n"
-            + error_msg);
-        return false;
-    }
-
-    var custompattern = 0;
-    if(advancedpatternlocked == 0) {
-        custompattern = 1;
-    }
-
-    var ajaxData = {
-        'custompattern': custompattern,
-        [% IF (subscriptionid) %]
-            'subscriptionid': [% subscriptionid %],
-        [% END %]
-        [% IF (more_than_one_serial) %]
-          'nextacquidate': nextacquidate,
-        [% END %]
-        'firstacquidate': acquidate
-    };
-    var ajaxParams = [
-        'to', 'subtype', 'sublength', 'frequency', 'numberingmethod',
-        'lastvalue1', 'lastvalue2', 'lastvalue3', 'add1', 'add2', 'add3',
-        'every1', 'every2', 'every3', 'innerloop1', 'innerloop2', 'innerloop3',
-        'setto1', 'setto2', 'setto3', 'numbering1', 'numbering2', 'numbering3',
-        'whenmorethan1', 'whenmorethan2', 'whenmorethan3', 'locale'
-    ];
-    for(i in ajaxParams) {
-        var param = ajaxParams[i];
-        var value = $("#"+param).val();
-        if(value.length > 0)
-            ajaxData[param] = value;
-    }
-
-    $.ajax({
-        url:"/cgi-bin/koha/serials/showpredictionpattern.pl",
-        data: ajaxData,
-        success: function(data) {
-            $("#displayexample").html(data);
-            patternneedtobetested = 0;
-        }
-    });
-}
-
-function saveAdvancedPattern() {
-    if ($("#patternname").val().length == 0) {
-        alert(_("Please enter a name for this pattern"));
-        return false;
-    }
-
-    // Check if patternname already exists, and modify pattern
-    // instead of creating it if so
-    var found = 0;
-    $("#numberpattern option").each(function(){
-        if($(this).text() == $("#patternname").val()){
-            found = 1;
-            return false;
-        }
-    });
-    var cnfrm = 1;
-    if(found){
-        var msg = _("This pattern name already exists. Do you want to modify it?")
-            + "\n" + _("Warning: it will modify the pattern for all subscriptions")
-            + _("that are using it.");
-        cnfrm = confirm(msg);
-    }
-
-    if(cnfrm) {
-        var ajaxData = {};
-        var ajaxParams = [
-            'patternname', 'numberingmethod', 'label1', 'label2', 'label3',
-            'add1', 'add2', 'add3', 'every1', 'every2', 'every3',
-            'setto1', 'setto2', 'setto3', 'numbering1', 'numbering2', 'numbering3',
-            'whenmorethan1', 'whenmorethan2', 'whenmorethan3', 'locale'
-        ];
-        for(i in ajaxParams) {
-            var param = ajaxParams[i];
-            var value = $("#"+param).val();
-            if(value.length > 0)
-                ajaxData[param] = value;
-        }
-
-        $.getJSON(
-            "/cgi-bin/koha/serials/create-numberpattern.pl",
-            ajaxData,
-            function(data){
-                if (data.numberpatternid) {
-                    if(found == 0){
-                        $("#numberpattern").append("<option value=\""+data.numberpatternid+"\">"+$("#patternname").val()+"</option>");
-                    }
-                    $("#numberpattern").val(data.numberpatternid);
-                    numberpatternload();
-                } else {
-                    alert(_("Something went wrong. Unable to create a new numbering pattern."));
-                }
-            }
-        );
-    }
-}
-
-function show_page_1() {
-    $("#page_1").show();
-    $("#page_2").hide();
-    $("#page_number").text("1/2");
-}
-
-function show_page_2() {
-    $("#page_1").hide();
-    $("#page_2").show();
-    $("#page_number").text("2/2");
-    displaymoreoptions();
-}
-
-
-$(document).ready(function() {
-    $("select#frequency").change(function(){
-        patternneedtobetested = 1;
-        $("input[name='enddate']").val('');
-        frequencyload();
-    });
-    $("select#numberpattern").change(function(){
-        patternneedtobetested = 1;
-        numberpatternload();
-    });
-    $("#subtype").change(function(){
-        $("input[name='enddate']").val('');
-    });
-    $("#sublength").change(function(){
-        $("input[name='enddate']").val('');
-    });
-    $("#lastvaluetemp1").keyup(function(){
-        $("#lastvalue1").val($(this).val());
-    });
-    $("#lastvaluetemp2").keyup(function(){
-        $("#lastvalue2").val($(this).val());
-    });
-    $("#lastvaluetemp3").keyup(function(){
-        $("#lastvalue3").val($(this).val());
-    });
-    $("#lastvalue1").keyup(function(){
-        $("#lastvaluetemp1").val($(this).val());
-    });
-    $("#lastvalue2").keyup(function(){
-        $("#lastvaluetemp2").val($(this).val());
-    });
-    $("#lastvalue3").keyup(function(){
-        $("#lastvaluetemp3").val($(this).val());
-    });
-
-    $("#innerlooptemp1").keyup(function(){
-        $("#innerloop1").val($(this).val());
-    });
-    $("#innerlooptemp2").keyup(function(){
-        $("#innerloop2").val($(this).val());
-    });
-    $("#innerlooptemp3").keyup(function(){
-        $("#innerloop3").val($(this).val());
-    });
-    $("#innerloop1").keyup(function(){
-        $("#innerlooptemp1").val($(this).val());
-    });
-    $("#innerloop2").keyup(function(){
-        $("#innerlooptemp2").val($(this).val());
-    });
-    $("#innerloop3").keyup(function(){
-        $("#innerlooptemp3").val($(this).val());
-    });
-
-    if($("#frequency").val() != ""){
-        frequencyload();
-    }
-    if($("#numberpattern").val() != ""){
-        numberpatternload();
-    }
-
-    var node;
-    [% FOREACH field IN dont_export_field_loop %]
-        node = $("#[% field.fieldid %]");
-        if ( $(node).is('input') || $(node).is('textarea') ) {
-            $(node).val("");
-        } else if ( $(node).is('select') ) {
-            $(node).find("option:first").attr('selected','selected');
-        }
-    [% END %]
-
-    show_page_1();
-});
-//]]>
-</script>
 </head>
+
 <body id="ser_subscription-add" class="ser">
 [% INCLUDE 'header.inc' %]
 [% INCLUDE 'serials-search.inc' %]
 
-<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/serials/serials-home.pl">Serials</a> &rsaquo; [% IF ( modify ) %]<a href="/cgi-bin/koha/serials/subscription-detail.pl?subscriptionid=[% subscriptionid %]"><i>[% bibliotitle |html %]</i></a> &rsaquo; Modify subscription[% ELSE %]New subscription[% END %]</div>
+<div id="breadcrumbs">
+    <a href="/cgi-bin/koha/mainpage.pl">Home</a>
+    &rsaquo; <a href="/cgi-bin/koha/serials/serials-home.pl">Serials</a>
+    [% UNLESS blocking_error %]
+        &rsaquo; [% IF ( modify ) %]<a href="/cgi-bin/koha/serials/subscription-detail.pl?subscriptionid=[% subscriptionid | uri %]"><i>[% bibliotitle | html %]</i></a> &rsaquo; Modify subscription[% ELSE %]New subscription[% END %]
+    [% END %]
+</div>
+[% INCLUDE 'blocking_errors.inc' %]
+
+<div class="main container-fluid">
+    <div class="row">
 
-<div id="doc3" class="yui-t7">
-    <div id="bd">
-        <div class="yui-g">
-            <h1>[% IF ( modify ) %] Modify subscription for <i>[% bibliotitle |html %]</i>[% ELSE %]Add a new subscription[% END %] (<span id="page_number">1/2</span>)</h1>
-            <form method="post" name="f" action="/cgi-bin/koha/serials/subscription-add.pl">
+            <h1>[% IF ( modify ) %] Modify subscription for <i>[% bibliotitle | html %]</i>[% ELSE %]Add a new subscription[% END %] (<span id="page_number">1/2</span>)</h1>
+            <form method="post" id="subscription_add_form" name="f" action="/cgi-bin/koha/serials/subscription-add.pl" class="validated">
                 [% IF ( modify ) %]
                     <input type="hidden" name="op" value="modsubscription" />
-                    <input type="hidden" name="subscriptionid" value="[% subscriptionid %]" />
+                    <input type="hidden" name="subscriptionid" value="[% subscriptionid | html %]" />
                 [% ELSE %]
                         <input type="hidden" name="op" value="addsubscription" />
                 [% END %]
-                <input type="hidden" name="user" value="[% loggedinusername %]" />
+                <input type="hidden" name="user" value="[% logged_in_user.userid | html %]" />
                 <input type="hidden" name="irreg_check" value="0" />
 
                 <div id="page_1">
-                    <div class="yui-u first">
+                    <div class="col-md-6">
                         <fieldset id="subscription_add_information" class="rows">
                             <legend>Subscription details</legend>
                             <ol>
                                 [% IF ( subscriptionid ) %]
-                                    <li><span class="label">Subscription #</span> [% subscriptionid %]</li>
+                                    <li><span class="label">Subscription #</span> [% subscriptionid | html %]</li>
                                 [% END %]
                                 <li>
                                     <label for="aqbooksellerid">Vendor: </label>
-                                    <input type="text" name="aqbooksellerid" id="aqbooksellerid" value="[% aqbooksellerid %]" size="8" /> (<input type="text" name="aqbooksellername" value="[% aqbooksellername %]" disabled="disabled" readonly="readonly" />) <a href="#" onclick="FindAcqui(f)">Search for a vendor</a>
+                                    <input type="text" name="aqbooksellerid" id="aqbooksellerid" value="[% aqbooksellerid | html %]" size="8" /> (<input type="text" name="aqbooksellername" id="aqbooksellername" value="[% aqbooksellername | html %]" disabled="disabled" readonly="readonly" />) <a href="#" id="vendor_search"><i class="fa fa-search"></i> Search for a vendor</a>
                                 </li>
                                 <li>
-                                    <label for="biblionumber" class="required" title="Subscriptions must be associated with a bibliographic record">Biblio:</label>
-                                    <input type="text" name="biblionumber" id="biblionumber" value="[% bibnum %]" size="8" />
-                                    (<input type="text" name="title" value="[% bibliotitle %]" disabled="disabled" readonly="readonly" />) <span class="required" title="Subscriptions must be associated with a bibliographic record">Required</span>
-                                    <div class="inputnote"> <a href="#" onclick="Plugin(f)">Search for Biblio</a>
+                                    <label for="biblionumber" class="required" title="Subscriptions must be associated with a bibliographic record">Record:</label>
+                                    <input type="text" name="biblionumber" id="biblionumber" value="[% bibnum | html %]" size="8" />
+                                    (<input type="text" name="title" value="[% bibliotitle | html %]" disabled="disabled" readonly="readonly" />) <span class="required" title="Subscriptions must be associated with a bibliographic record">Required</span>
+                                    <div class="inputnote"> <a href="#" id="record_search"><i class="fa fa-search"></i> Search for record</a>
                                         [% IF ( CAN_user_editcatalogue ) %]
                                             [% IF ( modify ) %]
-                                            | <a href="#" onclick="addbiblioPopup([% bibnum %]); return false;">Edit biblio</a>
+                                            | <a href="#" id="biblio_add_edit" data-biblionumber="[% bibnum | html %]"><i class="fa fa-pencil"></i> Edit record</a>
                                             [% ELSE %]
-                                            | <a href="#" onclick="addbiblioPopup(); return false;">Create Biblio</a>
+                                            | <a href="#" id="biblio_add_edit"><i class="fa fa-plus"></i> Create record</a>
                                             [% END %]
                                         [% END %]
                                     </div>
@@ -541,7 +97,7 @@ $(document).ready(function() {
                                   [% END %]
                                 </li>
                                 <li>
-                                    <label for="manualhistory">Manual history</label>
+                                    <label for="manualhistory">Manual history:</label>
                                     [% IF (manualhistory) %]
                                         <input type="checkbox" id="manualhistory" name="manualhist" checked="checked" />
                                     [% ELSE %]
@@ -549,8 +105,8 @@ $(document).ready(function() {
                                     [% END %]
                                 </li>
                                 <li>
-                                    <label for="callnumber">Call number</label>
-                                    <input type="text" name="callnumber" id="callnumber" value="[% callnumber %]" size="20" />
+                                    <label for="callnumber">Call number:</label>
+                                    <input type="text" name="callnumber" id="callnumber" value="[% callnumber | html %]" size="20" />
                                 </li>
                                 <li>
                                     <label for="branchcode">Library:</label>
@@ -558,22 +114,20 @@ $(document).ready(function() {
                                         [% UNLESS ( Independentbranches ) %]
                                             <option value="">None</option>
                                         [% END %]
-                                        [% FOREACH branchloo IN branchloop %]
-                                            [% IF ( branchloo.selected ) %]
-                                                <option value="[% branchloo.value %]" selected="selected">[% branchloo.branchname %]</option>
-                                            [% ELSE %]
-                                                <option value="[% branchloo.value %]">[% branchloo.branchname %]</option>
-                                            [% END %]
+                                        [% IF CAN_user_serials_superserials %]
+                                            [% PROCESS options_for_libraries libraries => Branches.all( selected => branchcode, unfiltered => 1 ) %]
+                                        [% ELSE %]
+                                            [% PROCESS options_for_libraries libraries => Branches.all( selected => branchcode ) %]
                                         [% END %]
                                     </select> (select a library)
                                 </li>
                                 <li>
                                     <label for="notes">Public note:</label>
-                                    <textarea name="notes" id="notes" cols="30" rows="2">[% notes %]</textarea>
+                                    <textarea name="notes" id="notes" cols="30" rows="2">[% notes | html %]</textarea>
                                 </li>
                                 <li>
                                     <label for="internalnotes">Nonpublic note:</label>
-                                    <textarea name="internalnotes" id="internalnotes" cols="30" rows="2">[% internalnotes %]</textarea>
+                                    <textarea name="internalnotes" id="internalnotes" cols="30" rows="2">[% internalnotes | html %]</textarea>
                                 </li>
                                 <li>
                                     [% IF ( letterloop ) %]
@@ -582,9 +136,9 @@ $(document).ready(function() {
                                             <option value="">None</option>
                                             [% FOREACH letterloo IN letterloop %]
                                                 [% IF ( letterloo.selected ) %]
-                                                    <option value="[% letterloo.value %]" selected="selected">[% letterloo.lettername %]</option>
+                                                    <option value="[% letterloo.value | html %]" selected="selected">[% letterloo.lettername | html %]</option>
                                                 [% ELSE %]
-                                                    <option value="[% letterloo.value %]">[% letterloo.lettername %]</option>
+                                                    <option value="[% letterloo.value | html %]">[% letterloo.lettername | html %]</option>
                                                 [% END %]
                                             [% END %]
                                         </select>
@@ -599,44 +153,80 @@ $(document).ready(function() {
                                     <select name="location" id="location">
                                         <option value="">None</option>
                                         [% FOREACH locations_loo IN locations_loop %]
-                                            [% IF ( locations_loo.selected ) %]
-                                                <option value="[% locations_loo.authorised_value %]" selected="selected">[% locations_loo.lib %]</option>
+                                            [% IF locations_loo.authorised_value == location %]
+                                                <option value="[% locations_loo.authorised_value | html %]" selected="selected">[% locations_loo.lib | html %]</option>
+                                            [% ELSE %]
+                                                <option value="[% locations_loo.authorised_value | html %]">[% locations_loo.lib | html %]</option>
+                                            [% END %]
+                                        [% END %]
+                                    </select>
+                                </li>
+                                <li>
+                                    <label for="itemtype">Item type:</label>
+                                    <select name="itemtype" id="itemtype">
+                                        <option value=""></option>
+                                        [% FOREACH type IN typeloop %]
+                                            [% IF ( type.selected ) %]
+                                                <option value="[% type.code | html %]" selected="selected">[% type.value | html %]</option>
                                             [% ELSE %]
-                                                <option value="[% locations_loo.authorised_value %]">[% locations_loo.lib %]</option>
+                                                <option value="[% type.code | html %]">[% type.value | html %]</option>
                                             [% END %]
                                         [% END %]
                                     </select>
                                 </li>
+                                [%IF makePreviousSerialAvailable %]
                                 <li>
+                                    <label for="previousitemtype">item type for older issues:</label>
+                                    <select name="previousitemtype" id="previousitemtype">
+                                            <option value=""></option>
+                                        [% FOREACH previous IN previoustypeloop %]
+                                            [% IF ( previous.selected ) %]
+                                                <option value="[% previous.code | html %]" selected="selected">[% previous.value | html %]</option>
+                                            [% ELSE %]
+                                                <option value="[% previous.code | html %]">[% previous.value | html %]</option>
+                                            [% END %]
+                                        [% END %]
+                                    </select>
+                                </li>
+                                [% END %]
+                                    <li>
                                     <label for="graceperiod">Grace period:</label>
-                                    <input type="text" name="graceperiod" id="graceperiod" value="[% graceperiod %]" size="5"/> day(s)
+                                    <input type="text" name="graceperiod" id="graceperiod" value="[% graceperiod | html %]" size="5"/> day(s)
                                 </li>
                                 <li>
                                      <label class="widelabel" for="staffdisplaycount">Number of issues to display to staff: </label>
-                                     <input type="text" name="staffdisplaycount" id="staffdisplaycount" value="[% staffdisplaycount %]" size="4"/>
+                                     <input type="text" name="staffdisplaycount" id="staffdisplaycount" value="[% staffdisplaycount | html %]" size="4"/>
                                  </li>
                                  <li>
                                     <label class="widelabel" for="opacdisplaycount">Number of issues to display to the public: </label>
-                                    <input type="text" name="opacdisplaycount" id="opacdisplaycount" value="[% opacdisplaycount %]" size="4"/>
+                                    <input type="text" name="opacdisplaycount" id="opacdisplaycount" value="[% opacdisplaycount | html %]" size="4"/>
                                 </li>
                             </ol>
                         </fieldset>
                         <fieldset class="action">
-                            <input type="button" value="Next >>" onclick="if ( Check_page1() ) show_page_2();" style="float:right;" />
+                            <input type="button" value="Next &gt;&gt;" id="subscription_add_next" style="float:right;" />
                         </fieldset>
                     </div>
                 </div>
 
                 <div id="page_2">
-                    <div class="yui-u first">
+                    <div class="col-md-6">
+                [% IF ( Koha.Preference('Mana') == 1) && !mana_url %]
+                    <fieldset>
+                        <p><center>The Mana Knowledge Base can be used to import subscription patterns submitted by other libraries and save you extra work. Ask your system administrator to configure this service and complete the configuration, or remove this message by disabling the system preference
+                        <a href=/cgi-bin/koha/admin/preferences.pl?tab=&op=search&searchfield=request+to+mana+webservice>here</a></center></p>
+                    </fieldset>
+                [% END %]
+                        <div hidden id="mana_search" class="dialog message">
+                        </div>
                         <div id="subscription_form_planning">
                             <fieldset class="rows">
                                 <legend>Serials planning</legend>
                                 <ol>
                                     <li>
-                                        <label for="firstacquidate">First issue publication date: (*)</label>
+                                        <label for="acqui_date" class="required">First issue publication date:</label>
                                         [% UNLESS (more_than_one_serial) %]
-                                          <input type="text" size="10" id="acqui_date" name="firstacquidate" value="[% firstacquidate | $KohaDates %]" class="datepicker" readonly="readonly"/>
+                                          <input type="text" size="10" id="acqui_date" name="firstacquidate" value="[% firstacquidate | $KohaDates %]" class="datepicker required" required="required" />
                                         [% ELSE %]
                                           [% firstacquidate | $KohaDates %]
                                           <input type="hidden" size="10" id="acqui_date" name="firstacquidate" value="[% firstacquidate | $KohaDates %]"/>
@@ -645,20 +235,20 @@ $(document).ready(function() {
                                     [% IF (more_than_one_serial) %]
                                       <li>
                                         <label for="nextacquidate">Next issue publication date:</label>
-                                        <input type="text" size="10" id="nextacquidate" name="nextacquidate" value="[% nextacquidate | $KohaDates %]" class="datepicker" readonly="readonly"/>
+                                        <input type="text" size="10" id="nextacquidate" name="nextacquidate" value="[% nextacquidate | $KohaDates %]" class="datepicker" />
                                       </li>
                                     [% END %]
                                     <li>
-                                        <label for="frequency">Frequency: (*)</label>
-                                        <select name="frequency" size="1" id="frequency">
+                                        <label for="frequency" class="required">Frequency:</label>
+                                        <select name="frequency" size="1" id="frequency" class="required" required="required">
                                             <option value="">-- please choose --</option>
                                             [% FOREACH frequency IN frequencies %]
                                                 [% IF (frequency.selected) %]
-                                                    <option value="[% frequency.id %]" selected="selected">
+                                                    <option value="[% frequency.id | html %]" selected="selected">
                                                 [% ELSE %]
-                                                    <option value="[% frequency.id %]">
+                                                    <option value="[% frequency.id | html %]">
                                                 [% END %]
-                                                    [% frequency.label %]
+                                                    [% frequency.label | html %]
                                                 </option>
                                             [% END %]
                                         </select>
@@ -666,55 +256,73 @@ $(document).ready(function() {
                                     <li>
                                         <label for="subtype">Subscription length:</label>
                                         <select name="subtype" id="subtype">
-                                            [% FOREACH subt IN subtype %]
-                                                [% IF (subt.selected) %]
-                                                    <option value="[% subt.name %]" selected="selected">
-                                                [% ELSE %]
-                                                    <option value="[% subt.name %]">
+                                            [% FOREACH st IN subtypes %]
+                                                [% SWITCH st %]
+                                                    [% CASE 'numberlength' %]
+                                                        [% IF st == subtype %]
+                                                            <option value="issues" selected="selected">
+                                                        [% ELSE %]
+                                                            <option value="issues">
+                                                        [% END %]
+                                                        issues
+                                                    [% CASE 'weeklength' %]
+                                                        [% IF st == subtype %]
+                                                            <option value="weeks" selected="selected">
+                                                        [% ELSE %]
+                                                            <option value="weeks">
+                                                        [% END %]
+                                                        weeks
+                                                    [% CASE 'monthlength' %]
+                                                        [% IF st == subtype %]
+                                                            <option value="months" selected="selected">
+                                                        [% ELSE %]
+                                                            <option value="months">
+                                                        [% END %]
+                                                        months
+                                                    [% CASE %][% st | html %]
                                                 [% END %]
-                                                    [% subt.name %]
                                                 </option>
                                             [% END %]
                                         </select>
-                                        <input type="text" name="sublength" id="sublength" value="[% sublength %]" size="3" /> (enter amount in numerals)
+                                        <input type="text" name="sublength" id="sublength" value="[% sublength | html %]" size="3" /> (enter amount in numerals)
                                         <input type="hidden" name="issuelengthcount">
                                     </li>
                                     <li>
-                                        <label for="startdate"> Subscription start date: (*)</label>
-                                        <input type="text" size="10" id="from" name="startdate" value="[% startdate | $KohaDates %]" class="datepickerfrom" readonly="readonly"/>
+                                        <label for="from" class="required"> Subscription start date:</label>
+                                        <input type="text" size="10" id="from" name="startdate" value="[% startdate | $KohaDates %]" class="datepickerfrom required" required="required" />
                                     </li>
                                     <li>
-                                        <label for="enddate">Subscription end date:</label>
-                                        <input type="text" size="10" id="to" name="enddate" value="[% enddate | $KohaDates %]" class="datepickerto" readonly="readonly"/>
+                                        <label for="to">Subscription end date:</label>
+                                        <input type="text" size="10" id="to" name="enddate" value="[% enddate | $KohaDates %]" class="datepickerto" />
                                     </li>
                                     <li>
-                                        <label for="numberpattern">Numbering pattern:</label>
-                                        <select name="numbering_pattern" size="1" id="numberpattern">
+                                        <label for="numberpattern" class="required">Numbering pattern:</label>
+                                        <select name="numbering_pattern" size="1" id="numberpattern" class="required" required="required">
                                             <option value="">-- please choose --</option>
                                             [% FOREACH numberpattern IN numberpatterns %]
                                                 [% IF (numberpattern.selected) %]
-                                                    <option value="[% numberpattern.id %]" selected="selected">
+                                                    <option value="[% numberpattern.id | html %]" selected="selected">
                                                 [% ELSE %]
-                                                    <option value="[% numberpattern.id %]">
+                                                    <option value="[% numberpattern.id | html %]">
                                                 [% END %]
-                                                    [% numberpattern.label %]
+                                                    [% numberpattern.label | html %]
                                                 </option>
                                             [% END %]
                                         </select>
                                     </li>
                                     <li>
-                                        <label for="locale">Locale</label>
+                                        <label for="locale">Locale:</label>
                                         <select id="locale" name="locale">
                                             <option value=""></option>
                                             [% FOREACH l IN locales %]
-                                                [% IF l == locale %]
-                                                    <option value="[% l %]" selected="selected">[% l %]</option>
+                                                [% IF l.language == locale %]
+                                                    <option value="[% l.language | html %]" selected="selected">[% l.description | html %]</option>
                                                 [% ELSE %]
-                                                    <option value="[% l %]">[% l %]</option>
+                                                    <option value="[% l.language | html %]">[% l.description | html %]</option>
                                                 [% END %]
                                             [% END %]
                                         </select>
-                                        <span class="hint">If empty, system locale is used</span>
+                                        <span class="hint">If empty, English is used</span>
                                     </li>
                                     <li id="more_options">
                                         <table id="moreoptionst">
@@ -735,33 +343,36 @@ $(document).ready(function() {
                                                         Begins with
                                                       [% END %]
                                                     </td>
-                                                    <td id="beginsX"><input type="text" id="lastvaluetemp1" name="lastvaluetemp1" value="[% lastvalue1 %]" /></td>
-                                                    <td id="beginsY"><input type="text" id="lastvaluetemp2" name="lastvaluetemp2" value="[% lastvalue2 %]" /></td>
-                                                    <td id="beginsZ"><input type="text" id="lastvaluetemp3" name="lastvaluetemp3" value="[% lastvalue3 %]" /></td>
+                                                    <td id="beginsX"><input type="text" id="lastvaluetemp1" name="lastvaluetemp1" value="[% lastvalue1 | html %]" /></td>
+                                                    <td id="beginsY"><input type="text" id="lastvaluetemp2" name="lastvaluetemp2" value="[% lastvalue2 | html %]" /></td>
+                                                    <td id="beginsZ"><input type="text" id="lastvaluetemp3" name="lastvaluetemp3" value="[% lastvalue3 | html %]" /></td>
                                                 </tr>
                                                 <tr>
                                                     <td>Inner counter</td>
-                                                    <td id="innerX"><input type="text" id="innerlooptemp1" name="innerlooptemp1" value="[% innerloop1 %]" /></td>
-                                                    <td id="innerY"><input type="text" id="innerlooptemp2" name="innerlooptemp2" value="[% innerloop2 %]" /></td>
-                                                    <td id="innerZ"><input type="text" id="innerlooptemp3" name="innerlooptemp3" value="[% innerloop3 %]" /></td>
+                                                    <td id="innerX"><input type="text" id="innerlooptemp1" name="innerlooptemp1" value="[% innerloop1 | html %]" /></td>
+                                                    <td id="innerY"><input type="text" id="innerlooptemp2" name="innerlooptemp2" value="[% innerloop2 | html %]" /></td>
+                                                    <td id="innerZ"><input type="text" id="innerlooptemp3" name="innerlooptemp3" value="[% innerloop3 | html %]" /></td>
                                                 </tr>
                                             </tbody>
                                         </table>
                                     </li>
-                                    <li><a style="cursor:pointer" onclick="toggleAdvancedPattern();">Show/Hide advanced pattern</a></li>
+                                    <li>
+                                        <a href="#" class="toggle_advanced_pattern show_advanced_pattern"><i class="fa fa-plus-square"></i> Show advanced pattern</a>
+                                        <a href="#" style="display:none;" class="toggle_advanced_pattern hide_advanced_pattern"><i class="fa fa-minus-square"></i> Hide advanced pattern</a>
+                                    </li>
                                     <div id="advancedpredictionpattern" style="display:none">
                                       <li>
-                                        <label for="patternname">Pattern name: (*)</label>
-                                        <input id="patternname" name="patternname" type="text" readonly="readonly" />
+                                        <label for="patternname" class="required">Pattern name:</label>
+                                        <input id="patternname" name="patternname" type="text" readonly="readonly" class="required" required="required" />
                                       </li>
                                       <li>
                                         <label for="numberingmethod">Numbering formula:</label>
-                                        <input readonly="readonly" type="text" name="numberingmethod" id="numberingmethod" size="50" value="[% numberingmethod %]" />
+                                        <input readonly="readonly" type="text" name="numberingmethod" id="numberingmethod" size="50" value="[% numberingmethod | html %]" />
                                       </li>
                                         <table id="advancedpredictionpatternt">
                                             <thead>
                                                 <tr>
-                                                    <th colspan="4">Advanced prediction pattern</td>
+                                                    <th colspan="4">Advanced prediction pattern</th>
                                                 </tr>
                                                 <tr>
                                                     <th>&nbsp;</th>
@@ -815,11 +426,14 @@ $(document).ready(function() {
                                                 </tr>
                                                 <tr>
                                                     [% BLOCK numbering_select %]
-                                                        <select disabled="disabled" id="[% name %]" name="[% name %]" />
+                                                        <select disabled="disabled" id="[% name | html %]" name="[% name | html %]">
                                                             <option value=""></option>
                                                             <option value="dayname">Name of day</option>
+                                                            <option value="dayabrv">Name of day (abbreviated)</option>
                                                             <option value="monthname">Name of month</option>
+                                                            <option value="monthabrv">Name of month (abbreviated)</option>
                                                             <option value="season">Name of season</option>
+                                                            <option value="seasonabrv">Name of season (abbreviated)</option>
                                                         </select>
                                                     [% END %]
                                                     <td>Formatting</td>
@@ -829,26 +443,79 @@ $(document).ready(function() {
                                                 </tr>
                                             </tbody>
                                         </table>
-                                        <input id="modifyadvancedpatternbutton" type="button" value="Modify pattern" onclick="modifyAdvancedPattern();" />
-                                        <input id="restoreadvancedpatternbutton" type="button" value="Cancel modifications" onclick="restoreAdvancedPattern();" style="display:none" />
-                                        <input id="saveadvancedpatternbutton" type="button" value="Save as new pattern" onclick="saveAdvancedPattern();" style="display:none" />
+                                        <input id="modifyadvancedpatternbutton" type="button" value="Modify pattern" />
+                                        <input id="restoreadvancedpatternbutton" type="button" value="Cancel modifications" style="display:none" />
+                                        <input id="saveadvancedpatternbutton" type="button" value="Save as new pattern" style="display:none" />
                                     </div>
                                 </ol>
                             </fieldset>
+
+                            [% IF additional_fields_for_subscription %]
+                                <div id="subscription_additional_fields">
+                                    [% INCLUDE 'additional-fields-entry.inc' available=additional_fields_for_subscription values=additional_fields %]
+                                </div>
+                            [% END %]
+
+                            <input type="hidden" id="mana_id"  name="mana_id" value=""/>
+                            <input type="hidden" id="sndescription"  name="sndescription" value=""/>
+                            <input type="hidden" id="sfdescription"  name="sfdescription" value=""/>
+                            <input type="hidden" id="unit"  name="unit" value=""/>
+                            <input type="hidden" id="unitsperissue"  name="unitsperissue" value=""/>
+                            <input type="hidden" id="issuesperunit"  name="issuesperunit" value=""/>
                             <fieldset class="action">
-                                <input type="button" value="<< Previous" onclick="show_page_1();" style="float:left;"/>
-                                <input id="testpatternbutton" type="button" value="Test prediction pattern" onclick="testPredictionPattern();" />
-                                <input type="button" value="Save subscription" onclick="if (Check_page2()) submit();" style="float:right;" accesskey="w" />
+                                <input type="button" id="subscription_add_previous" value="&lt;&lt; Previous" style="float:left;"/>
+                                <input id="testpatternbutton" type="button" value="Test prediction pattern" />
+                                <input id="save-subscription" type="submit" value="Save subscription" style="float:right;" accesskey="w"/>
                             </fieldset>
                         </div>
                     </div>
-                    <div class="yui-u">
+                    <div class="col-md-6">
                         <li id="displayexample"></li>
                     </div>
                 </div>
             </form>
         </div>
-    </div>
-</div>
+        <div id="mana_search_result" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mana_search_result_label" style="width: 100%; left:0%; margin-left: auto; display: none;">
+            <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="mana_search_result_label"></h3>
+                    </div>
+                    <div class="modal-body">
+            </div>
+        </div>
+
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'calendar.inc' %]
+    [% INCLUDE 'datatables.inc' %]
+    <script>
+        var subscriptionid = "[% subscriptionid | html %]";
+        var irregularity = "[% irregularity | html %]";
+        var more_than_one_serial = "[% more_than_one_serial | html %]";
+        var tags = [];
+        [% FOREACH field IN dont_export_field_loop %]
+            tags.push("[% field.fieldid | html %]");
+        [% END %]
+        var mana_enabled = [% IF (Koha.Preference('Mana') == 1 && mana_url) %]1[% ELSE %]0[% END %];
+        var MSG_LINK_TO_VENDOR = _("If you wish to claim late or missing issues you must link this subscription to a vendor. Click OK to ignore or Cancel to return and enter a vendor");
+        var MSG_LINK_BIBLIO = _("You must choose or create a bibliographic record");
+        var MSG_REQUIRED_SUB_LENGTH = _("You must choose a subscription length or an end date.");
+        var MSG_TEST_PREDICTION = _("Please click on 'Test prediction pattern' before saving subscription.");
+        var MSG_REQUIRED_PUB_DATE = _("You must choose a first publication date");
+        var MSG = _("You have modified the advanced prediction pattern. Please save your work or cancel modifications.");
+        var MSG_PATTERN_IRREG = _("Warning! Present pattern has planned irregularities. Click on 'Test prediction pattern' to check if it's still valid")
+        var MSG_PATTERN_NAME = _("Please enter a name for this pattern");
+        var MSG_PATTERN_NAME_EXISTS = _("This pattern name already exists. Do you want to modify it?");
+        var MSG_OVERWRITE_PATTERNS = _("Warning: it will modify the pattern for all subscriptions that are using it.");
+        var MSG_PATTERN_CREATE_FAILED = _("Something went wrong. Unable to create a new numbering pattern.");
+        var MSG_PATTERN_TEST_FAILED = _("Cannot test prediction pattern for the following reason(s): %s");
+        var MSG_FREQUENCY_UNDEFINED = _("Frequency is not defined");
+        var MSG_PUB_DATE_UNDEFINED = _("First publication date is not defined");
+        var MSG_NEXT_ISSUE_UNDEFINED = _("Next issue publication date is not defined");
+    </script>
+    [% Asset.js("js/subscription-add.js") | $raw %]
+    [% Asset.js("js/showpredictionpattern.js") | $raw %]
+[% END %]
 
 [% INCLUDE 'intranet-bottom.inc' %]