Flowplayer Destroy

Raven280438

Erfahrenes Mitglied
#1
Hi,

ich benutze Flowplayer Commercial v5.5.0

Ich habe auf meiner Seite ein jQuery UI Dialog (Modal) in dem ich ein Video mit Flowplayer anzeigen.
Wenn der Dialog geschlossen wird, soll auch der Flowplayer wieder aus dem Speicher gelöscht werden.

Wie mache ich das am Besten? Die shutdown() Methode gibts irgendwie nicht.

Hier mein Javascript:

Code:
function trailer_popup(trailer_id)
{
    if ($("#trailer_popup_dialog").length > 0)
    {
        $("#trailer_popup_dialog").remove();
    }
   
    $("body").append("<div id=\"trailer_popup_dialog\"><div class=\"loading\"><span>Lade ...</span></div></div>");
   
    //Dialog öffnen
    $("#trailer_popup_dialog").load('/ajax/trailer_popup.php?trailer_id='+trailer_id, function() {
        $(".flowplayer_"+trailer_id).flowplayer();
    }).dialog({
        modal: true,
        dialogClass: 'trailer_popup_dialog',
        close: function() {
            console.log($(".flowplayer_"+trailer_id).data("flowplayer"));
        }
    });
   
    return false;
}
In der close-Methode soll der Player dann wieder aus dem Speicher gelöscht werden.


Gruß
 

SpiceLab

ZENmechanic
Premium-User
#2
Layout - Demos - Flowplayer hat gesagt.:
Overlay User interface classic.

When the playback begins the wrapper element is given a CSS classname "active" and when the player is unloaded using the close button or ESC-key the classname is removed. The rest is CSS.
Zitat-Quelle: http://dev72.flowplayer.org/demos/layout/

jQuery-Script dieser Demo-Seite:
Code:
// The smallest jQuery Overlay
$.fn.overlay = function() {
   var ACTIVE = "is-active"
   function toggle(el) {
      $("body").toggleClass("is-overlayed", !!el);
      el ? el.addClass(ACTIVE).trigger("open") :
         els.filter("." + ACTIVE).removeClass(ACTIVE).trigger("close");
   }
   // trigger elements
   var els = this.click(function(e) {
      toggle($(this));
   });
   // esc key
   $(document).keydown(function(e) {
      if (e.which == 27) toggle();
   });
   // close
   $(".close", this).click(function() {
      toggle(); return false;
   });
   return els;
};
// construct overlays
$(".overlay").overlay().bind("close", function() {
   // when overlay closes -> unload flowplayer
   $(this).find(".flowplayer").data("flowplayer").unload();
});
 

SpiceLab

ZENmechanic
Premium-User
#4
Vielleicht wird's Dir jetzt klarer.
JavaScript API - Docs - Flowplayer hat gesagt.:
shutdown()

Destroys the player instance. Call this method before you remove the container element from the page, or before you remove the player from it. This way all Flowplayer event handles are cleaned up as well.

Caveat: Like unload() which is called internally by it, this method requires a splash setup for perfect cleanup. Also prefer unload() whenever possible to avoid unnecessary DOM manipulations and prevent race conditions with immediately ensuing actions by wrapping them in the callback of the shutdown event.
Zitat-Quelle: https://flowplayer.org/docs/api.html#extension-methods

Der unload()-Event taucht im zuvor zitierten jQuery-Script auf.
 

SpiceLab

ZENmechanic
Premium-User
#6
Bei dem Abstand von fast unschlagbaren 2 Minuten zwischen unseren Beiträgen, von denen mind. die Hälfte für den "Posteingang/-ausgang"-Prozeß wegfällt, bleibt nicht viel übrig, um das zitierte jQuery-Script der "Overlay"-Variante näher angeschaut zu haben, geschweige denn, dem zugehörigen Link gefolgt zu sein, um sich gewissenhaft/seriös über dessen Inhalt zu informieren, damit man im Bilde ist/bleibt, und überhaupt "mitreden kann".

Ansonsten wäre diese Frage jetzt nicht gefallen, und erklärt im Abgang auch, warum Du den Kern meiner ersten Antwort überhaupt nicht verstanden hattest.


[edit]Tipp-Ex[/edit]
 
Zuletzt bearbeitet: