//--------------------------------------------------------------------------
function getListText(list)
{
    return list.options[list.selectedIndex].text;
}
//--------------------------------------------------------------------------
function serie_creakit(val_modello)
{
	// restituisce la seria a cui appartiene il creakit a partire dal codice
	// 0 = serie blu
	// 1 = serie verde
	// 2 = serie rossa
	var v;
	v = parseInt(val_modello,10);	// ottiene il valore
	if ((v == 41) || (v == 42) || (v == 43)) return 2;	                	// rossa
	if (((v>=37)&&(v<=40)) || (v==46) || ((v>=60)&&(v<=68))) return 1;		// verde
	if (v<=0) return -1;            						// nessuna serie
	return 0;									// blu
}
function update_serie(val_modello, serie)
{
	// aggiorna la serie del modello
	// definire nella pagina l'array SeriesNames con il nomi (tradotti)
	// delle serie
	var s = serie_creakit(val_modello);
	if (s>=0)
	    serie.value = SeriesNames[s];
	else
	    serie.value = "";
}
//--------------------------------------------------------------------------
function update_price(frm)
{
    // aggiorna il costo dell'articolo
    // n.b. funziona con i form "standard", non con quelli "ensamble"
	var val_c, val_c25, val_r, t, i;
	var val_sc;
	var p1, p2, p3, p4;
	var extra;
	var has_model = true;   // true per gli articoli che hanno un "modello", false per gli altri (es. cartoncino cartellone, che ha il colore)
	var pz_album_blu = {}
	switch (frm.name)
	{
		//----------------------------------------------------------------------------
		// Confetti & Co.
		case "cn_confetti":
		    if (frm.colore.value == 0)
			val_r = val_c = 27.00;	// bianchi
		    else
			val_r = val_c = 28.50;
		    has_model = false;
		    break;
		case "cn_box_confetti":
		    // costo creakit
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
			    val_c = 1.0; break;
			  case 1:	// verde
			    val_c = 1.5; break;
			  case 2:	// rossa
			    val_c = 2.0; break;
			}
			// costo box
			switch (frm.box_size.value)
			{
			  case 'size_s':
			    val_c += 1.8; break;
			  case 'size_m':
			    val_c += 2.5; break;
			  case 'size_l':
			    val_c += 5.0; break;
			}
            // costo confezione
            if (frm.for_you.value == 'for_you_yes') val_c += 0.5;
			val_r = val_c; has_model = false;
		    break;
		    
		case "ls_sacchettini":
			t = frm.Itemquantity.value+0.0;	// trasformo in numero
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				p1 = 16;
				p2 = 15.5;
				p3 = 14;
				p4 = 13.5;
			  break;
			  case 1:	// verde
				p1 = 20;
				p2 = 18.5;
				p3 = 18;
				p4 = 17.5;
			  break;
			  case 2:	// rossa
				p1 = 16;
				p2 = 15.5;
				p3 = 14;
				p4 = 13.5;
			  break;
			}
			//----------------
			if (frm.Itemquantity.value<5)
				val_c = p1;
			else if (frm.Itemquantity.value<10)
				val_c = p2;
			else if (frm.Itemquantity.value<15)
				val_c = p3;
			else
				val_c = p4;
			val_r = val_c;
			break;

		case "ls_scatolette":
			val_r = val_c = 15;
			break;

		case "ls_creakit_bomboniere":
			t = frm.Itemquantity.value+0.0;	// trasformo in numero
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				p1 = 25;
				p2 = 22;
				p3 = 20;
			  break;
			  case 1:	// verde
				p1 = 28;
				p2 = 25;
				p3 = 22;
			  break;
			  case 2:	// rossa
				p1 = 38;
				p2 = 34;
				p3 = 30;
			  break;
			}
			//----------------
			if (frm.Itemquantity.value<5)
				val_c = p1;
			else if (frm.Itemquantity.value<10)
				val_c = p2;
			else
				val_c = p3;
			val_r = val_c;
			break;
	
		//----------------------------------------------------------------------------
		// Linea Sposi
		case "ls_kit_partecipazioni":
		    val_c = 52; val_r = 24; break;
		case "ls_kit_partecipazioni_quadrate":
			val_c = 52; val_r = 24; break;
		case "ls_kit_libretto_messa":
			val_c = 28; val_r = 13; break;
		case "ls_kit_ringraziamenti":
			val_c = 25; val_r = 22; break;
		case "ls_kit_menu":
			val_c = 34; val_c25 = 20; val_r = 17; break;
		case "ls_kit_segnatavoli":
			val_c = 26; val_r = 24; break;
		case "ls_kit_segnaposti":
			val_c = 7; val_r = 7; has_model = false; break;
		case "ls_creakit":
		case "ls_creakit_quadrati":
			t = frm.Itemquantity.value+0.0;	// trasformo in numero
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				p1 = 15;
				p2 = 13;
				p3 = 11;
			  break;
			  case 1:	// verde
				p1 = 20;
				p2 = 18;
				p3 = 15;
			  break;
			  case 2:	// rossa
				p1 = 18;
				p2 = 17;
				p3 = 15;
			  break;
			}
			//----------------
			if (frm.Itemquantity.value<5)
				val_c = p1;
			else if (frm.Itemquantity.value<10)
				val_c = p2;
			else
				val_c = p3;
			val_r = val_c;
			break;

		case "ls_creakit_messa":
		case "ls_creakit_menu":
			t = frm.Itemquantity.value+0.0;	// trasformo in numero
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				p1 = 12;
				p2 = 11;
				p3 = 10;
			  break;
			  case 1:	// verde
				p1 = 15;
				p2 = 13;
				p3 = 12;
			  break;
			  case 2:	// rossa
				p1 = 18;
				p2 = 16;
				p3 = 15;
			  break;
			}
			//----------------
			if (frm.Itemquantity.value<5)
				val_c = p1;
			else if (frm.Itemquantity.value<10)
				val_c = p2;
			else
				val_c = p3;
			val_r = val_c;
			break;

		case "ls_creakit_ringraziamenti":
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				val_c = 16;    break;
			  case 1:	// verde
				val_c = 18;    break;
			  case 2:	// rossa
				val_c = 22;    break;
			}
			val_r = val_c;
			break;

		case "ls_creakit_cartellone":
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				val_c = 2.5;    break;
			  case 1:	// verde
				val_c = 3.5;    break;
			  case 2:	// rossa
				val_c = 4;    break;
			}
			val_r = val_c;
			break;

		case "ls_cornice":
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				val_c = 14;    break;
			  case 1:	// verde
				val_c = 16;    break;
			  case 2:	// rossa
				val_c = 20;    break;
			}
			val_r = val_c;
			break;

		case "ls_portafedi":
			val_c = 18; val_r = 18; break;

		case "ls_diario":
			switch (serie_creakit(frm.modello.value))
			{
			  case 0:	// blu
				val_c = 10;    break;
			  case 1:	// verde
				val_c = 12;    break;
			  case 2:	// rossa
				val_c = 14;    break;
			}
			val_r = val_c;
			break;

		case "ls_svuotatasche":
			val_c = 9; val_r = 9; break;

		case "ls_album":
		case "kf_album":
			extra = 0;
			
			switch(frm.formato.value)
			{
				case "20x15x30":
					val_c  = 22; 
					val_sc = 0;
					switch(serie_creakit(frm.modello.value))
					{
						case 0: break;
						case 1: extra = 2; break;
						case 2: extra = 6; break;
					}
					break;
					
				case "24x30x30":
					val_c  = 28;
					val_sc = 27;
					switch(serie_creakit(frm.modello.value))
					{
						case 0: break;
						case 1: extra = 3; break;
						case 2: extra = 7; break;
					}
					break;
					
				case "35x35x60":
					val_c  = 80;
					val_sc = 35;
					switch(serie_creakit(frm.modello.value))
					{
						case 0: break;
						case 1: extra = 5; break;
						case 2: extra = 10; break;
					}
					break;
					
				case "35x42x60":
					val_c  = 85;
					val_sc = 40;
					switch(serie_creakit(frm.modello.value))
					{
						case 0: break;
						case 1: extra = 5; break;
						case 2: extra = 10; break;
					}
					break;
					
				default:
					alert("Errore2! " + frm.formato.value);
					return 0;
			}
			val_c += extra;
			if (frm.scatola.value == "CS") val_c += val_sc;
			if (frm.colore.value == "NE") val_c += 12;
			val_r = val_c;
			break;

		// prodotti senza "modello
		case "ls_cartoncino":
			val_c = 6; val_r = 6; has_model = false; break;
			
		case "ls_coni":
			val_c = 10; val_r = 10; has_model = false; break;

		case "ls_raffia":
			val_c = 3; val_r = 3; has_model = false; break;

		case "ls_petali":
			val_c = 3; val_r = 3; has_model = false; break;

        //----------------------------------------------------------------------------
        // Kids & Fun
		case "lb_kit_annunci":
			val_c = 29; val_r = 25; break;
		case "lj_kit_inviti":
			val_c = 15; val_r = 12; break;
		case "kf_diario_fiabe":
			val_c = 9; val_r = 9; break;
		case "kf_cornice":
			val_c = 12; val_r = 12; break;
		case "kf_scatolette":
			val_c = 15; val_r = 15; break;
		case "kf_valigette":
			val_c = 20; val_r = 20; break;
		case "kf_sacchettini":
		    if ((frm.modello.value == 45) || (frm.modello.value == 47) || 
		        (frm.modello.value == 69) || (frm.modello.value == 70) ||
			(frm.modello.value == 72))
    		    val_r = val_c = 19; // angelo, rosAngelo, safari e stellina
		    else
			    val_r = val_c = 15;
		    break;
			
        //----------------------------------------------------------------------------
		default:
			alert("Errore3! " + frm.name);
			return 0;
	}
	if (has_model)
	{
	    if (frm.modello == null)
	    {
	        alert("[update_price]" - frm.name + ": non ha modello");
	        return;
	    }
	    if (frm.modello.value == "completo (50pz)")
	    {
		    frm.Prezzo.value = ftm_cur(val_c);
		    t = val_c;
	    }
	    else if (frm.modello.value == "completo (15pz)")
	    {
		    frm.Prezzo.value = ftm_cur(val_c);
		    t = val_c;
	    }
	    else if (frm.modello.value == "completo (20pz)")
	    {
		    frm.Prezzo.value = ftm_cur(val_c);
		    t = val_c;
	    }
	    else if (frm.modello.value == "completo (16+16pz)")
	    {
		    frm.Prezzo.value = ftm_cur(val_c);
		    t = val_c;
	    }
	    else if (frm.modello.value == "completo (25pz)")
	    {
		    if (frm.name == "ls_kit_menu")
		    {
			    frm.Prezzo.value = ftm_cur(val_c25);
			    t = val_c25;
		    }
		    else
		    {
			    frm.Prezzo.value = ftm_cur(val_c);
			    t = val_c;
		    }
	    }
	    else
	    {
	        if (frm.name == "ls_creakit_cartellone")
	            frm.Prezzo.value = ftm_cur(val_r * frm.Itemquantity.value); // nel caso del cartellone, il prezzo visualizzato è quello complessivo
	        else
    		    frm.Prezzo.value = ftm_cur(val_r);
		    t = val_r;
	    }
	}
	else
	{
	    // articoli senza "modello", es. coni, cartoncino cartellone..
	    frm.Prezzo.value = ftm_cur(val_c);
	    t = val_c;
	}
	frm.ItemPrice.value = ftm_cur(t);
	return 1;
}
//--------------------------------------------------------------------------
function setup_ecom(frm)
{
    // alert(1);
	var descr, code;
	// costruisce il codice completo, da mettere il product ID, in modo che
	// tenga conto delle varianti
	// alert(frm.name);
	if ((frm.name == "ls_creakit") ||
	    (frm.name == "ls_creakit_quadrati") ||
	    (frm.name == "ls_creakit_messa") ||
	    (frm.name == "ls_creakit_menu") ||
	    (frm.name == "ls_creakit_bomboniere") ||
	    (frm.name == "ls_creakit_ringraziamenti") ||
	    (frm.name == "ls_creakit_cartellone") ||
        (frm.name == "ls_diario") ||
        (frm.name == "ls_cornice") ||
        (frm.name == "ls_portafedi") ||
        (frm.name == "ls_sacchettini") ||
        (frm.name == "ls_svuotatasche") ||
	    (frm.name == "kf_diario_fiabe") || 
	    (frm.name == "kf_cornice") || 
	    (frm.name == "kf_valigette") || 
	    (frm.name == "kf_scatolette") || 
        (frm.name == "kf_sacchettini"))
	{
		code = frm.Codice.value + frm.modello.options[frm.modello.selectedIndex].value;
		descr = getListText(frm.modello);
		descr = frm.Descr.value + ", " + descr;

		if (frm.name == "ls_creakit_quadrati")
		{
			// nel caso dei creakit quadrati, i modelli alena, hanno lo stesso codice dei creakit standard
			if ((frm.modello.options[frm.modello.selectedIndex].value == "02") ||	
			    (frm.modello.options[frm.modello.selectedIndex].value == "35") ||	
			    (frm.modello.options[frm.modello.selectedIndex].value == "36"))
			{
				code = "CK" + frm.modello.options[frm.modello.selectedIndex].value;
				descr = getListText(frm.modello);
				descr = "CreaKit per partecipazioni, " + descr;
			}
		}
	}
	else if ((frm.name == "ls_raffia") || 
		 (frm.name == "ls_petali") || 
		 (frm.name == "ls_coni") || 
		 (frm.name == "ls_cartoncino") ||
		 (frm.name == "cn_confetti"))
	{
		code = frm.Codice.value + frm.colore.options[frm.colore.selectedIndex].value;
		descr = getListText(frm.colore);
		descr = frm.Descr.value + ", " + descr;
	}
	else if ((frm.name == "ls_album") || (frm.name == "kf_album"))
	{
		code = frm.Codice.value + 
		       (frm.formato.selectedIndex+1) + 
                frm.modello.value +
		        frm.colore.value;
		if (frm.scatola.value == "CS") code += "CS";
		descr = getListText(frm.formato) + ", ";
		descr = descr + getListText(frm.modello);
		descr = frm.Descr.value + " " + descr;
		descr = descr + ", " + getListText(frm.colore);
		if (frm.scatola.value == "CS") descr = descr + ", " + getListText(frm.scatola);
		descr = descr;
	}
	else if (frm.name =="ls_kit_menu")
	{
		code = frm.Codice.value; 
		descr = frm.Descr.value;
		descr = descr + ", " + getListText(frm.modello);
		code = code + frm.modello.value.substring(0, 1).toUpperCase();
		descr = descr + ", " + getListText(frm.colore);
		code = code + frm.colore.value.substring(0, 2).toUpperCase();
		// distingue tra kit completo 50/25 
		if (frm.modello.value == "completo (50pz)")
			code = code + "50";
		else if (frm.modello.value == "completo (25pz)")
			code = code + "25";
	}
	else if (frm.name =="cn_box_confetti")
	{
		code = frm.Codice.value; 
		descr = frm.Descr.value;
		// modello
		descr = descr + ", " + getListText(frm.modello);
		code = code + frm.modello.options[frm.modello.selectedIndex].value;
		// dimensione
	    descr = descr + ", " + getListText(frm.box_size);
		switch (frm.box_size.value)
		{
		  case 'size_s':
		    code = code + "S"; break;
		  case 'size_m':
		    code = code + "M"; break;
		  case 'size_l':
		    code = code + "L"; break;
		}
	    // confetti
		descr = descr + " (" + getListText(frm.colore_confetti) + ")";
		code = code + frm.colore_confetti.options[frm.colore_confetti.selectedIndex].value.split(',')[0];
		// confezione
		if (frm.for_you.value == 'for_you_yes')
		{
		    descr = descr + ", " + frm.ConfezioneSi.value;
		    code = code + "C"; 
		}
		else
		{
		    descr = descr + ", " + frm.ConfezioneNo.value;
		    code = code + "NC";
		}
	}
	else
	{
		code = frm.Codice.value; 
		descr = frm.Descr.value;
		if (frm.modello != null)
		{
			descr = descr + ", " + getListText(frm.modello);
			code = code + frm.modello.value.substring(0, 1).toUpperCase();
		}
		if (frm.colore  != null) 
		{
			descr = descr + ", " + getListText(frm.colore);
			code = code + frm.colore.value.substring(0, 2).toUpperCase();
		}
	}
	frm.ProductID.value = code;
	frm.Description.value = descr;
	frm.SubmitId.value = rand(1000000);

	  // alert("ProductID: " + frm.ProductID.value);
	  // alert("Description: " + frm.Description.value);
	  // alert("ItemPrice: " + frm.ItemPrice.value);
	  // alert("SubmitId: " + frm.SubmitId.value);

	return 0;
}

//--------------------------------------------------------------------------
function setup_item_ecom(frm)
{
	var descr, code;
	// alert(frm.name);
	code = frm.Codice.value; 
	descr = frm.Descr.value;

	frm.ProductID.value = code;
	frm.Description.value = descr;
	frm.SubmitId.value = rand(1000000);

    // alert("ProductID: " + frm.ProductID.value);
    // alert("Description: " + frm.Description.value);
    // alert("ItemPrice: " + frm.ItemPrice.value);
    // alert("SubmitId: " + frm.SubmitId.value);

	return 0;
}

//--------------------------------------------------------------------------
function setup_gift_ecom(frm, delivery)
{
	var descr, code;
	// costruisce il codice completo, da mettere il product ID, in modo che
	// tenga conto delle varianti
	code = frm.Codice.value + frm.occasione.value; 
	descr = frm.Descr.value + " - " + getListText(frm.occasione) + delivery + frm.data_consegna.value;

	frm.ProductID.value = code;
	frm.Description.value = descr;
	frm.SubmitId.value = rand(1000000);

    // alert("ProductID: " + frm.ProductID.value);
    // alert("ItemPrice: " + frm.ItemPrice.value);
    // alert("SubmitId: " + frm.SubmitId.value);
	return 0;
}

//--------------------------------------------------------------------------
// gestione dei tabs
var current_tab_id = "";

function tabinit(tab_id)
{
	current_tab_id = tab_id;
}
function tabclick(tab, content_id)
{
	var ul, li;
	var i;
	if (tab.className == "tabselected") return;

	ul = tab.parentNode;
	// firstChild non funziona!
	for (i=0; i<ul.childNodes.length; i++)
	{
		li = ul.childNodes[i];
		li.className = "";
	}
	tab.className = "tabselected";
	// nasconde il tab visibile e visualizza quello selezionato
	var c;
	if (current_tab_id != "")
	{
		c = document.getElementById(current_tab_id);
		c.className="tabcontent_hidden";
	}
	c = document.getElementById(content_id);
	c.className="tabcontent";
	current_tab_id = content_id;
	return true;
}
tabinit("tab_1");
//--------------------------------------------------------------------------
// usato per ristemare la gestione delle option list in firefor
function fire_event(element,event)
{
    if (document.createEventObject)
    {
        // dispatch for IE
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt)
    }
    else
    {
        // dispatch for firefox + others
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable
        return !element.dispatchEvent(evt);
    }
}
function ff_fixchange(obj)
{
    // gestisce l'evento onkeydown nella select che in FireFox non genera l'evento
    // onChange, mentre lo fa in Explorer ed in Opera
    if (is_firefox) fire_event(obj, 'change');
}
//--------------------------------------------------------------------------
// genera un id random, usato per evitare duplicazioni di inserimento degli oggetti
function rand(n)
{
  return ( Math.floor ( Math.random ( ) * n + 1 ) );
}
//--------------------------------------------------------------------------
String.prototype.trim = function () {  return this.replace(/^\s*(\S*(\s+\S+)*)\s*$/, "$1");};
//--------------------------------------------------------------------------
function format_currency(val)
{
	val = val.toString().replace("/\€|\./g", "");
	if (isNaN(val))
		val = "0";
	sign = (val == (val = Math.abs(val)));
	val = Math.floor(val*100+0.50000000001);
	cents = val % 100;
	val = Math.floor(val/100).toString();
	if (cents<10)
 	cents = "0" + cents;
	for (var i = 0; i < Math.floor((val.length-(1+i))/3); i++)
		val = val.substring(0,val.length-(4*i+3))+"."+
		      val.substring(val.length-(4*i+3));
	return (((sign)?'':'-') + "€ " + val + "," + cents);
}
function ftm_cur(val)
{
    // come format_currency, ma senza il prefisso della valuta
	val = val.toString().replace("/\€|\./g", "");
	if (isNaN(val))
		val = "0";
	sign = (val == (val = Math.abs(val)));
	val = Math.floor(val*100+0.50000000001);
	cents = val % 100;
	val = Math.floor(val/100).toString();
	if (cents<10)
 	cents = "0" + cents;
	for (var i = 0; i < Math.floor((val.length-(1+i))/3); i++)
		val = val.substring(0,val.length-(4*i+3))+"."+
		      val.substring(val.length-(4*i+3));
	return (((sign)?'':'-') + val + "," + cents);
}
//--------------------------------------------------------------------------
function cvtcur(val)
{
	// restitituisce un float convertito da currency
	if (typeof val == "number") return val;
	if (typeof val != "string") return 0.0;
	val = val.replace("€", "");		// elimina il segno di valuta
	val = val.replace(".", "");		// elimino i separatori delle migliaia
	val = val.replace(",", ".");		// . al posto di ,
	return parseFloat(val);
}
//--------------------------------------------------------------------------
function check_qta(field, default_value)
{
    // controlla che il numero inserito nel campo sia numerico, positivo e non esagerato, in caso
    // contrario inserire il valore di default
    if (isNaN(field.value)) 
        field.value = default_value;
    else
        if (field.value<0) 
            field.value = default_value;
        else
            if (field.value>999) 
                field.value = 999;
}
function check_min_qta(field, min_qta, default_value)
{
    // controlla che il numero inserito nel campo sia numerico, positivo, >= alla quantità minima e non esagerato, in caso
    // contrario inserire il valore di default
    if (isNaN(field.value)) 
        field.value = default_value;
    else
        if (field.value<min_qta) 
            field.value = default_value;
        else
            if (field.value>999) 
                field.value = 999;
}
function check_multiple_qta(field, multiple, default_value, max_value)
{
    // controlla che il numero inserito nel campo sia numerico, positivo e non esagerato, in caso
    // contrario inserire il valore di default
    // inoltre si assicura che sia un multiplo del valore indicato
    var fv = field.value;
    var v = fv;
    if (isNaN(fv)) 
        v = default_value;
    else
        if (fv<0) 
            v = default_value;
        else
            if (fv>max_value) 
                v = max_value;
    v = parseInt(v);
    if ((v%multiple)>0)
        v = v + (multiple - (v%multiple));
    field.value = v;
}

//--------------------------------------------------------------------------
function getViewportHeight()
{
    // document.viewport.getHeight() di prototype (fino alla 1.6.2) non sembra
    // funzionare con Opera 9.5 (funzionava con le versioni precedenti)

    var viewportheight;
    // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
    if (typeof window.innerWidth != 'undefined')
        viewportheight = window.innerHeight;
    // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
    else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0)
       viewportheight = document.documentElement.clientHeight
    // older versions of IE
    else
       viewportheight = document.getElementsByTagName('body')[0].clientHeight;
    return viewportheight;
}
function getViewportWidth()
{
    var viewportwidth;
    // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
    if (typeof window.innerWidth != 'undefined')
        viewportwidth = window.innerWidth;
    // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
    else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0)
       viewportwidth = document.documentElement.clientWidth;
    // older versions of IE
    else
       viewportwidth = document.getElementsByTagName('body')[0].clientWidth;
    return viewportwidth;
 }