Comunidad de diseño web y desarrollo en internet online

TUTORIAL, LIBRO DE VISITAS HECHO EN FLASH, SIN BASE DE DATOS

Citar            
MensajeEscrito el 27 Oct 2010 09:23 am
Hace un par de años, cuando recién empezaba a manejar el maravilloso mundo de Flash, publiqué un tutorial sobre cómo crear un libro de estos:
http://foros.cristalab.com/libro-de-visitas-en-flash-sin-base-de-datos-y-con-php-yea-t69176/
El típico libro de visitas que todos queremos tener en nuestra página. Mas hoy, debido a que el tuto que cree hace un par de años resultaba un poco defectuoso y con varios errores, he decidido volver a publicar el mismo, pero con mejoras muy simples y sin opción a que de error!

IDEA GENERAL
Solo quiero que tengan la idea de qué vamos a hacer ok?....primero, vamos a crear un pequeñito formulario que flash usará para enviar los datos, cómo los enviara? por medio de php, php qué hará?...php lo que hará será escribir los datos en un archivo de texto, o sea, un "notepad" creado por nosotros mismos (clic derecho>nuevo>documento de texto)....ta fácil!!......Flash de por sí solo no puede escribir sobre archivos de texto, sólo los puede leer, pero sí puede enviarselos a php para que php los escriba, es por eso que usamos php para poder escribir en ellos...


Solo sigan los siguientes pasos:

1) Vamos a crear primero la apariencia de nuestro libro de visitas:
a) Añadimos a la escena una "caja de introducción de texto" a la cual le colocamos como nombre de instancia "nombre", así como otra con nombre de instancia "apellido" y una tercera con nombre de instancia "comentario".
b) Creamos una "caja de texto dinámico" a la cual le ponemos como nombre de instancia "comentarios".
c) Creamos un boton, podemos hacerlo añadiendo un "texto estátito" y presionando f8 para poder convertirlo en botón, al botón le ponemos como nombre de instancia "enviar".

(supongo que ya saben cómo añadir cajas de texto?...texto estático...?....crear botoncitos.....etc verdad?....sino investiguenlo, es muy fácil)


2) Vamos a la parte del código, lo que a muchos les aterra!....pero se los explico de la forma más sencilla para que comprendan qué es lo que hace cada código, tranquilos, yo no le entendí a la primera, con un poco de práctica llegué a entenderle con el tiempo...

a) Hubicados en el primer y único fotograma que tenemos en nuestra película presionamos f9 para que se abra la ventana de introducción de código, nótese que tiene que estar seleccionado el fotograma 1 para ingresar el código en el fotograma 1....facil no?....ahora, escribimos el siguiente código: (despues de cada "//" doy una pequeña explicacion de lo que hará el código....)

//-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
//PRIMERO: VAMOS A HACER QUE FLASH LEA NUESTROS COMENTARIOS EXISTENTES AL NOMAS CARGAR:

Código :

//creamos una variable cargadora, tipo "LoadVars", o sea, este tipo de variables puede "contener más sub-variables" dentro de ella:
       var cargadora:LoadVars=new LoadVars();

        //le decimos a flash que cuando abra nuestra variable lea las variables de nuestro archivo "comentarios.txt":
       cargadora.load("libro.txt");
              
       //leemos las variables, que en este caso sólo será una!!....la variable "coments" de nuestro .txt, y se le asignarán a nuestra caja de texto dinámico "comentarios":
       cargadora.onLoad=function(){
      comentarios.htmlText=cargadora.coments;
       }


//-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
//SEGUNDO: lo que hicimos anteriormente lo encerramos dentro de una funcion llamada "cargarcomentarios", esto nos dará la ventaja de poder cargar nuestros comentarios cuando se nos antoje!....entonces nos quedaría asi:
//Y de paso la mandamos a ejecutar para q cargue los existentes, simplemente escribiendo su nombre y (): cargarcomentarios()......

Código :

 cargarcomentarios();
       function cargarcomentarios(){
       var cargadora:LoadVars=new LoadVars();
       cargadora.load("libro.txt");
      
       cargadora.onLoad=function(){
      comentarios.htmlText=cargadora.coments;
       }
       }

//-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
//TERCERO: ahora vamos a seguir escribiendo el siguiente código, que lo que hará será enviar un nuevo comentario cuando el usuario desee hacerlo!....

Código :

//creamos una nueva variable "LoadVars" llamada "estoyenviando" que almacenará nuestros datos a enviar (nombre apellido y comentario) cuando el botón "enviar" sea presionado:
       var estoyenviando:LoadVars=new LoadVars();

       //asignamos lo que contiene cada cajita de texto que creamos (nombre apellido y comentario) a una sub-variable de la variable "estoyenviando":
       //nótese que agrego varios "+<br/>" a los textos, estos serán interpretados por flash como "un enter" o "una línea en blanco" a la hora de leer el comentario....(pues es código html el que leera...no le pongamos atencion a eso..)
       estoyenviando.nombreenviado=nombre.text+"<br/>"; 
       estoyenviando.apellidoenviado=apellido.text+"<br/>";
       estoyenviando.comentarioenviado=comentario.text+"<br/>"+"<br/>";

       //luego de asignar los datos a nuestras "sub-variables" vamos a enviarlos!...claro, no directamente a nuestro archivo .txt, sino que a un archivo .php que más adelante crearémos...es muy fácil.  Nuestro .php se llamará "yohagoeltrabajosucio.php"  ;-)
       //le decimos que envíde nuestra variable "estoyenviando" y entre paréntesis colocamos: (el nombre de nuestro php, la variable a enviar, el método a enviar)....nótese que el método es "POST"...si quieren saber qué es esto investiguenlo un poco....
       estoyenviando.sendAndLoad("yohagoeltrabajosucio.php", estoyenviando, "POST");

        //ahora que ya le envió los datos a nuestro archivo .php, se cargaran los comentarios nuevamente, cómo? simplemente llamando a nuestra función "cargarcomentarios()" que creamos al principio!!...
        cargarcomentarios();

//-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
CUARTO: como lo que queremos es que los datos se envíen al presionar el botón "enviar" simplemente encerramos todo lo que creamos en el paso anterior entre lo siguiente:
//le diremos que al presionar el boton "enviar" va a realizar la siguiente funcion.....que es lo que hicimos en el paso anterior....todo queda ya así:

Código :

 enviar.onPress=function(){
       var estoyenviando:LoadVars=new LoadVars();      
       estoyenviando.nombreenviado=nombre.text+"<br/>"; 
       estoyenviando.apellidoenviado=apellido.text+"<br/>";
       estoyenviando.comentarioenviado=comentario.text+"<br/>"+"<br/>";

       estoyenviando.sendAndLoad("yohagoeltrabajosucio.php", estoyenviando, "POST");

        cargarcomentarios();
        }

//-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
QUINTO: ya casi terminamos!!....el código siguiente es para nuestro archivo .php, por lo tanto no va en ningún lado de nuestra escena en flash.......vamos a crear nuestro archivo .php: nos vamos al escritorio de nuestra PC, damos clic derecho > nuevo > archivo de texto y le colocamos cualquier nombre que se nos antoje en ese momento......
//dentro de nuestro archivo de texto creado vamos a ingresar el siguiente código:

Código :

 <?
       //capturamos las variables que flash le envíe a nuestro archivo, en php para crear una variable nueva usamos el signo "$"....investiguen un poco sobre la sintáxis de php, es una de las más fáciles que conozco...
       $nombre=$_POST["nombreenviado"];
       $apellido=$_POST["apellidoenviado"];
       $comentario=$_POST["comentarioenviado"];
       $nombredemitxt="libro.txt";
       
       //abrimos nuestro archivo, en forma de escritura "a+", esto significa que lo que le agreguemos se agregará al final de lo que ya está...
      $abriendo=fopen($nombredemitxt,"a+");

      //escribimos en el archivo, dentro del paréntesis va:  fwrite(nombre de nuestra variable que abre el archivo, nombre de nuestra variable que sera escrita):
      fwrite($abriendo,$nombre);
      fwrite($abriendo,$apellido);
      fwrite($abriendo,$comentario);

      //no se nos olvide cerrar nuestro archivo!...sino nunca volverémos a tener acceso a este:
     fclose($abriendo);
    
     ?> 


//-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
SEXTO: luego de escribir este código en nuestro archivo, vamos a convertir nuestro archivo a un archivo "php".....es muy fácil de hacer, en la misma ventanita en donde estas, vete a archivo > guardar como; luego seleccionas la carpeta en donde vas a guardar tu archivo, la cual tiene que ser la misma carpeta en donde tendras tu película y tu .txt.......luego de seleccionar la carpeta, escribes como nombre "yohagoeltrabajosucio.php"<----escribirlo con todo y comillas, y das clic en "guardar"...y listo!....fácil no?.....para serciorarte de que creaste un archivo .php vete a donde lo hayas guardado y da clic derecho > propiedades, sobre él, fíjate que en sus propiedades aparecerá "archivo tipo: php"..... :-)


//-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
SÉPTIMO Y ÚLTIMO PASO: es el más fácil de todos!....solo te vas a la carpeta en donde estarán guardados todos tus archivos (la pelicula y el .php) y creas un nuevo archivo de texto llamado "libro"....lo abres y adentro escribes "&coments=" que será la variable a donde se añadirán todos nuestros comentarios...guardas los cambios y listo!....ya creaste tu libro de visitas!!.....FELICIDADES!!


RECOPILACIÓN DE TODO EL CÓDIGO:
1) en el primer fotograma de nuestra movie irá:

Código :

 cargarcomentarios();
 function cargarcomentarios(){
       var cargadora:LoadVars=new LoadVars();
       cargadora.load("libro.txt");
      
       cargadora.onLoad=function(){
      comentarios.htmlText=cargadora.coments;
       }
       }
 
 enviar.onPress=function(){
       var estoyenviando:LoadVars=new LoadVars();      
       estoyenviando.nombreenviado=nombre.text+"<br/>"; 
       estoyenviando.apellidoenviado=apellido.text+"<br/>";
       estoyenviando.comentarioenviado=comentario.text+"<br/>"+"<br/>";

       estoyenviando.sendAndLoad("yohagoeltrabajosucio.php", estoyenviando, "POST");

        cargarcomentarios();
        }



2) en nuestro archivo .php:

Código :

<?
       $nombre=$_POST["nombreenviado"];
       $apellido=$_POST["apellidoenviado"];
       $comentario=$_POST["comentarioenviado"];
       $nombredemitxt="libro.txt";
       
      $abriendo=fopen($nombredemitxt,"a+");

      fwrite($abriendo,$nombre);
      fwrite($abriendo,$apellido);
      fwrite($abriendo,$comentario);

     fclose($abriendo);
   
?> 


3) en nuestro archivo .txt:

Código :

&coments=






EXTRAS: pueden agregarle muchas más opciones, en realidad les aconsejo que usen su creatividad y su ingeniosidad, pues es así como se aprende bastante!.....por ejemplo, este libro yo busque y busque y busque y nunca encontraba cómo hacer uno....entonces, decidí crear el mío, a mi manera....talvez no sea la mejor manera pero por el momento me va muy bien con este libro..... Pueden agregarle cosillas como: que cuando presione el botón enviar las cajitas de texto se pongan vacías de nuevo....o salgan un mensaje que diga "mensaje enviado!"...y un sin fin de cosas que no se las colo qué aquí para no hacerles complicado el asunto...aunque este tipo de detalles es muy fácil de hacer.....por eso: INVESTIGUEN!......

ESO ES TODO AMIGOS!....CUALQUIER DUDA ESCRIBANME: [email protected] y con gusto les enviaré mis archivos. NOTA: no les envío los míos si uds no me envían los suyos, la idea es ver que por lo menos se esforzaron intentando hacer el tuto...
(más adelante haré un tuto sobre un sistema de aprobación de comentarios...)

Por MARCO DUARTE

13 de clabLevel



 

Guatemala

chrome
Citar            
MensajeEscrito el 29 Oct 2010 03:35 pm
Dado que hace más de tres años que existe AS3, quizás podrías reescribir tu tutorial para que no nazca desfazado. De todas formas, seguramente habrá gente que siga utilizando AS2, paso el tuto a Aportes

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.