« Noviembre 2003 | Inicio | Enero 2004 »

Diciembre 30, 2003

Mi primera extensiÛn!!! (jsfl)

Uno de los proyectos en los que estoy trabajando est· formado por catorce fla, que utilizan algunas clases comunes a todos ellos, de manera que cuando se quiere hacer alg˙n cambio, hay que publicarlos todos uno a uno. øNo serÌa mejor poder publicarlos todos a la vez?

°Bien!. °Justo lo que necesitaba!: una oportunidad para hacer mi primera extensiÛn. Es algo muy sencillo, pero es la primera, y eso es lo que cuenta.

Descarga PublishAll.mxp

Diciembre 29, 2003

CuestiÛn de flexibilidad (AS 2.0)

Pero esta flexibilidad no es exclusiva del "viejo" actionscript, sino que podemos hacer exactamente lo mismo con AS2.0

En primer lugar, vamos a crear nuestra clase de pruebas:

class net.designnation.exp.Dinamica{ public var prop1:String; public var prop2:String; public var prop3:String; function Dinamica(){ } public function metodo(Void):Void{ trace("mÈtodo ------"); trace(prop1 + " " + prop2 + " " + prop3); } }

Esta clase tiene que salvarse en disco en un archivo que se llame Dinamica, y en el path correspondiente (es decir, net/designnation/exp).

En el primer frame de la lÌnea de tiempo principal escribimos lo siguiente:

import net.designnation.exp.*; var testClass:Dinamica = new Dinamica(); testClass.prop1 = "Hola"; testClass["prop2"] = "estoy"; var cadena:String = "prop3"; testClass[cadena] = "probando"; //Ahora recupero los valores for (var k=1;k<4;k++){ trace(testClass["prop"+k]); } //Y ejecuto el mÈtodo definido testClass.metodo(); //o bien testClass["metodo"](); //o bien var cadena2:String="metodo"; testClass[cadena2](); stop();

Ahora, pues, podemos hacer que un mÈtodo de la clase ejecute otro cuyo nombre se pasa como par·metro, o que una clase ejecute mÈtodos de otra, o......

En fin, que, una vez m·s, actionScript demuestra ser un lenguaje muy potente y flexible.

CuestiÛn de flexibilidad

Como ya es conocido, los objetos en ActionScript realmente son una especie de arrays accesibles no sÛlo por n˙mero de Ìndice, sino por un identificador.

Por tanto, cuando queremos manipular alguna de las propiedades de un objeto lo podemos hacer de las siguiente manera:

var miObj = new Object(); miObj.prop1 = "design-nation";

Aunque tambiÈn podemos hacerlo asÌ:

var miObj = new Object(); miObj["prop1"] = "design-nation";

Y esto nos abre la puerta a acceder a los valores de las propiedades de objetos de forma din·mica. Por ejemplo:

var miObj = new Object(); miObj.prop1 = "propiedad1"; miObj.prop2 = "propiedad2"; miObj.prop3 = "propiedad3";

Y luego podemos acceder a esos valores de la siguiente manera:

for (var k=1;k<4;k++){ trace("la propiedad prop"+k+ " tiene el valor " + miObj["prop"+k]); }

øY quÈ pasa con los mÈtodos?. Pues algo parecido. Veamos:

var miObj = new Object(); miObj.metodo1 = function(){ trace("metodo1"); } miObj["metodo1"]();

Por tanto, podremos ejecutar mÈtodos de un objeto de forma din·mica, sin saber realmente lo que estamos ejecutando.

Diciembre 27, 2003

Extensiones para Flash MX 2004

Impresionante colecciÛn de extensiones para el entorno de Flash. (informaciÛn recogida del blog de Josh Dura)

Diciembre 26, 2003

Componente Tree (·rbol)

Estoy empezando a trabajar con los nuevos componentes de Flash MX 2004.

Hoy, un poco tambiÈn para probar su supuesta facilidad de uso, he hecho la pequeÒa "aplicaciÛn" de enlaces que podeis ver en la parte derecha.

Y efectivamente, ha sido r·pido y f·cil:

_global.style.setStyle("fontSize", 12); myTree.setStyle("color", 0x999966); myTree.setStyle("borderStyle","solid"); myTree.setStyle("themeColor", "haloBlue"); // carga y asignacion de contenido myTreeDataProvider = new XML(); myTreeDataProvider.ignoreWhite = true; myTreeDataProvider.onLoad = function(){ myTree.dataProvider = myTreeDataProvider; } myTreeDataProvider.load("/enlaces/tree.xml"); myTreeListener = new Object(); myTreeListener.tree = myTree; //Listener para el evento change del arbol //Quiero desplegar nodos al seleccionarlos myTreeListener.change = function(eventObject){ var theSelectedNode = eventObject.target.selectedNode; var theSelectedNodeLabel = theSelectedNode.attributes.label; var esLink = theSelectedNode.attributes.isLink; var esBranch = this.tree.getIsBranch(theSelectedNode) if (esBranch){ if (this.tree.getIsOpen(theSelectedNode)){ this.tree.setIsOpen(theSelectedNode, false, true); }else{ this.tree.setIsOpen(theSelectedNode, true, true); } }else{ if (esLink){ var theSelectedNodeURL = theSelectedNode.attributes.url; //trace("url " + theSelectedNodeURL); getURL(theSelectedNodeURL, "_blank"); } } } myTree.addEventListener("change", myTreeListener); stop();

Dos cosas a tener en cuenta: evidentemente, el nombre de instancia del componente es myTree; y podeis ver el formato que tiene el xml carg·ndolo desde el Internet Explorer

Diciembre 24, 2003

Los favoritos de O'Reilly

O'Reilly es probablemente la editorial m·s conocida y/o famosa en cuanto a libros de programaciÛn. Generalmente, el hecho de que un libro estÈ editado por ellos, es seÒal de calidad y de pertenecer a un autor de reconocido prestigio en el tema tratado por el libro. En el blog enterFrame he encontrado el link a la lista de O'Reilly de los libros m·s buscados en el 2003. Puede servir como guÌa de por donde va el mundo del ordenador.

Diciembre 23, 2003

Y ahora tambiÈn un Mac

…ste es mi puesto (hoy a la hora de comer, por eso no hay nadie).

øPorquÈ una foto de mi puesto?. Porque en Èl est· mi nueva "adquisiciÛn", un poderoso G4 con monitor de 21 pulgadas.

Ya sÛlo me falta un monitor m·s para poder hacer de hacker en una pelÌcula de hollywood... ;)

(Por cierto, la foto est· hecha con la c·mara de un mÛvil TSM-30 de TimofÛnica).

puesto.jpg

Nuevo build de PrimalScript 3.1 beta

La verdad es que estoy gratamente impresionado. Acabo de recibir un email de los chicos de soporte de Sapien, comunicando que han publicado un nuevo build de la beta de PromalScript 3.1.

Entre otras mejoras, han resuelto el problema de la instalaciÛn en sistemas no USA, es decir, que si tienes el flash en espaÒol, funcionar·n los codehints y la ayuda.

Puedes bajar el nuevo build aquÌ

Diciembre 22, 2003

CaÌda libre (cÛdigo fuente)

AquÌ est· el cÛdigo fuente de la caÌda libre.

Como podrÈis ver, no es un cÛdigo particularmente brillante, y puede (y deberÌa) optimizarse para que no fuera tan intensivo para el procesador.

Pero, aun asÌ, lo m·s importante es demostrar que todo se puede realizar sin que haya referencias explÌcitas ni a _root ni a ninguna otra lÌnea de tiempo en concreto.

De esta manera, ganamos en portabilidad y modularidad, ya que este "experimento" puede construirse sobre el _root, dentro de un movieclip, dentro de un movieclip que a su vez est· dentro de otro, cargarse dentro de otro swf, etc.

Todo ello se consigue aquÌ:

var miGravedad:Gravedad = new Gravedad(this);

Al pasar como par·metro al constructor del objeto miGravedad la referencia a la lÌnea de tiempo, resolvemos todos los problemas que nos podÌa reportar el tener una referencia a_root.

B·jate el cÛdigo fuente (si quieres, claro)

CaÌda libre de un objeto

Otro pequeÒo ejercicio m·s. Arrastra el cÌrculo, y suÈltalo para verlo caer. Tanto la aceleraciÛn de la caÌda, como la absorciÛn de energÌa en el rebote son parametrizables.

Desde luego, no es un modelo real, pero.....







Diciembre 21, 2003

ActualizaciÛn de componentes para mx2004

Bueno, esta noticia ya ha salido en varios blogs en los ˙ltimos dÌas. AquÌ os pong link al mensaje de la lista de flashcom en la que nos anuncian la nueva.
( Mensaje de Asa Whillock )

Diciembre 19, 2003

Expermiento 3.0

Sigo buscando inspiraciÛn para hacer otras cosas:







Diciembre 18, 2003

Experimento 2.0

Una vuelta de tuerca m·s:







Un pequeÒo experimento

Estoy comenzando a preparar un juego, y como trabajo previo estoy escribiendo unas cuantas funciones matem·ticas para manejar la fÌsica del mismo.

Por ahora, sÛlo he escrito dos cosas muy simples: una funciÛn que devuelve la distancia entre dos puntos, y otra que devuelve el ·ngulo del vector que une a dos puntos. El caso es que, llegado a ese punto, me he empezado a aburrir, y se me ha ocurrido jugar un poco con unos cuantos movieclips.

El resultado est· aquÌ (hace falta el flashplayer 7):







Obviamente, no est· ni por asomo optimizado, es tan sÛlo algo que he montado en media hora, pero seg˙n lo estaba haciendo me he dado cuenta de que podÌa ser es el primer swf que poste·ramos en el blog, asique...

Si quieres bajarte el fla y las clases, haz click aquÌ.

Diciembre 17, 2003

Una cita

"Un lenguaje de programaciÛn es una herramienta que tiene una profunda influencia en nuestros h·bitos de pensamiento" (Edsger W. Dijkstra).

He recordado esta cita despuÈs de una larga discusiÛn con un par de compaÒeros sobre si Neo est· hecho en flash o en java. (Por cierto, como es el bueno de la pelÌcula, es evidente que est· hecho en flash. Adem·s, si fuera java, nunca podrÌa tener esa facilidad de movimientos, y tardarÌa casi un minuto en hacer su primera apariciÛn)

Planear bien un proyecto

Parece una obviedad, pero el hecho de no haber planeado bien un proyecto, antes de comenzar a escribir cÛdigo o a generar gr·ficos, puede convertirlo en una pesadilla. Y m·s cuando se quiere realizar alguna aplicaciÛn para dispositivos port·tiles (pocketPC, telÈfonos,...).

En esos casos, m·s que nunca, hay que realizar un trabajo previo bastante intenso: definir claramente la funcionalidad, intentar separar la estructura de datos de la presentaciÛn de los mismos, conocer las limitaciones de la plataforma a utilizar, planear los tests, identificar los puntos dÈbiles de la aplicaciÛn,....

En el "Mobile and Devices Developer Center" de Macromedia han publicado un artÌculo bastante interesante sobre la materia (en inglÈs):

Planning Your Mobile Flash Projects

Noticias acerca de releases de Macromedia

Bueno, pues en los ˙ltimos dÌas han surgido varias noticias acerca de Macromedia y sus productos. AquÌ teneis unos links.

Flash player updater -> Macromedia

Updater flash video exporter y media components -> ash

Anunciado Flash Video Streaming Service -> peldi

Diciembre 15, 2003

Central en castellano

Bueno, parece que los programadores castellano parlantes vamos aumentando en n˙mero y/o en importancia. centralmx.com ha aÒadido un foro en castellano para hablar de central en particular y de las RIA's en general. Ya no hay excusa :D

que viene que viene

moock

Diciembre 14, 2003

Bugs en flashcom

Interesante artÌculo sobre los bugs de flashcom ( algunos parece ser que negados por MM pero que ocurren ). Alguno me he encontrado alguna vez. Lo podÈis leer aquÌ ( en inglÈs ), en Sti-media.com

Diciembre 13, 2003

estadÌsticas en flashcom y 2

Bueno, pues ahora vemos como hacer lo mismo del post anterior pero con client.getStats y sumando los valores de cada sesiÛn

application.onAppStart=function(){ //obtener enlace al SO my_so. Creamos el SO de forma persistente //Lo creamos en application.onAppStart , asÌ sÛlo se ejecutar· cuando se //inicie por primera vez la aplicaciÛn my_so=SharedObject.get("el_so",true); //Creamos un objeto con los datos a almacenar. Cuando se inicia por primera //vez la aplicaciÛn no ha habido transferencia por lo que iniciamos los datos a //cero mis_stats={bytes_in:0, bytes_out:0, msg_in:0, msg_out:0, msg_dropped:0, ping_rtt:0}; //A diferencia de lado cliente, en lado servidor a los SO accedemos con //getProperty y setProperty my_so.setProperty("appStats", mis_stats); }; application.onConnect=function(newClient){ application.acceptConnection(newClient); trace("nuevo usuario conectado"); }; application.onDisconnect=function(oldClient){ trace("Usuario desconectado"); stats = oldClient.getStats(); trace("Total bytes received : " + stats.bytes_in); trace("Total bytes sent : " + stats.bytes_out); trace("RTMP messages received : " + stats.msg_in); trace("RTMP messages sent: " + stats.msg_out); trace("RTMP messages dropped : " + stats.msg_dropped); trace("Ping roundtrip time: " + stats.ping_rtt); //Voy a aÒadir estos datos a los que ya tenÌa para obtener estadÌsticas totales //obtengo los datos del so var the_stats=my_so.getProperty("appStats"); //Hago la suma for (var prop in the_stats){ the_stats[prop]=the_stats[prop]+stats[prop]; } //Grabo los datos en el SO my_so.setProperty("appStats", the_stats); //Como los datos son importantes, forzamos al grabado a disco del SO //persistente my_so.flush(); //Realizamos una comprobaciÛn sacando los datos por pantalla //Obtengo los datos del SO var comprobacion=my_so.getProperty("appStats"); //los saco por pantalla trace("ComprobaciÛn de los datos"); for(var prop in comprobacion){ trace(prop+" : "+comprobacion[prop]); } };

Como ves, tanto los cÛdigos de este ejemplo como los del anterior los monitorizas para comprobar su funcionamiento desde la communication app inspector.

En el lado cliente sÛlo necesitas establecer la conexiÛn y si quieres otro botÛn para cerrarla y ver lo que ocurre, pues esto se ejecuta cuando se desconecta el cliente

nc=new NetConnection(); nc.onStatus=function(info){ trace("level: "+info.level+" code: "+info.code); } a.onRelease=function(){ nc.connect("rtmp:/stats"); }; b.onRelease=function(){ nc.close(); }

EstadÌsticas de tus aplicaciones en flashcom

øcomo obtener estadÌsticas de tus aplicaciones ? existen varias formas, una es usando flash remoting con coldfusion, otra m·s sencilla es con un Shared Object persistente. Ve·mos este caso

application.onAppStart=function(){ //obtener enlace al SO my_so. Creamos el SO de forma persistente //Lo creamos en application.onAppStart , asÌ sÛlo se ejecutar· cuando se //inicie por primera vez la aplicaciÛn my_so=SharedObject.get("el_so",true); //Creamos un objeto con los datos a almacenar. Cuando se inicia por primera //vez la aplicaciÛn no ha habido transferencia por lo que iniciamos los datos a //cero mis_stats={bytes_in:0, bytes_out:0, msg_in:0, msg_out:0, msg_dropped:0, total_connects:0, total_disconnects:0}; //A diferencia de lado cliente, en lado servidor a los SO accedemos con //getProperty y setProperty my_so.setProperty("appStats", mis_stats); }; application.onConnect=function(newClient){ application.acceptConnection(newClient); trace("nuevo usuario conectado"); }; application.onDisconnect=function(oldClient){ trace("Usuario desconectado"); stats = application.getStats(); trace("Total bytes received: " + stats.bytes_in); trace("Total bytes sent : " + stats.bytes_out); trace("RTMP messages received : " + stats.msg_in); trace("RTMP messages sent : " + stats.msg_out); trace("RTMP messages dropped : " + stats.msg_dropped); trace("Total clients connected : " + stats.total_connects); trace("Total clients disconnected : " + stats.total_disconnects); //Paso los datos al so my_so.setProperty("appStats", stats); //Como los datos son importantes, forzamos al grabado a disco del SO //persistente my_so.flush(); //Le pido que me muestre los datos por pantalla ( comprobaciÛn de que todo //saliÛ bien) //obtengo los datos del so var the_stats=my_so.getProperty("appStats"); //los saco por pantalla trace("ComprobaciÛn de los datos"); for(var prop in the_stats){ trace(prop+" : "+the_stats[prop]); } Esto tiene un problema, y es que application.getStats siempe devuelve el total de las estadÌsticas desde que se inciÛ el sitio y si por alg˙n casual debemos recargar el sitio ( reload ) este histÛrico se vuelve a cero. Para solucionar esto, usamos client.getStats, pero eso ser· en otro mensaje que tengo que probarlo :D

Audio Video Streamer 2.0

Bueno, pues aquÌ os podeis descargar ya el audiovideostreamer completo. Sus principales caracterÌsticas son:

La plantilla onStatusTemplate contempla todos los casos para NetConnection y para NetStream ( incluso aquellos que en este ejemplo no se van a dar nunca, como puede ser NetStream.publish pero asÌ ya la teneis )

el stream se empieza a reproducir con sÛlo pulsar en un tÌtulo de la lista

Cuando se empieza a reproducir un stream se muestran en pantalla unos campos de texto que nos indican el tÌtulo del stream, la duraciÛn del mismo y el tiempo que llevamos de stream.

Al finalizar de reproducirse el stream estos textos desaparecen. Adem·s si se trata de un stream de video, al terminar de reproducirse se pone a _visible=false con lo que nos evitamos que se quede en pantalla el ˙ltimo fotograma est·tico que hace muy feo.

Como se ve, la longitud del stream se obtiene desde el lado servidor con stream.length ( diferente forma si es flv o mp3 ), desde lado cliente llamamos a la funciÛn de servidor que lo obtiene y con onResult obtenemos la informaciÛn ( en segundos, hay que darla formato )

Muy importante. Con los tres videos que he elegido yo para hacer las pruebas, cada uno tenÌa un ancho y un alto diferente ( resoluciÛn del vÌdeo 160x120,240x180....)Si colocamos el objeto video en pantalla sin m·s, los vÌdeos se mostrar·n al mismo tamaÒo que el objeto video no importa cual sea su resoluciÛn. Esto produce escalamientos que adem·s no tienen proporcionalidad. El resultado es que se pierde gran calidad y que el vÌdeo hace efectos raros. Esto se ha solucionado con la funciÛn theSize, que le da al objeto video el tamaÒo de la resoluciÛn del vÌdeo. ( Esta resoluciÛn sÛlo se puede obtener desde lado cliente y una vez que ha empezado a reproducirse el video, por eso la obtenemos dentro del primer segundo de reproducciÛn y llamamos dentro de ese espacio a theSize que lo coloca todo bien )

Ojo, el control de vol˙men funciona en una pelÌcula exportada ( archivo swf ) si lo ejecutais desde el IDE de flash ( control+enter )no sube o baja vol˙men, una vez exportado sÌ. Esta forma de manejar el vol˙men de un stream la he visto en la web de la universidad Ryerson ( Canad· ) . AhÌ podeis encontrar m·s cosas sobre flashcom

Fallos, bugs.
-Hay dos sitios donde he hecho "hardcoded" por las prisas, en la prÛxima versiÛn ser· solucionado
-El que al finalizar el stream de video se borre la pantalla, viene determinado por recibir el evento buffer.empty, este evento no siempre se recibe ( de hecho en la lista de flashcom de chattyfig hubo un hilo sobre esto. hay personas que no lo reciben de ninguna manera ) por lo que a veces se quedar· el ˙ltimo fotograma visible.
-En la prÛxima versiÛn, los datos ( tÌtulos , nombres de los streams ,) se cargar·n desde un xml que vendr· de una base de datos.

foto_reproductor.jpg

En la foto se est· reproduciendo un stream de audio. Los campos de texto nos informan de cual es, tiempo, el status del stream y de la conexiÛn.

Bueno, lo puedes descargar aquÌ

Creo que m·s o menos lo he contado todo, si se me ha pasado algo y me acuerdo luego , pues pongo un comentario o ya me espero a la versiÛn definitiva. øCuando colgarÈ la versiÛn definitiva con todo funcionando perfecto? No se, cuando encuentre alguna tarde libre para dedicarme a ello. :D

Diciembre 11, 2003

audio video streamer en flashcom

Bueno, esta tarde me puse a hacer un audiovideostreamer en flashcom. Faltan de pulir cosas, como obtener la longitud del stream y alguna cosilla, pero bueno, ahÌ van unos cÛdigos

//Creamos la conexiÛn al servidor. nc=new NetConnection(); /* FunciÛn: onStatusTemplate Desc: FunciÛn onStatus para netConnection y netStream params: info -> objeto que trae la informaciÛn desde el servidor Nota: Esta funciÛn (onStatusTemplate) est· basada en la plantilla realizada por Kevin Towes para su libro "Macromedia Flash Communication Server MX" ( pangaea newmedia inc ) p·gina 449, apÈndice E */ function onStatusTemplate(info){ info_array=info.code.split("."); trace("∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑Comienzo de mensaje"); trace(new Date()); trace("Mensaje recibido para el objeto: "+info_array[0]); trace("LEVEL: "+info.level); trace("CODE: "+info.code); /*AquÌ el resto de la plantilla, no la pongo entera que es muy larga pues contempla todos los casos de NetConnection y NetStream */ } //AsignaciÛn de la plantilla. NetConnection.prototype.onStatus=onStatusTemplate; NetStream.prototype.onStatus=onStatusTemplate; //ConexiÛn al servidor ( por debajo de onStatus para que no escape ninguno ) nc.connect("rtmp:/videolistado/videomusic"); /* FunciÛn: audioVideoStreamer Desc: Crea objetos de la clase audioVideoStreamer, permitiendo la reproducciÛn de audio y video. La asignamos como _global para ser accedida desde cualquier nivel/anidamiento f·cilmente Params: streamName -> El nombre del stream videoObjectName -> El nombre del objeto video netConnectionName -> El nombre de la conexiÛn que utilizamos soundmcName -> El nombre de un mc que usaremos para controlar el volumen bufferTimeC -> El buffer que establecemos */ _global.audioVideoStreamer=function(streamName, videoObjectName, netConnectionName, soundmcName, bufferTimeC){ //AsignaciÛn this.my_ns=streamName; this.my_video=videoObjectName; this.my_nc=netConnectionName; this.my_sound_mc=soundmcName; this.my_buffer=bufferTimeC; //CreaciÛn this.my_ns=new NetStream(this.my_nc); this.my_video.attachVideo(this.my_ns); this.my_ns.setBufferTime(this.my_buffer); this.my_sound_mc.attachAudio(this.my_ns); this.soundControl=new Sound(this.my_sound_mc); this.soundControl.setVolume(50); }//audioVideostreamer /* FunciÛn: doPlay Desc: Comienza a reproducir el stream indicado. Se desdobla en dos partes ya que la ejecuciÛn es distinta si se trata de un stream de audio ( mp3 )de uno de video ( flv ) Params: selectedStream -> El stream seleccionado para su reproduciÛn selectedType -> Tiene dos posibles valores, "flv" o "mp3", nos indica el tipo de archivo que queremos reproducir */ audioVideoStreamer.prototype.doPlay=function(selectedStream,selectedType){ if(selectedType=="flv"){ this.my_ns.play(selectedStream); }//flv else if(selectedType=="mp3"){ this.my_ns.play("mp3:"+selectedStream); }//mp3 };//doPlay /* FunciÛn: doRewing Desc: Rebobina el stream una cantidad indicada de segundos, en este caso est· preparado para que sea 10 segundos, pero se puede cambiar para recibir esta cantidad como par·metro Params: no tiene */ audioVideoStreamer.prototype.doRewing=function(){ this.my_ns.seek(this.my_ns.time-10); };//doRewing /* FunciÛn: doForward Desc: Avanza el stream una cantidad indicada de segundos, en este caso est· preparado para que sea 10 segundos, pero se puede cambiar para recibir esta cantidad como par·metro Params: no tiene */ audioVideoStreamer.prototype.doForward=function(){ this.my_ns.seek(this.my_ns.time+10); };//doForward /* FunciÛn: doPause Desc: Pausa la reproducciÛn del stream. Para que el stream vuelva a reproducirse, deber· ejecutarse esta funciÛn de nuevo Params: no tiene */ audioVideoStreamer.prototype.doPause=function(){ this.my_ns.pause(); };//doPause /* FunciÛn: doDisconnect Desc: Termina la reproducciÛn del stream y lo libera. No cierra la conexiÛn Params: no tiene */ audioVideoStreamer.prototype.doDisconnect=function(){ this.my_ns.play(false); this.my_ns.clear(); };//doDisconnect //////////////////////////USO this.createEmptyMovieclip("mi_mc", 1); reproductor=new audioVideoStreamer(el_stream, my_video, nc, mi_mc, 2); video1={label:"Macromedia", data:"video macromedia", typeF:"flv"}; musica1={label:"Bob & Marcia", data:"young gifted and black", typeF:"mp3"}; mis_Streams=[video1, musica1]; my_lb.setDataProvider(mis_Streams); my_lb.setChangeHandler("elegir", this); elegir=function(c){ selectedStream=c.getSelectedItem().data; selectedType=c.getSelectedItem().typeF; _root.reproductor.doPlay(selectedStream, selectedType); }; stop_btn.onRelease=function(){ reproductor.doDisconnect(); }; pause_btn.onRelease=function(){ reproductor.doPause(); }; rewing_btn.onRelease=function(){ reproductor.doRewing(); }; forward_btn.onRelease=function(){ reproductor.doForward(); };

Cuando estÈ terminado, lo pongo para descargar ( los archivos fla o as y el main.asc). Pero de momento para los no iniciados en flashcom les puede servir como punto de partida para ver quÈ f·cil es hacer un reproductor de audio y video.

Ah claro, en pantalla tengo un objeto video de nombre: my_video, un componente listbox de nombre: my_lb y una serie de botones: stop_btn, pause_btn, rewing_btn, forward_btn

Continuar·...

Diciembre 10, 2003

ActionScript 2.0 - clase 2.1 (ahora sÌ)

Ahora sÌ, vamos a escribir cÛdigo!!.

Vamos a recuperar la clase que escribimos el otro dÌa:

class DesignBlog{ private var texto:String; function DesignBlog(arg){ texto = arg; }; public function resultado(Void):String{ return texto.toUpperCase(); }; }

Veamos con un poco m·s de detalle lo que significa cada cosa

La clase se llama DesignBlog, y dentro de ella hay una funciÛn llamada tambiÈn DesignBlog. øQuÈ quiere decir eso?. Pues esa funciÛn es lo que se llama el constructor de la clase. Esa funciÛn se ejecuta cuando se crea alguna instancia de la clase, por lo que es el lugar apropiado para inicializar variables, recoger par·metros, etc.

Para comprobar cÛmo funciona, vamos a cambiar un poco la clase:

class DesignBlog{ private var texto:String; function DesignBlog(arg){ trace("constructor de la clase " + arg); texto = arg; }; public function resultado(Void):String{ return texto.toUpperCase(); }; }

øQuÈ va a ocurrir cuando creemos nuevas instancias de la clase?. PruÈbalo!

var instancia1:DesignBlog = new DesignBlog("Clase uno"); var instancia2:DesignBlog = new DesignBlog("Clase dos"); var instancia3:DesignBlog = new DesignBlog("Clase tres");

No hay que olvidar un concepto muy importante. Las clases sÛlo se pueden definir en archivos .as externos al fla, y cuyo nombre de archivo sea exactamente igual al nombre de la clase

Pues por hoy, suficiente. La carrera del aprendizaje es de fondo, no de velocidad..... ;)

ActionScript 2.0 - clase 2.0

Seguimos intentando entender un poco mejor en quÈ consiste el ActionScript 2.0.

En principio, hay que dejar claro que el bytecode generado por el compilador de flash es el mismo, ya sea el cÛdigo fuente AS2.0 o el ya "cl·sico" AS. Dicho de otra manera, al flash player le da igual que escribamos nuestro cÛdigo fuente en AS2 o AS1. O dicho de otra manera distinta, realmente el AS2.0 no es m·s que una envoltura al ActionScript.

øQuÈ ventajas, entonces, tiene este nueva sintaxis?.

Pues en principio se gana en seguridad y claridad en el cÛdigo. Al forzar los tipos de datos, conseguimos obtener errores en tiempo de compilaciÛn, que antes no tenÌamos, y podemos hacer que nuestro cÛdigo sea m·s estructurado, y por lo tanto m·s facil de leer, de portar, y de mantener.

Pero, en el cambio, se pierde gran parte de la flexibilidad que siempre ha tenido flash. No es que ya no se pueda vivir siempre forzando el lÌmite, sino que ahora es m·s dificil.

Dicho de otra forma, es como si, de repente, flash se hubiera hecho adulto. Se ha vuelto serio, predecible, perdiendo parte de su "locura" juvenil.

øO no?. En nuestra mano est· que flash no se convierta en un nuevo java.

Y al final no hemos escrito ni una lÌnea de cÛdigo. En fin....

Processing

Processing es un proyecto orientado a explorar las posibilidades de los nuevos medios de comunicaciÛn. Se basa en un software de cÛdigo abierto, especialmente orientado a la experimentaciÛn gr·fica.

M·s que recomendable

M·s sobre PrimalScript 3.1

Bueno, pues en principio las cosas no ha funcionado como deberÌan.

Parece que esta aplicaciÛn no se ha previsto para funcionar en sistemas distintos al inglÈs. De hecho, en mi trabajo, con un Windows 2000 SP5 en espaÒol, no he conseguido que funcione correctamente, ya que la carpeta donde flash instala las clases y la ayuda es c:\Documents and Settings\usuario\ConfiguraciÛn local\........

Seg˙n parece, el programa busca las clases de macromedia, y las del usuario en c:\Documents and settings\usuario\Local settings\........

He mandado un par de correos a Sapien, exponiendo el problema.

Ya os contarÈ cÛmo sigue el asunto.

PequeÒo juego en Flashcom ( v1.0)

Si bien es cierto, que el uso m·s goloso de Flashcomm es la transmisiÛn de audio y video, en mi opiniÛn la gran potencia de este servidor est· en la transmisiÛn de datos sincronizada. Un pequeÒo y muy simple ejemplo de esta sincronizaciÛn es este pequeÒo juego que desarrollÈ el otro dÌa.

Se trata de un pequeÒo tres en raya. Evidentemente es un ejemplo muy simple y al que se le puede aÒadir m·s funcionalidades ( por ejemplo hacer el shared object persistente lo que permite grabar la partida a la mitad para seguir otro dÌa ) pero bueno, como ejemplo sirve:

//Variables iniciales∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑ //Utilizo 6 mc, que son circulos con dos frames, en un frame el circulo de //color rojo y en el otro frame el circulo de color negro circulo1={mc:circulo1_mc, x:40, y:235, color:"rojo" };//el primer circulo circulo2={mc:circulo2_mc, x:20, y:194, color:"rojo" };//segundo circulo circulo3={mc:circulo3_mc, x:40, y:152, color:"rojo" }; circulo4={mc:circulo4_mc, x:20, y:110, color:"negro"}; circulo5={mc:circulo5_mc, x:40, y:69, color: "negro" }; circulo6={mc:circulo6_mc, x:20, y:27, color: "negro" }; //array con el que trabajaremos var circulos=[circulo1,circulo2,circulo3,circulo4,circulo5,circulo6]; //Zona flashcom∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑ function initSO(nc){ //Creamos un SO no persistente my_so=SharedObject.getRemote("tresraya_so",nc.uri,false); my_so.onSync=function(lista){ for ( var prop in my_so.data){ debug("propiedad:valor - > "+prop+" : "+my_so.data[prop]); } var indexe=my_so.data.props[0]; var xPos=my_so.data.props[1]; var yPos=my_so.data.props[2]; circulos[indexe].mc._x=xPos; circulos[indexe].mc._y=yPos; } my_so.connect(nc); } //ConexiÛn al servidor Flash Communication Server nc=new NetConnection(); nc.onStatus=function(info){ if(info=="NetConnection.Connect.Success");{ debug("estoy conectado"); initSO(this); } } nc.connect("rtmp:/tresenraya"); //funciones, flujo del programa∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑∑ //para los trace function debug(texto){ trace(texto); } /* *Metodo: estadoIncial *Desc: Colocar las 6 fichas en la posiciÛn inicial, en una * hilera vertical en la parte izquierda de la pantalla. Asigna colores *params: No tiene par·metros */ estadoInicial=function(){ for (var i=0;i

Como se ve, un cÛdigo corto y simple pero que sirve para comprender la potencia de los objetos compartidos. Con este cÛdigo puedes jugar en red al tres en raya con los amigos. M·s adelante, colocarÈ un ejemplo basado en este pero m·s avanzado.

PrimalScript 3.1 Public Beta

Hoy ve la luz la beta p˙blica de PrimalScript 3.1, el primer IDE (que yo conozca) especÌficamente orientado al desarrollo con ActionScript 2.0.

Yo he estado usando PrimalCode 3.0 en mis proyectos con AS2, y la verdad es que he quedado bastante contento: navegador de clases, pistas de cÛdigo, auto-completado, y m·s funcionalidades que facilitan bastante la vida.

Yo ya me he bajado mi copia de la beta, y voy a empezar a utilizarlo ahora mismo. Ya os contarÈ.

M·s info: aquÌ

Descarga: aquÌ

Diciembre 09, 2003

LoadVars que carga un XML

Antes de continuar con la serie de "tutoriales" sobre ActionScript 2.0, y aunque est· claro que no deberÌa publicarlo ahora, sin todavÌa haber visto un poco m·s en profundidad los fundamentos del lenguaje, querÌa postear esta clase, que he escrito la semana pasada para un proyecto en el que estoy trabajando.

El escenario es el siguiente:

Necesito enviar el "login" y "password" que el usuario introduce a un script en php, que una vez ha identificado al usuario, devuelve un XML con el contenido de los men˙s de la aplicaciÛn para el perfiel de ese usuario.

øCÛmo hacerlo?. La primera parte est· clara. Utilizando la clase LoadVars, puedo enviar los datos necesarios a servidor, gracias al mÈtodo sendAndLoad. Dicho mÈtodo recoge la respuesta del servidor (que suele ser del tipo "variable1=valor1&variable2=valor2....." de manera que en el objeto destino de esa peticiÛn se generan las propiedades recibidas con los valores recibidos.

Pero øy si necesito recoger de servidor un XML?. Pues es muy f·cil. Asignando lo que se recibe de servidor a un objeto XML. øQuieres saber cÛmo?

Muy sencillo:

import net.designnation.menus.*; /** * @class es.designnation.menus.LVXML * @author Cesar Tardaguila * @version 1.0.0.0 * @description Convierte el resultado de un LoadVars en un XMLMenusAll */ class es.designnation.menus.LVXML extends LoadVars{ private var datos:Object; private var url:String; public var retorno; public var ref; private var method:String; private var devolucion; private var concat:Boolean; function LVXML(datosp:Object, urlp:String, method, retornop){ datos = new Object(); datos = datosp; url = urlp; retorno = retornop; ref = referencia; method = method; init(); }; private function init(){ for (var k in datos){ this[k] = datos[k]; } }; public function enviarRecibir(){ sendAndLoad(url, retorno, method); }; }

Bien, pues esta clase recibe como par·metros (por orden):

1.- Un objeto con los datos que se van a enviar a servidor.

2.- La url del script a la que enviar, y que contestar· con un xml.

3.- El mÈtodo ("GET", "POST").

4.- La referencia al objeto xml al que se va a asignar el resultado.

Por tanto, en primer lugar se crean las propiedades que se reciben en el objeto par·metro, y se les asigna el valor correspondiente, se hace la peticiÛn a servidor, y una vez recibida respuesta, se asigna Èsta al XML, de modo que se lanzar· el mÈtodo onLoad de dicho XML autom·ticamente.

Veamos un ejemplo:

var parametros = new Object(); parametros["login"] = loginp; parametros["pass"] = passp; var miXML:XML = new XML(); var miLoadVars:LVXML = new LVXML(parametros, "http://www.design-nation.net/scripts/testLV.php","POST", miXML); miLoadVars.enviarRecibir();

Bien, pues al cargarse el XML, se lanzar· el mÈtodo onLoad de miXML.