Player = {
    media_url : "http://media.theshadowfactory.net/static/images/media_player/", //For linking to the images
    inited : false,
    player : null, // element to contain player
    controls : document.createElement('div'), // element to display the controls
    play_list : document.createElement('ul'), // element to display the play list
    auto_play : false, // Start playing straight away?
    is_playing : false, // Is the audio actually playing?
    current_track : null, // Track track that is now playing
    selected_track : null, // Track ths is currently selected
    
    seek_amount : 5, // Seconds to seek by
    
    init: function (element) {
        this.player = element;
        this.controls.setAttribute('id', 'controls');
        this.play_list.setAttribute('id', 'play_list');
        
        var tracks = document.getElementsByTagName("audio");

        if (tracks.length){
            var that = this;
            for (var i=0; i<tracks.length; i++){
                tracks[i].addEventListener("canplay", function (e) {
                    that.handle_track_load(e);
                }, true);
            }
        }
    },
    
    draw_player : function () {
        this.inited = true;
        this._add_class(this.player, 'player');
        
        var that = this;

        var skip_backward = document.createElement('img');
        skip_backward.setAttribute('id', "skip_backward");
        skip_backward.setAttribute('src', this.media_url + "media-skip-backward.png");
        skip_backward.setAttribute('title', "Skip Backward");
        this.controls.appendChild(skip_backward);
        skip_backward.onclick = function (e) {
            that.skip_backward(e);
        };

        var seek_backward = document.createElement('img');
        seek_backward.setAttribute('id', "seek_backward");
        seek_backward.setAttribute('src', this.media_url + "media-seek-backward.png");
        seek_backward.setAttribute('title', "Seek Backward");
        this.controls.appendChild(seek_backward);
        seek_backward.onclick = function (e) {
            that.seek_backward(e);
        };
        
        var play_pause = document.createElement('img');
        play_pause.setAttribute('id', "play_pause");
        play_pause.setAttribute('src', this.media_url + "media-playback-start.png");
        play_pause.setAttribute('title', "Play");
        this.controls.appendChild(play_pause);
        play_pause.onclick = function (e) {
            that.play_pause(e);
        };
        
        var seek_forward = document.createElement('img');
        seek_forward.setAttribute('id', "seek_forward");
        seek_forward.setAttribute('src', this.media_url + "media-seek-forward.png");
        seek_forward.setAttribute('title', "Seek Forward");
        this.controls.appendChild(seek_forward);
        seek_forward.onclick = function (e) {
            that.seek_forward(e);
        };
        
        var skip_forward = document.createElement('img');
        skip_forward.setAttribute('id', "skip_forward");
        skip_forward.setAttribute('src', this.media_url + "media-skip-forward.png");
        skip_forward.setAttribute('title', "Skip Forward");
        this.controls.appendChild(skip_forward);
        skip_forward.onclick = function (e) {
            that.skip_forward(e);
        };
        
        this.player.appendChild(this.controls);
        this.player.appendChild(this.play_list);
    },
    
    handle_track_load : function (e) {
        e = this._fix_event(e);
        var audio = e.target.cloneNode(true);
        // Add tracks to list
        var id = 0;
        var track = document.createElement('li');
        var title = document.createTextNode(audio.getAttribute('title'));
        var that = this;

        id = this.play_list.childNodes.length;

        track.appendChild(audio);
        audio.setAttribute('id','audio_'+id);
        if (audio.hasAttribute('controls')){
            audio.removeAttribute('controls');
        }
        track.appendChild(title);
        track.setAttribute('id','track_'+id);
        this._add_class(track, 'loading');
        track.onclick = function (e) {
            that.selected(e);
        };
        
        this.play_list.appendChild(track);

        // Show the track when it can be played through
        track.addEventListener("canplaythrough", function (e) {
            that.show_track(e);
        }, true);

        // Play next track at end of current track
        track.addEventListener("ended", function (e) {
            that.skip_forward(e);
        }, true);
    },
        
    show_track : function (e) {
        // Show Player
        if (!this.inited){
            this.draw_player();
        }
        
	    e = this._fix_event(e);
	    var audio = e.target;
        var track = audio.parentNode;
        this._remove_class(track, 'loading');
        if (this.selected_track === null){
            this.selected(track);
            if (this.auto_play){
                this.play();
            }
        }
    },
    
    selected : function (e) {
        var track;
        if (e.type){ // If mouse event
	        e = this._fix_event(e);
	        track = e.target;
	    }
	    else { // If element
	        track = e;
	    }
        
        // De-select old track
        if (this.selected_track){
            this._remove_class(this.selected_track, 'selected');
        }        

        // Select new track
        this.selected_track = track;
        this._add_class(this.selected_track, 'selected');
    },
    
    play_pause : function (e) {
        var track = this.current_track || this.selected_track;
        var audio = track.getElementsByTagName('audio')[0];
        
        /* STATES:
         *  is_playing  | current_track | selected_track    | ACTION
         *      F       |     A         |     A             | Play current_track  
         *      T       |     A         |     A             | Stop current_track
         *      F       |     A         |     B             | Play selected_track, set it to current_track
         *      T       |     A         |     B             | Stop current_track, play selected_track, set it to current_track
         */
        
        if (!this.is_playing && ((this.current_track == this.selected_track) || this.current_track == null)) {
            //alert("Play current_track");
            this.current_track = track;
            this._add_class(track, 'playing');
            audio.play();
            this.is_playing = true;
            if (e.target.src == this.media_url + "media-playback-start.png"){
                e.target.src = this.media_url + "media-playback-pause.png";
            }
        }
        else if (this.is_playing && this.current_track == this.selected_track) {
            //alert("Stop current_track");
            this._remove_class(track, 'playing');
            audio.pause();
            this.is_playing = false;
            if (e.target.src == this.media_url + "media-playback-pause.png"){
                e.target.src = this.media_url + "media-playback-start.png";
            }
        }
        else if (!this.is_playing && this.current_track != this.selected_track) {
            //alert("Play selected_track, set it to current_track");
            
            //Seek current track to begining
            audio.currentTime = 0;
            
            this.current_track = this.selected_track;
            this._add_class(this.current_track, 'playing');
            audio = this.current_track.getElementsByTagName('audio')[0];
            audio.play();
            this.is_playing = true;
            if (e.target.src == this.media_url + "media-playback-start.png"){
                e.target.src = this.media_url + "media-playback-pause.png";
            }
        }
        else if (this.is_playing && this.current_track != this.selected_track) {
            //alert("Stop current_track, play selected_track, set it to current_track");
            // Stop currently playing track and seek to start
            this._remove_class(track, 'playing');
            audio.pause();
            audio.currentTime = 0;
            
            this.current_track = this.selected_track;
            this._add_class(this.current_track, 'playing');
            audio = this.current_track.getElementsByTagName('audio')[0];
            audio.play();
            this.is_playing = true;
            if (e.target.src == this.media_url + "media-playback-start.png"){
                e.target.src = this.media_url + "media-playback-pause.png";
            }
        }
    },
    
    skip_backward : function (e) {
        e = this._fix_event(e);

        for (var i = 0; i < this.play_list.childNodes.length; i++){
            if (this.selected_track === this.play_list.childNodes[i]){
                var track_no = i - 1;
                if (track_no < 0){
                    var track_no = this.play_list.childNodes.length - 1;
                }
                this.selected(this.play_list.childNodes[track_no]);
                this.play_pause(e); 
                break;
            }
        }
    },
    
    seek_backward : function (e) {
        e = this._fix_event(e);
        
        var audio = this.current_track.getElementsByTagName('audio')[0];
        if (audio.currentTime - this.seek_amount > 0){
            audio.currentTime -= this.seek_amount;
        }
        else {
            audio.currentTime = 0;
        }
    },
    
    seek_forward : function (e) {
        e = this._fix_event(e);
        
        var audio = this.current_track.getElementsByTagName('audio')[0];
        if (audio.currentTime + this.seek_amount < audio.duration){
            audio.currentTime += this.seek_amount;
        }
        else {
            this.skip_forward(e);  
        }
    },
    
    skip_forward : function (e) {
        e = this._fix_event(e);

        for (var i = 0; i < this.play_list.childNodes.length; i++){
            if (this.selected_track === this.play_list.childNodes[i]){
                var track_no = i + 1;
                if (track_no == this.play_list.childNodes.length){
                    var track_no = 0;
                }
                this.selected(this.play_list.childNodes[track_no]);
                this.play_pause(e);
                break;
            }
        }
    },
    
    _fix_event : function (e) {
        // Fix the event
	    if (!e){
	         var e = window.event;
	    }
	    if (e.srcElement){
	        e.srcElement = e.target;
	    }
	    
	    return e;
    },
    
    _add_class : function (element, class) {
        var cls = element.getAttribute('class');
        if (cls > ""){
            cls += " ";
            cls += class;
        }
        else {
            cls = class;
        }
        element.setAttribute('class', cls);
    },
    
    _remove_class : function (element, class) {
        var cls = element.getAttribute('class');
        if (cls) { // Make sure the class isn't empty before we try to replace it
            cls = cls.replace(class, "");
            element.setAttribute('class', cls);
        }
    },
    
};

p = document.getElementById("player");
Player.init(p);

