Comprobar tamaño de imagen

[Morgui]

Tengo una página web con el siguiente campo del tipo FILE:

<INPUT TYPE="FILE" SIZE="40" NAME="FILE1" ID="FILE1" onFocus="cambia(this.value);" onChange="cambia(this.value);">

La función cambia(), sustituye una imagen que hay en la página por otra elegida a través de dicho campo. El tamaño de la imagen tiene que ser de 460x280 pixels.

Quiero comprobar desde la función si el tamaño de la imagen es correcto, y si no lo es, que me redirija a otra página que informe sobre el error.

Esta es la función:

function cambia(foto){
if (document.forms[0].elements['FILE1'].value != ""){
foto2 = new Image();
foto2.src = 'file:///' + foto;
document.foto.src='file:///' + foto;
if (foto2.width != 460 || foto2.height != 280){
document.location ='error.asp?op=tamf';
} }

}

La mayoría de las veces funciona bien, pero en ocasiones me redirige a la otra página sin tener que hacerlo.

He hecho muchas pruebas y lo que falla es la anchura de la imagen, que a veces la toma como 0 y no sé por qué (incluso con la misma imagen unas veces lo toma bien y otras no).

He supuesto que a lo mejor no le da tiempo de crear el objeto "foto2" y comprobar las medidas, pero no veo sentido a que si falla, siempre falle la anchura y nunca la altura.

Espero sus respuestas, gracias adelantadas

[caricatos]

Hola Morgui:

Eso pasa cuando la imagen no se ha cargado...
Lo mejor es chequear el atributo complete de la imagen y cuando esté true recién consultar las dimensiones.

function chequeo() {
if (foto2.complete) {
if (foto2.width != 460 || foto2.height != 280)
document.location ='error.asp?op=tamf';
}
else setTimeout("chequeo()", 100);
}

function cambia(foto){
if (document.forms[0].elements['FILE1'].value != "") {
foto2 = new Image();
foto2.src = 'file:///' + foto;
document.foto.src='file:///' + foto;
chequeo();
}
}

Bueno, el chequeo está con foto2, pero si no está definido globalmente, deberías chequear "document.foto.complete"

Saludos

[Morgui]

Muchas gracias, ahora mismo lo pruebo a ver, que llevo más tiempo con este problema...

foto2 es una variable local, pero imagino que si al llamar a la función pongo chequeo(foto2); ya lo tengo solucionado, no?

[caricatos]

Hola otra vez.

Puedes hacerlo como dices, pero la función chequeo es recurrente, y podría darte más problemas de los necesarios.

Las 2 opciones que te recomiendo es que foto2 la declares de forma global, o que asignes la imagen a la imágen de la página y chequees esa imagen.

Tal vez sea mejor que usaras el primer método, porque incluso no haría falta que llegases a hacer la asignación, y el mensaje lo podrías mostrar en un popup... Aunque son cosas que debes decidir tu mismo...

En realidad, lo único que tendrías que hacer es declarar la variable foto2 fuera de las funciones:

var foto2;
function chequeo() {
if (foto2.complete) {
if (foto2.width != 460 || foto2.height != 280)
document.location ='error.asp?op=tamf';
}
else setTimeout("chequeo()", 100);
}

function cambia(foto){
if (document.forms[0].elements['FILE1'].value != "") {
foto2 = new Image();
foto2.src = 'file:///' + foto;
document.foto.src='file:///' + foto;
chequeo();
}
}

Saludos

[Morgui]

Mil gracias Caricatos!!! Me has salvado la vida con un cliente, funciona perfecto.

[caricatos]

Me alegra saber que te va bien.

Saludos