Realizar un webmail

[rulerson]

Hola

Ante todo un saludo pq este es mi primer mensaje.
Bueno mi problema es el siguiente, tengo que hacer un webmail. Es un favor que le hago a un amigo pero mis conocimientos sobre javascript no son muy avanzados por lo que pido ayuda al foro.

Si sabeis donde puedo conseguir codigos que se suelen emplear para un webmail, una guia o alguno de vosotros me puede ir ayudando a realizar esto pues os lo agradeceria mucho.

El webmail tendra las funciones basicas de cualquier webmail.

Pues eso, a cualquiera que se le ocurra algo que me lo diga, ok?

Muchas gracias y un saludo :)

[tunait]

Hola rulerson, bienvenido

Mira, el uso de javascript será lo mínimo que necesites.

Antes de meterte con js necesitas asentar las bases gordas de tu webmail con algún lenguaje del lado del servidor.

Así el primer paso sería que verifiques qué lenguaje del lado servidor soporta el servidor que vais a utilizar (asp, php, cgi, etc.)

El segundo paso entonces será buscar la forma de hacer la parte que interactúa con el servidor en ese lenguaje. Cuando tengas lista esa base, entonces yá podremos jugar con javascript.

un saludo

[rulerson]

Ok, el asunto es que yo simplemente me encargo de las funciones en javascript (que creo que son unas cuantas) y el aspecto del webmail, CGI y demas lo realiza otra persona.

Por lo que he podido mirar renombrar carpetas, contestar al remitente, archivos adjuntos, etc es con js...me equivoco?

Gracias por contestar, un saludo

[tunait]

Por lo que he podido mirar renombrar carpetas, contestar al remitente, archivos adjuntos, etc es con js...

No.

Básicamente javascripot actúa en el lado cliente. Así que no puede renombrar una carpeta en el servidor.

Contestar al remitente no sería más que redactar un correo citando el original con un destinatario determinado por una variable y enviarlo desde el servidor.

archivos adjuntos, para eso también necesitas de lenguaje servidor.

Con javascript (y html) debes crear los formularios de envío.
Puedes usar javascript para validar que el campo del destinatario esté relleno y cosas así.
Por ejemplo si se pincha en "responder" se enviaría una variable indicando el modo del envío. Si el modo es "responder" entonces debería cargar la página con el destinatario yá especificado y una cita del mensaje original.

Pasar esos datos con javascript es 4 veces más largo y comlejo que hacerlo con lenguaje servidor, en donde con lenguaje server-side recogería el parámetro, sacaría de la base de datos el email y el mensaje original, crearía la página dinámicamente y llegaría entonces al cliente.
Si pretendes pasar esos datos con javascript en vez de pasar un pequeño parámetro, sería enviarlo todo mediante javascript. Guardar el contenido escrito de un email en una variable javascript puedes ser arriesgado.

Resumiendo:

Con html, javascript y css puedes trabajar la parte de la interfaz con el usuario y todo lo que debas hacer antes de enviar nada (incluídos la redacción del email, inclusión de los datos y verificación de éstos). El resto yá será lado servidor.

[rulerson]

Ah pues mucho mejor :)
Pues la primera duda. Me gustaria poner la opcion de seleccionar todos los mensajes, es decir, marcas una casilla de verificacion que haga que la casilla de verificacion de cada casilla se marque. De esa manera puedes borrar varios mensajes de golpe o pasarlos a otra carpeta.

gracias

Duda resuelta, perdon por las molestias :)

Otra pregunta, como puedo validar solo un campo de un formulario en el que pueden haber varios?

Es decir, hay campos obligatorios para rellenar y otros no, en el campo de la direccion a la que hay que enviar el e-mail es obligatorio pero el campo del asunto no lo es.

Muchas gracias y un saludo

[Bravenap]

Pues símplemente comprobando que ese campo no está vacío:

Código:

if(document.nombre_formulario.campo_mail.value=="")
{alert("Debe rellenar el campo del e-mail")}

Suerte.

[rulerson]

Buenas, al final el webmail tengo que presentarlo en forma de demo por lo que muchas tareas con el servidor se haran a nivel local. Como puedo cambiar texto de un html. El ejemplo en concreto es que tengo que poder renombrar las carpetas que hayan en el webmail pero para la demo simplemente sera cambiar el texto en el documento html. Habra un checkbox por cada carpeta, despues pulsando la opcion de renombrar se abrira una ventana donde me pedira el nuevo nombre de la carpeta; al darle a aceptar despues de haber puesto el nombre en esa carpeta tiene que aparecer el nuevo nombre.

Alguien me puede dar una solucion?

Muchas gracias.

[Bravenap]

Bueno, no entendí muy bien tu pregunta, pero vamos a ver si van por aquí los tiros.

Para cambiar el texto de algo, ya sea por ejemplo, el contenido de una celda, de una capa o de un fragmento de la página has de nombrar primeramente esa parte a modificar.

<td id="contenido"></td>

o

<div id="contenido"></div>

Una vez hecho esto puedes utilizar dos funciones para incluir nuevo texto

Código:

document.getElementById("contenido").innerText="Nuevo texto que se incluye";

o incluso dándole formato HTML

Código:

document.getElementById("contenido").innerHTML="Nuevo texto que se incluye en <b>negrita</b>";

Yo te recomiendo mejor el segundo método.

De esta manera, cuando des a aceptar en el popup o nueva ventana podrías llamar a una función como esta:

Código:

<script language="JavaScript">
function cambiarNombre(){
  texto=document.formulario.carpeta.value;
  opener.getElementById("contenido").innerHTML="Nombre de la carpeta: <b>"+texto+"</b>.";
  self.close();
}
</script>

Espero que te sirva.

Un saludo.

[rulerson]

Primero de todo muchas gracias pero soy bastante pez aun en esto :)
Donde debo poner la funcion para incluir el nuevo texto de cualquiera de las dos opciones que has puesto?

Gracias y un saludo

[Bravenap]

Entre las etiquetas HEAD de la nueva ventana que abres para introducir el nombre de la carpeta, por eso se usa opener para cambiar el texto de la página que ha abierto el popup.

La nueva ventana te quedaría así:

<html>
<head>
<title>Introduce un nuevo nombre para la carpeta</title>

<script language="JavaScript">
function cambiarNombre(){
texto=document.formulario.carpeta.value;
opener.getElementById("contenido").innerHTML="Nomb re de la carpeta: <b>"+texto+"</b>.";
self.close();
}
</script>

</head>
<body>

<form name="formulario">
<input type="text" name="carpeta">
<input type="button" name="Button" value="Aceptar" onClick="cambiaNombre()">
</form>

</body>
</html>

[rulerson]

No perdona

Me referia a la linea
document.getElementById("contenido").innerHTML="Nu evo texto que se incluye en <b>negrita</b>";

Gracias

[Bravenap]

Pues te lo acabo de poner todo entero más arriba.

[rulerson]

Ahi va! es cierto..jajajja perdona

Muchas gracias por todo

[rulerson]

Por ahora no me funciona. Supongo que es pq falta algo mas. Voy a intentar explicarme mejor y asi a ver si conseguimos lo que falta :)

En un documento html tengo una checkbox por cada nombre de carpeta que puedo cambiar. Este documento se carga en un iframe de otro documento html. En este ultimo documento de html es donde tengo las opciones para las carpetas y entre ellas la de renombrar. Yo marco el checkbox y luego le doy a renombrar, se abre el popup y pongo el nuevo nombre de la carpeta y le doy a aceptar. Entonces deberia cambiar pero no ocurre asi.
He marcado la celda donde quiero cambiar el texto (lo de id=contenido) pero ¿puede ser que no me funcione al estar en una pagina diferente a la que esta la opcion?
Y de paso pregunto ¿seria muy complicado la opciones de borrar y crear carpetas? Una carpeta nueva deberia aparecer en una nueva fila de la tabla y con borrar deberia desaparecer esa fila.

Espero no marear a la gente pero esto es bastante importante para mi.

muchas gracias y un saludo

[rulerson]

Una nueva cosa. Para abrir un popup tengo puesto este codigo

entre las etiquetas head

function Abre() {
window.open("nuevomensaje.htm", "nombre",left="100",top="100",width="400",height=" 200");
}

y en la etiqueta body esto

<a onClick="Abre()" href="nuevomensaje.htm">

pero no me funciona, me lo pone en la misma ventana. Que tengo mal?

gracias :)

[Bravenap]

Mmmmm... ¿dices que está en un iframe? Si no me equivoco el checkbox está dentro del iframe mientras que el botón de renombrar está en la página que contiene a ese iframe, es decir, top. Prueba entonces a, en lugar de opener, poner el nombre del iframe, ya que lo que tiene que rellenar está en el iframe y no en la página que la ha abierto, que es el top.

Ahora bien, y quizás lo más importante. Pongamos el caso de que haya dos carpetas a seleccionar, es decir, dos checkbox y dos celdas. Entonces las dos celdas no se pueden llamar identificar por la misma palabra. Además es mejor renombrar las carpetas una a una, por tanto, utilizaremos opciones excluyentes (radiobutton mejor que checkbox)

***Esto en el iframe***

<form name="formulario">
<table>
<tr>
<td><input type="radio" name="radiobutton" value="1"></td>
<td id="1">Primera carpeta</td>
</tr>
<tr>
<td><input type="radio" name="radiobutton" value="2"></td>
<td id="2">Segunda carpeta</td>
</tr>
</form>
</table>

Una vez seleccionada la opción (1 ó 2) abrimos la ventana

***esto en el HEAD de la página del botón***
<script>
function Abre() {
window.open("nuevomensaje.htm", "nombre","left=100, top=100, width=400, height=200");
}
</script>


A la que llamamos de esta manera con el botón

<input type="button" name="Button" value="Renombrar" onClick="Abre()">

Y ahora el popup donde ponemos el siguiente script para recoger cuál es el valor del radio button y cambiar el nombre de la carpeta.

***Esto en nuevomensaje.htm***

<script language="JavaScript">
function cambiarNombre(){
for(i=0;i<nombreIframe.formulario.radiobutton[i].value.length;i++)
{
if (nombreIframe.formulario.radiobutton[i].value==true){opcion=i}
}
texto=document.formulario.carpeta.value;
nombreIframe.getElementById(opcion).innerHTML="Nom bre de la carpeta: <b>"+texto+"</b>.";
self.close();
}
</script>

Bueno, creo que toda estaría bien así. Lo único por lo que no pondría la mano en el fuego es por lo que está en rojo. A ver si alguine nos echa una mano a los dos.

Un saludo.

[rulerson]

En principio me da error cuando le doy al boton de aceptar del popup. ¿Puede influir que la opcion renombrar (q esta en el top) sea una imagen y no un boton?

Tu me has escrito esto para esa opcion

<input type="button" name="Button" value="Renombrar" onClick="Abre()">


y yo tengo escrito esto

<a onClick="Abre()" href="renombrar.htm">
<img border="0" src="iconos/renom.gif" width="29" height="32"></a>

un saludo

[Bravenap]

Te has fijado que muy probablemente te cambia la página anterior cuando se abre la nueva ventana. Te lo explico.

¿Diferencias entre un botón y una imagen con enlace? No tiene porqué influir, sólo que has de escribirlo correctamente.

Si pones

<a href="renombrar.htm">Lo que sea</a>

creas un enlace a renombrar.htm que por defecto se abre en la misma ventana. Si pones

onClick="Abre()"

en cualquier objeto, al pinchar sobre él se ejecutará la función Abre() con las instrucciones que lleve. En tu caso, abrir una nueva ventana. Pero si pones:

<a onClick="Abre()" href="renombrar.htm">Lo que sea</a>

no sólo le estás diciendo que ejecute una acción sino que vaya a una página. Es muy probable que el enlace tenga prioridad sobre la ejecución del Javascript, por lo tanto no funcionará. En el caso de que funcionara, ya has cargado una nueva página encima de todo y el script no tiene donde buscar ni nada que cambiar. Por tanto, para estos casos se pone lo siguiente:

<a onClick="Abre()" href="#">Lo que sea</a>

Así indicas que es un enlace pero que no vaya a ningún sitio, sino que símplemente ejecute un script. Ahora bien, como una imagen es un objeto también puede soportar el evento onClick, así que se te abren dos opciones: esta

<a onClick="Abre()" href="#">
<img border="0" src="iconos/renom.gif" width="29" height="32"></a>

o esta otra

<img border="0" src="iconos/renom.gif" width="29" height="32" onClick="Abre()">

Con la segunda te ahorras el ponerle el borde cero para que no salga el cuadro típico de los enlaces, pero sin embargo pierdes la "manita" del ratón. Tú eliges. Hay soluciones para los dos "problemas" con CSS.

Esperemos que ahora funcione.

[rulerson]

Si pongo # no se me abre el popup. Si le doy a abrir vinculo en una ventana nueva ma abre la misma pagina.

:(

[Bravenap]

window.open("nuevomensaje.htm","nombre","left=100, top=100, width=400, height=200");

¿estás usando eso?

[rulerson]

si

[Bravenap]

<html>
<head>
<script>
function Abre(){
window.open("nuevomensaje.htm","nombre","left=100, top=100, width=400, height=200")
}
</script></head>
<body>
<a onClick="Abre()" href="#"><img border="0" src="iconos/renom.gif" width="29" height="32"></a>
</body>
</html>

Pon esto en una nueva página, pincha sobre la imagen y dime qué ocurre.

[rulerson]

si que se abre el popup bien

[Bravenap]

Pues es lo mismo que teníamos antes.

[rulerson]

tiene que ver que este utilizando frames?

[Bravenap]

Bueno, chaval, como dicen en mi pueblo, son 10.000.

http://personales.ya.com/pyrus/pruebas/principal.htm

Entra ahí y podrás ver todo sobre lo que estábamos trabajando funcionando 100% (espero que ahora por listo no falle ). Tienes tres documentos: principal.htm, carpetas.htm y nuevomensaje.htm.

Y ahora ya no te puedes quejar ¿eh? Que para eso ya estoy yo que aquí hace mucho calor

Bueno, nada más. Un saludo.

Por cierto, se me olvidaba, quítale el status=yes a la función window.open si quieres, es que se me ha colado mientras hacía pruebas.

[rulerson]

Ole, si que funciona. Muchisimas gracias Bravenap por todas las molestias que te he podido causar ;)

Un saludo

P.D: En breve mas dudas jajajaja :)

[rulerson]

Vuelvo a la carga.

Si quiero responder un e-mail recibido ¿como puedo capturar las direcciones del remitente o remitentes?

Recuerdo que es todo a nivel local o por lo menos todo lo que se pueda.

Graciassssssssssssssssssss.

[Bravenap]

¿Y cómo te envían ese e-mail?

Contéstame aquí aunnque yo te recomiendo que abras una tema nuevo y que expliques mejor qué quieres y cómo estás tratando de hacerlo.

Un saludo.