MANUAL DE USUARIO CARACTERÍSTICAS GENERALES

Tamaño: px

Comenzar la demostración a partir de la página:

Download "MANUAL DE USUARIO CARACTERÍSTICAS GENERALES"

José Carlos Ortega Gutiérrez
hace 7 años
Vistas:

1 MANUAL DE USUARIO CARACTERÍSTICAS GENERALES El reproductor se ajusta a los tamaños dados en el HTML. Se puede controlar la visibilidad o no de los botones en la barra de controles, esto se explica más adelante. El reproductor cuenta con un icono de carga, el cual se muestra cuando se está cargando el contenido y se oculta cuando en el buffer ya hay la cantidad suficiente para reproducir. Este icono de carga cuenta con un contador que se va decrementando hasta cero según lo que vaya almacenando el buffer, y empieza en un valor dado en el archivo HTML, más adelante se explica este apartado. Cuando se reproduce el video en fullscreen, si no hay acción del mouse en alrededor de 3 segundos, se ocultan los controles; se vuelven a mostrar al mover el mouse. La barra de carga se llena a medida que se descarga el video, si se selecciona un punto no cargado, desde ahí se empieza a reproducir y desde ahí se empieza a mostrar la barra gris de carga actual. Al ubicarse en algún punto de la barra de reproducción, se muestra en un recuadro pequeño el tiempo al cual corresponde esa ubicación. Si no se encuentra el archivo de video o hay algún problema con el streaming, se muestra un mensaje diciendo que no se encuentra el archivo. AJUSTE DE TAMAÑO El reproductor se ajusta al tamaño del object dado en el archivo HTML que lo contiene. El video no se corta cuando los tamaños de ancho y alto son desproporcionados, sino que se ajusta a estos. Cuando el ancho es menor a 280 píxeles, el tiempo de reproducción se deja de mostrar, para así mostrar bien los botones y la barra de carga. Si la diferencia entre el ancho dado en el object y el número de botones activos en los controles es menos a 30 píxeles, la barra de carga no se muestra. Si el ancho dado en el object hace que el número de botones activos en los controles se sobrepongan uno sobre otro, los controles no se muestran (para tamaños muy pequeños). CONTROLES En la barra de controles siempre se muestra el botón de Play/Pause y el logo del programa, los demás botones pueden ser controlados por variables desde el HTML, estas son las variables:

2 embedhtml: Muestra-oculta el botón embed. Lo activa en 1, lo oculta en 0. Por defecto esta desactivado. fullhtml: Muestra-oculta el botón de fullscreen. Lo activa en 1, lo oculta en 0. Por defecto esta activado. soundhtml: Muestra-oculta el botón de sonido. Lo activa en 1, lo oculta en 0. Por defecto esta activado. timehtml: Muestra-oculta el tiempo de reproducción. Lo activa en 1, lo oculta en 0. Por defecto esta activado. Función botones Logo: Muestra los créditos del reproductor. Se ocultan volviendo a presionar el botón, o cerrándolo desde la X en el mensaje. Embed: Mostrará el código para embeber el objeto, o demás funciones (todavía no está en funcionamiento). FullScreen/NormalScreen: Botones para mostrar el video en pantalla completa (donde el video se muestra en su tamaño original ampliado a la resolución de la pantalla), o salir de la pantalla completa. Sonido: Activa o desactiva el sonido del video, al ubicar el mouse encima, se despliega el deslizador del sonido, para controlar gradualmente el mismo. Tiempo reproducción: Texto que muestra el tiempo actual de reproducción y el tiempo total del video. Play/Pause: Reproduce o pausa el video según corresponda el estado. Barra de desplazamiento: Para desplazarse por el video, se puede hacer moviendo el circulo pequeño que está en la barra, y soltarlo en el lugar deseado, o también, haciendo clic en el lugar deseado, inmediatamente se irá a reproducir en ese punto. VARIABLE DEL VIDEO Y TIEMPO DE BUFFER La variable que se envía en el HTML para reproducir el video se llama file, y lógicamente debe contener la ubicación del video FLV a reproducir. También desde el HTML se puede enviar una variable para controlar el tiempo de buffer, la cual es bufftime, es una variable numérica, la cual contendrá el tiempo de buffer del video, si no se especifica esta variable, o se ingresa un texto en caso de un número, se toma por defecto el valor de 20 (la unidad de esta variable es el segundo). Este tiempo es el que emplea el contador del icono de carga para empezar a disminuir su valor. COLOR BARRA CONTROLES Para cambiar el color de la barra de controles, se hace controlando el valor de una variable desde el HTML, la variable se llama _color, y recibe estos parámetros:

3 _color = red: Los controles quedan de color rojo. _color = blue: Los controles se muestran azules. _color = yello: Los controles se ven amarillos. _color = green: Los controles se ven verdes. Si se coloca un valor no válido, o no se pone nada, el color por defecto es el gris. AUTOPLAY El reproductor tiene función de autoplay, la cual se controla desde el archivo HTML, la variable se llama playauto, y cuando esta en 1, se reproduce automáticamente el video, en 0 el video no empieza a cargarse hasta que el usuario de clic en el botón de play que se muestra en el centro de la pantalla. Cuando el playauto está en cero, es decir, no está activada la reproducción automática, se puede colocar una imagen de previsualización, la cual se controla por medio del HTML, a través de la variable imageprev, y su valor es la URL de la imagen a mostrar, esta imagen se acomoda al ancho y alto del reproductor, por eso es necesario tener en cuenta sus dimensiones. COLOCAR EN PÁGINA WEB Para colocar el reproductor en una página web, primero que todo, se debe ubicar el archivo videoplayertic_udea.swf y el archivo HTML que lo contiene en alguna carpeta en el servidor, es bueno colocar los dos archivos juntos, para que así en el HTML al referirse al archivo swf, no se tenga que copiar una ruta antes del nombre del archivo. En el archivo HTML debe ir el siguiente código para que se muestre bien el reproductor: <object classid="clsid:d27cdb6e-ae6d-11cf-96b " codebase=" ersion=9,0,0,0" width="600" height="385" id="videoplayertic_udea" align="middle"> <param name="allowscriptaccess" value="samedomain" /> <param name="allowfullscreen" value="true" /> <param name="movie" value="videoplayertic_udea.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <param name="flashvars" value="file= mbedhtml=0&fullhtml=1&soundhtml=1&timehtml=1&_color=gray&playauto=0&i mageprev=" /> <embed src="videoplayertic_udea.swf" quality="high" bgcolor="#ffffff" width="600" height="385" name="videoplayertic_udea" align="middle"

4 allowscriptaccess="samedomain" allowfullscreen="true" type="application/xshockwave-flash" pluginspage=" /> </object> Ejemplos de configuración del reproductor Para configurar el reproductor, debemos centrarnos en el parámetro flashvars del código anterior, por ende no se volverá a copiar todo el código anterior, sino sólo la línea del parámetro flashvars. Ejemplo 1: Supongamos que el video a reproducir se encuentra en la siguiente ruta: Si se desea que el reproductor tenga autoplay, q muestre los botones del sonido, de pantalla completa y muestre el tiempo de reproducción, la línea de código quedaría así: &bufftime=10&embedhtml=0&fullhtml=1&soundhtml=1&timehtml=1&_color=gr ay&playauto=1&imageprev=" /> Notese que las variables fullhtml, soundhtml, timehtml, playauto están en 1, y la variable file contiene la dirección del video. Nota: el símbolo & se usa para separar las variables entre sí, recuerde que no deben usarse espacios en blanco, todo el texto va seguido. Ejemplo 2 Ahora, se desea desactivar el autoplay y poner una imagen de previsualización ubicada en la ruta no se desea mostrar el botón de pantalla completa: &bufftime=20&embedhtml=0&fullhtml=0&soundhtml=1&timehtml=1&_color=gr ay&playauto=0&imageprev= Ejemplo 3 Se quiere mostrar el reproductor en color verde, poner un tiempo de buffer pequeño (esto porque se asume que el ancho de banda de los usuarios es alto), y no mostrar el tiempo de reproducción en la barra: &bufftime=5&embedhtml=0&fullhtml=1&soundhtml=1&timehtml=0&_color=gre en&playauto=0&imageprev=

Documentos relacionados

MONTAJE DE VIDEO. Paso 1: Instale el servidor de video(flash media server 4.0).

MONTAJE DE VIDEO. Paso 1: Instale el servidor de video(flash media server 4.0). MONTAJE DE VIDEO Paso 1: Instale el servidor de video(flash media server 4.0). Paso 2: dentro del servidor en la ruta C:\Program Files\Adobe\Flash Media Server 4 Pegar el video en cual quiera de las tres