Carregar swfobject per AJAX amb mootools

Construïnt la web de Grapa hem vaig trobar amb un problema: carregar un flash dins d’una capa modificada per AJAX.

Per què ve el problema? Per un costat tenim que el swfobject s’executa quan la pàgina es carrega. Per l’altre costat sabem que l’AJAX carrega un contingut que importa des de una altra pàgina. Quan importa aquest “codi” el que fa és imprimir-lo allà on li dius. Amb mootools es faria així:

var showContents = this.showContents.bind(this);

var ajaxOptions = {
method: 'get',
update: $('section_cont'),
onComplete: showContents
};

this.ajaxRequest = new Ajax(this.url, ajaxOptions).request();

L’AJAX executa un Javascript però no torna a executar la pàgina de nou, per lo qual cridar al swfobject com es fa tradicionalment no funciona.

Com arrivar a la solució? Doncs cal saber una mica com funciona el swfobject. Bàsicament el que fa és crear un objecte i posteriorment imprimir-lo a la capa que li dius. Si això no deixa de ser Javascript, no podriem fer que crees aquest objecte quan ha de carregar l’AJAX?

Doncs efectivament, es pot! Seria alguna cosa així:

showContents: function() {
var interactive_flash = new FlashObject("/swf/reproductor.swf", "header", "548", "425", "8", "#ffffff", true);

interactive_flash.addParam("wmode", "opace");
interactive_flash.addParam("scale", "noscale");
interactive_flash.addVariable("file", this.video);
interactive_flash.write("embed_cont");
}

Si us fixeu, la crida AJAX del primer codi té una linia dins la variable “ajaxOptions” que diu onComplete: showContents. Això vol dir que quan hagi carregat l’AJAX cridarà la funció showContents, la qual crearà el swfobject.

I ja ho tenim. No és pas tan difícil!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>