En esta Sugerencia rápida, le mostraré cómo crear un formulario de contacto utilizando PHP y ActionScript 3. Aprenderemos cómo pasar variables de Flash a PHP y alertaremos al propietario enviando un correo electrónico o un mensaje de texto SMS..
Paso 1: Configuración del documento
Lo primero que debes hacer es descargar los archivos de origen para este tutorial. Dado que este tutorial es un consejo rápido, omitiré los pasos de diseño. Una vez que haya descargado los archivos, abra el archivo 'contactForm.fla'.
El diseño de SWF se ve así:
Paso 2: La clase de documentos
Cree un nuevo archivo 'ActionScript' y guárdelo en la misma carpeta que 'contactForm.fla'. Asigne al archivo el nombre 'contatForm.as'. A continuación, vincule el archivo Flash y el archivo ActionScript en el panel Propiedades. Para una descripción más detallada de cómo configurar la clase de documento, consulte esta guía rápida.
Paso 3: Las importaciones
Aquí están las declaraciones de importación que usaremos para este archivo. Además, crearemos dos variables globales. Una es usar para un archivo adjunto, y la otra es hacer un seguimiento de si vamos a usar ese archivo o no..
La primera función que llamamos es en eso(). Dentro de la función, configuramos las etiquetas para nuestros campos de texto. Además, creamos una matriz de los proveedores de telefonía celular. Ya que estoy en los Estados Unidos, solo uso los proveedores de EE. UU. Echa un vistazo a este artículo en Wikipedia que te ayudará con los proveedores de teléfonos celulares en tu país..
función privada init (): void var labelArray: Array = [[nameLabel, "From name:"], [subjectLabel, "Subject:"], [messageLabel, "Message:"], [emailLabel, "From email:" ], [toLabel, "To name:"], [addyLabel, "To email:"]]; var textArray: Array = [nameText, subjectText, messageText, emailText, toText, addyText]; var len: int = labelArray.length; adjunto = falso; pBar.visible = falso; pBar.minimum = 0; pBar.maximum = 100; pBar.mode = ProgressBarMode.MANUAL; combo.visible = falso; para (var i: int = 0; i
También configuramos los botones de radio..
Paso 5: Manejo del accesorio
Lo primero que nos preocupa es manejar el archivo adjunto. Ya que estoy usando Flash CS3, lo haremos adjuntando a la antigua usanza. Cuando se haga clic en el botón 'adjuntar', crearemos una instancia de FileReference Variable que hemos creado. Una cosa importante a tener en cuenta es que la FileReference la variable debe ser una global variable (es decir, no específica para una sola función) para que los eventos se activen correctamente.
Cuando el usuario haya seleccionado un archivo para cargar, haremos visible la barra de progreso y escucharemos los eventos "progreso" y "completo". Cuando se dispara el evento 'completo', deshabilitamos el botón 'adjuntar', establecemos la variable de adjunto en cierto y ocultar la barra de progreso.
Cambiando a PHP. Primero, cree un nuevo documento PHP y guárdelo como 'upload.php'. Ahora, crea un directorio en tu servidor web llamado 'temp'. Esta será la carpeta que usaremos para almacenar el archivo cargado. Asignaremos esa ubicación a una variable de PHP llamada 'carpeta'. A continuación, usamos la variable súper global '$ _FILES' para obtener el nombre del archivo que cargamos. Luego creamos una variable que almacena el nombre temporal del archivo que acabamos de cargar. Por último, movemos el archivo a nuestro directorio 'temp'. Puede encontrar un excelente tutorial sobre cómo cargar archivos con PHP sobre Nettuts+.
Paso 7: El documento de mensaje
Cree un nuevo documento PHP y guárdelo como 'message.php'. En este archivo, recibiremos las variables de Flash. Lo primero que hacemos es usar la variable súper global '$ _POST' para configurar todos los campos de correo electrónico como 'a' y 'desde'. A continuación, establecemos nuestra variable 'encabezados'. En PHP, usamos '.' en lugar de '+' para concatenar. En nuestra variable 'encabezados', verás que '. =' Funciona igual que '+ =' en ActionScript. Después de cada vez que concatenemos agregamos dos retornos de línea. Esto es importante y sin él nuestro correo puede fallar..
Finalmente, después de que todos nuestros encabezados y campos estén listos para comenzar, llamamos a la función "correo". Si el correo es exitoso, verificamos si hubo un archivo asociado con el correo electrónico. Si la variable 'archivo' está configurada, simplemente eliminamos ese archivo de nuestro servidor usando la función 'desvincular'.
'; $ address = $ _POST ['email']; $ mensaje = $ _POST ['mensaje']; $ subject = $ _POST ['subject']; $ nombre = $ _POST ['nombre']; $ from = $ _POST ['from']; $ headers = "From: $ from <$address>\ r \ n "; $ headers. =" Return-Path: $ address \ r \ n "; $ headers. =" Responder a: $ address \ r \ n "; $ headers. =" X-Mailer: PHP ". phpversion ()." \ r \ n "; $ headers. =" MIME-Version: 1.0 \ r \ n "; // EL ADJUNTO DE ARCHIVOS VA AQUÍ $ headers. =" Tipo de contenido: texto / plano; charset = utf-8 \ r \ n "; if (correo ($ a, $ asunto, $ mensaje, $ encabezados)) si (isset ($ archivo)) unlink ($ archivo); echo 1; else eco 0;?>
Paso 8: Agregar el archivo adjunto
Aquí está el código que utilizamos para enviar un archivo adjunto. Si desea incluir este tipo de funcionalidad en su aplicación, simplemente inserte este código donde dice "ARCHIVO ADJUNTO AQUÍ". Lo primero que hacemos es verificar si la variable 'archivo' se ha publicado. Además, verificamos si la variable 'bool' es 'true'. Esto comprobará que el usuario no esté intentando enviar un archivo adjunto como mensaje de texto. Aunque puede enviar archivos como archivos adjuntos a teléfonos celulares, las dimensiones máximas son solo de aproximadamente 640x480. Eso tomaría un poco de lógica adicional para cambiar el tamaño de la imagen y está fuera del alcance de este Consejo rápido. Sin embargo, siéntete libre de probarlo tú mismo.!
De vuelta en el camino, crearemos una variable de "archivo" para llegar a la ubicación del archivo que subimos. Además, después de realizar un cambio de cadena simple, verificamos la extensión del archivo. Finalmente, modificamos nuestra variable 'encabezados' para incluir el archivo, así como toda la información necesaria para adjuntarlo..
Cuando se hace clic en el botón 'remitente', llamamos a la función 'onClick ()'. Realizamos algunas comprobaciones para ver si es un correo electrónico o un mensaje de texto que el usuario está tratando de enviar. Si se trata de un mensaje de texto, daremos un pequeño formato al número de teléfono, verificaremos si el usuario ha seleccionado un proveedor y nos aseguraremos de que el número sea válido. Una vez que hayamos validado toda la información del usuario, cargaremos el documento 'message.php', le enviaremos todas nuestras variables y escucharemos el evento 'completo'.
función privada onClick (evento: MouseEvent): void var textArray: Array = [nameText, messageText, subjectText]; var len: int = textArray.length; if (! emailRadio.selected) addyText.text = addyText.text.replace (/ [() - \ s \. \ +] / g, ""); para (var i: int = 0; i
Paso 10: Los manejadores de eventos
Cuando se activa el evento 'completo', simplemente analizaremos el número entero que PHP nos envía. Junto con el evento 'completo', a continuación se encuentran el resto de las funciones del controlador de eventos que se utilizan en este proyecto.
La función 'onChange' cambiará la visibilidad del cuadro combinado y llamará a la función 'handleAddy'. La función 'onText' establecerá el foco del campo de texto cuando se haga clic en la etiqueta, como en HTML. Finalmente, la función 'onLabel' manejará el resaltado del campo de texto cuando el mouse se mueva sobre él.
función privada onComplete (event: Event): void var num: int = parseInt (event.target.data); if (num) ExternalInterface.call ("alerta", "El mensaje fue enviado"); else ExternalInterface.call ("alerta", "Hubo un error"); función privada enCambiar (evento: Evento): void switch (event.target.selection) case emailRadio: combo.visible = false; attach.visible = true; addyLabel.dyText.text = "Al correo electrónico:"; handleOffset (falso); descanso; case textRadio: attachment = false; combo.visible = verdadero; attach.visible = false; addyLabel.dyText.text = "A número:"; handleOffset (true); descanso; handleAddy (); función privada onText (evento: MouseEvent): void switch (event.type) caso MouseEvent.ROLL_OVER: event.target.drawFocus (true); descanso; caso MouseEvent.ROLL_OUT: event.target.drawFocus (false); descanso; función privada onLabel (event: MouseEvent): void var labelName: String = event.currentTarget.name.replace ("Label", "Text"); var tf: UIComponent; if (labelName === "messageText") tf = TextArea (this.getChildByName (labelName)); else tf = TextInput (this.getChildByName (labelName)); switch (event.type) case MouseEvent.ROLL_OVER: tf.drawFocus (true); descanso; caso MouseEvent.ROLL_OUT: tf.drawFocus (false); descanso; caso MouseEvent.CLICK: tf.setFocus (); descanso; función privada onFocus (evento: FocusEvent): void event.target.text = "";
Paso 11: El resto de las funciones
Estas son las funciones finales que controlarán la verificación de los campos de texto para asegurarse de que no estén vacíos, así como el manejo del desplazamiento causado por la selección del botón de opción.
Función privada handleOffset (bool: Boolean): void var ch: Number = combo.height + 10; switch (bool) case true: nameLabel.y + = ch; subjectLabel.y + = ch; messageText.y + = ch; messageLabel.y + = ch; subjectText.y + = ch; sender.y + = ch; nameText.y + = ch; rule.y + = ch; emailLabel.y + = ch; emailText.y + = ch; rule2.y + = ch; descanso; caso falso: mensaje de texto.y - = ch; messageLabel.y - = ch; subjectText.y - = ch; subjectLabel.y - = ch; sender.y - = ch; nameLabel.y - = ch; nameText.y - = ch; rule.y - = ch; emailLabel.y - = ch; emailText.y - = ch; rule2.y - = ch; descanso; función privada handleString (string: String): Boolean if (string.toLowerCase (). search (/ [a-z0-9] / g)! = -1) return true; else devolver falso; función privada handleEmail (string: String): Boolean // este RegExp se usa para verificar si el usuario ingresó una dirección de correo electrónico válida patrón var: RegExp = / [a-z0-9! # $% & '* + \ / =? ^ _ '| ~ -] + (?: \. [a-z0-9! # $% &' * + \ / =? ^ _ '| ~ -] +) * @ ( ?: [a-z0-9] (?: [a-z0-9 -] * [a-z0-9])? \.) + [a-z0-9] (?: [a-z0-9 -] * [a-z0-9])? / g; if (pattern.exec (string)! = null) return true; else devolver falso; función privada handleNumber (string: String): Boolean if (string.search (/ [0-9] /) === -1) return false; else // es posible que necesite cambiar esta lógica dependiendo de la longitud de // los números de teléfonos móviles en su país si (string.length < 11) return false; else return true; return false; private function handleAddy():void addyText.addEventListener(FocusEvent.FOCUS_IN, onFocus); if(!emailRadio.selected) addyLabel.text = "To email:"; addyText.text = ""; else addyLabel.text = "To number:"; addyText.text = "Starting with country code";
Conclusión
En este Consejo rápido, aprendió a usar Flash y AS3 para enviar no solo variables de texto simples, sino también imágenes, y no solo por correo electrónico, sino también a través de mensajes de texto SMS. Estas técnicas se pueden utilizar de varias maneras. Sigue experimentando y recuerda suscribirte al feed de Tuts +. Gracias por leer!
Share
Accentsconagua
