Comunidad de diseño web y desarrollo en internet online

Fade in Fadeout en Video

Citar            
MensajeEscrito el 27 Sep 2011 07:52 pm
Jorge, me ayudas hacer la funcion de fade in y fade out??

Me habias comentado de hacer una funcion que reciba 2 argumentos (fadein y fadeout) de que tipo tendrian que ser??

El codigo original es:

Código ActionScript :

   //------------ desaparecer ------------------------
   var alpha_interval:Number = setInterval(fadeImage, 100, miVideo);
   function fadeImage(target_mc:MovieClip):Void {
      target_mc._alpha -= 5;
      if (target_mc._alpha <= 0) {
         target_mc._visible = false;
         clearInterval(alpha_interval);
      }
   }
   
   //----------- aparecer --------------
   var alpha_interval:Number = setInterval(fadeIn, 100, miVideo2);
   function fadeIn(target_mc:MovieClip):Void {
      var videoN1:Number = 0;
      target_mc._alpha += 8;
      if (target_mc._alpha >= 100) {
         target_mc._visible = true;
         clearInterval(alpha_interval);
      }
   }


La idea es tener un boton btnN1 que aparezca video2 y desaparezca video1. Luego el btnN2 apareceria y volveria al video1 y desapareca video2.

El tema de los botones lo pondria en la misma funcion?? o en el onrelease del boton??

Graciasss!! Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 01:53 pm
Los argumentos son los dos MovieClips contenedores del objeto video, haz un intento de código, esto es lo que tenías de antes

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 02:17 pm
Hola Jorge,

Ya empece hacer algo, consulta lo que tiene que ser dinamico por asi decir serian los objetos attachVideo: miVideo, miVideo2, etc.

Código ActionScript :

var alpha_interval:Number = setInterval(fadeOut, 100, miVideo);
var alpha_interval:Number = setInterval(fadeIn, 100, miVideo2);

function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip):Void {
   
   function fadeOut(fadeOut:MovieClip):Void {
      fadeOut._alpha -= 5;
      if (fadeOut._alpha <= 0) {
         fadeOut._visible = false;
         clearInterval(alpha_interval);
      }
   }
   
   function fadeIn(fadeIn:MovieClip):Void {
      fadeIn._alpha += 8;
      if (fadeIn._alpha >= 100) {
         fadeIn._visible = true;
         clearInterval(alpha_interval);
      }
   }

}


Lo que todavia no veo es como poderlo re utilizar.. cuando doy click en el boton, entiendo que desde el boton le tengo que pasar el objeto attachVideo no??

Saludos!!!

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 02:26 pm
Nop, tenes dos funciones metidas dentro de otra. Tenés que hacer una sola función, con un solo loop que baje el alpha a uno y se lo suba al otro, usando onEnterFrame, porque los setInterval tienen a descontrolarse

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 02:42 pm
Oka Jorge!

Seria algo parecido a esto no?

Código ActionScript :

function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip):Void {
   
   fadeOut.onEnterFrame = function() {
      fadeOut._alpha -= 5;
      if (fadeOut._alpha <= 0) {
         fadeOut._visible = false;
         delete fadeOut.onEnterFrame;
      }
   };
      
   fadeIn.onEnterFrame = function() {
      fadeIn._alpha += 8;
      if (fadeIn._alpha >= 100) {
         fadeIn._visible = true;
         delete fadeIn.onEnterFrame;
      }
   };

}


Ahora bien, como le paso el objeto attachVideo desde el boton para que aparesca un video y desaparesca otro?

Código ActionScript :

var conexion:NetConnection = new NetConnection();  
conexion.connect(null);
var stream:NetStream = new NetStream(conexion); 
miVideo.attachVideo(stream);
stream.play("video1.flv"); 

var conexion2:NetConnection = new NetConnection();  
conexion2.connect(null);  
var stream2:NetStream = new NetStream(conexion2); 
miVideo2.attachVideo(stream2);
stream2.play("video2.flv"); 
miVideo2.pause();


Código ActionScript :

btnN1.onRelease ...
btnN2.onRelease ...
btnN3.onRelease ...


Saludoss!

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 02:54 pm
myVideo y myVideo2 son objetos video, no tienen onEnterFrame, debes meter ambos en distintos MovieClips, pasar esos MovieClips como referencia. El alpha se lo puedes hacer al MovieClip, ya que afecta a todo lo que contiene

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 02:58 pm
Pero puedo crear un mc que ten adentro u objeto video no? Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 03:00 pm
Claro, abres el timeline del MC y le arrastras el objeto video

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 03:04 pm
Oka y como cargo el flv?? Por que el:

var conexion:NetConnection = new NetConnection();
conexion.connect(null);
var stream:NetStream = new NetStream(conexion);
miVideo.attachVideo(stream);
stream.play("video1.flv");

No lo puedo usar verdad?

Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 03:14 pm
Cambia la ruta

miMovieClip.miVideo.attachVideo(stream);

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 03:32 pm
Claro!

Entonces me quedaria algo asi:

Código ActionScript :

var conexion:NetConnection = new NetConnection();   
conexion.connect(null); 
var stream:NetStream = new NetStream(conexion);  
miMovieClip.miVideo.attachVideo(stream); 
stream.play("video1.flv");  
 
var conexion2:NetConnection = new NetConnection();   
conexion2.connect(null);   
var stream2:NetStream = new NetStream(conexion2);  
miMovieClip2.miVideo2.attachVideo(stream2); 
stream2.play("video2.flv");  
miMovieClip2.miVideo2.pause(); 
 
 
function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip):Void { 
    
   fadeOut.onEnterFrame = function() { 
      fadeOut._alpha -= 5; 
      if (fadeOut._alpha <= 0) { 
         fadeOut._visible = false; 
         delete fadeOut.onEnterFrame; 
      } 
   }; 
       
   fadeIn.onEnterFrame = function() { 
      fadeIn._alpha += 8; 
      if (fadeIn._alpha >= 100) { 
         fadeIn._visible = true; 
         delete fadeIn.onEnterFrame; 
      } 
   }; 
 
}

Si esta bien esto, pasariamos al click del boton, como hago para que aparesca un video y desaparesca otro? Endonde le paso eso parametros?

Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 03:36 pm
???

Código ActionScript :

miBoton.onPress = function(){
   fadeVideo(miMovieClip, miMovieClip2)
}


Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 03:57 pm
Oka Jorge, te muestro como quedo:

Código ActionScript :

stop();

this.miMovieClip.miVideo._x =0;
this.miMovieClip.miVideo._y =0;
this.miMovieClip2.miVideo2._x =0;
this.miMovieClip2.miVideo2._y =0;

btnN2._visible = false;

// ------------------------ miVideo -------------------------------

var conexion:NetConnection = new NetConnection();  
conexion.connect(null);
var stream:NetStream = new NetStream(conexion); 
miMovieClip.miVideo.attachVideo(stream);
stream.play("video1.flv"); 

// ------------------------ miVideo2 -------------------------------

var conexion2:NetConnection = new NetConnection();  
conexion2.connect(null);  
var stream2:NetStream = new NetStream(conexion2); 
miMovieClip2.miVideo2.attachVideo(stream2);
stream2.play("video2.flv"); 
miMovieClip2.miVideo2.pause();

// ------------------------ fullbrowser-------------------------------

this.onResize = function()
   {
      this.btnN1._x = (Stage.width  / 2) - (this.btnN1._width  / 2);
      this.btnN1._y = (Stage.height / 2) - (this.btnN1._height / 2);
      this.btnN1.text = Stage.width + "x" + Stage.height;
      
      this.btnN2._x = (Stage.width  / 2) - (this.btnN2._width  / 2);
      this.btnN2._y = (Stage.height / 2) - (this.btnN2._height / 2);
      this.btnN2.text = Stage.width + "x" + Stage.height;
   
      miMovieClip.miVideo._width = Stage.width;  
      miMovieClip.miVideo._height =Stage.height;
      miMovieClip2.miVideo2._width = Stage.width;  
      miMovieClip2.miVideo2._height =Stage.height;
   };
   
Stage.scaleMode = "noScale";
Stage.align = "TL";
Stage.showMenu = false;
Stage.addListener(this);
   
this.onResize();

// ------------------------ function fadeVideo -------------------------------

function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip):Void {
   
   fadeOut.onEnterFrame = function() {
      fadeOut._alpha -= 5;
      if (fadeOut._alpha <= 0) {
         fadeOut._visible = false;
         delete fadeOut.onEnterFrame;
      }
   };
      
   fadeIn.onEnterFrame = function() {
      fadeIn._alpha += 8;
      if (fadeIn._alpha >= 100) {
         fadeIn._visible = true;
         delete fadeIn.onEnterFrame;
      }
   };

}

btnN1.onPress = function(){ 
   fadeVideo(miMovieClip, miMovieClip2);
   btnN1._visible = false;
   btnN2._visible = true;
}

btnN2.onPress = function(){ 
   fadeVideo(miMovieClip2, miMovieClip);
   btnN2._visible = false;
   btnN1._visible = true;
}


Me reproduce los dos videos a la vez, video1 a la izquierda y video2 a la derecha. No estara funcionando:

Código ActionScript :

miMovieClip2.miVideo2.pause();


Luego el boton btnN1 no esta funcionando bien, hice un trace:

Código ActionScript :

btnN1.onRelease = function(){ 
   fadeVideo(miMovieClip, miMovieClip2);
   trace(fadeVideo(miMovieClip, miMovieClip2));


Salida: undefined

Porque no estaria funcionando??

Saludos!

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 06:06 pm
Ok, vamos a otro hilo interminable. La función sería así

Código ActionScript :

var speed =  5;
function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip, stream:NetStream):Void { 
   this.onEnterFrame = function() { 
     fadeOut._alpha -= speed;
     fadeIn._alpha  += speed;
      if (fadeIn._alpha >= 100) { 
         fadeOut._visible = false;
         stream.stop(); 
         delete this.onEnterFrame; 
      } 
   }; 
} 


El boton switch sería

Código ActionScript :

miBoton.onPress = function(){
  if(miMovieClip.visible) {
            fadeVideo(miMovieClip, miMovieClip2, stream); 
            stream2.play("algun.flv");
  } else {
     fadeVideo(miMovieClip2, miMovieClip1, stream2); 
      stream.play("otro.flv")
}


Esa es la a idea. Parto de que cada MC tiene attachado el NetStream al objeto video que contiene

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 07:01 pm
Jorge, consulta, se tendria que modificar algo de aca??

Código ActionScript :

// ------------------------ miVideo -------------------------------

var conexion:NetConnection = new NetConnection();  
conexion.connect(null);
var stream:NetStream = new NetStream(conexion); 
miMovieClip.miVideo.attachVideo(stream);
stream.play("video1.flv"); 

// ------------------------ miVideo2 -------------------------------

var conexion2:NetConnection = new NetConnection();  
conexion2.connect(null);  
var stream2:NetStream = new NetStream(conexion2); 
miMovieClip2.miVideo2.attachVideo(stream2);
stream2.play("video2.flv"); 
miMovieClip2.miVideo2.pause();


Y en la funcion no faltaria el stream2??

Código ActionScript :

function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip, stream:NetStream, stream2:NetStream):Void {


Codigo completo:

Código ActionScript :

// ------------------------ miVideo -------------------------------

var conexion:NetConnection = new NetConnection();  
conexion.connect(null);
var stream:NetStream = new NetStream(conexion); 
miMovieClip.miVideo.attachVideo(stream);
stream.play("video1.flv"); 

// ------------------------ miVideo2 -------------------------------

var conexion2:NetConnection = new NetConnection();  
conexion2.connect(null);  
var stream2:NetStream = new NetStream(conexion2); 
miMovieClip2.miVideo2.attachVideo(stream2);
stream2.play("video2.flv"); 
miMovieClip2.miVideo2.pause();

// ------------------------ BOTON -------------------------------

btnN1.onPress = function(){ 
  if(miMovieClip.visible) { 
            fadeVideo(miMovieClip, miMovieClip2, stream);  
            stream2.play("video2.flv"); 
  } else { 
     fadeVideo(miMovieClip2, miMovieClip, stream2);  
      stream.play("video.flv") 
   }
}

// ------------------------ FUNCION -------------------------------

var speed =  5; 
function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip, stream:NetStream):Void {  
   this.onEnterFrame = function() {  
     fadeOut._alpha -= speed; 
     fadeIn._alpha  += speed; 
      if (fadeIn._alpha >= 100) {  
         fadeOut._visible = false; 
         stream.stop();  
         delete this.onEnterFrame;  
      }  
   };  
} 


El resultado es la reproduccion simultanea de los dos video, luego a tocar el btnN1 se ve solamente video1, pero sin el fade out ni el fade in.

Hay algo que esto haciendo mal??

De nuevo gracias Jorge!

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 07:08 pm
Bien, ya viste el uso del trace en el otro hilo, usalo para sacar mas información ahora, ver que se ejecuta, que alpha tiene cada elemento, etc

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 28 Sep 2011 07:30 pm
Oka lo voy a tracear!!

Pero todavia lo que no entiendo es poque me reproduce los 2 videos, si le estoy asignando pausa..

.....
stream2.play("video2.flv");
miMovieClip2.miVideo2.pause();

Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 28 Sep 2011 07:41 pm

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 29 Sep 2011 03:45 pm
Jorge, como estuve viendo el onStatus, entiendo que seria algo asi no?

Código ActionScript :

miMovieClip2.miVideo2.attachVideo(stream2);
stream2.play("video1.flv");
stream2.onStatus = function(algo:Object) {
   
};


Como pregunto cuando obtiene NetStream.Play.Start??

Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 29 Sep 2011 03:52 pm

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 29 Sep 2011 05:03 pm
Jorge, entonces seria algo asi no:

Código ActionScript :

miMovieClip2.miVideo2.attachVideo(stream2);
stream2.play("video1.flv");

var onEnd:Boolean = false; 
 
stream2.onStatus = function(evt:Object):void{ 
   if(evt.info.code=="NetStream.Buffer.Flush"){ 
        onEnd = true 
   } else if(evt.info.code=="NetStream.Play.Start"){ 
      if(onEnd) { 
        miMovieClip2.miVideo2.pause();
      } 
  } 
} 


Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 29 Sep 2011 05:29 pm
No, el flag es si esta terminando, y no es el caso, simplemente te interesa saber si empezó (Start) para hacerle el pause ... pero de todas formas tendrás que usar un flag, porque sino la siguiente vez que realmente lo quieras empezar y hacer play, se volverá a pausar, sería algo así:

Código ActionScript :

var inited:Boolean = false;  
stream2.onStatus = function(evt:Object):void{  
   if(evt.info.code=="NetStream.Play.Start"){  
      if(!inited) {  
        stream2.pause(); 
        inited = true;
      }  
  }
}


Jorge
} [/as]

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 29 Sep 2011 05:41 pm
Creo que el codigo en AS 3.0

solisarg escribió:



Código ActionScript :

var inited:Boolean = false;  
stream2.onStatus = function(evt:Object):void{  
   if(evt.info.code=="NetStream.Play.Start"){  
      if(!inited) {  
        stream2.pause(); 
        inited = true;
      }  
  }
}


Porque me da error.

Mofique:

Código ActionScript :

var inited:Boolean = new Boolean("false");            // modificado
stream2.onStatus = function(evt:Object):void{    // Error: Después de ':' se espera un identificador de tipo.

   if(evt.info.code=="NetStream.Play.Start"){  
      if(!inited) {  
        stream2.pause(); 
        inited = true;
      }  
  }
}


Saludos

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 29 Sep 2011 05:52 pm
¿que error?

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 29 Sep 2011 06:01 pm
En esta linea:

stream2.onStatus = function(evt:Object):void{

Error: Después de ':' se espera un identificador de tipo.

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 29 Sep 2011 06:07 pm
sacale :void

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 29 Sep 2011 06:41 pm
Ahora compila!

Este seria el codigo actualizado:

Código ActionScript :

// ------------------------ miVideo -------------------------------

var conexion:NetConnection = new NetConnection();  
conexion.connect(null);
var stream:NetStream = new NetStream(conexion); 
miMovieClip.miVideo.attachVideo(stream);
stream.play("video1.flv"); 

// ------------------------ miVideo2 -------------------------------

var conexion2:NetConnection = new NetConnection();  
conexion2.connect(null);  
var stream2:NetStream = new NetStream(conexion2); 
miMovieClip2.miVideo2.attachVideo(stream2);
stream2.play("video2.flv"); 
//miMovieClip2.miVideo2.pause();

var inited:Boolean = new Boolean("false");  
stream2.onStatus = function(evt:Object){   
   if(evt.info.code=="NetStream.Play.Start"){   
      if(!inited) {   
        stream2.pause();  
        inited = true; 
      }   
  } 
}

// ------------------------ BOTON N1 -------------------------------

btnN1.onPress = function(){ 
  if(miMovieClip.visible) { 
            fadeVideo(miMovieClip, miMovieClip2, stream);  
            stream2.play("video2.flv"); 
  } else { 
     fadeVideo(miMovieClip2, miMovieClip, stream2);  
      stream.play("video.flv") 
   }
}

// ------------------------ fadeVideo -------------------------------

var speed =  5; 
function fadeVideo(fadeOut:MovieClip, fadeIn:MovieClip, stream:NetStream):Void {  
   this.onEnterFrame = function() {  
     fadeOut._alpha -= speed; 
     fadeIn._alpha  += speed; 
      if (fadeIn._alpha >= 100) {  
         fadeOut._visible = false; 
         stream.stop();  
         delete this.onEnterFrame;  
      }  
   };  
}


El resultado es: reproduce los 2 videos en la misma pantalla, al darl click al btnN1 desaparece (sin alpha) video2 y el video1 se pausea..

En principio la pausa no funciona, y creo que le tendria que agregar antes de la funcion fadeVideo: miVideo2._alpha = 0; para que no se vea.

Que decis Jorge??

Por T1000

Claber

121 de clabLevel



Genero:Masculino  

firefox

 

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