Cambio carattere

[mastermirko]

Ciao a tutti.
Nel mio sito volevo mettere la possibilità di cambiare il carattere, e il ricordarsi la scelta dell'utente.
Così setto il nuovo carattere, e funziona:

function carattere(tipo)
{	var tipopc = '0';
	var	faccia = "arial";
	if (tipo == '1')
	{	faccia = "verdana";
		tipopc = '1';
	}
	if (tipo == '2')
	{	faccia = "serif";
		tipopc = '2';
	}
	document.body.style.fontFamily = faccia;
	createCookie(cookieFontFaceName,tipopc,31);
}

Qui c'è la lettura del cookie che però mi provoca un errore...

function readFontFaceCookie()
{	//try{
		cookies=document.cookie;
		posStile=cookies.indexOf(cookieFontFaceName+"="); 
		var value=0;
		if (posStile > -1)
		{	fineStile = posStile+ (cookieFontFaceName.length + 1); 
			//+1, perché bisogna considerare anche l'uguale ('=')
			//prendiamo il valore specificato nel cookie
			//: +2: segno e valore (-1, 
			value = cookies.slice(fineStile,fineStile+1); 
			if(value == '0')
			{	carattere(value);
			}
			else if(value == '1')
			{	carattere(value);
			}
			else if(value == '2')
			{	carattere(value);
			}
		}
		else
		{	value='0';
			//alert("Errore di elaborazione cookie");
			carattere(value);
		}		
	//}
}

Secondo questa, l'elemento document.body.style non le va bene, dice che vuole un oggetto... come mai se io clicco per cambiare il carattere va, e questo automatico dà problemi?

Grazie

[mastermirko]

Una piccola risoluzione l'ho trovata... ma presenta un problema:

function carattere(tipo)
{	var tipopc = '0';
	var	faccia = "arial";
	if (tipo == '1')
	{	faccia = "verdana";
		tipopc = '1';
	}
	if (tipo == '2')
	{	faccia = "serif";
		tipopc = '2';
	}
	createCookie(cookieFontFaceName,tipopc,365);
	document.write("<style>body{font-family:"+faccia+"}</style>");	
}

In questa maniera forza il carattere... ma il bello è che dopo la sua forzatura bisogna fare il refresh, altrimenti il sito è inutilizzabile.
Non capisco come mai "document.body.style.fontFamily = faccia;" sia corretto se la funzione "carattere(tipo)" la chiamo io tramite link js, e non vada bene se la chiama un cookie quando si carica la pagina.

Sapreste aiutarmi?

Grazie.

[mastermirko]

up

[pierofix]

In questo caso forse sarebbe meglio usare uno style-switcher, ovvero preparare tanti fogli di stile - quanti sono i caratteri a disposizione della scelta dell'utente - e poi attribuirli alla pagina.

Si avrebbe un risultato molto più pulito e non ci sarebbero invasioni di campo tra le funzioni dei vari linguaggi.

Il massimo sarebbe realizzare il tutto lato server: hai la possibilità di usare linguaggi come ad esempio PHP? Altrimenti possiamo procedere con javascript, ma otterresti un risultato meno performante e meno elegante.

Facci sapere.

[mastermirko]

Ho già 4 fogli di stile che mi cambiano la combinazione di colori.
Volevo far scegliere il carattere in questa maniera per non dovermi trovare con 12 fogli differenti...

Il bello è che nella pagina stessa dove posso scegliere il carattere il cambio funziona benissimo, è il lancio da cookie che dà problemi!

Grazie

[Xinod]

cosa c'e' nella funzione createCookie?

[mastermirko]

Eccola:

function createCookie(name, value, days)
{	var CookieContent= "";
	var expires = "; expires=";
	if (days)
	{	var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		expires += date.toUTCString();
	}
	else
	{	expires += " ";
	}
	CookieContent = name+"="+value + expires +"; path=/;";
	document.cookie = CookieContent;
}

[pierofix]

Originariamente inviato da mastermirko
Ho già 4 fogli di stile che mi cambiano la combinazione di colori.
Volevo far scegliere il carattere in questa maniera per non dovermi trovare con 12 fogli differenti...

Il mio discorso è a livello concettuale: per gestire la grafica si usano i CSS. Punto. Meglio evitare invasioni di campo: lasciamo ad ogni linguaggio la propria funzione.

Anche l'utilizzo di document.write, poi, sarebbe bene evitarlo, a favore di un codice più conforme alla logica del DOM. E, usando i CSS, quest'ultimo passaggio sarebbe addirittura eliminabile.

Sto semplicemente ragionando ad alta voce per dare più ordine al tuo meccanismo e per ottenere una separazione più accentuata tra XHTML, CSS e Javascript.

Il bello è che nella pagina stessa dove posso scegliere il carattere il cambio funziona benissimo, è il lancio da cookie che dà problemi!

Qui lascio la parola agli esperti di javascript.

[mastermirko]

Sì, a logica hai ragione, ma includere 12 fogli di stile è un po' tantino!

[pierofix]

Originariamente inviato da mastermirko
Sì, a logica hai ragione, ma includere 12 fogli di stile è un po' tantino!

Bè, questo non è proprio vero. Innanzitutto non servirebbe proprio creare mille fogli diversi, ma sfruttare a dovere una combinazione intelligente di selettori di discendenza e classi. Un esempietto banale:

body.testo_piccolo
{
   font-size:90%;
}
body.testo_grande
{
   font-size:120%;
}

Con il metodo di attribuzione delle classi mediante javascript, poi, si risolverebbe il problema. Ad esempio:

function ridimensiona(grandezza)
{
   var pagina = document.getElementsByTagName('body').item(0)

   if ( grandezza == 'piccolo' )
   {
      pagina.className = 'testo_piccolo'
   }
   if ( grandezza == 'grande' )
   {
      pagina.className = 'testo_grande'
   }
}