var imagebase = 'border';
var backgroundimage = 'spc_trans.gif';
var bodyimage = 'blank';
var scrwidth = '1000';
var scrheight = '768';
var scrtop = '10'; //0 for no top offset
var horzoffset = '18';
var vertoffset = '10';
var bordersize = '5'; //0 for no border
var bodywidth = parseInt(scrwidth) - parseInt(2*bordersize)
var bodyheight = parseInt(scrheight) - parseInt(2*bordersize)
var bodytoph = '120'; //0 for no 1st top bar
var body1toph = '25'; //0 for no 2nd top bar
var bodyleftw = '0'; //0 for no left bar
var bodyrightw = '0'; //0 for no right bar
var bodybottomh = '34'; // 0 for no 1st bottom bar
var body1bottomh = '34'; // 0 for no 2nd bottom bar
var bodycenterh = parseInt(bodyheight) - parseInt(bodytoph) - parseInt(body1toph) - parseInt(bodybottomh) - parseInt(body1bottomh);
var bodycenterw = parseInt(bodywidth) - parseInt(bodyleftw) - parseInt(bodyrightw);
var columnspan = '1';


function maketemplate() {

   var cw = document.documentElement.clientWidth;
   var ch = document.documentElement.clientHeight;

   cw = cw - parseInt(horzoffset);
   ch = ch - parseInt(vertoffset);

   cw1=cw-parseInt(scrwidth);
   cw1=cw1/2;
   if (cw1 < 0) {cw1 = 0}

   ch1=ch-parseInt(scrheight)-parseInt(scrtop);
   if (ch1 < 0) {ch1 = 0}

   document.getElementById('top').innerHTML = '<img src="images/' + backgroundimage + '" height="' + scrtop + '" width = "100%" alt="" />'
   document.getElementById('left').innerHTML = '<img src="images/' + backgroundimage + '" height="' + scrheight + '" width = "' + cw1 + '" alt="" />'
   document.getElementById('right').innerHTML = '<img src="images/' + backgroundimage + '" height="' + scrheight + '" width = "'+ cw1 + '" alt="" />'
   document.getElementById('bottom').innerHTML = '<img src="images/' + backgroundimage + '" height="' + ch1 + '" width = "100%" alt="" />'

   var HTML_string = '<table cellspacing="0" cellpadding="0" border="0" align="center">'
   HTML_string += '<tr>'
   HTML_string += '<td><img src="images/' + imagebase + '/nw.png" height="' + bordersize + '" width = "' + bordersize + '" alt=""></td>'
   HTML_string += '<td><img src="images/' + imagebase + '/top.png" height="' + bordersize + '" width = "' + bodywidth + '" alt=""></td>'
   HTML_string += '<td><img src="images/' + imagebase + '/ne.png" height="' + bordersize + '" width = "' + bordersize + '" alt=""></td>'
   HTML_string += '</tr>'
   HTML_string += '<tr>'
   HTML_string += '<td><img src="images/' + imagebase + '/left.png" height="' + bodyheight + '" width = "' + bordersize + '" alt=""></td>'
   HTML_string += '<td id="body_main" height="' + bodyheight + '" width = "' + bodywidth + '" style="background-image: url(images/' + bodyimage + '.png);"></td>'
   HTML_string += '<td><img src="images/' + imagebase + '/right.png" height="' + bodyheight + '" width = "' + bordersize + '" alt=""></td>'
   HTML_string += '</tr>'
   HTML_string += '<tr>'
   HTML_string += '<td><img src="images/' + imagebase + '/sw.png" height="' + bordersize + '" width = "' + bordersize + '" alt=""></td>'
   HTML_string += '<td><img src="images/' + imagebase + '/bottom.png" height="' + bordersize + '" width = "' + bodywidth + '" alt=""></td>'
   HTML_string += '<td><img src="images/' + imagebase + '/se.png" height="' + bordersize + '" width = "' + bordersize + '" alt=""></td>'
   HTML_string += '</tr>'
   HTML_string += '</table>'
   document.getElementById('main').innerHTML = HTML_string

   if (bodyleftw > 0) {columnspan += parseInt(1)}
   if (bodyrightw > 0) {columnspan += parseInt(1)}

   HTML_string = '<table cellspacing="0" cellpadding="0" border="0" align="center">'

   if (bodytoph > 0) {
      HTML_string += '<tr>'
      HTML_string += '<td id="body_top" colspan="' + columnspan + '" align="left" valign="middle" height="' + bodytoph + '" style="background-image: url(images/topbar.png);"></td>'
      HTML_string += '</tr>'
   }

   if (body1toph > 0) {
      HTML_string += '<tr>'
      HTML_string += '<td id="body_top1" colspan="' + columnspan + '" align="left" valign="middle" height="' + body1toph + '" style="background-image: url(images/bluebuttonb.png);"></td>'
      HTML_string += '</tr>'
   }

   HTML_string += '<tr>'

   if (bodyleftw > 0) {
      HTML_string += '<td id="body_left" height="' + bodycenterh + '" width = "' + bodyleftw + '" style="background-image: url(images/leftbar.png);"></td>'
   }

   HTML_string += '<td id="body_center" align="left" valign="top" height="' + bodycenterh + '" width = "' + bodycenterw + '" style="background-image: url(images/middlebar.png);"></td>'

   if (bodyrightw > 0) {
      HTML_string += '<td id="body_right" height="' + bodycenterh + '" width = "' + bodyrightw + '" style="background-image: url(images/rightbar.png);"></td>'
   }

   HTML_string += '</tr>'

   if (body1bottomh > 0) {
      HTML_string += '<tr>'
      HTML_string += '<td id="body_bottom1" colspan="' + columnspan + '" height="' + body1bottomh + '" style="background-image: url(images/bluebutton1b.png);"></td>'
      HTML_string += '</tr>'
   }

   if (bodybottomh > 0) {
      HTML_string += '<tr>'
      HTML_string += '<td id="body_bottom" colspan="' + columnspan + '" height="' + bodybottomh + '" style="background-image: url(images/bottombar.png);"></td>'
      HTML_string += '</tr>'
   }

   HTML_string += '</table>'
   document.getElementById('body_main').innerHTML = HTML_string

}