Ver Mensaje Individual
  #2 (permalink)  
Antiguo 22/01/2005, 11:20
furoya
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 21 años, 6 meses
Puntos: 317
Hola, aquí de nuevo.

es evidente que si no puedo conseguir la lista de fuentes instaladas, no puedo buscar la mía por nombre; así que me resigné a hacer uso y abuso del pensamiento lateral y empecé a buscarla por forma.
No estoy proponiendo una suerte de "inteligencia artificial" con JavaScript; solamente medir algún valor que la difeencie de las otras. Y empecé a probar con el tamaño.

No encontré nada que midiera los caracteres, pero sí hay una forma de medir sus 'consecuencias', y creí que ya tenía resuelto el problema.

En realidad lo hice (en la mayoría de las fuentes), pero solamente para IE5+ [NOTA : recordemos que el código anterior sirve nada más que en la última versión -quizás en 5.5-], cuando lo probé en Firefox falló estrepitosamente.
Creo que intuyo el motivo pero antes de seguir, dejo el código. Éste es una herramienta que genera el JS a pegar en nuestra página, ya que el código será distinto para cada fuente.

Código:

<HTML>
<HEAD>
<TITLE>DETECTA FUENTE INSTALADA.</TITLE>
<script language= "JavaScript">
var alto,ancho,tipo,vFuente;

function mideFuente(){
var tipo=document.formulario.nFuente.value;
document.getElementById("muestra").style.fontFamily = tipo;
ancho = document.getElementById('muestra').offsetWidth;
alto = document.getElementById('muestra').offsetHeight;
document.getElementById('elAlto1').innerText = alto;  
document.getElementById('elAncho1').innerText = ancho;
document.getElementById('laFuente1').innerText = tipo;
document.getElementById('laFuente2').innerText = tipo;
}

function ejemploFuente(Z){
vAlto=parseInt(Z);
vAncho=parseInt(Z.substring(Z.indexOf(',')+1));
vFuente=Z.substring(Z.indexOf('-')+1);
document.getElementById("muestra").style.fontFamily="\""+vFuente+"\"!important";
if((document.getElementById("muestra").offsetHeight==vAlto) && (document.getElementById("muestra").offsetWidth==vAncho)){
alert("Fuente "+vFuente+" instalada.");}
else alert("Fuente "+vFuente+" no instalada.");
}

</script>
<style>
#muestra{position:absolute; top:10px; left:10px; visibility:hidden; background-color:#ffffcc; font-size:16px!important}
</style>
</HEAD>
<BODY>
<form name="formulario">
<h2>Confirma si una fuente se encuentra instalada.</h2>

Elija una fuente de la lista para saber si se encuentra instalada en el sistema:<p>
<select name="selector" onchange="ejemploFuente(this.value)">
<option value="18,51-Arial">Arial
<option value="19,50-Bedini">Bedini
<option value="16,63-Courier">Courier
<option value="19,76-DoggyPrint AOE">DoggyPrint AOE
<option value="19,63-Eclipse">Eclipse
<option value="18,56-Georgia">Georgia
<option value="19,49-Times New Roman">Times New Roman
<option value="18,64-Verdana">Verdana
</select>

<hr>

Para usar el código en una página, ingrese el nombre de una fuente <u>previamente instalada</u>. <input name="nFuente"> <br>
Click en &nbsp<button onclick="mideFuente()">Crear código</button> 
(<input type="checkbox" name="mMuestra" onmousedown="if(this.checked) getElementById('muestra').style.visibility = 'hidden'; else getElementById('muestra').style.visibility = 'visible'" > Ver muestra).<br>
Copie el código verde y pegue entre las etiquetas <tt>&lt;BODY></tt>, antes del documento.
</form>

<tt>&lt;BODY></tt>
<pre style=color:#009900>
&lt;SCRIPT language=javascript>
vAltoQpB=<b><font color="#006600" id=elAlto1>HH</font></b>;
vAnchoQpB=<b><font color="#006600" id=elAncho1>WW</font></b>;
vFuenteQpB="<b><font color="#006600" id=laFuente1>FF</font></b>";
document.write('&lt;span id="Mj5Kf6" style="position:absolute; top:10px;'+
' left:10px; visibility:hidden; font-size:16px!important; font-family:\'<b><font color="#006600" id=laFuente2>FF</font></b>\'!important">'+
'WXil _´&lt;/span>');
if ((document.getElementById("Mj5Kf6").offsetHeight==vAltoQpB) 
&& (document.getElementById("Mj5Kf6").offsetWidth==vAnchoQpB)){
alert("Fuente "+vFuenteQpB+" instalada.");}
else {
descarga=confirm("Fuente "+vFuenteQpB+" no instalada. \r\n¿Desea instalarla?");
if(descarga)open("http://www.mi_sitio/mi_fuente.htm","DF","")
}
&lt;/SCRIPT>
</pre>
<tt>&lt;!--DESDE AQUÍ EL DOCUMENTO --><br>
&lt;/BODY></tt>

<span id="muestra">WXil _´</span>

</BODY>
</HTML>
 
Lo que hace es meter una serie de caracteres con nuestra fuente dentro de un SPAN y luego medir su alto y su ancho. Al poner ese mismo SPAN en la página que abre nuestra visita, si ésta usa la misma fuente que aquel, debería tener también el mismo tamaño, pero si usa la fuente por omisión, no. Entonces se abre un mensaje de descarga con la sugerencia de instalar la nueva fuente.

Como dije, midiendo todo en px tabaja razonablemente bien ... en IE.

Conseguí un FF, y haciendo algunas puebas (no muchas) observé que en la configuración permite usar distintas medidas para cada familia y -lo más importante- elegir una como referencia para la altura relativa de las demás.

Por supuesto que algo así va a falsear cualquier medida que deba tener nuestro SPAN. Seguramente habrá alguna forma de corregir ésto con CSS, pero yo llego hasta aquí. Ya mencioné que solamente conozco el IE y que nada más uso ese navegador, ni hablar de que nunca usaría una fuente que no tuviera previamente instalada.

Si alquien tiene alguna idea, se los dejo para corregirlo.

saludos

furoya

Nota : el código funcionaba en IExplorer Opera , pero ya no anda.

Última edición por furoya; 03/11/2009 a las 15:40 Razón: tachar código