// tonepreview.js - Media class used to playback audio in a hidden flash component.
//
// This feature has several dependencies :
//   tonepreview.jsp (to have an element ready in the page)
//   swfobject.js (to insert flash into the page)
//   flashgateway.js (to communicate with the hidden flash mp3 player)
//   javascriptflashgateway.swf (flash file to communicate with javascript)
//   player.swf (flash file to play back the mp3)
//
// by default, it automatically hooks up to elements of class "previewplay"

if (typeof Media == "undefined") { var Media = new Object(); }

Media.TonePreview = Class.create();


Media.TonePreview.prototype = {
    
    initialize: function(params) { // initialize takes no params

        this.playStatus = "stopped"; // or play
        this.playingElement = null; // element of currently playing item
        this.playContent = null; // holder for previous 'click here' content
        this.timeout = null;
        this.swfContainer = "swfPreviewContainer";
        
        var selector = ".previewplay";  // flag the items to attach to
        var els = Element.select(document, selector);

        for (var i=0; i<els.length; i++) {
            var el = els[i];
            Event.observe(el, "click", this.handlePreview.bindAsEventListener(this), false);
        }
    },
        
    play: function (url, id) {
        // call flash object with play, url to media, id for element, and flag if it should stop current stream
        try {
            flashPreviewProxy.call("play", url, id, "true");
        } catch(err) { }
        this.playStatus = "playing";
    },

    gotEvent: function (type, id) {
        // use id to find element, if type == "end" flip image back to play button
        var el = $(id);

        if (type == "end") { 
            if (this.playingElement) {
                var el = this.playingElement;
            }

            flashPreviewProxy.call("stop");
            
            if (this.playStatus != "stopped") { 
                this.playStatus = "stopped";
                // toggle image 
                if (el) {
                    
                    try {                         
                        var icon = el.getElementsByTagName("IMG")[0];
                        
                        Element.removeClassName(icon, "stop");
                        Element.addClassName(icon, "play");
                        
                        if (icon.getAttribute("play")) { 
                            icon.src = icon.getAttribute("play");
                        } else { 
                            icon.src = "/images/content/play_btn.gif";
                        }
                        icon.alt = "Play";
                        icon.title = "Play";
                    } catch(err) { }
                }
                this.playContent = null;
            }
        }

    },

    handlePreview: function(e) {
                
        var el  = Event.element(e);
        var url; // preview comes from anchor itself
        // go hunting for the parent A tag
        if ((el.tagName != "SPAN") && !(el.getAttribute("previewpath"))) {
            el = Event.findElement(e,"SPAN"); 
        }

        if (typeof el.getAttribute('previewpath') == "undefined") {
            url = el.parentElement; // strange workaround for safari
        } else {
            url = el.getAttribute("previewpath");
        }

        Event.stop(e); // this prevents an "a" tag we're attached to from following the click

        if (this.playStatus == "playing") {
            this.gotEvent("end", this.id);
            if (el.id == this.id) { 
                return;
            } // if we've clicked the current one we dont want to restart it 
        }

        this.id = el.id;
        this.playingElement = el;
        this.playContent = el.getElementsByTagName("IMG")[0].src;
        
        this.play(url, el.id);
            
        // toggle image 
        try { 

            var icon = el.getElementsByTagName("IMG")[0];
            
            Element.removeClassName(icon, "play");
            Element.addClassName(icon, "stop");
            
            if (icon.getAttribute("stop")) { 
                icon.src = icon.getAttribute("stop");
            } else { 
                icon.src = "/images/content/stop_btn.gif";
            }
            icon.alt = "Stop";
            icon.title = "Stop";

        } catch(err) { }
    }
        
}