Swiff: Mootools Flash Plugin

Swiff es una clase de Mootools que permite embeber archivos Flash en páginas html a semejanza de SWFObject. Este clase fue desarrollada originalmente por Harald Kirschner para la librería FancyUpload el cual permite hacer upload de archivos con barra de progreso de manera sencilla y ahora se esta incluyendo en la nueva versión de Mootools 1.2 que aun esta en estado beta.

Obteniendo Swiff
Para utilizar Swiff hay dos opciones. La primera es descargar la versión beta Mootools 1.2beta2 en el cual podemos seleccionar Swiff de la lista de componentes y luego la incluimos en el header de nuestra página:

  1. <!-- Si utilizamos mootools 1.2beta2 -->
  2. <script type="text/javascript" src="mootools.js"></script>

La segunda forma es para cuando se utiliza Mootools 1.1, podemos descargar sólo la librería Swiff.Base.js el cual es parte de la librería FancyUpload.

  1. <!-- Si utilizamos mootools 1.1 -->
  2. <script type="text/javascript" src="mootools.js"></script>
  3. <script type="text/javascript" src="Swiff.Base.js"></script>

Utilizando Swiff
Para utilizar Swiff podemo utilizar la siguiente sintaxis, donde ‘path’ es la ruta al swf a incluir, w es el ancho, h es la altura y ‘iddiv’ es el identificador

  1. new Swiff('path', {width: w, height: h, container: 'iddiv'});

Luego si deseamos incluir un swf llamado header.swf en nuestra página en el div llamado main, tendríamos el siguiente código:

  1. <title>Demo Swiff - unijimpe</title>
  2. <script type="text/javascript" src="mootools.js"></script>
  3. <script type="text/javascript">
  4. window.addEvent('load', function() {
  5.     var myswf = new Swiff('swffull.swf', {
  6.         width: 600,
  7.         height: 450,
  8.         container: 'main'
  9.     });
  10. });
  11. </head>
  12. <div id="main">Flash Movie</div>
  13. </body>
  14. </html>

El resultado de este ejemplo lo pueden ver en: Demo Swiff – unijimpe. Obviamente hay muchas mas opciones al momento de insertar un swf como el color del fondo, pasarle flashvars e incluso agregarle eventos, esto lo pueden encontrar de forma detallada en la documentación en Mootools Class: Swiff.

Este método de inclusión de SWFs es muy practico cuando ya estamos utilizando Mootools y no deseamos utilizar una librería adicional para ejecutar flash en nuestra página. Pero si es que deseas controlar el swf al detalle (Por ejemplo la versión de Flash Player) siempre estará SWFObject el cual es el estándar para inclusión de SWFs.

Comentarios Total 3 comentarios


Matias
Publicado: 01/03/2008 2:15 am

Hola, muy interesante articulo, una pregunta: ¿podrías explicarme el uso de FancyUpload? ya que no conozco la forma de utilizar este tipo de utilidades.

un abrazo

Se acerca MooTools 1.2 | aNieto2K
Publicado: 09/04/2008 6:14 pm

[…] Swiff: MooTools flash plugin Compártelo « Mejorando la dificultad de GeekTest […]

David Bernad
Publicado: 26/03/2009 5:51 am

Hola, muy bueno el artículo.

Tengo una duda y no sé si sabréis la solución.
¿Con el objeto Swiff el browser nos pediría el plugin de flash en caso de no tenerlo, o mostrará caracteres extraños en vez de la película flash?

Muchas gracias de antemano.

 

Comentar

En este blog los comentarios están moderados, serán mostrados cuando el administrador los apruebe. Por favor, evita comentarios ofensivos u obscenos por que no serán aprobados.
Si deseas publicar código fuente debes hacerlo entre las etiquedas <code> y </code>, además debes reemplazar los carácteres < por &lt; y > por &gt;.

(Requerido)

(Requerido, no será publicado)

(Requerido)

(Tags aceptados: <a> <em> <strong> <code> <ul> <li>)