/**
 Copyright (c) 2009, spirito GmbH, Germany
 http://www.spirito.de
 info@spirito.de
 */

/* Dynamischer Mediaplayer
 * Blendet einen MP3 oder Flashvideo-Player ein und aus.
 *
 * Sucht onload nach Elementen mit der Klasse "spiritomediaplayer". 
 * Dieses Element wird der onClick-Öffner für den Mediaplayer.
 *
 * Es können anhand von XML-Attributen folgende Konfigurationen vorgenommen werden:
 *
 * REQUIRED:
 *   Informationen, woher der Inhalt kommen soll:
 *   dbtable
 *   dbfield
 *   dbid
 *
 * OPTIONAL:
 *   containerid : Id des in der Seite definierten Kontainers, in dem der Player angezeigt werden soll.
 *                 Dieser Container sollte ein Element mit der Klasse "spiritomediaplayer_content" und "spiritomediaplayer_close" enthalten.
 *                 xx_content wird mit dem Player gefüllt, xx_close bekommt einene onclick-Close-Player Handler
 *                 Wird containerid weggelassen oder existiert nicht, wird ein Container erzeugt und ganz oben im Dokument eingehängt.
 *  center       : Wenn gesetzt, wird der Container zentriert
 *  fadebg       : Wenn gesetzt, wird der Hintergrund ausgeblendet.
 *
 *
 * BEISPIEL: 
 *   <img id="audio_video" src="/$(xd-design-public)/img/btn_audio_video.png" 
 *        class="spiritomediaplayer" 
 *        containerid="mediaplayer_container_video"
 *        dbtable="xdcontent" 
 *        dbfield="data6" 
 *        dbid="$(top_section_id)"
 *        center="1" 
 *        fadebg="1">
 */

Event.observe(window, "load", function(){
    var SpiritoMediaPlayer = {
        defaultContainerId: "spiritomediaplayer_container",
        ajaxConnector: "/_dado/get_mediaplayer_content.html",
        
        _close : function(ev){
            ev.stop();
            if ($("spiritomediaplayer_fade_layer"))
                $("spiritomediaplayer_fade_layer").remove();
            var container = ev.element().up(".spiritomediaplayer_open_container");
            container.hide();
            //container.down(".spiritomediaplayer_content").update("");
            console.log("Mediaplayercontainer geschlossen.")
        },
        
        _centerContainer : function(container, containerWidth, containerHeight){
            console.log("zentriere Container");
            if( ! containerHeight)
                containerHeight = 0
            if( ! containerWidth)
                containerWidth = 0
            var left = (document.viewport.getWidth() - containerWidth) / 2;
            var top = (document.viewport.getHeight() - containerHeight) / 2;
            console.log("zentriere den Container (l,r):" + left + " " + top);
            container.setStyle({
                "position" : "absolute",
                "left" : left + "px",
                "top" : top + "px"
            });
       },
       
       _fadeBg : function(){
           console.log("Fade den BG");
            var layer = new Element("div");
            layer.id = "spiritomediaplayer_fade_layer";
            layer.setStyle({
                "backgroundColor" : "black",
                "opacity" : 0.5,
                "zIndex" : "3000",
                "height" : document.viewport.getHeight() + "px",
                "width" : document.viewport.getWidth() + "px",
                "position" : "absolute",
                "top" : 0,
                "left" : 0
            });
            $$("BODY")[0].insert({"top" : layer});
       },
       
        /* Zeigt den Mediaplayer an.*/
        _show: function(json, container, fadebg, center){
            var container_content = container.down(".spiritomediaplayer_content"); 
            container_content.setStyle({
                "width" : json.width + "px",
                "height" : json.height + "px"
            });
            container_content.update(json.content);
            
            container.down(".spiritomediaplayer_close").observe("click", SpiritoMediaPlayer._close);
            if (center) 
                SpiritoMediaPlayer._centerContainer(container, parseInt(json.width), parseInt(json.height));
            if (fadebg){
                SpiritoMediaPlayer._fadeBg();
            }
            container.show();
        },

        /**
         * Wenn es einen Kontainer mit containerId gibt, wird dieser zurück gegeben,
         * ansonsten ein neuer Kontainer mit content-Holder und Close-Button erzeugt.
        */
        _getContainer: function(containerId){
            containerId = containerId ? containerId : SpiritoMediaPlayer.defaultContainerId;
            console.log("Suche Container mit Id: " + containerId)
            if ($(containerId)) 
                return $(containerId)
            else 
                if ($(SpiritoMediaPlayer.defaultContainerId)) 
                    return ($(SpiritoMediaPlayer.defaultContainerId))
                else {//Container erzeugen
                    var container = new Element("div");
                    var content = new Element("div");
                    var closeButton = new Element("div");
                    
                    content.addClassName("spiritomediaplayer_content");
                    closeButton.addClassName("spiritomediaplayer_close");
                    closeButton.update("<a href='' >X</a>");
                    container.id = SpiritoMediaPlayer.defaultContainerId;
                    
                    container.insert({
                        "top": content
                    });
                    container.insert({
                        "bottom": closeButton
                    });
                    $$("BODY")[0].insert({
                        "top": container
                    });
                    
                    return container
                }
        },
        
        /* Einzige "Public-Funktion" */        
        exec: function(ev){
            var trigger = ev.element();
            while (!trigger.hasClassName("spiritomediaplayer")) {
                trigger = trigger.up();
            }
            var containerId = trigger.readAttribute("containerid");
            var dbtable = trigger.readAttribute("dbtable");
            var dbfield = trigger.readAttribute("dbfield");
            var dbid = trigger.readAttribute("dbid");
            var center = trigger.readAttribute("center");
            var fadebg = trigger.readAttribute("fadebg");
            console.log("Erzeuge Mediaplayer: container: " + containerId 
                               + "\nDB: " + dbtable + " " + dbfield + " " + dbid
                               + "\ncenter: " + center 
                               + "\nFadebg: " + fadebg)
            
            if (!dbtable || !dbfield || !dbid) 
                throw "dbtable, dbfield und dbid müssen im Element gesetzt sein."
            
            var container = SpiritoMediaPlayer._getContainer(containerId);
            container.addClassName("spiritomediaplayer_open_container");
            container.hide();
            container.setStyle({"zIndex" : "4000"});
            
            new Ajax.Request(SpiritoMediaPlayer.ajaxConnector, {
                method: "GET",
                parameters: $H({
                    "nocache": Math.random(),
                    "table": dbtable,
                    "field": dbfield,
                    "id": dbid
                }).toQueryString(),
                onSuccess: function(t){
                    SpiritoMediaPlayer._show(t.responseText.evalJSON(), container, fadebg, center);
                }
            });
        }
    };
    
    
    $$(".spiritomediaplayer").each(function(trigger){
        trigger.observe("click", SpiritoMediaPlayer.exec);
    });
});