Utilización de cuepoints en FLV (video en flash)

Para empezar a leer este tutorial, debemos entender el uso del componente MediaPlayBack o la forma de reproducir un FLV con actionScript, para eso le damos una leida al tutorial de Video en Flash

Ahora, empezaremos con una ligera explicación de los cuepoints:

Un cuepoint es solo un punto insertado en nuestro video FLV, para que segun el cuepoint podamos interactuar con la web, una animacion, un texto o cualquier elemento, pues una vez identificado el cuepoint se difunde un evento.

En este ejemplo, veremos la traducción de un video en dos idiomas (no habria problemas de implementar mas idiomas), donde almacenaremos la traducción en un arreglo (Array), y que seria optimo tenermo en un xml por ejemplo. Para eso usaremos un Componente MediaPlayBack y un par de RadioButton. Ahora veamos el codigo:

//Le digo a mi componente q se ejecute el video al cargarlo
my_mp.autoPlay = false;

//agrego a un arreglo, los segundos
//donde deseo colocar cuepoint
var segundos:Array = new Array("vacio", 1, 4, 6, 8, 9.3, 10.5, 12, 14, 16, 18.3, 19.5, 20.4, 23);

//inserto a mi metodo addcuePoint los segundos donde quiero mis eventos
for (var i:Number = 0; i<segundos.length; i++) {
    my_mp.addCuePoint(i, segundos[i]);
}

// creo un arreglo donde tengo separado mi traduccion deacuerdo a los cuePoint
var idioma1:Array = new Array();
idioma1.push("---traduccion---");
idioma1.push("bella");
idioma1.push("y en forma");
idioma1.push("por partida triple");
idioma1.push("la naturaleza es sabia");
idioma1.push("y capsulas triple");
idioma1.push("bionaturista");
idioma1.push("concentra \nlo mejor de ella");
idioma1.push("para vivir saludable \ny en forma");
idioma1.push("y verse siempre bien");
idioma1.push("muy bien");
idioma1.push("me mantengo en forma");
idioma1.push("con capsulas\ntriple bionaturistas");
idioma1.push("... me canse!!!");

// este es el otro idioma
var idioma2:Array = new Array();
idioma2.push("---traduccion---");
idioma2.push("beautiful");
idioma2.push("and in form");
idioma2.push("by departure triple");
idioma2.push("the nature is wise");
idioma2.push("and triple");
idioma2.push("bionaturista cap");
idioma2.push("concentrates the best of her ");
idioma2.push("to live healthy and in form");
idioma2.push("and to be seen always well");
idioma2.push("very well");
idioma2.push("I maintain me in form with");
idioma2.push("triple bionaturistas caps");
idioma2.push("...tire me!!!");

//creo mi function q sera llamado por mi listener donde extraigo el cuePoint
//y se lo asigno a mi arreglo para extraer la traduccion
function doCuePoint(eventObj:Object):Void {
     var ubi = eventObj.cuePointName;
     campo.text = esp[ubi];
     campo.setTextFormat(myformat);
}

//asigno a mi componente mi function
my_mp.addEventListener("cuePoint", doCuePoint);

//creo mi campo de texto donde mostrare la traduccion
this.createTextField("campo", 0, 0, 300, 300, 100);
this.campo.multiline = true;
this.campo.html = true;
var myformat:TextFormat = new TextFormat();
myformat.size = 20;
myformat.font = "verdana";
myformat.align = "center";
campo.setTextFormat(myformat);

//asigno a mi variable esp el idioma q usare por defecto
esp = idioma1;
//activo el idioma q estara por defecto
rb_esp.selected = true;

//aqui cambio de idioma segun la seleccion del radionButton
var mi_listener:Object = new Object();
mi_listener.click = function() {
    if (rb_esp.selected == true) {
       esp = idioma1;
    }
    if (rb_ing.selected == true) {
        esp = idioma2;
    }
};
radioGroup.addEventListener("click", mi_listener);

Espero les sirva, aqui les dejo el ejemplo y el fla

saludos

elder h. vásquez rettis
Diseñador y desarrollador web

www.eldervaz.com
www.ini4.com
contactos@eldervaz.com

 

Otros tutoriales:

Guía de Video en Flash MX 2004
Controlando el video en Flash
Introductorio a lo nuevo en VIDEO con FLASH 8
PRECARGA para FLV (video en flash)
Utilización de cuepoints en FLV (video en flash)
--
Tutorial de Login con SharedObject
Tutorial de PRECARGAS multiples