/*
 * The following (global) variables are declarated in specified file references:
 *  - resources			(/logic/resources.js)
 *  - mediatypes		(/logic/shopdata.js)
 *  - businessunits	(/logic/shopdata.js)
 *  - languages			(/logic/shopdata.js)
*/

var COLOR_HIGHLIGHT	= "#f5f5f5";
var COLOR_NORMAL		= "#ffffff";

COLOR_HIGHLIGHT = COLOR_NORMAL; //disable old Corporate Design

/*
 *	Generates localizable HTML for shopcart page.
 *  @param locale - the locale e.g. 'de'
 */
function generateShopcartInputForm(locale) {
	var html = "";
	html = html + "  <table class='shoptable' style='width:530px;'>\n";
	html = html + "    <tr>\n";
	html = html + "      <td colspan='3' class='headText' style='margin-top:10px; padding:0px 10px 15px 16px;'>\n";
	html = html + "        <b>"+resources[locale]["label.shopcart.title"]+"</b><br/>\n";
	html = html + "        <p>"+resources[locale]["label.shopcart.subtitle"]+"</p>\n";
	html = html + "      </td>\n";
	html = html + "    </tr>\n";
	html = html + "  </table>\n";
	return html;
}

function generateOrderInputForm(locale) {
	var html = "";
	html = html + "  <table class='shoptable' style='width:530px;'>\n";
	html = html + "    <tr>\n";
	html = html + "      <td colspan='3' class='headText' style='margin-top:10px; padding:0px 10px 15px 16px;'>\n";
	html = html + "        <b>"+resources[locale]["label.order.title"]+"</b><br/>\n";
	html = html + "        <p>"+resources[locale]["label.order.subtitle"]+"</p>\n";
	html = html + "      </td>\n";
	html = html + "    </tr>\n";
	html = html + "  </table>\n";
	return html;
}

function generateLanguageInputForm(locale) {
	var html = "";
//	html = html + "<div id='inputForm'>\n";
	html = html + "  <table border='0' cellpadding='0' cellspacing='0'>\n";
	html = html + "    <tr>\n";
	html = html + "      <td width='18'><img src='" + HOST + "images/transparent.gif' width='18' height='1' alt='' /></td>\n";
	html = html + "      <td class='plaininverse' style='padding:15px 0 20px 0;'>\n";
	html = html + "        <b>"+resources[locale]["label.language.title"]+"</b><br/>\n";
	html = html + "        <p style='margin-top:5px;'>"+resources[locale]["label.language.subtitle"]+"</p>\n";
	html = html + "      </td>\n";
	html = html + "    </tr>\n";
	html = html + "  </table>\n";
//	html = html + "</div>\n";
	return html;
}

function generateSearchInputForm(locale, formMediatype, formBusinessunit, formLanguage, formPrintnorm) {
	var html = "";
	html = html + "<form name='searchForm' onSubmit='return search(0);' method='post'>";
	html = html + "  <div class='searchInputForm'>";

	html = html + "    <div>" + resources[locale]["welcome.media"] + "</div>";

	html = html + "    <table class='searchInputFormTable'>";
	html = html + "    <tr>\n";
	html = html + "      <td><img src='" + HOST + "images/transparent.gif' height='1' width='160' alt='' /></td>\n";
	html = html + "      <td><img src='" + HOST + "images/transparent.gif' height='1' width='160' alt='' /></td>\n";
	html = html + "      <td><img src='" + HOST + "images/transparent.gif' height='1' width='160' alt='' /></td>\n";
	html = html + "    </tr>\n";

	html = html + "    <tr>\n";
	html = html + "      <td>"+resources[locale]["label.mediatype"]+":</td>\n";
	html = html + "      <td style='height: 22px;'>"+generateMediatypeSelectBox(locale,formMediatype)+"</td>\n";
	html = html + "      <td />";
	html = html + "    </tr>\n";
	
	html = html + "    <tr>\n";
	html = html + "      <td>"+resources[locale]["label.businessunit"]+":</td>\n";
	html = html + "      <td style='height: 22px;'>"+generateBusinessunitSelectBox(locale,formBusinessunit)+"</td>\n";
	html = html + "      <td />\n";
	html = html + "    </tr>\n";

	html = html + "    <tr>\n";
	html = html + "      <td>"+resources[locale]["label.language"]+":</td>\n";
	html = html + "      <td style='height: 22px;'>"+generateLanguageSelectBox(locale,formLanguage)+"</td>\n";
	html = html + "      <td style='text-align:left;'><input name='submitMixedSearch' type='button' onClick='search(0,0);' value='"+resources[locale]["button.search"]+"' class='button' /></td>\n";
	html = html + "    </tr>\n";
	
	html = html + "    <tr>\n";
	html = html + "      <td colspan='3' style='border-bottom:1px solid #b5c7d9;'>&nbsp;</td>\n";
	html = html + "    </tr>\n";
	html = html + "    <tr>\n";
	html = html + "      <td colspan='3'>&nbsp;</td>\n";
	html = html + "    </tr>\n";
	
	html = html + "    <tr height='1em;'>\n";
	html = html + "      <td>"+resources[locale]["label.search.term"]+":</td>\n";
	html = html + "      <td style='height: 22px;'><input name='number' type='text' maxlength='20' value='"+formPrintnorm+"' class='text' style='width:168px;' /></td>\n";
	html = html + "      <td style='text-align:left;'><input name='submitOrderNumberSearch' type='button' onClick='search(0,1);' value='"+resources[locale]["button.search"]+"' class='button' /></td>\n";
	html = html + "    </tr>\n";

	html = html + "  </table>";
	html = html + "  </div>";
	html = html + "</form>\n";
	return html;
}

function generateMediatypeSelectBox(locale, selectedMediatype) {
	var html = "";
	html = html + "<select name='mediatype' class='select' style='width:168px;' onchange=\"number.value='';\">\n";
	html = html + "  <option value='0'>"+resources[locale]["select.option.none"]+"...</option>\n";
	for (var i=0; i<=mediatypes.length; i++) {
		var tempMT = mediatypes[i];
		if (tempMT) {
			//exists the current mediatype in media data? false=leave out
			if(!existsMediatype(tempMT.resourceKey)) { continue; }
			html = html + "  <option value='"+tempMT.resourceKey+"'";
			if (tempMT.resourceKey==selectedMediatype) {
				html = html + " selected='selected'";
			}
			html = html + ">"+resources[locale][tempMT.resourceKey]+"</option>\n";
		}
	}
	html = html + "</select>\n";
	return html;
}

function existsMediatype(mtResourceKey) {
	for (var i=0; i<media.length; i++) {
		if (media[i].mediatype==mtResourceKey) { return true; }
	}
	return false;
}

function generateBusinessunitSelectBox(locale,selectedBusinessunit) {
	var html = "";
	html = html + "<select name='businessunit' class='select' style='width:168px;' onchange=\"number.value='';\">\n";
	html = html + "  <option value='0'>"+resources[locale]["select.option.none"]+"...</option>\n";
	for (var i=0; i<=businessunits.length; i++) {
		var tempBU = businessunits[i];
		if (tempBU) {
			//exists the current businessunit in media data? false=leave out
			if (!existsBusinessunit(tempBU.shortname)) { continue; }
			html = html + "  <option value='"+tempBU.shortname+"'";
			if (tempBU.shortname==selectedBusinessunit) {
				html = html + " selected='selected'";
			}
			html = html + ">"+tempBU.name+"</option>\n";
		}
	}
	html = html + "</select>\n";
	return html;
}

function existsBusinessunit(buShortname) {
	for (var i=0; i<media.length; i++) {
		if (media[i].businessunit==buShortname) { return true; }
	}
	return false;
}

function generateLanguageSelectBox(locale, selectedLanguage) {
	var html = "";
	html = html + "<select name='language' class='select' style='width:168px;' onchange=\"number.value='';\";'>\n";
	html = html + "  <option value='0'>"+resources[locale]["select.option.none"]+"...</option>\n";
	for (var i=0; i<=languages.length; i++) {
		var tempLG = languages[i];
		if (tempLG) {
			//exists the current language in media data? false=leave out
			if(!existsLanguage(tempLG.resourceKey)) { continue; }
			html = html + "  <option value='"+tempLG.resourceKey+"'";
			if (tempLG.resourceKey==selectedLanguage) {
				html = html + " selected='selected'";
			}
			html = html + ">"+resources[locale][tempLG.resourceKey]+"</option>\n";
		}
	}
	html = html + "</select>\n";
	return html;
}

function existsLanguage(langResourceKey) {
	for (var i=0; i<media.length; i++) {
		for (var l=0; l<media[i].languages.length; l++) {
			if (media[i].languages[l]==langResourceKey) { return true; }
		}
	}
	return false;
}

/**
 * Generates HTML snippet displaying one medium in searchresult page.
 *
 * @param locale - Locale
 * @param medium - Element
 * @param color - e.g. #f5f5f5
 */
function generateMediumSearchInfo(locale, medium, color) {
	var html = "";
	
	html = html + "<!-- Start Einzelner Artikel -->\n";
	html = html + "<tr>\n";
	html = html + "<td style='width:100%; padding:12px 0 12px 0; background:"+color+"; border-bottom:1px solid #829DBA;'>\n";
	html = html + "  <table style='width:100%;'>\n";
	html = html + "  <td style='text-align:center; vertical-align:top;'>\n";
	if (!medium.image) { medium.image="missing.gif"; }
	html = html + "    <img src='" + HOST + "images/product/"+medium.image+"' width='54' border='0' alt='' title='"+medium.printnorm+"'/>\n";
	html = html + "  </td>\n";
	html = html + "  <td class='plainblue' style='width:100%; vertical-align:top; padding-left:5px;'>\n";
	html = html + "    <b>"+medium.title+"</b><br/>\n";
	html = html + "    <span class='subtextblue'>";
	html = html + "      "+resources[locale][medium.mediatype]+"<br/>\n";
	html = html + "    </span>\n";
	html = html + "  </td>\n";
	html = html + "  <td><img src='" + HOST + "images/transparent.gif' width='1' height='1' alt=''></td>\n";

	//languages box:
	html = html + "  <td style='padding-left:15px; vertical-align:top;'>\n";
	html = html + "    <div style='width:174px; background:#153B63; color:white; padding:1px 3px 2px 3px;'>\n";
	html = html + "      <b>"+resources[locale]["label.language.available"]+"</b>\n";
	html = html + "    </div>\n";	

	var groupMedia = getGroupMedia(medium.groupID);
	//if medium has no mediums in group (empty group) and it contains more than one language
	if (medium.languages.length>1 && groupMedia.length==0) {
		html = html + "    <div style='cursor:pointer; width:174px; background:#B4C6D9; color:#153B62; border-bottom:1px solid white; padding:1px 3px 2px 3px;' onclick=\"generateMediumDetailsOverlay('"+medium.printnorm+"');\" onmouseover=\"this.style.backgroundColor='#A0B7CF';\" onmouseout=\"this.style.backgroundColor='#B4C6D9';\">\n";
		html = html + "      <span class='subtextblue'>\n";
		html = html + "        <img src='" + HOST + "images/pf_blue.gif' style='width:4px; height:7px; border:0;' alt='' />\n";
		html = html + "        &nbsp;"+resources[locale]["label.language.multi"]+"\n";
		html = html + "      </span>\n";
		html = html + "    </div>\n";
	} else {
		//lists all languages of each medium in same group
		if (groupMedia.length==0) groupMedia[0]=medium;
		var sml = getSortedMediaGroupLanguages(locale,groupMedia);
		for (var i=0; i<sml.length; i++) {
			//set background of linkbox if an ordernumber is searched directly and language of this medium matches
			var bgcolor = '#B4C6D9';
			if(sml[i][1].printnorm==queryOrdernumber) { bgcolor='#8CA8C5'; }
			html = html + "    <div style='cursor:pointer; width:174px; background:"+bgcolor+"; color:#153B62; border-bottom:1px solid white; padding:1px 3px 2px 3px;' onclick=\"generateMediumDetailsOverlay('"+sml[i][1].printnorm+"');\" title='"+sml[i][1].title+"' onmouseover=\"this.style.backgroundColor='#A0B7CF';\" onmouseout=\"this.style.backgroundColor='"+bgcolor+"';\">\n";
			html = html + "      <span class='subtextblue'>\n";
			html = html + "        <img src='" + HOST + "images/pf_blue.gif' style='width:4px; height:7px; border:0;' alt='' />\n";
			html = html + "        &nbsp;"+resources[locale][sml[i][0]]+"\n";
			html = html + "      </span>\n";
			html = html + "    </div>\n";
		}
	}
	html = html + "  </td>\n";
	//end of languages box

	html = html + "  </table>\n";
	html = html + "</td>\n";
	html = html + "</tr>\n";
	html = html + "<!-- Ende Einzelner Artikel -->\n";
    	
	return html;
}

/**
 * The old Format2 function.
 * Generates HTML snippet displaying one medium in medium languages page.
  *
 * @param locale - Locale
 * @param medium - Element
 * @param color - e.g. #f5f5f5
 */
function generateMediumLanguagesInfo(locale, medium, color) {
	var html = "";
		
	html = html + "<!-- Start Einzelner Artikel -->\n";
	
	html = html + "<!-- etwas leeren Platz ueber Artikel einfuegen -->\n";
	html = html + "<tr>\n";
	html = html + "  <td><img src='" + HOST + "images/transparent.gif' width='1' height='18' alt='' /></td>\n";
	html = html + "  <td bgcolor='"+color+"'/>\n";
	html = html + "</tr>\n";
	
	html = html + "<tr bgcolor=\'"+color+"'>\n";
	html = html + "  <td bgcolor='#ffffff'><img src='" + HOST + "images/transparent.gif' width='1' height='1' alt='' /></td>\n";
	html = html + "  <td>\n";
	html = html + "  <table width='100%'>\n";
	html = html + "    <tr>\n";
	html = html + "      <td>\n";
	html = html + "        <a href=\"javascript:openMediaDetail2Window('"+medium.ordernumber+"')\">\n";
	html = html + "          <img src='" + HOST + "images/product/"+medium.image+"' width='54' border='0' alt='' />\n";
	html = html + "        </a>\n";
	html = html + "      </td>\n";
	html = html + "      <td class='plainblue' valign='top' style='width:100%;'>\n";
	html = html + "        <a class='plainblue' href=\"javascript:openMediaDetail2Window('"+medium.ordernumber+"')\"><b>"+medium.title+"</b></a><br/>\n";
	html = html + "        <span class='subtextblue'>\n";
	html = html + "          "+resources[locale][medium.mediatype]+", "+medium.details+"<br/>\n";
	html = html + "          "+resources[locale]["label.orderNo"]+": "+medium.ordernumber+"\n";
	html = html + "        </span>\n";
	html = html + "      </td>\n";
	html = html + "      <td><img src='" + HOST + "images/transparent.gif' width='1' height='1' alt='' /></td>\n";
	html = html + "      <td valign='top'>\n";
	html = html + "        <table cellpadding='0' cellspacing='0' border='0' style='color:#153B62;'>\n";
	html = html + "          <tr>\n";
	html = html + "            <td>\n";
	html = html + "              <b>"+resources[locale]["label.language.contains"]+":</b><br/>\n";
	html = html + "              "+medium.language+"\n";
	html = html + "            </td>\n";
	html = html + "          </tr>\n";
	html = html + "          <tr>\n";
	html = html + "            <td class='menuebright'><img src='" + HOST + "images/transparent.gif' width='174' height='1' alt='' /></td>\n";
	html = html + "          </tr>\n";
	html = html + "          <tr>\n";
	html = html + "            <td class='subtextblue' height='18'>\n";
	html = html + "              <a href=\"javascript:addProduct('"+medium.ordernumber+"')\" class='subtextblue'>\n";
	html = html + "                <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
	html = html + "                &nbsp;&nbsp;"+resources[locale]["link.shopcart.add"]+"\n";
	html = html + "              </a>\n";
	html = html + "            </td>\n";
	html = html + "          </tr>\n";
	html = html + "        </table>\n";
	html = html + "      </td>\n";
	html = html + "    </tr>\n";
	html = html + "  </table>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	
	html = html + "<!-- etwas leeren Platz unter Artikel einfügen -->\n";
	html = html + "<tr>\n";
	html = html + "  <td><img src='" + HOST + "images/transparent.gif' width='1' height='18' alt='' /></td>\n";
	html = html + "  <td bgcolor='"+color+"' style='border-bottom:1px solid #829DBA;'/>\n";
	html = html + "</tr>\n";

/*	
	html = html + "<!-- dünner blauer Trennbalken am Ende eines Artikels -->\n";
	html = html + "<tr>\n";
	html = html + "  <td><img src='" + HOST + "images/transparent.gif' width='1' height='6' alt='' /></td>\n";
	html = html + "  <td bgcolor='#b5c7d9'><img src='" + HOST + "images/transparent.gif' width='1' height='1' alt='' /></td>\n";
	html = html + "</tr>\n";
*/	
	html = html + "<!-- Ende Einzelner Artikel -->\n";
	
	return html;
}

/**
 * The old Format3 function.
 * Generates HTML snippet displaying one medium in shopcart page.
 *
 * @param locale - Locale
 * @param medium - Element
 * @param color - e.g. #f5f5f5
 */
function generateMediumShopcartInfo(locale, medium, amount, color) {
	var html = "";
	
	html = html + "<tr>\n";
	html = html + "  <td style='padding:12px 0 12px 0; background:"+color+"; border-bottom:1px solid #829DBA;'>\n";
	html = html + "    <form onSubmit='return displayShopcart();' name='WarenkorbInfo"+medium.printnorm+"'>\n";

	html = html + "      <table class='shoptable'>\n";
	html = html + "        <tr>\n";
	html = html + "          <td style='text-align:center;'>\n";
	html = html + "            <a href=\"javascript:openMediumDetailsWindow('"+medium.printnorm+"')\">\n";
	html = html + "              <img src='" + HOST + "images/product/"+medium.image+"' border='0' alt='' />\n";
	html = html + "            </a>\n";
	html = html + "          </td>\n";
	html = html + "          <td style='width:100%; padding:0 3px 0 3px;'>\n";
	html = html + "            <a class='plainblue' href=\"javascript:openMediumDetailsWindow('"+medium.printnorm+"')\" title='"+resources[locale]["label.language"]+"'><b>"+medium.title+"</b></a><br/>\n";
	html = html + "            <span class='subtextblue'>\n";
	html = html + "              "+resources[locale][medium.mediatype]+", "+medium.specification+"<br/>\n";
	html = html + "              "+resources[locale]["label.language"]+": ";

	medium.languages = getSortedMediumLanguages(locale,medium);
	for (var i=0; i<medium.languages.length; i++) {
		html = html + resources[locale][medium.languages[i]];
		if (i<medium.languages.length-1) html = html + ", ";
	}

	html = html + "<br/>\n";
	html = html + "              "+resources[locale]["label.orderNo"]+": "+medium.printnorm+"\n";
	html = html + "            </span>\n";

	html = html + "          </td>\n";
	html = html + "          <td>\n";
	html = html + "            <table class='shoptable' style='width:165px; background:"+color+";'>\n";
	html = html + "              <tr>\n";
	html = html + "                <td class='subtextblue' style='width:100%; text-align:right; vertical-align:middle; padding-bottom:2px;'>"+resources[locale]["label.shopcart.quantity"]+":</td>\n";
	html = html + "                <td style='vertical-align:middle; padding:0px 5px 2px 5px;'><input type='text' class='stk' id='stk' size='1' maxlength='1' name='exemplare' value='"+amount+"' onchange=\"changeShopcartItem('"+medium.mediumID+"',this.value)\"/></td>\n";
	html = html + "                <td class='subtextblue' style='vertical-align:middle; padding-bottom:2px; white-space:nowrap;'>"+resources[locale]["label.shopcart.copies"]+"</td>\n";
	html = html + "              </tr>\n";
	html = html + "              <tr>\n";
	html = html + "                <td class='subtextblue' colspan='3' style='text-align:right; border-top:1px solid  #B4C6D9;'>\n";
	html = html + "                	 <a href=\"javascript:removeShopcartItem('"+medium.mediumID+"')\" class='subtextblue'>\n";
	html = html + "                    <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
	html = html + "                    &nbsp;"+resources[locale]["link.shopcart.remove"]+"\n";
	html = html + "                	 </a>\n";
	html = html + "                </td>\n";
	html = html + "              </tr>\n";
	html = html + "            </table>\n";
	html = html + "          </td>\n";
	html = html + "        </tr>\n";
	html = html + "      </table>\n";

	html = html + "    </form>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	
	html = html + "<!-- Ende Einzelner Artikel -->\n";
	
	return html;
}

function generateGeneralOutputForm(locale,innerHTML) {
	var html = "";
	html = html + "<table class='shoptable' style='width:100%;'>\n";
	html = html + innerHTML;
	html = html + "</table>\n";
	return html;
}

function generateShopcartOutputForm(locale, innerHTML) {
	var html = "";
	html = html + "<div id='outputForm'>\n";
	html = html + "  <table cellspacing='0' cellpadding='0' border='0'>\n";
	html = html + "    <tr>\n";
	html = html + "      <td width='6' bgcolor='#ffffff'><img src='" + HOST + "images/transparent.gif' width='6' height='12' alt='' /></td>\n";
	html = html + "      <td width='66'><img src='" + HOST + "images/transparent.gif' width='66' height='1' alt='' /></td>\n";
	html = html + "      <td width='264'><img src='" + HOST + "images/transparent.gif' width='264' height='1' alt='' /></td>\n";
	html = html + "      <td width='30'><img src='" + HOST + "images/transparent.gif' width='30' height='1' alt='' /></td>\n";
	html = html + "      <td width='174'><img src='" + HOST + "images/transparent.gif' width='174' height='1' alt='' /></td>\n";
	html = html + "    </tr>\n";
	html = html + "    <tr>\n";
	html = html + "      <td colspan='5'><img src='" + HOST + "images/transparent.gif' width='1' height='12' alt='' /></td>\n";
	html = html + "    </tr>\n";
	html = html + innerHTML;
	html = html + "      <td colspan=\"4\"><img src=\"" + HOST + "images/transparent.gif\" width=\"1\" height=\"1\"></td>\n";
	html = html + "      <td valign=\"top\">\n";
	html = html + "        <table cellpadding=\"0\" cellspacing=\"0\" border=\"0\">\n";
	html = html + "          <tr>\n";
	html = html + "            <td bgcolor=\"#829dba\"><img src=\"" + HOST + "images/transparent.gif\" width=\"162\" height=\"1\"></td>\n";
	html = html + "            <td bgcolor=\"#829dba\"><img src=\"" + HOST + "images/transparent.gif\" width=\"12\" height=\"1\"></td>\n";
	html = html + "          </tr>\n";
	html = html + "          <tr>\n";
	html = html + "            <td class=\"subtextblue\" height=\"17\" align=\"right\"><a href=\"javascript:dispatchBestellung()\" class=\"subtextblue\"><b>zur Bestellung</b></a></td>\n";
	html = html + "            <td align=\"center\"><a href=\"javascript:dispatchBestellung()\"><img src=\"" + HOST + "images/pf_bluevbig.gif\" width=\"6\" height=\"17\" border=\"0\" alt=\"\"></a></td>\n";
	html = html + "          </tr>\n";
	html = html + "          <tr>\n";
	html = html + "            <td colspan=\"2\" bgcolor=\"#829dba\"><img src=\"" + HOST + "images/transparent.gif\" width=\"1\" height=\"1\"></td>\n";
	html = html + "          </tr>\n";
	html = html + "        </table>\n";
	html = html + "      </td>\n";
	html = html + "    </tr>\n";
	html = html + "  </table>\n";
	html = html + "</div>\n";
	return html;
}

function generateOrderOutputForm(locale,shopcartMedia) {
	var html = "";
	for (var i=0; i<shopcartMedia.length; i++) {
		html = html + "<tr>\n";
		html = html + "  <td class='plainblue' style='vertical-align:top; padding:12px 12px 5px 12px; border-bottom:1px solid #829DBA;'>\n";
		html = html + "    <b>"+shopcartMedia[i].medium.title+"</b><br/>\n";
		html = html + "    <span class='subtextblue'>"+shopcartMedia[i].amount+"&nbsp;"+resources[locale]["label.shopcart.copies"]+"</span>\n";
		html = html + "  </td>\n";
		html = html + "</tr>\n";
	}
	
	html = html + "<tr>\n";
	html = html + "  <td style='vertical-align:top; padding:12px 0 12px 12px; text-align:left;'>\n";
	html = html + "    <form name='bestellung' method='post' focus='lastname'>\n";
	html = html + "      <input type='hidden' name='anzahl' value='"+shopcartMedia.length+"'>\n";
	for (var i=0; i<shopcartMedia.length; i++) {
		html = html + "      <!-- shopcart item no. "+i+" -->\n";
		html = html + "      <input type='hidden' name='titel"+i+"' value='"+shopcartMedia[i].medium.title+"'>\n";
		html = html + "      <input type='hidden' name='bestellnummer"+i+"' value='"+shopcartMedia[i].medium.printnorm+"'>\n";
		html = html + "      <input type='hidden' name='medientyp"+i+"' value='"+resources["de"][shopcartMedia[i].medium.mediatype]+"'>\n";
		var mediumLanguages = "";
		for (var l=0; l<shopcartMedia[i].medium.languages.length; l++) {
			mediumLanguages = mediumLanguages + resources["de"][shopcartMedia[i].medium.languages[l]];
			if (l<shopcartMedia[i].medium.languages.length-1)  mediumLanguages = mediumLanguages + ", ";
		
		}
		html = html + "      <input type='hidden' name='sprache"+i+"' value='"+mediumLanguages+"'>\n";
		html = html + "      <input type='hidden' name='stueck"+i+"' value='"+shopcartMedia[i].amount+"'>\n";
//		html = html + "      <input type='hidden' name='supplierid"+i+"' value='"+shopcartMedia[i].keysupplierid+"'>\n";
	}
	html = html + "\n      <input type='hidden' name='spruch1' value='vielen Dank f&uuml;r Ihre Bestellung von Bosch Informationsmaterial.'>\n";
	html = html + "      <input type='hidden' name='spruch2' value='Wir w&uuml;nschen Ihnen noch einen sch&ouml;nen Tag und verbleiben'>\n";
	html = html + "      <input type='hidden' name='spruch3' value='mit freundlichen Gr&uuml;&szlig;en'>\n";

	html = html + "    <table class='shoptable' style='background:#F1F1F1;'>\n";
	
	html = html + "      <tr>\n";
	html = html + "        <th colspan='2'>"+resources[locale]["label.order.address"]+"</th>\n";
	html = html + "      </tr>\n";
	
	html = html + "      <tr>\n";
	html = html + "        <td><img src='" + HOST + "images/transparent.gif' width='126' height='1' border='0'></td>\n";
	html = html + "        <td><img src='" + HOST + "images/transparent.gif' width='222' height='1' border='0'></td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td />\n";
	html = html + "        <td style='padding-top:4px;'>\n";
	html = html + "          <input type='radio' name='gender' value='Herr' checked>&nbsp;"+resources[locale]["label.order.mister"]+"\n";
	html = html + "          <input type='radio' name='gender' value='Frau' />&nbsp;"+resources[locale]["label.order.miss"]+"\n";
	html = html + "        </td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.lastname"]+" *</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px;'><input type='text' name='lastname' style='width:250px; font-size:11px;' /></td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.firstname"]+"</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px;'><input type='text' name='firstname' style='width:250px; font-size:11px;' /></td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.company"]+"</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px;'><input type='text' name= 'company' style='width:250px; font-size:11px;' /></td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.street"]+" *</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px;'><input type='text' name='street' style='width:250px; font-size:11px;' /><br/>"+resources[locale]["label.order.noPOB"]+"</td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.city"]+" *</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px; white-space:nowrap;'>\n";
	html = html + "          <input type='text' name='zipcode' style='width:50px; font-size:11px;' /><input type='text' name='city' style='width:200px; font-size:11px;' />\n";
	html = html + "        </td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.country"]+" *</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px;'>\n";
	html = html + "          <select name='country' style='width:250px; font-size:11px;'>\n";
	html = html + "            <option value=''>"+resources[locale]["select.option.none"]+"...</option>\n";
	for (var c=0; c<countries[locale].length; c++) {
		var letter = countries[locale][c];
		for (var l=0; l<letter.length; l++) {
			if (l==0)
				html = html + "            <optgroup label='"+letter[0]+"'>\n";
			else {
				var selected = "";
				if (letter[l]=="Germany" || letter[l]=="Deutschland") 
					selected = "selected='selected'";
				html = html + "            <option value='"+letter[l]+"' "+selected+">"+letter[l]+"</option>\n";
			}
		}
		html = html + "            </optgroup>\n";
	}
	html = html + "          </select>\n";
	html = html + "        </td>\n";
	html = html + "      </tr>\n";
	
	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.phone"]+" *</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px;'><input type='text' name='phone' style='width:250px; font-size:11px;' /></td>\n";
	html = html + "      </tr>\n";
	
	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;'>"+resources[locale]["label.order.email"]+" *</td>\n";
	html = html + "        <td style='padding-top:6px; padding-right:6px;'><input type='text' name='email' style='width:250px; font-size:11px;' /></td>\n";
	html = html + "      </tr>\n";

	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;' />\n";
	html = html + "        <td style='padding:8px 0 8px 0;'>"+resources[locale]["label.order.required"]+"</td>\n";
	html = html + "      </tr>\n";
	
	html = html + "      <tr>\n";
	html = html + "        <td style='padding-left:4px; vertical-align:middle;' />\n";
	html = html + "        <td style='padding-bottom:10px;'><input type='button' class='button' value='"+resources[locale]["link.order.send"]+"' onclick=\"submitForm('bestellung');\"/></td>\n";
	html = html + "      </tr>\n";
	
/*
	html = html + "      <tr>\n";
	html = html + "        <td colspan='2' style='padding:2px 0 2px 0; text-align:right; border-top:1px solid #829DBA; border-bottom:1px solid #829DBA;'>\n";
	html = html + "          <a href=\"javascript: submitForm('bestellung')\" class='subtextblue'>\n";
	html = html + "            <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
	html = html + "            &nbsp;<b>"+resources[locale]["link.order.send"]+"</b>\n";
	html = html + "          </a>\n";
	html = html + "        </td>\n";
	html = html + "      </tr>\n";
*/

	html = html + "    </table>\n";
	html = html + "    </form>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	
	return html;
}

function generateEmptySearchResult(locale) {
	var html = "";
	
	html = html + "<!-- weisse Trennzeile -->\n";
	html = html + "<tr>\n";
	html = html + "  <td><img src='" + HOST + "images/transparent.gif' width='1' height='12' alt='' /></td>\n";
	html = html + "</tr>\n";
	
	html = html + "<tr>\n";
	html = html + "  <td class='plainblue'>"+resources[locale]["label.search.nohits"]+"</td>\n";
	html = html + "</tr>\n";
	return html;
}

function generateShopcartInfobar(locale, itemCount) {
	var html = "";
	html = html + "<!-- Beginn Warenkorb -->\n";

	html = html + "<!-- gruene Warenkorbzeile -->\n";
	html = html + "<tr>\n";
	html = html + "  <td style='padding-top:12px;'>\n";
	html = html + "    <table class='shoptable' style='width:100%; background:#DCC644;'>\n";
	html = html + "      <tr>\n";
	html = html + "        <td class='subtextblue' colspan='2' style='padding:5px 0 0 5px;'>\n";
	html = html + "          <b>"+resources[locale]["label.shopcart.title"]+"</b>\n";
	html = html + "        </td>\n";
	html = html + "      </tr>\n";
	if (itemCount>0) {
		html = html + "      <tr>\n";
		html = html + "        <td class='subtextblue' style='padding:0 5px 5px 5px; text-align:left;'>\n";
		html = html + "          "+resources[locale]["label.shopcart.itemcount"]+": <b>"+itemCount+"</b>\n";
		html = html + "        </td>\n";
		html = html + "        <td class='subtextblue' style='padding:0 5px 5px 5px; text-align:right;'>\n";
		html = html + "          <a href='javascript:displayShopcart()' class='subtextblue'>\n"
		html = html + "            <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
		html = html + "            &nbsp;<b>"+resources[locale]["link.shopcart.to"]+"</b>\n";
		html = html + "          </a>\n";
		html = html + "        </td>\n";
		html = html + "      </tr>\n";
	} else {
		html = html + "      <tr>\n";
		html = html + "        <td class='subtextblue' colspan='2' style='padding:0 5px 5px 5px;'>\n"
		html = html + "           "+resources[locale]["label.shopcart.empty"]+"\n";
		html = html + "        </td>\n";
		html = html + "      </tr>\n";
	}
	html = html + "    </table>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	
	html = html + "<!-- Ende Warenkorb -->\n";
	return html;
}

function generateShopcartLinkbar(locale) {
	var html = "";
	
	html = html + "<!-- Beginn Warenkorbzeile am Fuss der Seite -->\n";
	html = html + "<tr>\n";
	html = html + "  <td style='width:100%; padding-top:10px; text-align:right;'>\n";
	html = html + "    <table class='shoptable' style='width:100%;'>\n";
	html = html + "      <tr>\n";
	html = html + "        <td style='padding:2px 0 2px 0; text-align:right; border-top:1px solid #829DBA; border-bottom:1px solid #829DBA;'>\n"
	html = html + "          <a href='javascript:displayShopcart();' class='subtextblue'>\n";
	html = html + "            <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
	html = html + "            &nbsp;<b>"+resources[locale]["link.shopcart.to"]+"</b>\n";
	html = html + "          </a>\n";
	html = html + "        </td>\n";
	html = html + "      </tr>\n";
	html = html + "    </table>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	html = html + "<!-- Ende Warenkorbzeile am Fuss der Seite -->\n";
	
	return html;
}

function generateOrderLinkbar(locale) {
	var html = "";
	
	html = html + "<tr>\n";
	html = html + "  <td style='padding-top:12px; vertical-align:top;'>\n";
	html = html + "    <table class='shoptable' style='width:100%;'>\n";
	html = html + "      <tr>\n";
	html = html + "        <td class='subtextblue' style='padding:2px 0 2px 0; text-align:right; border-top:1px solid #829DBA; border-bottom:1px solid #829DBA;'>\n"
	html = html + "          <a href='javascript:displayOrder();' class='subtextblue'>\n";
	html = html + "            <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
	html = html + "            &nbsp;<b>"+resources[locale]["link.order.to"]+"</b>\n";
	html = html + "          </a>\n";
	html = html + "        </td>\n";
	html = html + "      </tr>\n";
	html = html + "    </table>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	html = html + "<!-- Ende Warenkorbzeile am Fuss der Seite -->\n";
	
	return html;
}

function generatePager(locale,starter,pagingIncrement,countResult) {
	var html = "";
	
	html = html + "<!-- Start Pager -->\n";
	html = html + "<tr>\n";
	html = html + "  <td style='width:100%; text-align:center; padding-top:10px;'>\n";
	html = html + "    <table class='shoptable' style='width:100%; color:#153B62; background:#DFE9F4;'>\n";
	html = html + "      <tr>\n";

	html = html + "        <td style='width:33%; padding:3px 5px 3px 5px; text-align:left;'>\n";
	if (starter >= pagingIncrement) {
		html = html + "          <span class='subtextblue'>";
		html = html + "            <a href='javascript:search("+(starter-pagingIncrement)+")' title='"+resources[locale]["info.medium.previous"]+"' class='subtextblue'>\n";
		html = html + "              <img src='" + HOST + "images/pf_blueback.gif' width='4' height='7' border='0' alt='' />\n";
		html = html + "              &nbsp;"+resources[locale]["link.medium.previous"]+"\n";
		html = html + "            </a>\n";
		html = html + "          </span>\n";
	}
	html = html + "        </td>\n";

	html = html + "        <td style='width:33%; padding:3px 5px 3px 5px; text-align:center;'>\n";
	html = html + "          "+resources[locale]["label.search.hits"]+"&nbsp;"+(starter+1)+"&nbsp;-&nbsp;"+Math.min((starter+pagingIncrement),countResult)+"&nbsp;"+resources[locale]["label.search.of"]+"&nbsp;"+countResult+"\n";
	html = html + "        </td>\n";

	html = html + "        <td style='width:33%; padding:3px 5px 3px 5px; text-align:right;'>\n";
	if (starter < countResult - pagingIncrement) {
		html = html + "          <span class='subtextblue'>";
		html = html + "            <a href='javascript:search("+(starter+pagingIncrement)+")' title='"+resources[locale]["info.medium.next"]+"' class='subtextblue'>\n";
		html = html + "              <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
		html = html + "              &nbsp;"+resources[locale]["link.medium.next"]+"\n";
		html = html + "            </a>\n";
		html = html + "          </span>\n";
	}
	html = html + "        </td>\n";

	html = html + "      </tr>\n";
	html = html + "    </table>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	html = html + "<!-- Ende Pager -->\n";
	
	return html;
}

function generateOrderNavigationBar(locale) {
	var html = "";
	
	html = html + "<tr>\n";
	html = html + "  <td style='text-align:left; padding-top:12px;'>\n";
	html = html + "    <div class='subtextblue' style='margin:0; padding:3px 5px 3px 5px; background:#DFE9F4; text-align:left;'>\n";
	html = html + "      <a href='javascript:displayShopcart();' class='subtextblue'>\n";
	html = html + "        <img src='" + HOST + "images/pf_blueback.gif' width='4' height='7' border='0' alt='' />\n";
	html = html + "        &nbsp;"+resources[locale]["link.order.back"]+"\n";
	html = html + "      </a>\n";
	html = html + "    </div>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	
	return html;
}

function generateNavigationBar(locale) {
	var html = "";
	
	html = html + "<tr>\n";
	html = html + "  <td style='text-align:left; padding-top:12px;'>\n";
	html = html + "    <div class='subtextblue' style='margin:0; padding:3px 5px 3px 5px; background:#DFE9F4; text-align:left;'>\n";
	html = html + "      <a href='javascript:search(0);' class='subtextblue'>\n";
	html = html + "        <img src='" + HOST + "images/pf_blueback.gif' width='4' height='7' border='0' alt='' />\n";
	html = html + "        &nbsp;"+resources[locale]["link.search.back"]+"\n";
	html = html + "      </a>\n";
	html = html + "    </div>\n";
	html = html + "  </td>\n";
	html = html + "</tr>\n";
	
	return html;
}

function generateMediumDetailsOverlay(printnorm) {
	var medium = null;
	for (var i=0; i<media.length; i++) {
		if (printnorm == media[i].printnorm) {
			medium = media[i];
			break;
		}
	}
	
	/*
	// document title setting
	if ("en"==locale && medium.titleEn) {
		document.title = printnorm +" - "+ medium.titleEn;
	} else {
		document.title = printnorm +" - "+ medium.title;
	}
	*/
	
	var mediumImage = "";
	if (!medium.image) {
		mediumImage = "missing.gif";
	} else {
		mediumImage = medium.image;
	}
	
	var mediumTitle = "";
	if ("en"==locale && medium.titleEn) {
		mediumTitle = medium.titleEn;
	} else {
		mediumTitle = medium.title;
	}
	
	var mediumSpec = "";
	if ("en"==locale && medium.specificationEn) {
		mediumSpec = medium.specificationEn;
	} else {
		mediumSpec = medium.specification;
	}
	
	var mediumLanguages = "";
	medium.languages = getSortedMediumLanguages(locale,medium);
	for (var i=0; i<medium.languages.length; i++) {
		mediumLanguages = mediumLanguages + resources[locale][medium.languages[i]];
		if (i < medium.languages.length - 1) mediumLanguages = mediumLanguages + ", ";
	}
	
	var html = "\n";
	
	html = html + "<table class='tableMediumDetails'>\n"
	html = html + "  <tr>\n";
	html = html + "    <td colspan='5' style='width:438px; height:40px; background-color:white;'>\n";
	html = html + "      <table style='width:100%; border:0; border-collapse:collapse; margin:0; padding:0;' cellspacing='0' cellpadding='0'>\n";
	html = html + "        <tr>\n";
	html = html + "          <td style='padding-left:12px; color:#153B62; font:bold 17px Arial,sans serif; vertical-align:middle;'>"+resources[locale]["label.medium.details"]+"</td>\n";
	html = html + "          <td style='text-align:right; vertical-align:middle;'><img src='" + HOST + "images/popup_logo.gif' border='0' alt='' /></td>\n";
	html = html + "        </tr>\n";
	html = html + "      </table>\n";
	html = html + "    </td>\n";
	html = html + "  </tr>\n";
	html = html + "  <tr height='12'>\n";
	html = html + "    <td colspan='5'><img src='" + HOST + "images/transparent.gif' width='1' height='12' border='0' alt=''></td>\n";
	html = html + "  </tr>\n";
	html = html + "  <tr>\n";
	html = html + "    <td><img src='" + HOST + "images/transparent.gif' width='12' height='1' border='0' alt=''></td>\n";
	html = html + "    <td rowspan='2'><img src='" + HOST + "images/product/large/"+mediumImage+"' width='108' border='0' alt='' /></td>\n";
	html = html + "    <td><img src='" + HOST + "images/transparent.gif' width='12' height='1' border='0' alt=''></td>\n";
	html = html + "    <td>\n";
	html = html + "      <span style='font:bold 12px Arial'>" + mediumTitle + "</span><br/><br/>\n";
	html = html + "      <span style='font:11px Arial,sans serif'>" + medium.description + "<br/><br/>\n";
	html = html + resources[locale][medium.mediatype] + "<br/>\n";
	html = html + mediumSpec + "<br/>\n";
	html = html + resources[locale]["label.orderNo"] + ": " + medium.printnorm + "<br/><br/>\n";
	html = html + resources[locale]["label.language.contains"] + ":<br/>\n";
	html = html + "         <b>" + mediumLanguages + "</b></span>\n";
	html = html + "    </td>\n";
	html = html + "    <td><img src='" + HOST + "images/transparent.gif' width='12' height='1' border='0' alt=''></td>\n";
	html = html + "  </tr>\n";
	html = html + "  <tr>\n";
	html = html + "    <td colspan='2' />\n";
	if (!containsShopcartItem(medium.mediumID)) {
		html = html + "    <td id='addToShopcartLink' colspan='3' style='padding:10px 0 10px 0;'>\n";
		html = html + "      <div style='text-align:right; padding:2px 12px 2px 15px; border-top:1px solid #829DBA; border-bottom:1px solid #829DBA;'>\n";
		html = html + "        <a href=\"javascript:addShopcartItem("+medium.mediumID+",1); hideInputFields(); hideLink();\" class='subtextblue'>\n";
		html = html + "          <img src='" + HOST + "images/pf_blue.gif' width='4' height='7' border='0' alt='' />\n";
		html = html + "          &nbsp;<b>"+resources[locale]["link.shopcart.add"]+"</b>\n";
		html = html + "        </a>\n";
		html = html + "      </div>\n";
		html = html + "    </td>\n";
	} else {
		html = html + "    <td colspan='3' />\n";
	}
	html = html + "  </tr>\n";
	html = html + "  <tr bgcolor='#829DBA' height='7'>\n";
	//html = html + "    <td class='f11white'><img src='" + HOST + "images/transparent.gif' width='1' height='1' border='0'></td>\n";
	html = html + "    <td colspan='5' style='text-align:right; vertical-align:middle;'>\n";
	html = html + "      <a href='#' onClick='hideMediumDetailsOverlay(); return false;' class='f11white'>";
	html = html + "        <img src='" + HOST + "images/X.gif' border='0' alt='' />";
	html = html + "        &nbsp;" + resources[locale]["link.medium.close"] + "&nbsp;&nbsp;&nbsp;&nbsp;";
	html = html + "      </a>\n";
	html = html + "    </td>\n";
	//html = html + "    <td class='f11white'><img src='" + HOST + "images/transparent.gif' width='1' height='1' border='0'></td>\n";
	html = html + "  </tr>\n";
	html = html + "</table>\n";

	$("#mediumDetails").html(html);
	hideInputFields();
	$("#mediumDetails").show();
}

function hideInputFields() {
	$(".select").hide();
	$(".text").hide();
}

function showInputFields() {
	$(".select").show();
	$(".text").show();
}

function hideLink() {
	document.getElementById("addToShopcartLink").innerHTML = "";
}

function hideMediumDetailsOverlay() {
	$("#mediumDetails").hide();
	showInputFields();
}