Cómo manipular tus videos e incrustarlos en tu web en un plis plas

Suponiendo que tienes un video .avi o lo que sea (casi) y quieres ponerlo en tu web.

Este es un método para transformarlo a swf e incrustarlo en tu web al mas puro estilo youtube.

Redimensionar tu video

Supongo que tu video será a pantalla completa y bastante pesado, por lo que lo primero que vamos a hacer es redimensionarlo y hacerlo mas pequeño para poder propagarlo por la red.

Para eso nada más facil que usar mencoder:

mencoder tu_video.avi -ovc lavc -lavcopts vcodec=mpeg4 -vf scale=640:480 -o tu_video_resultante

Ahora ya lo tenemos redimensionado 640 X 480 … si quieres un tamaño mas pequeño pues lo pones.

Tras eso lo más práctico es convertirlo a un formato .flv para que cualquiera de los reproductores flash que existen lo puedan reproducir….. Yo uso http://www.flowplayer.org/ que es Software Libre. Tu puedes usar el que te de la gana.

Para transformarlo a flv pues tan sencillo como usar ffmpeg

ffmpeg -i tu_video.avi -acodec mp3 -ar 22050 -ab 32 -f flv  tu_video.flv;

Yo tengo hecho 3 scripts para hacer esto…. uno para escalar, otro para redimensionar y otro que los invoca a ambos uno detrás de otro…. para no estar esperando…. XD

escalar.sh

#!/bin/bash
# 
# nombre : escalar.sh
# autor : juantxu  
# copyleft : 15/09/2008
#

echo "Script para escalar video AVI a un tamaño propagable por internet";
echo "";
echo "Si ni le has puesto la path del video te la voy a pedir";
echo ""
echo "si no has puesto la path del video de salida o dejaré en \$ENTRADA_640_480.avi";
echo ""
echo "uso : ./escalar_video_avi.sh /path/del/video/de/origen.avi /path/del/video/destino.avi"
if [ "x"$1 != "x" ]
then 
	entrada=$1;
else
	echo "cual es la path del video?"
	read entrada
fi;
if [ "x"$2 != "x" ]
then 
	salida=$2;
else
  	salida=$entrada"_640_480.avi";
fi;
mencoder $entrada -ovc lavc -lavcopts vcodec=mpeg4 -vf scale=640:480 -o $salida

transformar.sh

#!/bin/bash
# 
# nombre : transformar.sh
# autor : juantxu  
# copyleft : 15/09/2008


echo "Script para trasformar video AVI a flv ";
echo "";
echo "Si ni le has puesto la path del video te la voy a pedir";
echo ""
echo "si no has puesto la path del video de salida o dejaré en \$ENTRADA.flv";
echo ""
echo "uso : ./transformar_avi_a_flv.sh /path/del/video/de/origen.avi /path/del/video/destino.flv"
if [ "x"$1 != "x" ]
then 
	entrada=$1;
else
	echo "cual es la path del video?"
	read entrada
fi;
if [ "x"$2 != "x" ]
then 
	salida=$2;
else
  	salida=$entrada".flv";
fi;
ffmpeg -i $entrada -acodec mp3 -ar 22050 -ab 32 -f flv  $salida;

flvtool2 -U $salida ;

escala_y_transforma.sh

#!/bin/bash
# 
# nombre : escala_y_transforma.sh
# autor : juantxu  
# copyleft : 15/09/2008

if [ "x"$1 != "x" ]
then 
	entrada=$1;
else
	echo "cual es la path del video?"
	read entrada
fi;

escalar.sh $entrada

transformar.sh $entrada"_640_480.avi"

echo "el video está en   $entrada"_640_480.avi".flv";

Ahora que ya lo tienes todo tan sólo tienes que bajarte el flowplayer e incrustar tu video.

yo lo he hecho tal que así:

index.html

<html>
<head>
</head>
<body>

<!------------------ TODO LO REFERENTE AL REPRODUCTOR SE ENCUENTRA CONTENIDO AQUI -->

<!-- script que contiene el objeto reproductor de las peliculas flash -->
<script type="text/javascript" src="inc/flashembed.min.js"></script>
<script>

function cargaPeli(peli_a_reproducir){
	var html_div_destino='reproductorFlash';
	var reproductor='FlowPlayerClassic.swf';



	 flashembed(html_div_destino, 

		{

			src:reproductor,

			width: 640, 

			height: 480

		},

		{config: {   

			autoPlay: true,
			autoBuffering: true,
			controlBarBackgroundColor:'0x2e8860',

			initialScale: 'scale',
			videoFile: peli_a_reproducir

		}} 

	);
}

	</script>	

<div id="reproductorFlash" style="width:640px;height:480px;">
<input type="button" value="Ver Video 1" onClick="cargaPeli('videos/video1.avi_640_480.avi.flv');" >
<input type="button" value="Ver Video 2" onClick="cargaPeli('videos/video2.avi_640_480.avi.flv');" >
<input type="button" value="Ver Video 3" onClick="cargaPeli('videos/video3.avi_640_480.avi.flv');" >
<input type="button" value="Ver Video 4" onClick="cargaPeli('videos/video4.avi_640_480.avi.flv');" >
<input type="button" value="Ver Video 5" onClick="cargaPeli('videos/video5.flv');" >
<!------------------HASTA AQUI -->
</body>
</html>

Y ya está!

Bueno, tienes que poner cada cosa en su sitio, los videos en la subcarpeta videos y el JavaScript en la subcarpeta inc. Pero eso ya lo manejas ya tu a tu gusto.