/* ----------------------------------------------------- */
/* Defines design of website, inclusive navigation       */
/* (Parameter "textcolumns" defines number of columns.   */
/* Valid values are 1 or 2)                              */
/* ----------------------------------------------------- */

function DesignOfWebsite(textcolumns)
{
  if   (textcolumns == 2) { columnspan = ''; } else { columnspan = 'colspan=3'; } /* note 5 */
  document.write('<body background="images/_icon-top.jpg" bgproperties="fixed">');
  preloadImages(); /* note 1 */
  document.write('<a name="top"></a>'); /* note 2 */

  /* note 3 + 4 */
  document.write('<table width="1004" height="100%" cellpadding="0" cellspacing="0" valign="top" border="0">');
  document.write('<colgroup> <col width="170"> <col width="60"> <col width="515"> <col width="55"> <col width="188"> <col width="16"> </colgroup>');

  /* 1. TR: logo | 2.-5. TD empty cells */
  document.write('<tr><td width="170" height="102"><a href="index.html"><img src="images/ci_logo.gif" width="170" height="102" alt="" border="0"></a></td>');
  document.write('<td width="60" height="102"><img src="images/_blank.gif" width="60" height="102" alt="" border="0"></td>');
  document.write('<td width="515" height="102"><img src="images/_blank.gif" width="515" height="102" alt="" border="0"></td>');
  document.write('<td width="55" height="102"><img src="images/_blank.gif" width="55" height="102" alt="" border="0"></td>');
  document.write('<td width="188" height="102"><img src="images/_blank.gif" width="188" height="102" alt="" border="0"></td>');
  document.write('<td width="16" height="102"><img src="images/_blank.gif" width="16" height="102" alt="" border="0"></td>');

  /* 2. TR - 1. TD: navigation */
  document.write('<tr><td background="images/ci_navi-background.gif" width="170" height="100%" valign="top">');
  document.write('<img src="images/ci_navi-background.gif" width="170" height="35" alt="" border="0"><br>');
  showMenu("alltag");
  showMenu("wissen");
  showMenu("oertliches");
  showMenu("geld");
  showMenu("essentrinken");
  showMenu("events");
  showMenu("sprachen");
  showMenu("computer");
  showMenu("unternehmer");
  document.write('<img src="images/ci_navi-whiteline.gif" width="170" height="3" alt="" border="0"><br><br>');
  showMenu("kontakt");
  document.write('<img src="images/ci_navi-whiteline.gif" width="170" height="3" alt="" border="0"><br>');
  document.write('</td>');

  /* 2. TR - 2.-3. TD: spacer with top-button | text area */
  document.write('<td width="60" background="images/_blank.gif" onClick="self.location.href=\'#top\'" title="zur&uuml;ck zum Seitenanfang" height="100%" valign="top">&nbsp;</td>');
  document.write('<td ' + columnspan + ' height="100%" valign="top" align="left">');
}


/* ----------------------------------------------------- */
/* Show main and its submenu                             */
/* Main and submenu html-file has to follow the          */
/* conventions: main.html and main_submenu.html          */
/* ----------------------------------------------------- */

function showMenu(menu)
{ 
  /* ---- show main menu items ---- */
  var menuLink = menu + ".html";
  var str;

  if   (!locContains(menu)) /* note 6 */
       { str = 'style="display:none"';
         document.write('<a href="' + menuLink + '"' +
         'onmouseover="changeImages(\'m_' + menu + '\', \'images/m_' + menu + '-down.gif\'); window.status=\'\'; return true;"' +
         'onmouseout="changeImages(\'m_' + menu + '\', \'images/m_' + menu + '.gif\'); window.status=\'\'; return true;">' +
         '<img name="m_' + menu + '" src="images/m_' + menu + '.gif" alt="" width="170" height="35" border="0"></a><br>');
       }
  else { str = ''; 
         document.write('<a href="' + menuLink + '"><img name="m_' + menu + '" src="images/m_' + menu + '-down.gif" alt="" width="170" height="35" border="0"></a><br>');
       }
}


/* ----------------------------------------------------- */
/* Add footer to main content column                     */
/* - You can add additional text in the html page, but   */
/*   without <p>, i.e. write only the text after calling */
/*   Footer(spacing)                                     */
/* - spacing=0 complies to margin-top=85px (default)     */
/* ----------------------------------------------------- */

function Footer(spacing)
{ 
  if   (locContains('/en/'))
       { var copyrightLink = 'Legal Notices and Terms; Privacy Statement'; }
  else { var copyrightLink = 'Rechtliche Hinweise und Datenschutz'; }
  if   (spacing == 0) spacing = "85"
  document.write('<p class="smallgray" style="line-height:2.0; margin-top:' + spacing + 'px; text-align:center;"><a href="copyright.html" class="smallgray" style="text-decoration:none">' + copyrightLink + '</a>');
}

/* ----------------------------------------------------- */
/* Closes main content cell                              */
/* And opens small content column if needed              */
/* ----------------------------------------------------- */

function SmallColumn()
{ 
  /* 2. TR - 4.-5. TD: close main content cell and if 2-columns for text: add spacer and open sub content cell */
  document.write('</p>');
  document.write('</td>');
  if   (columnspan == '') /* note 5 */
       { document.write('<td width="55" height="100%" valign="top"><img src="images/_blank.gif" width="55" height="1" alt="" border="0"></td>');
         document.write('<td width="188" height="100%" valign="top"><img src="images/_blank.gif" width="10" height="87" alt="" border="0"><br>');
       }
}

/* ----------------------------------------------------- */
/* Closes website                                        */
/* ----------------------------------------------------- */

function EndOfWebsite()
{ 
  /* 2. TR - 5.-6. TD: if 2-columns for text, close sub content cell | spacer */
  if   (columnspan == '') { document.write('</td>'); } /* note 5 */
  document.write('<td width="16" height="100%" valign="top">&nbsp;</td></tr>');
  /* 3. TR: small empty row | close table and website */
  document.write('<tr><td height="5" width="170" background="images/ci_navi-background.gif">&nbsp;</td>');
  document.write('<td width="60" background="images/_blank.gif" onClick="self.location.href=\'#top\'" title="zur&uuml;ck zum Seitenanfang" height="100%" valign="top">&nbsp;</td>');
  document.write('<td height="5" colspan="4">&nbsp;</td></tr>');
  document.write('</table></body></html>');
}

/* ----------------------------------------------------- */
/* Global variables and utilities                        */
/* ----------------------------------------------------- */

var preloadFlag = false;
var columnspan; /* note 5 */

function newImage(arg)
{ if (document.images)
     { rslt = new Image();
       rslt.src = arg;
       return rslt;
     }
}

function changeImages()
{ 
  if (document.images && (preloadFlag == true))
     { for (var i=0; i<changeImages.arguments.length; i+=2)
           { document[changeImages.arguments[i]].src = changeImages.arguments[i+1]; }
     }
}

/* Does URL contains certain string (=strSubstr)? */
function locContains(strSubstr)
{
  var strHREF = new String(window.location.href);
  strHREF = strHREF.toLowerCase();
  if   (strHREF.indexOf(strSubstr) != -1)
       { return true; }
  else { return false; }
}

/* Preload navigation buttons */
function preloadImages()
{ 
  if (document.images)
     { m_alltag_down = newImage("images/m_alltag-down.gif");
       m_wissen_down = newImage("images/m_wissen-down.gif");
       m_oertliches_down = newImage("images/m_oertliches-down.gif");
       m_geld_down = newImage("images/m_geld-down.gif");
       m_essentrinken_down = newImage("images/m_essentrinken-down.gif");
       m_events_down = newImage("images/m_events-down.gif");
       m_sprachen_down = newImage("images/m_sprachen-down.gif");
       m_computer_down = newImage("images/m_computer-down.gif");
       m_unternehmer_down = newImage("images/m_unternehmer-down.gif");
       m_kontakt_down = newImage("images/m_kontakt-down.gif");
       preloadFlag = true;
     }
}


/* ----------------------- */
/* Notes to implementation */
/* ----------------------- */
/*
Note 1:  document.write('<body onload="preloadImages()">'); would not work, 
         because the body statement will only be written in HTML file, i.e. 
         function would not be called
Note 2:  Only necessary for NS (top of page)
Note 3:  Table width = 1004 px (+ scrollbar 20px = 1024px).
         If set to 100% and screen resolution is different
         to 1024, then content will be pressed or stretched
Note 4:  Design with 5 columns: 
         navigation 170 px + main content 530 + spacer 40px
         + sub content 188px + spacer 16px = 1004px 
         Proof with alert(document.body.offsetWidth);
Note 5:  Web page is standardized programmed with 2-columns for text -- 
         call function "DesignOfWebsite(2)".
         For special pages a 1-column page is possible (DesignOfWebsite(1)) 
         -- this is programmed with the help of "colspan".
Note 6:  Set "menuLink" instead of "menu" if you don't want to 
         show submenu when certain submenu item is clicked
Note 7:  Indent of sub menus made with "&nbsp", because margin-left 
         in css doesn't work with IE 6
Note 8:  If error: See whether div=name is defined and closed (</div>)
         and if image has a name (e.g. m_unternehmen and submenu m_unternehmen01)
*/

