Fix an unstranslatable string in JavaScript
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / modules / serials / subscription-add.tmpl
index 11e0cc6..26337f1 100644 (file)
 <!-- TMPL_INCLUDE NAME="doc-head-open.inc" -->
-<title>Koha &rsaquo; Serials</title>
+<title>Koha &rsaquo; Serials &rsaquo; <!-- TMPL_IF name="mod" --><!-- TMPL_VAR name="bibliotitle" escape="html" --> &rsaquo; Modify subscription<!-- TMPL_ELSE -->New subscription<!-- /TMPL_IF --></title>
 <!-- TMPL_INCLUDE NAME="doc-head-close.inc" -->
+<!-- TMPL_INCLUDE NAME="calendar.inc" -->
 
-<!-- TMPL_INCLUDE NAME="menus.inc" -->
-<!--TMPL_INCLUDE NAME="menu-serials.inc" -->
-
-<!-- Additions to enable Calendar system -->
-<link rel="stylesheet" type="text/css" href="<!-- TMPL_VAR name="themelang" -->/includes/calendar/calendar-system.css">
-<!-- End of additions -->
-
-<!-- Additions to enable Calendar system -->
-<script type="text/javascript" src="<!-- TMPL_VAR name="themelang" -->/includes/calendar/calendar.js"></script>
-<script type="text/javascript" src="<!-- TMPL_VAR name="themelang" -->/includes/calendar/calendar-en.js"></script>
-<script type="text/javascript" src="<!-- TMPL_VAR name="themelang" -->/includes/calendar/calendar-setup.js"></script>
-<!-- End of additions -->
-
-<script type="text/javascript" language="javascript">
-<!--
+<style type="text/css">
+fieldset.rows li.radio { width: 100%; } /* override staff-global.css */
+.yui-u li p label.widelabel {
+    width: 300px;  /* not enough for IE7 apparently */
+    /* height: 2.4em; background-color: pink; */
+}
+</style>
+<script type="text/javascript">
+//<![CDATA[
 
 // the english words used in display purposes
-var text = new Array(_('Number'),_('Volume'),_('Issue'),_('Month'),_('Week'),_('Starting with:'),_('Rollover at:'),_('Choose Hemisphere:'),_('Northern'),_('Southern'),
-_('Autumn'),_('Winter'),_('Spring'),_('Summer'),_('Fall'),_('Season'),_('Year'));
+var text = new Array(_("Number"),_("Volume"),_("Issue"),_("Month"),_("Week"),_("Starting with:"),_("Rollover at:"),_("Choose Hemisphere:"),_("Northern"),_("Southern"),
+_("Autumn"),_("Winter"),_("Spring"),_("Summer"),_("Fall"),_("Season"),_("Year"));
+var weekno_label = _("Week # ");
 var is_season = 0;
 var is_hemisphere = 1;
+var irregular_issues;   // will hold irregularity object.
+
+function formatDate(myDate) {
+    var d = new Array( myDate.getFullYear(), myDate.getMonth() + 1 ,myDate.getDate());
+    if(d[1].toString().length == 1) { d[1] = '0'+d[1] };
+    if(d[2].toString().length == 1) { d[2] = '0'+d[2] };
+    <!-- TMPL_IF NAME="dateformat_us" -->
+        return(d[1] + '/' + d[2] + '/' + d[0]) ;
+    <!-- TMPL_ELSIF NAME="dateformat_metric" -->
+        return(d[2] + '/' + d[1] + '/' + d[0]) ;
+    <!-- TMPL_ELSE -->
+        return(''+d[0] + '-' + d[1] + '-' + d[2]) ;
+    <!-- /TMPL_IF -->    
+}
+
+Date.prototype.addDays = function(days) {
+    this.setDate(this.getDate()+days);
+}
+
+function getWeeksArray(startDate,periodicity) {
+// returns an array of syspref-formatted dates starting at the first day of startDate's year.
+// This prediction method will not accurately predict irregularites beyond the first year.
+// FIXME : Should replace with ajax query to get the first Monday of the year so that week numbers have correct dates.
+    var incr=1;
+    if(periodicity==3) {  // 1/2 wks
+        incr=2;
+    } else if(periodicity == 4) { // 1/3 wks
+        incr=3;
+    }
+    var weeksArray = new Array;
+    var jan01 = new Date();
+    jan01.setDate(1);
+    jan01.setMonth(0);
+    jan01.setFullYear(startDate.getFullYear());
+    for(var i=0;i<52;i++) {
+        weeksArray[i] = formatDate(jan01) + ' ' + weekno_label + (i + 1);
+        jan01.addDays( 7 ); 
+    }
+    return weeksArray;
+}
+
+function YMDaToYWDa(S) {
+    with (new Date(Date.UTC(S[0], S[1] - 1, S[2]))) {
+        var DoW = getUTCDay();
+        setUTCDate(getUTCDate() - (DoW + 6) % 7 + 3);
+        var ms = valueOf();
+        setUTCMonth(0, 4);
+        var WN = Math.round((ms - valueOf()) / 604800000) + 1;
+        return [getUTCFullYear(), WN, DoW == 0 ? 7 : DoW];
+    }
+}
+function dayofyear(d) { // d is a Date object
+var yn = d.getFullYear();
+var mn = d.getMonth();
+var dn = d.getDate();
+var d1 = new Date(yn,0,1,12,0,0); // noon on Jan. 1
+var d2 = new Date(yn,mn,dn,12,0,0); // noon on input date
+var ddiff = Math.round((d2-d1)/864e5);
+return ddiff+1;
+}
+
+
+// create irregularity object.
+function IrregularPattern() {
+       this.months = new Array(_("January"),_("February"),_("March"),_("April"),_("May"),_("June"),_("July"),_("August"),_("September"),_("October"),_("November"),_("December"));
+       this.seasons = new Array(_("Autumn"),_("Winter"),_("Spring"),_("Summer"),_("Fall"));
+    this.daynames = new Array(_("Monday"),_("Tuesday"),_("Wednesday"),_("Thursday"),_("Friday"),_("Saturday"),_("Sunday"));
+    // create weeks irregularity selection array:
+    this.firstissue = new Date();
+    this.firstissue.setDate(1);
+    this.firstissue.setMonth(0);
+    <!-- TMPL_IF NAME='firstacquiyear' --> // it's a mod, we already have a start date.
+        this.firstissue.setFullYear( <!-- TMPL_VAR NAME="firstacquiyear" --> );
+    <!-- /TMPL_IF -->
+       this.weeks = getWeeksArray(this.firstissue); 
+
+    this.numskipped = 0;
+    // init:
+       var irregular = '<!-- TMPL_VAR NAME="irregularity" -->';
+    this.skipped = irregular.split(',');
+}
+
+IrregularPattern.prototype.update = function() {
+               this.skipped= new Array;
+               var cnt = 0;
+               // daily periodicity, we interpret irregular array as which days of week to skip.
+               // else if weekly periodicity, week numbers (starting from 01 Jan) to skip.
+        // else  irregular array is list of issues to skip
+               var summary_str = '';
+               this.numskipped = 0;
+        if(document.f.irregularity_select) {
+            //$("#irregularity_select option:selected").each(...); //jquery can combine both conditionals and the for loop
+            for( var i in document.f.irregularity_select.options ) {
+                if( document.f.irregularity_select.options[i].selected ) {
+                    this.skipped[cnt] = document.f.irregularity_select.options[i].value ;
+                    summary_str += document.f.irregularity_select.options[i].text + "\n" ;
+                                   cnt++;
+                                   this.numskipped++;
+                           }
+                   }
+                   var summary = document.getElementById("irregularity_summary");
+                   if(summary) {
+                           summary.value = summary_str;
+                           summary.rows= ( cnt > 6 ) ? cnt : 6 ; // textarea will bre resized, but not more than 6 lines will show.
+                   }
+        }
+}
+
+IrregularPattern.prototype.irregular = function(index) { 
+       for( var i in this.skipped) {
+                       if( this.skipped[i] == index) {
+                               return true;
+                       }
+       }
+       return false;
+}
+
+function init_pattern() {
+       irregular_issues = new IrregularPattern();
+}
+function reset_pattern() {
+       document.getElementById("numberpattern").value = '';
+    document.getElementById("irregularity").innerHTML = '';
+       init_pattern();
+       reset_num_pattern();
+}
 
 // common pre defined number patterns
-function num_pattern() {
+function reset_num_pattern() {
 var patternchoice = document.getElementById("numberpattern").value;
     switch(patternchoice){
     case "2":
@@ -44,7 +166,7 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.f.lastvalue1.value=1;
         document.f.lastvalue2.value=1;
         document.f.lastvalue3.value=1;
-        document.f.numberingmethod.value=_('Vol {X}, No {Y}, Issue {Z}');
+        document.f.numberingmethod.value=_("Vol {X}, No {Y}, Issue {Z}");
         moreoptions(text[1],text[0],text[2]);
         display_table(0); // toggle info box on (1) or off (0)
         break;
@@ -64,7 +186,7 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.f.lastvalue1.value=1;
         document.f.lastvalue2.value=1;
         document.f.lastvalue3.value='';
-        document.f.numberingmethod.value=_('Vol {X}, No {Y}');
+        document.f.numberingmethod.value=_("Vol {X}, No {Y}");
         moreoptions(text[1],text[0]);
         display_table(0);
         break;
@@ -84,11 +206,13 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.f.lastvalue1.value=1;
         document.f.lastvalue2.value=1;
         document.f.lastvalue3.value='';
-        document.f.numberingmethod.value=_('Vol {X}, Issue {Y}');
+        document.f.numberingmethod.value=_("Vol {X}, Issue {Y}");
         moreoptions(text[1],text[2]);
         display_table(0);
         break;
     case "5":
+//        var d = new Date(document.f.firstacquidate.value);
+//        var smonth = d.getMonth();
         document.f.add1.value=1;
         document.f.add2.value=1;
         document.f.add3.value='';
@@ -101,15 +225,15 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.f.setto1.value=0;
         document.f.setto2.value=1;
         document.f.setto3.value='';
-        document.f.lastvalue1.value=1;
-        document.f.lastvalue2.value=1;
-        document.f.lastvalue3.value='';
-        document.f.numberingmethod.value=_('No {X}, Issue {Y}');
+        document.f.numberingmethod.value=_("No {X}, Issue {Y}");
         moreoptions(text[0],text[2]);
         display_table(0);
         break;
     case "6":
-        var d = new Date();
+        var d = new Date(document.f.firstacquidate.value);
+        var sYear = d.getFullYear();
+        moreoptions_seasons(text[15],sYear);
+        var d = new Date(document.f.firstacquidate.value);
         var sYear = d.getFullYear();
         document.f.add1.value=1;
         document.f.add2.value='1';
@@ -123,12 +247,10 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.f.setto1.value=0;
         document.f.setto2.value='1';
         document.f.setto3.value='';
-        document.f.lastvalue1.value=sYear;
-        document.f.lastvalue2.value='1';
-        document.f.lastvalue3.value='';
         document.f.periodicity.value='8';
-        document.f.numberingmethod.value=_('{Y} {X}');
+        document.f.numberingmethod.value=_("{Y} {X}");
         moreoptions_seasons(text[15],sYear);
+        document.f.lastvalue1temp.value=document.f.lastvalue1.value=sYear;
         display_table(0);
         is_season = 1;
         break;
@@ -137,8 +259,8 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.getElementById("more_options").innerHTML = '';
         document.f.irreg_check.value=1; 
         break;
-    case "8":
-        var d = new Date();
+    case "8":  // Year/Number
+        var d = (document.f.firstacquidate.value) ? new Date( document.f.firstacquidate.value) : new Date() ;
         var sYear = d.getFullYear();
         document.f.add1.value=1;
         document.f.add2.value=1;
@@ -153,10 +275,50 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.f.setto2.value=1;
         document.f.setto3.value='';
         document.f.lastvalue1.value=sYear;
-        document.f.lastvalue2.value='1';
+          switch (document.f.periodicity.value){
+            case 1:              
+              var doy = dayofyear(d);
+              document.f.lastvalue2.value=doy; 
+              document.f.whenmorethan2.value=365; 
+              break;      
+            case 12:     
+              var doy = dayofyear(d);
+              document.f.lastvalue2.value=doy*2; 
+              document.f.whenmorethan2.value=730; 
+              break;      
+            case 2:
+            case 3:
+            case 4:
+              var YWDa = YMDaToYWDa(d);
+              document.f.lastvalue2.value=YWDA[1]/(document.f.periodicity.value-1); 
+              break;      
+            case 5:
+              var smonth = d.getMonth();
+              document.f.lastvalue2.value=smonth;
+              break;      
+            case 6:
+              var smonth = d.getMonth();
+              document.f.lastvalue2.value=smonth/2;
+              document.f.whenmorethan2.value=6;
+              break;      
+            case 7:
+            case 8:      
+              var smonth = d.getMonth();
+              document.f.lastvalue2.value=smonth/3;
+              document.f.whenmorethan2.value=4;
+              break;      
+            case 9:                        
+              var smonth = d.getMonth();
+              document.f.lastvalue2.value=smonth/6;
+              document.f.whenmorethan2.value=2;
+              break;      
+            default:
+          } 
         document.f.lastvalue3.value='';
-        document.f.periodicity.value=1;
-        document.f.numberingmethod.value=_('{X}/{Y}');
+        document.f.numberingmethod.value=_("{X} / {Y}");
+        moreoptions(text[16],text[0]);
+     //   document.f.lastvalue1temp.value=sYear;
+     //   document.f.lastvalue2temp.value=document.f.lastvalue2.value;
         display_table(0);
         break;
     default:
@@ -176,7 +338,8 @@ var patternchoice = document.getElementById("numberpattern").value;
         document.f.lastvalue2.value='';
         document.f.lastvalue3.value='';
         document.f.numberingmethod.value='{X}';
-        moreoptions_daily_check(text[0]);
+//        moreoptions_daily_check(text[0]);
+        moreoptions(text[0]);
         document.f.irreg_check.value=1;
         display_table(0);
         break;
@@ -186,14 +349,18 @@ var patternchoice = document.getElementById("numberpattern").value;
 function display_table(n) {
     if(n==1){
         document.getElementById("basetable").style.display = 'block';
-    } else {
+    } else if(n==0){
         document.getElementById("basetable").style.display = 'none';
-    }
+    } else {
+               var disp_val = ( document.getElementById("basetable").style.display == 'none' ) ? 'block' : 'none' ;
+                       document.getElementById("basetable").style.display = disp_val;
+       }
 }
 
-function modify_num_pattern() {
+function set_num_pattern_from_template_vars() {
+       if(!document.getElementById("numberpattern")){ return false; }
     document.getElementById("numberpattern").value = '<!-- TMPL_VAR NAME="numberpattern" -->';
-    num_pattern();
+    reset_num_pattern();
     
     document.f.add1.value='<!-- TMPL_VAR NAME="add1" -->';
     document.f.add2.value='<!-- TMPL_VAR NAME="add2" -->';
@@ -224,15 +391,14 @@ function modify_num_pattern() {
         more_strZ="Z";
     }
     <!-- /TMPL_IF -->
-
-    document.f.lastvaluetemp1.value='<!-- TMPL_VAR NAME="lastvalue1" -->';
+    document.f.lastvalue1temp.value='<!-- TMPL_VAR NAME="lastvalue1" -->';
     if(more_strY){
-        document.f.lastvaluetemp2.value='<!-- TMPL_VAR NAME="lastvalue2" -->';
-    document.f.whenmorethantemp2.value='<!-- TMPL_VAR NAME="whenmorethan2" -->';
+        document.f.lastvalue2temp.value='<!-- TMPL_VAR NAME="lastvalue2" -->';
+    document.f.whenmorethan2temp.value='<!-- TMPL_VAR NAME="whenmorethan2" -->';
     }
     if(more_strZ){
-        document.f.lastvaluetemp3.value='<!-- TMPL_VAR NAME="lastvalue3" -->';
-    document.f.whenmorethantemp3.value='<!-- TMPL_VAR NAME="whenmorethan3" -->';
+        document.f.lastvalue3temp.value='<!-- TMPL_VAR NAME="lastvalue3" -->';
+    document.f.whenmorethan3temp.value='<!-- TMPL_VAR NAME="whenmorethan3" -->';
     }
 }
 
@@ -240,12 +406,11 @@ function modify_num_pattern() {
 function moreoptions_daily_check(x) {
     var periodicity = document.f.periodicity.value;
     var errortext='';
-    if(periodicity == 1){
+    if(periodicity == 1){ // i.e. daily
         document.getElementById("irregularity").innerHTML = '';
-        var daynames = new Array(_('Monday'),_('Tuesday'),_('Wednesday'),_('Thursday'),_('Friday'),_('Saturday'),_('Sunday'));
         errortext =_("Please indicate which days of the week you <b>DO NOT<\/b> expect to receive issues.<br \/>");
-        for(var j=0;j<daynames.length;j++){
-            errortext +="<input type='checkbox' name='irregular' id='irregular"+(j+1)+"' value='"+(j+1)+"' />"+daynames[j]+" &nbsp; ";
+        for(var j=0;j<irregular_issues.daynames.length;j++){
+            errortext +="<input type='checkbox' name='irregular' id='irregular"+(j+1)+"' value='"+(j+1)+"' />"+irregular_issues.daynames[j]+" &nbsp; ";
         }
         var error = errortext;
         moreoptions(x);
@@ -264,32 +429,32 @@ document.getElementById("more_options").innerHTML = '';
 var textbox = '';
     // alert("X: "+x+"Y: "+y+"Z: "+z);
     if(x){
-        textbox +="<table>\n<tr><td>&nbsp;<\/td><td>"+x+"<\/td>";
+        textbox +="<table id='irregularity_table'>\n<tr><th>&nbsp;<\/th><th>"+x+"<\/th>";
         if(y){
-            textbox +="<td>"+y+"<\/td>";
+            textbox +="<th>"+y+"<\/th>";
             if(z){
-                textbox +="<td>"+z+"<\/td>";
+                textbox +="<th>"+z+"<\/th>";
             }
         }
         textbox +="<\/tr>\n";
-        textbox +="<tr><td>"+text[5]+"<\/td><td><input type='text' name='lastvaluetemp1' size='4' onkeyup='moreoptionsupdate(\"lastvalue1\")'><\/td>\n";
+        textbox +="<tr><th scope=\"row\">"+text[5]+"<\/td><td><input type='text' name='lastvalue1temp' id='lastvalue1temp' size='4' onkeyup='moreoptionsupdate(this)' value=\"" + document.f.lastvalue1.value +  "\" /><\/td>\n";
         if(y){
-            textbox +="<td><input type='text' name='lastvaluetemp2' size='4' onkeyup='moreoptionsupdate(\"lastvalue2\")'><\/td>\n";
+            textbox +="<td><input type='text' name='lastvalue2temp' id='lastvalue2temp' size='4' onkeyup='moreoptionsupdate(this)' value=\"" + document.f.lastvalue2.value + "\" /><\/td>\n";
             if(z){
-                textbox +="<td><input type='text' name='lastvaluetemp3' size='4' onkeyup='moreoptionsupdate(\"lastvalue3\")'><\/td>\n";
+                textbox +="<td><input type='text' name='lastvalue3temp' id='lastvalue3temp' size='4' onkeyup='moreoptionsupdate(this)' value=\"" + document.f.lastvalue3.value + "\" /><\/td>\n";
             }
         }
         textbox +="<\/tr>\n";
         if(y){
-            textbox +="<tr><td>"+text[6]+"<\/td>";
-            textbox +="<td><a href='javascript:irregularity_check()'>"+_('Irregularity?')+"<\/a><\/td>\n";
-            textbox +="<td><input type='text' name='whenmorethantemp2' size='4' onkeyup='moreoptionsupdate(\"whenmorethan2\",1)'><\/td>\n";
+            textbox +="<tr><th scope=\"row\">"+text[6]+"<\/th>";
+            textbox +="<td>&nbsp;<\/td>\n";
+            textbox +="<td><input type='text' name='whenmorethan2temp' id='whenmorethan2temp' size='4' onkeyup='moreoptionsupdate(this,1)'><\/td>\n";
             if(z){
-                textbox +="<td><input type='text' name='whenmorethantemp3' size='4' onkeyup='moreoptionsupdate(\"whenmorethan3\",1)'><\/td>\n";
+                textbox +="<td><input type='text' name='whenmorethan3temp' id='whenmorethan3temp' size='4' onkeyup='moreoptionsupdate(this,1)'><\/td>\n";
             }
             textbox +="<\/tr>";
         } else {
-          textbox +="<tr> <td>"+_('issues expected')+"</td><td><input type='text' name='issuesexpectedtemp1' size='4' onkeyup='moreoptionsupdate(\"issuesexpected1\",0)'><br/><a href='javascript:irregularity_check()'>"+_('Irregularity?')+"</a></td></tr>";
+          textbox +="<tr> <td>"+_("issues expected")+"<\/td><td><input type='text' name='issuesexpected1temp' id='issuesexpected1temp' size='4' onkeyup='moreoptionsupdate(this,0)' value=\"" + document.f.issuesexpected1.value + "\" ><\/td><\/tr>";
         }
         textbox +="<\/table>\n";
     }
@@ -302,7 +467,7 @@ var selbox = document.getElementById("season1");
     var selboxselected = selbox.options[selbox.selectedIndex].value;
     selbox.options.length = 0;
 
-    if (chosen == "1") {
+    if ( (chosen == "1") || ( ! (chosen) && is_hemisphere == 1 )) {
         selbox.options[selbox.options.length] = new Option(text[11],'1');
         selbox.options[selbox.options.length] = new Option(text[12],'2');
         selbox.options[selbox.options.length] = new Option(text[13],'3');
@@ -311,7 +476,7 @@ var selbox = document.getElementById("season1");
         selbox.options[selboxselected-1].selected = true;
     }
 
-    if (chosen == "2") {
+    if ( (chosen == "2") || ( ! (chosen) && is_hemisphere == 2 )) {
         selbox.options[selbox.options.length] = new Option(text[13],'1');
         selbox.options[selbox.options.length] = new Option(text[10],'2');
         selbox.options[selbox.options.length] = new Option(text[11],'3');
@@ -322,15 +487,16 @@ var selbox = document.getElementById("season1");
     }
 }
 
-// to dispaly the more options section for seasons
+// to display the more options section for seasons
 function moreoptions_seasons(x,y){
+// x = 'Season'.  y = 'Year'.
 document.getElementById("irregularity").innerHTML = '';
 document.getElementById("more_options").innerHTML = '';
 var textbox = '';
-    // alert("X: "+x+"Year: "+y);
+    //alert("X: "+x+"Year: "+y);
     if(x){
         var hemi_select = parseInt('<!-- TMPL_VAR NAME="hemisphere" -->');
-        textbox +="<table>\n<tr><td>"+ text[7]  +"<\/td><td colspan='2'><select name='hemisphere' onchange='hemispheres(this.options[this.selectedIndex].value)'>";
+        textbox +="<li><label for=\"hemisphere\">"+ text[7]  +"<\/label><select name='hemisphere' id=\"hemisphere\" onchange='hemispheres(this.options[this.selectedIndex].value)'>";
         for(var i = 1; i <= 2; i++){
             textbox +="<option value='"+i+"'";
             if(i == hemi_select){
@@ -338,23 +504,20 @@ var textbox = '';
             }
             textbox +=">"+text[i+7]+"<\/option>";
         }
-        textbox +="<\/select><\/td><\/tr>\n";
-        textbox +="<tr><td>&nbsp;<\/td><td>"+x+"<\/td>";
-        textbox +="<td>"+text[16]+"<\/td>";
+        textbox +="<\/li>\n";
+        textbox +="<table id='seasonal_irregularity'><tr><th>&nbsp;<\/th><th>"+x+"<\/th>";
+        textbox +="<th>"+text[16]+"<\/th>";
         textbox +="<\/tr>\n";
-        textbox +="<tr><td>"+text[5]+"<\/td><td><select name='lastvaluetemp2' id='season1' onchange='moreoptionsupdate(\"lastvalue2\")'>";
+        textbox +="<tr><th scope=\"row\">"+text[5]+"<\/th><td><select name='lastvalue2temp' id='lastvalue2temp' id='season1' onchange='moreoptionsupdate(this)'>";
         for(var j = 1; j <= 4; j++){
-            textbox +="<option value='"+j+"'>"+text[j+10]+"<\/option>";
-        }
-        textbox +="<\/select><\/td><td><select name='lastvaluetemp1' onchange='moreoptionsupdate(\"lastvalue1\")'>";
-        for(var k = parseInt(y); k <= parseInt(y)+15; k++){
-            textbox +="<option value='"+k+"'>"+k+"<\/option>";
+            textbox +="<option value='"+j+"'>"+text[j+9]+"<\/option>";
         }
-        textbox +="<\/select><\/td><\/tr>\n";
-        textbox +="<tr><td>"+text[6]+"<\/td>";
-        textbox +="<td><a href='javascript:irregularity_check()'>"+_('Irregularity?')+"<\/a><\/td>\n";
-        textbox +="<td><input type='text' name='whenmorethantemp2' size='4' onkeyup='moreoptionsupdate(\"whenmorethan2\",1)'><\/td>\n";
-                textbox +="<\/tr><\/table>\n";
+        textbox +="<\/select><\/td>";
+        var isyr = irregular_issues.firstissue;
+        textbox += "<td>" + irregular_issues.firstissue.getFullYear() + "<\/td><\/tr>\n";
+        textbox +="<tr><th scope=\"row\">"+text[6]+"<\/th>";
+        textbox +="<td><input type='text' name='whenmorethan2temp' id='whenmorethan2temp' size='4' onkeyup='moreoptionsupdate(this,1)'><\/td>\n";
+        textbox +="<\/tr><\/table>\n";
     }
     document.getElementById("more_options").innerHTML = textbox;
 }
@@ -362,12 +525,17 @@ var textbox = '';
 function irregularity_check(){
     document.f.irreg_check.value = 1; // Irregularity button now pushed
     var periodicity = document.f.periodicity.value;
-    var rollover = document.f.issuesexpected1.value;
-    if(document.f.whenmorethantemp2){
-      rollover = document.f.whenmorethantemp2.value;
+       var rollover = document.f.issuesexpected1.value;
+    if( (document.f.whenmorethan2) && ( document.f.whenmorethan2.value > 0) ){
+      rollover = document.f.whenmorethan2.value;
     }
-    if(document.f.whenmorethantemp3){
-        rollover = document.f.whenmorethantemp3.value;
+    if((document.f.whenmorethan3) && document.f.whenmorethan3.value > 0 ){
+        // FIXME: Irregularity check assumes that the full prediction pattern repeats each year.
+               //  In cases where the outermost periodicity is > 1 year,  
+               //  e.g. where a volume spans two years, the irregularity check will be incorrect, 
+        // but you can safely ignore the check, submit the form, and the prediction pattern should be correct.
+               //  a way to distinguish between these two cases is needed.
+               rollover = document.f.whenmorethan3.value * document.f.whenmorethan2.value;
     }
     var error='';
     var toobig;
@@ -388,13 +556,6 @@ function irregularity_check(){
             toobig=1;
         }
         break;
-    case "13":
-        if(rollover < 156) expected =156;
-        if(rollover > 156) {
-            expectedover=156;
-            toobig=1;
-        }
-        break;
     case "2":
         if(rollover < 52) expected =52;
         if(rollover > 52){
@@ -462,66 +623,59 @@ function irregularity_check(){
         break;
     }
     if(expected){
-        if(expected == 365 || expected==730){
-            var daynames = new Array(_('Monday'),_('Tuesday'),_('Wednesday'),_('Thursday'),_('Friday'),_('Saturday'),_('Sunday'));
+        if(expected == 365 || expected==730){  // what about leap years ?
+                       // FIXME:  We interpret irregularity as which days per week for periodicity==1.
+                       //  We need two cases: one in which we're published n days/week, in which case irregularity should be per week,
+                       //  and a regular daily pub, where irregularity should be per year.
             errortext += _("Please indicate which days of the week you <b>DO NOT<\/b> expect to receive issues.<br \/>");
-            for(var j=0;j<daynames.length;j++){
-                errortext +="<input type='checkbox' name='irregular' id='irregular"+(j+1)+"' value='"+(j+1)+"' />"+daynames[j]+" &nbsp; ";
-            }
-            error=errortext;
         } else {
-            errortext +=expected+_(" issues expected ")+rollover+_(" were entered. <br \/>Please indicate which date(s) an issue is not expected<br \/>");
-            var count=0;
-            for(var i=rollover;i<expected;i++){
-                errortext +="<select name='irregular' id='irregular"+count+"' onchange='display_example(expected)'>\n";
-                errortext +=irregular_options(periodicity);
-                errortext +="<\/select>\n";
-                count++;
-            }
-            error=errortext;
-        }
+            errortext +=expected+_(" issues expected, ")+rollover+_(" were entered. <br \/>Please indicate which date(s) an issue is not expected<br \/>");
+            irregular_issues.numskipped = expected - rollover;
+               }
+        errortext +="<select multiple id='irregularity_select' name='irregularity_select' onchange='irregular_issues.update();'>\n";
+               errortext +=irregular_options(periodicity);
+               errortext += "<\/select>\n <textarea rows='6' width='18' id='irregularity_summary' name='irregularity_summary' value='foo' />";
+        error=errortext;
     }
     if(toobig){
-        errortext +=expectedover+_(" issues expected ")+rollover+_(" were entered.<br \/> You seem to have indicated more issues per year than expected.");
+        errortext +=expectedover+_(" issues expected, ")+rollover+_(" were entered.<p class='warning'> You seem to have indicated more issues per year than expected.<\/p>");
         error=errortext;
     }
     if(error.length ==0){
-        error=_('No irregularities noticed');
+        error=_("No irregularities noticed");
     }
-    display_example(expected);
+       display_example(expected);
     document.getElementById("irregularity").innerHTML = error;
+       irregular_issues.update();
 }
 
 function irregular_options(periodicity){
     var titles;
     var count;
-<!-- TMPL_IF NAME="weekarrayjs" -->
-    var weeks = new Array(<!-- TMPL_VAR NAME="weekarrayjs" -->); 
-<!-- /TMPL_IF -->
-    var months = new Array(_('January'),_('February'),_('March'),_('April'),_('May'),_('June'),_('July'),_('August'),_('September'),_('October'),_('November'),_('December'));
-    var seasons = new Array(_('Autumn'),_('Winter'),_('Spring'),_('Summer'),_('Fall'));
     var errortext='';
+    var numberpattern = document.getElementById('numberpattern').value;
     if(periodicity == 1) {
-        expected = 366;
-        titles = "Day";
+        expected = 7;
+        titles = irregular_issues.daynames;
         count = 1;
     }
     if(periodicity == 2 || periodicity == 3 || periodicity == 4) { 
-        expected = 52;
-    <!-- TMPL_IF NAME="weekarrayjs" -->
-        titles = weeks;
-        count = <!-- TMPL_VAR NAME="weekno" -->;
-    <!-- TMPL_ELSE -->
-        titles = "Week";
-        count = 1;
-    <!-- /TMPL_IF -->
+        titles = irregular_issues.weeks;
+               count = 1;
+        if(periodicity==3) {  // 1/2 wks
+            expected = 26;
+        } else if(periodicity == 4) { // 1/3 wks
+            expected = 17;
+        } else {
+            expected = 52;
+        }
     }
     if(periodicity == 5 || periodicity == 6 || periodicity == 7 || periodicity == 8 || periodicity == 9) {
-        if(periodicity == 8) {
+        if(periodicity == 8 && numberpattern==8) {
             is_season = 1; // setting up from edit page
         } 
         if(is_season){
-            titles = seasons;
+            titles = irregular_issues.seasons;
             expected = 4;
             if(is_hemisphere == 2){
                 count = 2;
@@ -529,12 +683,15 @@ function irregular_options(periodicity){
                 count = 1;
             }
         } else {
-            titles = months;
+            titles = irregular_issues.months;
             expected = 12;
             count = 1;
         }
     }
-    for(var j=1;j<=expected;j++){
+       if( !expected) {
+               return '';   // don't know how to deal with irregularity.
+       }       
+    for(var j=0;j<expected;j++){   // rch - changed frrom (1..expected).
         if(isArray(titles)){
             if(count>expected){
                 count = count-expected;
@@ -545,31 +702,27 @@ function irregular_options(periodicity){
             } else if(is_season && is_hemisphere == 2){
                 errortext +="<option value='"+((count*3)-2)+"'>"+titles[j-1]+"<\/option>\n";
 // alert("value: "+((count*3)-2)+" title: "+titles[j-1]);
-            } else {
-                errortext +="<option value='"+count+"'>"+titles[j-1]+"<\/option>\n";
+            } else {  // all non-seasonal periodicities:
+                var incr=1; // multiplier for ( 1/n weeks)  patterns; in this case the irreg calc relies on the week# , not the issue#.
+                if(periodicity==3) {  // 1/2 wks
+                    incr=2;
+                } else if(periodicity == 4) { // 1/3 wks
+                    incr=3;
+                }
+                errortext += "<option value='" + (1+j*incr) ;  
+                               if(irregular_issues.irregular(1+incr*j)) {
+                                       errortext += "' selected='selected" ;
+                               }
+                               errortext += "'>"+titles[incr*j]+"<\/option>\n";
             }
             count++;
-        } else {
+        } else { 
             errortext +="<option value='"+j+"'>"+titles+" "+j+"<\/option>\n";
         }
     }
     return errortext;
 }
 
-function irregular_order(){
-    var irregular = '<!-- TMPL_VAR NAME="irregularity" -->';
-    var periodicity = document.f.periodicity.value;
-    var irregarray = irregular.split(',');
-    if(periodicity ==1){
-        for(j=0;j<irregarray.length;j++){
-        document.getElementById("irregular"+irregarray[j]).checked = true; 
-        }
-    } else {
-        for(i=0;i<irregarray.length;i++){    
-            document.getElementById("irregular"+i).value = irregarray[i];
-        }
-    }
-}
 
 function display_example(expected){
     var startfrom1 = parseInt(document.f.lastvalue1.value);
@@ -583,11 +736,11 @@ function display_example(expected){
     var whenmorethan3 = parseInt(document.f.whenmorethan3.value);
     var setto2 = parseInt(document.f.setto2.value);
     var setto3 = parseInt(document.f.setto3.value);
-    var displaytext = _('Based on the information<br \/>entered the Numbering Pattern<br \/>will look like this<br \/>\n');
+    var displaytext = _("Based on the information entered, the Numbering Pattern will look like this: ") + "<br \/><ul class=\"numpattern_preview\">";
     if(startfrom3>0){
         var count=startfrom3-1;
         var count2=startfrom2;
-        for(var i=0;i<12;i++){
+        for(var i = 0 ; i < 12; i++){
             if(count>=whenmorethan3){
                 count=setto3;
                 if(count2>=whenmorethan2){
@@ -599,9 +752,9 @@ function display_example(expected){
             } else {
                 count++;
             }
-            displaytext += numberpattern.replace(/{Z}/,count)+'\n';
-            displaytext = displaytext.replace(/{Y}/,count2)+'<br \/>\n';
-            displaytext = displaytext.replace(/{X}/,startfrom1)+'<br \/>\n';
+            displaytext += '<li>' + numberpattern.replace(/{Z}/,count) + '<\/li>\n';
+            displaytext = displaytext.replace(/{Y}/,count2);
+            displaytext = displaytext.replace(/{X}/,startfrom1);
 
         }
     }
@@ -640,7 +793,7 @@ function display_example(expected){
             displaytext += numberpattern.replace(/{X}/,i)+'<br \/>\n';
         }
     }
-    displaytext = "<div style='padding: 5px; background-color: #CCCCCC'>"+displaytext+"<\/div>";
+   //  displaytext = "<div style='padding: 5px; background-color: #CCCCCC'>"+displaytext+"<\/div>";
     document.getElementById("displayexample").innerHTML = displaytext;
 }
 
@@ -651,19 +804,52 @@ else
     return true;
 }
 
-function moreoptionsupdate(fieldnames,rollover){
-    fieldname = fieldnames;
-    fld = fieldname.length;
-    fld = fld-1;
-    fieldnametempnumber = fieldname.substr(fld);
-    //alert(fieldnametempnumber);
-    fieldnametemp = fieldname.slice(0,-1)+"temp"+fieldnametempnumber;
-    // alert(fieldnametemp);
-    eval("document.f."+fieldname+".value = document.f."+fieldnametemp+".value");
-//     alert (fieldname+" : "+eval("document.f."+fieldname+".value") +' '+fieldnametemp+' : ' +eval("document.f."+fieldnametemp+".value"));
-    if(rollover){
-        eval("document.f.every"+(fieldnametempnumber-1)+".value = document.f."+fieldnametemp+".value");
+function moreoptionsupdate(inputfield,rollover){
+    fieldname = inputfield.name;
+    // find parent element in base table by stripping 'temp' from element name.
+    basefield = document.getElementById(fieldname.slice(0,-4));
+    var fieldnumber = fieldname.slice(-5,-4);
+
+    basefield.value = inputfield.value;
+    var patternchoice = document.getElementById("numberpattern").value;
+    switch(patternchoice){
+    case "2":
+    case "4":
+    case "5":
+    case "8": // Year, Number.  -- Why not just use Vol, Number withvol==year??
+                //  FIXME: this my conflict with innerloop calc below.
+       if (document.f.lastvalue2temp.value > 0){document.f.innerloop1.value = document.f.lastvalue2temp.value - 1;}
+      break;   
+    }  
+    if(basefield.name.slice(0,-1) == 'lastvalue' || 'whenmorethan' ) {
+        // The enumeration string is held in a positional numeral notation with three positions, X,Y,Z.
+        // The last values lastvalue1, lastvalue2,lastvalue3 should match the last received serial's X,Y,Z enumeration.
+        // make array indexes start with 1 for consistency with variable names.
+        var innerloop = new Array( undefined, document.getElementById('innerloop1'), document.getElementById('innerloop2'), document.getElementById('innerloop3') );
+        var lastvalue = new Array( undefined, document.getElementById('lastvalue1').value *1 , document.getElementById('lastvalue2').value *1 , document.getElementById('lastvalue3').value *1  );
+        var every = new Array( undefined, document.getElementById('every1').value *1 , document.getElementById('every2').value *1 , document.getElementById('every3').value *1  );
+        var add = new Array( undefined, document.getElementById('add1').value *1 , document.getElementById('add2').value *1 , document.getElementById('add3').value *1  );
+        var whenmorethan = new Array( undefined, document.getElementById('whenmorethan1').value *1 , document.getElementById('whenmorethan2').value *1 , document.getElementById('whenmorethan3').value *1  );
+        
+       if(rollover){
+       // calculate rollover  for higher level of periodicity.
+       // if there are two levels of periodicity, (e.g. vol{X},num{Y},issue{Z}, then every1=every2*whenmorethan2 / add2 .
+          for(var N=3;N>1;N--){
+            if( add[N] > 0){
+                var addN = (add[N]) ? add[N] : 1 ;
+                var everyN = (document.getElementById('every'+N)) ? document.getElementById('every'+N).value : 1 ;
+                document.getElementById('every'+(N-1)).value = whenmorethan[N] * everyN / addN ;
+            }
+          }
+        }
+        innerloop[3].value = ( every[3] > 1 ) ? lastvalue[3] % every[3] : 0 ;
+        innerloop[2].value = ( every[2] > 1 ) ? lastvalue[3] - 1 : 0 ;
+        innerloop[1].value = ( every[1] > 1 ) ? 
+                                    ( whenmorethan[3] > 0 ) ?  (lastvalue[2] - 1) * every[2] + 1* innerloop[2].value 
+                                                            : lastvalue[2] - 1
+                                               : 0 ;
     }
+     //FIXME : add checks for innerloop || lastvalue .gt. rollover  
 }
 
 
@@ -677,74 +863,165 @@ function check_input(e){
     }
 }
 
--->
+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 Check(f) {
+    if (f.aqbooksellerid.value.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==true) {
+               }
+               else {
+                       return false;
+               }
+    }
+       if (f.biblionumber.value.length==0) {
+        alert(_("You must choose or create a biblio"));
+    } else if(f.startdate.value.length != 0 && f.sublength.value > 0) {
+        if (f.irreg_check.value == 1) {
+            document.f.submit();
+        } else {
+            if(f.numbering_pattern.value == ''){
+                alert(_("Please choose a numbering pattern"));
+            } else {
+                alert(_("Please check for irregularity by clicking 'Test Prediction Pattern'"));
+            }
+        }
+    } else {
+        alert(_("You must choose a start date and a subscription length"));
+    }
+       if(irregular_issues.numskipped < irregular_issues.skipped.length ) {
+               alert(_("You have not accounted for all missing issues."));
+       }
+    return false;
+}
+
+$(document).ready(function() {
+    init_pattern();
+<!-- TMPL_IF name="mod" -->
+    set_num_pattern_from_template_vars();
+    <!-- TMPL_IF name="hemisphere" -->
+       is_hemisphere = <!-- TMPL_VAR NAME="hemisphere" --> ;
+    hemispheres();
+    <!-- /TMPL_IF -->
+<!-- /TMPL_IF -->
+<!-- TMPL_IF name="irregularity" -->
+    irregularity_check();
+<!-- /TMPL_IF -->
+    $('#numberpattern').change( function() { 
+        reset_num_pattern(); 
+    });
+});
+//]]>
 </script>
+</head>
+<body>
+<!-- TMPL_INCLUDE NAME="header.inc" -->
+<!-- TMPL_INCLUDE NAME="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; <!-- TMPL_IF name="mod" --><a href="/cgi-bin/koha/serials/subscription-detail.pl?subscriptionid=<!-- TMPL_VAR NAME="subscriptionid" -->"><i><!-- TMPL_VAR NAME="bibliotitle" escape="html" --></i></a> &rsaquo; Modify subscription<!-- TMPL_ELSE -->New subscription<!-- /TMPL_IF --></div>
 
+<div id="doc3" class="yui-t7">
+   
+   <div id="bd">
+   <div class="yui-g">
+<h1><!-- TMPL_IF name="mod" --> Modify subscription for <i><!-- TMPL_VAR name="bibliotitle" escape="html" --></i><!-- TMPL_ELSE -->Add a new subscription<!-- /TMPL_IF --></h1>
+    <form method="post" name="f" action="/cgi-bin/koha/serials/subscription-add.pl">
 <!-- TMPL_IF name="mod" -->
-    <h1>Modify a subscription</h1>
-    <form method="post" name="f">
-        <input type="hidden" name="op" value="modsubscription">
-        <input type="hidden" name="subscriptionid" value="<!-- TMPL_VAR name="subscriptionid" -->">
+        <input type="hidden" name="op" value="modsubscription" />
+        <input type="hidden" name="subscriptionid" value="<!-- TMPL_VAR name="subscriptionid" -->" />
 <!-- TMPL_ELSE -->
-    <h1>Add a subscription (Serial Holdings Record)</h1>
-    <form method="post" name="f">
-        <input type="hidden" name="op" value="addsubscription">
+        <input type="hidden" name="op" value="addsubscription" />
 <!-- /TMPL_IF -->
-<input type="hidden" name="user" value="<!-- TMPL_VAR name="loggedinusername" -->">
-<input type="hidden" name="irreg_check" value="0">
-<input type="hidden" name="issuesexpected1" value="0">
+<input type="hidden" name="user" value="<!-- TMPL_VAR name="loggedinusername" -->" />
+<input type="hidden" name="irreg_check" value="0" />
+<input type="hidden" name="issuesexpected1" id="issuesexpected1" value="0" />
 
-
-<div id="subscription_form">
-    <h2>Subscription information for subscription #<!--TMPL_VAR name="subscriptionid"--></h2>
-    <table>
-        <tr>
-            <td>Librarian:</td>
-            <td><!-- TMPL_VAR name="loggedinusername" --></td>
-        </tr>
-        <tr>
-            <td><label>Supplier:</label></td>
-            <td><input type="text" name="aqbooksellerid" value="<!-- TMPL_VAR name="aqbooksellerid" -->" size="8"> (<input type="text" name="aqbooksellername" value="<!-- TMPL_VAR name="aqbooksellername" -->" disabled="disabled" readonly="readonly" />) <a href="#" onClick="FindAcqui(f)">Search for a Supplier</a></td>
-        </tr>
-        <tr>
-            <td><label>Biblio</label></td>
-            <td>
-                <input type="text" name="biblionumber" value="<!-- TMPL_VAR name="biblionumber" -->" size="8"> 
-                (<input type="text" name="title" value="<!-- TMPL_VAR name="bibliotitle" -->" disabled="disabled" readonly="readonly" />)
-                <a href="#" onClick="Plugin(f)">Search for Biblio</a> <!--TMPL_UNLESS Name="mod"--> |
-                <a href="#" onClick="Create_biblio(f)">Create Biblio</a><!--/TMPL_UNLESS-->
-            </td>
-        </tr>
-        <tr>
-            <td><label>Call Number</label></td>
-            <td><input type="text" name="callnumber" value="<!-- TMPL_VAR name="callnumber" -->" size="20"></td>
-        </tr>
-        <tr>
-            <td>Branch</td>
-            <td>
-                <select name="branchcode">
-                    <option value="">Any branch</option>
+       <div class="yui-u first">
+    <fieldset id="subscription_add_information" class="rows">
+       <legend>Subscription details</legend>
+       <ol>
+        <li><span class="label">Subscription #</span> <!--TMPL_VAR name="subscriptionid"--></li>
+        <li><span class="label">Librarian: </span> <!-- TMPL_VAR name="loggedinusername" --></li>
+        <li>
+            <label for="aqbooksellerid">Vendor: </label>
+            <input type="text" name="aqbooksellerid" id="aqbooksellerid" value="<!-- TMPL_VAR name="aqbooksellerid" -->" size="8" /> (<input type="text" name="aqbooksellername" value="<!-- TMPL_VAR name="aqbooksellername" -->" disabled="disabled" readonly="readonly" />) <div class="inputnote"><a href="#" onclick="FindAcqui(f)">Search for a vendor</a></div>
+        </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="<!-- TMPL_VAR name="bibnum" -->" size="8" /> 
+                (<input type="text" name="title" value="<!-- TMPL_VAR name="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> | <!--TMPL_IF Name="mod"--><a href="#" onclick="addbiblioPopup(<!-- TMPL_VAR NAME="bibnum" -->); return false;">Edit biblio</a><!-- TMPL_ELSE -->
+                <a href="#" onclick="addbiblioPopup(); return false;">Create Biblio</a><!--/TMPL_IF--></div>
+            
+        </li>
+        <li class="radio">
+            <!-- TMPL_IF name="serialsadditems" -->
+                <p><input type="radio" id="serialsadditems-yes" name="serialsadditems" value="1" checked="checked" /><label class="widelabel" for="serialsadditems-yes">create an item record when receiving this serial</label></p>
+                <p><input type="radio" id="serialsadditems-no" name="serialsadditems" value="0" /><label class="widelabel" for="serialsadditems-no">do not create an item record when receiving this serial </label></p>
+            <!-- TMPL_ELSE -->
+                <p><input type="radio" id="serialsadditems-yes" name="serialsadditems" value="1"/><label class="widelabel" for="serialsadditems-yes">create an item record when receiving this serial</label></p>
+                <p><input type="radio" id="serialsadditems-no" name="serialsadditems" value="0" checked="checked" /><label class="widelabel" for="serialsadditems-no">do not create an item record when receiving this serial</label></p>
+            <!-- /TMPL_IF -->
+        </li>
+        <li>
+            <label for="location">Location:</label>
+            <input type="text" name="location" id="location" value="<!-- TMPL_VAR name="location" -->" size="30" />
+        </li>
+         <li>
+            <label for="callnumber">Call Number:</label>
+            <input type="text" name="callnumber" id="callnumber" value="<!-- TMPL_VAR name="callnumber" -->" size="20" />
+        </li>
+        <li>
+            <label for="branchcode">Library:</label>
+            
+                <select name="branchcode" id="branchcode" style="width: 20em;">
+                    <!-- TMPL_UNLESS NAME="Independantbranches" --><option value="">None</option><!-- /TMPL_UNLESS -->
                     <!-- TMPL_LOOP name="branchloop" --><!-- TMPL_IF NAME="selected" --><option value="<!-- TMPL_VAR NAME="value" -->" selected="selected"><!-- TMPL_VAR NAME="branchname" --></option>
                                <!-- TMPL_ELSE -->
                                <option value="<!-- TMPL_VAR NAME="value" -->"><!-- TMPL_VAR NAME="branchname" --></option>
                                <!-- /TMPL_IF -->
                     <!-- /TMPL_LOOP -->
-                </select> (select a branch)
-            </td>
-        </tr>
-        <tr>
-            <td><label>Notes</label></td>
-            <td><textarea name="notes" cols="30" rows="2"><!-- TMPL_VAR name="notes" --></textarea></td>
-        </tr>
-        <tr>
-            <td><label>Management Notes</label></td>
-            <td><textarea name="internalnotes" cols="30" rows="2"><!-- TMPL_VAR name="internalnotes" --></textarea></td>
-        </tr>
-        <tr>
-            <td>Patron alert with </td>
-            <td>
-                <select name="letter">
-                    <option value="">un-activated</option>
+                </select> (select a library)
+            
+        </li>
+        <li>
+               <label for="graceperiod">Grace period:</label> <input type="text" name="graceperiod" id="graceperiod" value="<!-- TMPL_VAR name="graceperiod" -->" /> day(s)
+           </li>
+        <li>
+            <label for="notes">Public note:</label>
+            <textarea name="notes" id="notes" cols="30" rows="2"><!-- TMPL_VAR name="notes" --></textarea>
+        </li>
+        <li>
+            <label for="internalnotes">Nonpublic note:</label>
+            <textarea name="internalnotes" id="internalnotes" cols="30" rows="2"><!-- TMPL_VAR name="internalnotes" --></textarea>
+        </li>
+        <li>
+            <label for="letter">Patron notification: </label>
+            
+               <!-- TMPL_IF NAME="letterloop" -->
+                          <select name="letter" id="letter">
+                    <option value="">None</option>
                 <!-- TMPL_LOOP name="letterloop" -->
                                <!-- TMPL_IF name="selected" -->
                     <option value="<!-- TMPL_VAR name="value" -->" selected="selected"><!-- TMPL_VAR name="lettername" --></option>
@@ -752,223 +1029,255 @@ function check_input(e){
                     <option value="<!-- TMPL_VAR name="value" -->"><!-- TMPL_VAR name="lettername" --></option>
 <!-- /TMPL_IF -->
                 <!-- /TMPL_LOOP -->
-                </select> (select a letter &amp; patrons will be able to "follow" this subscription and recieve a mail on every new issue)
-            </td>
-        </tr>
-        <tr>
-            <td><b>Warning:</b></td>
-            <td>
+                </select> 
+                               <div class="hint">Select a notice and patrons on the routing list will be notified when new issues are received.</div>
+               <!-- TMPL_ELSE -->
+                               <div class="hint">To notify patrons of new serial issues, you must <a href="/cgi-bin/koha/tools/letter.pl">define a notice</a>.</div>
+                               <!-- /TMPL_IF -->
+        </li>
+               <li class="radio">
+                       <label for="staffdisplaycount">Staff and Public Display</label>
+                       <p>
+                        <label class="widelabel" for="staffdisplaycount">Number of issues to display to staff: </label>
+                        <input type="text" name="staffdisplaycount" id="staffdisplaycount" value="<!-- TMPL_VAR NAME="staffdisplaycount" -->" size="4"/>
+                       </p>
+                       <p>
+                       <label class="widelabel" for="opacdisplaycount">Number of issues to display to the public: </label>
+                       <input type="text" name="opacdisplaycount" id="opacdisplaycount" value="<!-- TMPL_VAR NAME="opacdisplaycount" -->" size="4"/>
+                       </p>
+               </li>
+       </ol>
+
+            <div style="float:left;clear:left;margin:1em;"><strong>Note:</strong>
+            
                 <ul>
-                    <li>Remember you <b>must</b> have created a biblio <b>before</b> creating a subscription</li>
-                    <li>You also must have selected a supplier if you want to ask for late issues</li>
-                </ul>
-            </td>
-        </tr>
-    </table>
-<div>
+                    <li>The subscription <strong>must</strong> be associated with a bibliographic record.</li>
+                    <li>You <strong>must</strong> select a vendor if you wish to generate claims.</li>
+                </ul></div>
+            
+            
+       </fieldset>
+       </div>
+       
+<div class="yui-u">
 <div id="subscription_form_planning">
-    <h2>Planning</h2>
-    <table>
-        <tr>
-            <td>First Issue ETA:</td>
-            <td>
-                <img src="<!-- TMPL_VAR Name="themelang" -->/includes/calendar/cal.gif" id="button2" style="cursor: pointer;"  />
-                <input type="text" name="firstacquidate" value="<!-- TMPL_VAR name="startdate" -->" size=13 maxlength=10 id="acqui_date" style="border-width: 0px;" />
-                <!-- both scripts for calendar must follow the input field --> 
+       <fieldset class="rows">
+       <legend>Serials planning</legend>
+    <ol>
+        <li>
+           <label for="acqui_date"> First issue publication date:</label>
+                <!-- TMPL_UNLESS NAME="mod" --><img src="<!-- TMPL_VAR Name="themelang" -->/lib/calendar/cal.gif" id="acqui_button" style="cursor: pointer;" alt="Show Calendar" title="Show Calendar" /><!-- /TMPL_UNLESS -->
+                <input type="text" name="firstacquidate" value="<!-- TMPL_VAR name="firstacquidate" -->"  size="13" maxlength="10" id="acqui_date" <!-- TMPL_IF NAME="mod" -->disabled="disabled"<!-- /TMPL_IF --> style="border-width: 0px;"  />
+        </li>
+           <!-- TMPL_IF NAME="mod" --><li><label for="next_acqui_date"> Next issue publication date:</label>
+                <img src="<!-- TMPL_VAR Name="themelang" -->/lib/calendar/cal.gif" id="next_acqui_button" style="cursor: pointer;" alt="Show Calendar" title="Show Calendar" />
+                <input type="text" name="nextacquidate" value="<!-- TMPL_VAR name="nextacquidate" -->" size="13" maxlength="10" id="next_acqui_date" style="border-width: 0px;"  />
+                </li><!-- /TMPL_IF -->
+                
+        <li><!-- both scripts for calendar must follow the input field --> 
                 <script type="text/javascript">
                     Calendar.setup({
-                        inputField:"acqui_date",
-                        ifFormat       :   "%d/%m/%Y",
-                        button         :   "button2",
-                        align          :   "Tl"
-                    });
-                </script>
-                <script type="text/javascript">
+                        inputField      :   "<!-- TMPL_IF NAME="mod" -->next_<!-- /TMPL_IF -->acqui_date",
+                        ifFormat       :   "<!-- TMPL_VAR NAME="DHTMLcalendar_dateformat" -->",
+                        button         :   "<!-- TMPL_IF NAME="mod" -->next_<!-- /TMPL_IF -->acqui_button",
+                        align          :   "Tl",
+                        onUpdate        :    function(cal) { 
+                                                             irregular_issues.weeks = getWeeksArray(cal.date);
+                                                            irregular_issues.firstissue = cal.date;
+                                                            if(document.irregularity_summary) {
+                                                                irregular_issues.update();
+                                                            }
+                                                            if(document.getElementById("seasonal_irregularity")) {
+                                                                moreoptions_seasons(text[15]);
+                                                            }
+                                                        } 
+                        });
                     Calendar.setup({
-                        inputField     :   "acqui_date",
-                        ifFormat       :   "%d/%m/%Y",
-                        button         :   "acqui_date",
-                        align          :   "Tl"
-                    });
+                        inputField      :   "<!-- TMPL_IF NAME="mod" -->next_<!-- /TMPL_IF -->acqui_date",
+                        ifFormat       :   "<!-- TMPL_VAR NAME="DHTMLcalendar_dateformat" -->",
+                        button         :   "<!-- TMPL_IF NAME="mod" -->next_<!-- /TMPL_IF -->acqui_date",
+                        align          :   "Tl",
+                        onUpdate        :    function(cal) { irregular_issues.weeks = getWeeksArray(cal.date);
+                                                            irregular_issues.firstissue = cal.date;
+                                                            if(document.irregularity_summary) {
+                                                                irregular_issues.update();
+                                                            }
+                                                            if(document.getElementById("seasonal_irregularity")) {
+                                                                moreoptions_seasons(text[15]);
+                                                            }
+                                                        } 
+                        });
                 </script>
-            </td>
-            <td rowspan="5">
-                <div id="displayexample"></div>
-            </td>
-        </tr>
-        <tr>
-            <td>Frequency: (*)</td>
-            <td>
-                <select name="periodicity" size="1" onchange="javascript:document.getElementsByName('manualhist')[0].checked=(this.value==1);num_pattern;">
-                <option value="" selected>-- please choose --</option>
+            <label for="periodicity" class="required">Frequency:</label>
+            
+                <select name="periodicity" size="1" id="periodicity" onchange="javascript:document.getElementsByName('manualhist')[0].checked=(this.value==1); reset_num_pattern();">
+                <option value="" selected="selected">-- please choose --</option>
                 <!-- TMPL_IF name="periodicity16" -->
-                <option value="16" selected>Without Periodicity</option>
+                <option value="16" selected="selected">Without periodicity</option>
                 <!-- TMPL_ELSE -->
-                    <option value="16">Without Periodicity</option>
+                    <option value="16">Without periodicity</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity48" -->
-                <option value="48" selected>Unknown</option>
+                <option value="48" selected="selected">Unknown</option>
                 <!-- TMPL_ELSE -->
                 <option value="48">Unknown</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity32" -->
-                <option value="32" selected>Irregular</option>
+                <option value="32" selected="selected">Irregular</option>
                 <!-- TMPL_ELSE -->
                     <option value="32">Irregular</option>
                 <!-- /TMPL_IF -->
 
                 <!-- TMPL_IF name="periodicity12" -->
-                    <option value="12" selected>2/day</option>
+                    <option value="12" selected="selected">2/day</option>
                 <!-- TMPL_ELSE -->
                     <option value="12">2/day</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity1" -->
-                    <option value="1" selected>1/day</option>
-                <!-- TMPL_ELSE -->
-                    <option value="1">1/day</option>
-                <!-- /TMPL_IF -->
-                <!-- TMPL_IF name="periodicity13" -->
-                    <option value="13" selected>3/week</option>
+                    <option value="1" selected="selected">daily (n/week)</option>
                 <!-- TMPL_ELSE -->
-                    <option value="13">3/week</option>
+                    <option value="1">daily (n/week)</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity2" -->
-                    <option value="2" selected>1/week</option>
+                    <option value="2" selected="selected">1/week</option>
                 <!-- TMPL_ELSE -->
                     <option value="2">1/week</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity3" -->
-                    <option value="3" selected>1/2 weeks (2/month)</option>
+                    <option value="3" selected="selected">1/2 weeks </option>
                 <!-- TMPL_ELSE -->
-                    <option value="3">1/2 weeks (2/months)</option>
+                    <option value="3">1/2 weeks </option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity4" -->
-                    <option value="4" selected>1/3 weeks</option>
+                    <option value="4" selected="selected">1/3 weeks</option>
                 <!-- TMPL_ELSE -->
                     <option value="4">1/3 weeks</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity5" -->
-                    <option value="5" selected>1/month</option>
+                    <option value="5" selected="selected">1/month</option>
                 <!-- TMPL_ELSE -->
                     <option value="5">1/month</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity6" -->
-                    <option value="6" selected>1/2 months (6/year)</option>
+                    <option value="6" selected="selected">1/2 months (6/year)</option>
                 <!-- TMPL_ELSE -->
                     <option value="6">1/2 months (6/year)</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity7" -->
-                    <option value="7" selected>1/3 months (1/quarter)</option>
+                    <option value="7" selected="selected">1/3 months (1/quarter)</option>
                 <!-- TMPL_ELSE -->
                     <option value="7">1/3 months (1/quarter)</option>
                 <!-- /TMPL_IF -->
                 <!-- periodicity8 is 1/quarter, exactly like periodicity7 but will use it for seasonal option -->
                 <!-- TMPL_IF name="periodicity8" -->
-                    <option value="8" selected>1/quarter (seasonal)</option>
+                    <option value="8" selected="selected">1/quarter (seasonal)</option>
                 <!-- TMPL_ELSE -->
                     <option value="8">1/quarter (seasonal)</option>
                 <!-- /TMPL_IF -->
 
                 <!-- TMPL_IF name="periodicity9" -->
-                    <option value="9" selected>2/years</option>
+                    <option value="9" selected="selected">2/years</option>
                 <!-- TMPL_ELSE -->
                     <option value="9">2/year</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity10" -->
-                    <option value="10" selected>1/year</option>
+                    <option value="10" selected="selected">1/year</option>
                 <!-- TMPL_ELSE -->
                     <option value="10">1/year</option>
                 <!-- /TMPL_IF -->
                 <!-- TMPL_IF name="periodicity11" -->
-                    <option value="11" selected>1/2 years</option>
+                    <option value="11" selected="selected">1/2 years</option>
                 <!-- TMPL_ELSE -->
                     <option value="11">1/2 years</option>
                 <!-- /TMPL_IF -->
-                </select>
-                Manual History :<input type="checkbox" name="manualhist" value="1" />
-            </td>
-        </tr>
-        <tr>
-            <td>Numbering Pattern:</td>
-            <td>
-                <select name="numbering_pattern" size="1" id="numberpattern" onchange="num_pattern()">
-                    <option value="" selected>-- please choose --</option>
+                </select> <span class="required">Required</span></li>
+                <li>
+                    <label for="manuallist"> Manual history:</label>
+                    <!-- TMPL_IF name="manualhistory" -->
+                        <input type="checkbox" name="manualhist" id="manuallist" value="1" checked="checked" />
+                    <!-- TMPL_ELSE -->
+                        <input type="checkbox" name="manualhist" id="manuallist" value="1" />
+                    <!-- /TMPL_IF -->
+                </li>
+        <li>
+           <label for="numberpattern"> Numbering pattern:</label>
+            
+                <select name="numbering_pattern" size="1" id="numberpattern" >
+                    <option value="" selected="selected">-- please choose --</option>
                     <!-- TMPL_IF name="numberpattern1" -->
-                        <option value="1" selected>Number</option>
+                        <option value="1" selected="selected">Number</option>
                     <!-- TMPL_ELSE -->
                         <option value="1">Number</option>
                     <!-- /TMPL_IF -->
                     <!-- TMPL_IF name="numberpattern2" -->
-                        <option value="2" selected>Volume, Number, Issue</option>
+                        <option value="2" selected="selected">Volume, Number, Issue</option>
                     <!-- TMPL_ELSE -->
                         <option value="2">Volume, Number, Issue</option>
                     <!-- /TMPL_IF -->
                     <!-- TMPL_IF name="numberpattern3" -->
-                        <option value="3" selected>Volume, Number</option>
+                        <option value="3" selected="selected">Volume, Number</option>
                     <!-- TMPL_ELSE -->
                         <option value="3">Volume, Number</option>
                     <!-- /TMPL_IF -->
                     <!-- TMPL_IF name="numberpattern4" -->
-                        <option value="4" selected>Volume, Issue</option>
+                        <option value="4" selected="selected">Volume, Issue</option>
                     <!-- TMPL_ELSE -->
                         <option value="4">Volume, Issue</option>
                     <!-- /TMPL_IF -->
                     <!-- TMPL_IF name="numberpattern5" -->
-                        <option value="5" selected>Number, Issue</option>
+                        <option value="5" selected="selected">Number, Issue</option>
                     <!-- TMPL_ELSE -->
                         <option value="5">Number, Issue</option>
                     <!-- /TMPL_IF -->
                     <!-- TMPL_IF name="numberpattern6" -->
-                        <option value="6" selected>Seasonal only</option>
+                        <option value="6" selected="selected">Seasonal only</option>
                     <!-- TMPL_ELSE -->
                         <option value="6">Seasonal only</option>
                     <!-- /TMPL_IF -->
                     <!-- TMPL_IF name="numberpattern8" -->
-                        <option value="8" selected>Year/Number</option>
+                        <option value="8" selected="selected">Year/Number</option>
                     <!-- TMPL_ELSE -->
                         <option value="8">Year/Number</option>
                     <!-- /TMPL_IF -->          
                     <!-- TMPL_IF name="numberpattern7" -->
-                        <option value="7" selected>None of the above</option>
+                        <option value="7" selected="selected">None of the above</option>
                     <!-- TMPL_ELSE -->
                         <option value="7">None of the above</option>
                     <!-- /TMPL_IF -->
                 </select>
-                <div id="more_options"></div>
-                <div id="irregularity"></div>
-            </td>
-        </tr>
-        <tr>
-            <td>Begins On: (*)</td>
-            <td>
-                <img src="<!-- TMPL_VAR Name="themelang" -->/includes/calendar/cal.gif" id="button1" style="cursor: pointer;"  />
-                <input type="text" name="startdate" value="<!-- TMPL_VAR name="startdate" -->" size=13 maxlength=10 id="beginning_date" style="border-width: 0px;">
+        </li>
+                <li id="more_options"></li>
+                <li id="irregularity"></li>
+                  <li id="displayexample"></li>
+        <li>
+           <label for="beginning_date" class="required"> Subscription start date:</label>
+            
+                <img src="<!-- TMPL_VAR Name="themelang" -->/lib/calendar/cal.gif" id="button1" style="cursor: pointer;" alt="Show Calendar" title="Show Calendar" />
+                <input type="text" name="startdate" value="<!-- TMPL_VAR name="startdate" -->" size="13" maxlength="10" id="beginning_date" style="border-width: 0px;" />
                 <!-- both scripts for calendar must follow the input field --> 
                 <script type="text/javascript">
                     Calendar.setup({
                         inputField   : "beginning_date",
-                        ifFormat     : "%d/%m/%Y",
+                        ifFormat     : "<!-- TMPL_VAR NAME="DHTMLcalendar_dateformat" -->",
                         button       : "button1",
                         align        : "Tl"
                     });
-                </script>
-                <script type="text/javascript">
                     Calendar.setup({
                         inputField   : "beginning_date",
-                        ifFormat     : "%d/%m/%Y",
+                        ifFormat     : "<!-- TMPL_VAR NAME="DHTMLcalendar_dateformat" -->",
                         button       : "beginning_date",
                         align        : "Tl"
                     });
                 </script>
-            </td>
-        </tr>
-        <tr>
-            <td>Subscription length</td>
-            <td>
-                <select name="subtype">
+            <span class="required">Required</span>
+        </li>
+        <li>
+            <label for="subtype" class="required">Subscription length:</label>
+            
+                <select name="subtype" id="subtype">
                     <!-- TMPL_LOOP NAME="subtype" -->
                         <!-- TMPL_IF NAME="selected" -->
-                        <option value="<!-- TMPL_VAR NAME="name" -->"  selected="SELECTED">
+                        <option value="<!-- TMPL_VAR NAME="name" -->" selected="selected">
                         <!-- TMPL_ELSE -->
                         <option value="<!-- TMPL_VAR NAME="name" -->">
                         <!-- /TMPL_IF -->
@@ -976,18 +1285,26 @@ function check_input(e){
                         </option>
                     <!-- /TMPL_LOOP -->
                 </select>
-                <input type="text" name="sublength" value="<!-- TMPL_VAR name="sublength" -->" size="3" onkeypress="return check_input(event)"> (*) (enter amount in numerals)
-            </td>
-        </tr>
-    <tr>
-        <td>Numbering calculation</td>
-        <td>Numbering formula: <input type="text" name="numberingmethod" value="<!-- TMPL_VAR name="numberingmethod" -->"></td>
-    </tr>
-    <tr>
-    <td colspan=3>
-        <div id="basetable" style="display: none;">
+                <input type="text" name="sublength" value="<!-- TMPL_VAR name="sublength" -->" size="3" onkeypress="return check_input(event)" /> (enter amount in numerals)
+            <span class="required">Required</span>
+        </li>
+    <li><label for="numberingmethod">Numbering formula:</label> <input type="text" name="numberingmethod" id="numberingmethod" value="<!-- TMPL_VAR name="numberingmethod" -->" />
+    </li>
+    </ol>
+       </fieldset>
+</div>
+       <fieldset class="action">
+       <input type="button" class="action_test" value="Test Prediction Pattern" onclick="javascript:irregularity_check()" />
+       <input type="button" class="action_reset" value="Reset Pattern" onclick="javascript:reset_pattern()" />
+    <input type="button" class="action_save"  value="Save subscription" onclick="Check(this.form)" accesskey="w" />
+       </fieldset>
+    <fieldset class="action">
+    <input type="button" class="action_advanced" value="Show/Hide Advanced Pattern" onclick="javascript:display_table()" />
+    </fieldset>
+           <div id="basetable"  style="display: none;">
             <table class="small">
-                <tr>
+                <tr><th colspan="4">Advanced Prediction Pattern</th></tr>
+                               <tr>
                     <th>&nbsp;</th>
                     <th>X</th>
                     <th>Y</th>
@@ -996,40 +1313,38 @@ function check_input(e){
                 <tr>
                     <td>Add</td>
                     <td>
-                        <input type="text" name="add1" value="<!-- TMPL_VAR name="add1" -->">
+                        <input type="text" name="add1" id="add1" value="<!-- TMPL_VAR name="add1" -->" />
                     </td>
                     <td>
-                        <input type="text" name="add2" value="<!-- TMPL_VAR name="add2" -->">
+                        <input type="text" name="add2" id="add2" value="<!-- TMPL_VAR name="add2" -->" />
                     </td>
                     <td>
-                        <input type="text" name="add3" value="<!-- TMPL_VAR name="add3" -->">
+                        <input type="text" name="add3" id="add3" value="<!-- TMPL_VAR name="add3" -->" />
                     </td>
                 </tr>
                 <tr>
                     <td>once every</td>
-                    <td><input type="text" name="every1" value="<!-- TMPL_VAR name="every1" -->"></td>
-                    <td><input type="text" name="every2" value="<!-- TMPL_VAR name="every2" -->"></td>
-                    <td><input type="text" name="every3" value="<!-- TMPL_VAR name="every3" -->"></td>
+                    <td><input type="text" name="every1" id="every1" value="<!-- TMPL_VAR name="every1" -->" /></td>
+                    <td><input type="text" name="every2" id="every2" value="<!-- TMPL_VAR name="every2" -->" /></td>
+                    <td><input type="text" name="every3" id="every3" value="<!-- TMPL_VAR name="every3" -->" /></td>
                 </tr>
                 <tr>
                     <td>When more than</td>
-                    <td><input type="text" name="whenmorethan1" value="<!-- TMPL_VAR name="whenmorethan1" -->"></td>
-                    <td><input type="text" name="whenmorethan2" value="<!-- TMPL_VAR name="whenmorethan2" -->"></td>
-                    <td><input type="text" name="whenmorethan3" value="<!-- TMPL_VAR name="whenmorethan3" -->"></td>
+                    <td><input type="text" name="whenmorethan1" id="whenmorethan1" value="<!-- TMPL_VAR name="whenmorethan1" -->" /></td>
+                    <td><input type="text" name="whenmorethan2" id="whenmorethan2" value="<!-- TMPL_VAR name="whenmorethan2" -->" /></td>
+                    <td><input type="text" name="whenmorethan3" id="whenmorethan3" value="<!-- TMPL_VAR name="whenmorethan3" -->" /></td>
                 </tr>
-                <!-- TMPL_IF name="mod" -->
                 <tr>
-                    <td>The loop is for instance</td>
-                    <td><input type="text" name="innerloop1" value="<!-- TMPL_VAR name="innerloop1" -->"></td>
-                    <td><input type="text" name="innerloop2" value="<!-- TMPL_VAR name="innerloop2" -->"></td>
-                    <td><input type="text" name="innerloop3" value="<!-- TMPL_VAR name="innerloop3" -->"></td>
+                    <td>inner counter</td>
+                    <td><input type="text" name="innerloop1" id="innerloop1" value="<!-- TMPL_VAR name="innerloop1" -->" /></td>
+                    <td><input type="text" name="innerloop2" id="innerloop2" value="<!-- TMPL_VAR name="innerloop2" -->" /></td>
+                    <td><input type="text" name="innerloop3" id="innerloop3" value="<!-- TMPL_VAR name="innerloop3" -->" /></td>
                 </tr>
-                <!-- /TMPL_IF -->
                 <tr>
                     <td>Set back to</td>
-                    <td><input type="text" name="setto1" value="<!-- TMPL_VAR name="setto1" -->"></td>
-                    <td><input type="text" name="setto2" value="<!-- TMPL_VAR name="setto2" -->"></td>
-                    <td><input type="text" name="setto3" value="<!-- TMPL_VAR name="setto3" -->"></td>
+                    <td><input type="text" name="setto1" id="setto1" value="<!-- TMPL_VAR name="setto1" -->" /></td>
+                    <td><input type="text" name="setto2" id="setto2" value="<!-- TMPL_VAR name="setto2" -->" /></td>
+                    <td><input type="text" name="setto3" id="setto3" value="<!-- TMPL_VAR name="setto3" -->" /></td>
                 </tr>
                 <tr>
                     <td>
@@ -1039,107 +1354,59 @@ function check_input(e){
                             Begins with
                         <!-- /TMPL_IF -->
                     </td>
-                    <td><input type="text" name="lastvalue1" value="<!-- TMPL_VAR name="lastvalue1" -->"></td>
-                    <td><input type="text" name="lastvalue2" value="<!-- TMPL_VAR name="lastvalue2" -->"></td>
-                    <td><input type="text" name="lastvalue3" value="<!-- TMPL_VAR name="lastvalue3" -->"></td>
+                    <td><input type="text" name="lastvalue1" id="lastvalue1" value="<!-- TMPL_VAR name="lastvalue1" -->" /></td>
+                    <td><input type="text" name="lastvalue2" id="lastvalue2" value="<!-- TMPL_VAR name="lastvalue2" -->" /></td>
+                    <td><input type="text" name="lastvalue3" id="lastvalue3" value="<!-- TMPL_VAR name="lastvalue3" -->" /></td>
                 </tr>
             </table>
         </div>
-        </td></tr>
-    </table>
+
 </div>
+
+</form>
+</div>
+
 <!--TMPL_IF Name="history"-->
 <div id="subscription_form_history">
-    <h2>History</h2>
-    <table>
-        <tr>
-          <td>Starting date:</td>
-          <td><input type="text" name="histstartdate" value="<!-- TMPL_VAR name="histstartdate" -->"> (the date of the 1st subscription)</td>
-        </tr>
-        <tr>
-          <td>Ending date:</td>
-          <td><input type="text" name="enddate" value="<!-- TMPL_VAR name="enddate" -->">(if empty : subscription still active)</td>
-        </tr>
-        <tr>
-            <td>Recieved issues</td>
-            <td><textarea name="recievedlist" cols="60" rows="5"><!-- TMPL_VAR name="recievedlist" --></textarea></td>
-        </tr>
-        <tr>
-            <td>Missing issues</td>
-            <td><textarea name="missinglist" cols="60" rows="5"><!-- TMPL_VAR name="missinglist" --></textarea></td>
-        </tr>
-        <tr>
-            <td>Opac's notes</td>
-            <td><textarea name="opacnote" cols="60" rows="5"><!-- TMPL_VAR name="opacnote" --></textarea></td>
-        </tr>
-        <tr>
-            <td>Librarian notes</td>
-            <td><textarea name="librariannote" cols="60" rows="5"><!-- TMPL_VAR name="librariannote" --></textarea></td>
-        </tr>
-    </table>
+    <h2>Subscription history</h2>
+    <form method="post" action="/cgi-bin/koha/serials/subscription-add.pl">
+        <input type="hidden" name="op" value="modsubscription" />
+        <input type="hidden" name="subscriptionid" value="<!-- TMPL_VAR name="subscriptionid" -->" />
+        <input type="hidden" name="history_only" value="1" />
+        <p>Hint : you can update the serial history manually. This can be useful for an old subscription or to clean the existing history. Modify these fields with care, as future serial receive will continue to update them automatically.</p>
+        <fieldset class="rows">
+               <ol>
+            <li>
+            <label for="histstartdate">Subscription start date</label>
+            <input type="text" name="histstartdate" id="histstartdate" value="<!-- TMPL_VAR name="histstartdate" -->" /><div class="hint"> (start date of the 1st subscription)</div>
+            </li>
+            <li>
+            <label for="histenddate">Subscription end date</label>
+            <input type="text" name="histenddate" id="histenddate" value="<!-- TMPL_VAR name="histenddate" -->" /> <div class="hint">(if empty, subscription is still active)</div>
+            </li>
+            <li>
+                <label for="recievedlist">Received issues</label>
+            <textarea name="recievedlist" id="recievedlist" cols="60" rows="5"><!-- TMPL_VAR name="recievedlist" --></textarea>
+            </li>
+            <li>
+                <label for="missinglist">Missing issues</label>
+            <textarea name="missinglist" id="missinglist" cols="60" rows="5"><!-- TMPL_VAR name="missinglist" --></textarea>
+            </li>
+            <li>
+                <label for="opacnote">Note for OPAC</label>
+            <textarea name="opacnote" id="opacnote" cols="60" rows="5"><!-- TMPL_VAR name="opacnote" --></textarea>
+            </li>
+            <li>
+                <label for="librariannote">Note for staff</label>
+            <textarea name="librariannote" id="librariannote" cols="60" rows="5"><!-- TMPL_VAR name="librariannote" --></textarea>
+            </li>
+               </ol>
+        </fieldset>
+    <fieldset class="action"><input type="submit" value="Save subscription history"  /></fieldset>
+    </form>
 </div>
 <!--/TMPL_IF-->
-<!-- TMPL_IF name="mod" -->
-    <input type="button" value="Save subscription" onclick="Check(this.form)" accesskey="w">
-<!-- TMPL_ELSE -->
-    <input type="button" value="Add subscription" onclick="Check(this.form)" accesskey="w">
-<!-- /TMPL_IF -->
-</form>
-</div>
 
+</div>
 
 <!-- TMPL_INCLUDE NAME="intranet-bottom.inc" -->
-
-<script language="JavaScript" type="text/javascript">
-function Create_biblio(f)
-{
-   window.open('/cgi-bin/koha/cataloguing/addbiblio.pl?mode=popup','FindABibIndex','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 Check(f) {
-    if (f.startdate.value.length != 0 && f.sublength.value > 0) {
-        if (f.irreg_check.value == 1) {
-            document.f.submit();
-        } else {
-            if(f.numbering_pattern.value == ''){
-                alert(_("need to choose a numbering pattern"));
-            } else {
-                alert(_("need to check for irregularity by clicking 'Irregularity?'"));
-            }
-        }
-    } else {
-        alert(_('field marked with * are mandatory'));
-    }
-    return false;
-}
-</script>
-<!-- TMPL_IF name="mod" -->
-<script type="text/javascript">
-window.onload = modify_num_pattern();
-    <!-- TMPL_IF name="hemisphere" -->
-    window.onload = hemispheres(<!-- TMPL_VAR NAME="hemisphere" -->);
-    <!-- /TMPL_IF -->
-</script>
-<!-- /TMPL_IF -->
-<!-- TMPL_IF name="irregularity" -->
-<script type="text/javascript">
-window.onload = irregularity_check();
-window.onload = irregular_order();
-</script>
-<!-- /TMPL_IF -->