IriSP.Widgets.HtmlMashupPlayer = function(player, config) {
    IriSP.Widgets.Widget.call(this, player, config);
};

IriSP.Widgets.HtmlMashupPlayer.prototype = new IriSP.Widgets.Widget();


IriSP.Widgets.HtmlMashupPlayer.prototype.defaults = {
    aspect_ratio: 14/9,
    background: "#333333"
}

IriSP.Widgets.HtmlMashupPlayer.prototype.draw = function() {
    
    if (!this.height && this.aspect_ratio) {
        this.height = this.width / this.aspect_ratio;
        this.$.css("height", this.height);
    }
    
    if (this.background) {
        this.$.css("background", this.background);
    }
    
    var mashup = this.media,
        sel = this.$,
        width = this.width,
        height = this.height,
        url_transform = this.url_transform;
    
    mashup.currentMedia = null;
    mashup.currentAnnotation = null;
    mashup.seeking = false;
    var mashupSegmentBegin,
        mashupSegmentEnd,
        mashupTimecode = 0,
 //       seekdiv = $(".video-wait"),
        mashupTimedelta;
        
/*    
    function showSeek() {
        if (currentMedia.seeking) {
            seekdiv.show();
        }
    }
*/

    function changeCurrentAnnotation() {
        if (mashupTimecode >= mashup.duration) {
            if (!mashup.paused) {
                mashup.paused = true;
                mashup.trigger("pause");
            }
            mashupTimecode = 0;
        }
        var _annotation = mashup.getAnnotationAtTime( mashupTimecode );
        if (typeof _annotation === "undefined") {
            if (mashup.currentMedia) {
                mashup.currentMedia.pause();
                if (!mashup.paused) {
                    mashup.paused = true;
                    mashup.trigger("pause");
                }
            }
            return;
        }
        mashup.currentAnnotation = _annotation;
        mashupSegmentBegin = mashup.currentAnnotation.annotation.begin.milliseconds;
        mashupSegmentEnd = mashup.currentAnnotation.annotation.end.milliseconds;
        mashupTimedelta = mashupSegmentBegin - mashup.currentAnnotation.begin.milliseconds;
        mashup.currentMedia = mashup.currentAnnotation.getMedia();
        mashup.getMedias().forEach(function(_media) {
            if (_media !== mashup.currentMedia) {
                _media.hide();
                _media.pause();
            } else {
                _media.show();
            }
        });
        
        mashup.currentMedia.setCurrentTime( mashupTimecode + mashupTimedelta);
        mashup.currentMedia.seeking = true;
        
        if (!mashup.paused) {
            mashup.currentMedia.play();
            mashup.seeking = true;
//            setTimeout(showSeek,200);
        }
        mashup.trigger("timeupdate", new IriSP.Model.Time(mashupTimecode));

    }
    
    mashup.getMedias().forEach(addMedia);
    changeCurrentAnnotation();
    mashup.trigger("loadedmetadata");
    
    function addMedia(media) {
        if (media.has_player) {
            return;
        }
        media.has_player = true;
        var videourl = media.video;
        if (typeof url_transform === "function") {
            videourl = url_transform(media.video);
        }
        var videoid = "video_" + media.id,
            videoElement;
        
        media.show = function() {
            
            if (document.getElementById(videoid)) {
                return;
            }
            
            media.loaded = false;
            media.paused = true;
            var videoSelector = $('<video>');
            
            videoSelector.attr({
                id : videoid,
                width : width,
                height : height
            }).css({
                width: width,
                height: height
            });
            
            if (typeof videourl === "string") {
                videoSelector.attr( "src", videourl );
            } else {
                for (var i = 0; i < videourl.length; i++) {
                    var _srcNode = IriSP.jQuery('<source>');
                    _srcNode.attr({
                        src: videourl[i].src,
                        type: videourl[i].type
                    });
                    videoSelector.append(_srcNode);
                }
            }
            
            sel.append(videoSelector);
            
            videoElement = videoSelector[0];
            
            // Binding DOM events to media
            
            function getVolume() {
                media.muted = videoElement.muted;
                media.volume = videoElement.volume;
            }
            
            videoSelector.on("loadedmetadata", function() {
                getVolume();
                media.loaded = true;
                media.trigger("loadedmetadata");
                media.trigger("volumechange");
            })
            
            videoSelector.on("timeupdate", function() {
                media.trigger("timeupdate", new IriSP.Model.Time(1000*videoElement.currentTime));
            });
            
            videoSelector.on("volumechange", function() {
                getVolume();
                media.trigger("volumechange");
            })
            
            videoSelector.on("play", function() {
                media.trigger("play");
            });
            
            videoSelector.on("pause", function() {
                media.trigger("pause");
            });
            
            videoSelector.on("seeking", function() {
                media.trigger("seeking");
            });
            
            videoSelector.on("seeked", function() {
                media.trigger("seeked");
            });
        }
        
        media.hide = function() {
            videoElement = undefined;
            sel.find("#" + videoid).remove();
        }
        
        // Binding functions to Media Element Functions
        
        var deferredTime = undefined,
            deferredPlayPause = undefined;
        
        media.on("setcurrenttime", function(_milliseconds) {
            if (videoElement && videoElement.readyState >= videoElement.HAVE_METADATA) {
                try {
                    videoElement.currentTime = (_milliseconds / 1000);
                    deferredTime = undefined;
                } catch(err) {
                    deferredTime = _milliseconds;
                }
            } else {
                deferredTime = _milliseconds;
            }
        });
        
        media.on("setvolume", function(_vol) {
            if (videoElement && videoElement.readyState >= videoElement.HAVE_METADATA) {
                media.volume = _vol;
                videoElement.volume = _vol;
            }
        });
        
        media.on("setmuted", function(_muted) {
            if (videoElement && videoElement.readyState >= videoElement.HAVE_METADATA) {
                media.muted = _muted;
                videoElement.muted = _muted;
            }
        });
        
        media.on("setplay", function() {
            if (videoElement && videoElement.readyState >= videoElement.HAVE_METADATA) {
                try {
                    videoElement.play();
                    deferredPlayPause = undefined;
                } catch(err) {
                    deferredPlayPause = true;
                }
            } else {
                deferredPlayPause = true;
            }
        });

        media.on("setpause", function() {
            if (videoElement && videoElement.readyState >= videoElement.HAVE_METADATA) {
                try {
                    videoElement.pause();
                    deferredPlayPause = undefined;
                } catch(err) {
                    deferredPlayPause = false;
                }
            } else {
                deferredPlayPause = false;
            }
        });
        
        media.on("loadedmetadata", function() {
            if (typeof deferredTime !== "undefined") {
                media.setCurrentTime(deferredTime);
            }
            if (typeof deferredPlayPause !== "undefined") {
                if (deferredPlayPause) {
                    media.play();
                } else {
                    media.pause();
                }
            }
        });
        
        // Binding UI Events and Mashup Playing to Media
        
        media.on("play", function() {
            if (media === mashup.currentMedia) {
                mashup.trigger("play");
            }
        });
        
        media.on("pause", function() {
            if (media === mashup.currentMedia) {
                mashup.trigger("pause");
            }
        });
        
        media.on("timeupdate", function(_time) {
            if (!mashup.paused && media === mashup.currentMedia && !media.seeking) {
                if ( _time < mashupSegmentEnd ) {
                    if ( _time >= mashupSegmentBegin ) {
                        mashupTimecode = _time - mashupTimedelta;
                    } else {
                        mashupTimecode = mashupSegmentBegin - mashupTimedelta;
                        media.setCurrentTime(mashupSegmentBegin);
                    }
                } else {
                    mashupTimecode = mashupSegmentEnd - mashupTimedelta;
                    media.pause();
                    changeCurrentAnnotation();
                }
                mashup.trigger("timeupdate", new IriSP.Model.Time(mashupTimecode));
            }
        });
        
        media.on("seeked", function() {
            media.seeking = false;
            if (media === mashup.currentMedia && mashup.seeking) {
                mashup.seeking = false;
            }
//            seekdiv.hide();
        });
        
        media.on("volumechange", function() {
            mashup.muted = media.muted;
            mashup.volume = media.volume;
            mashup.trigger("volumechange");
        });
        
    }

    // Mashup Events
    
    mashup.on("setcurrenttime", function(_milliseconds) {
        mashupTimecode = _milliseconds;
        changeCurrentAnnotation();
    });
    
    mashup.on("setvolume", function(_vol) {
        mashup.getMedias().forEach(function(_media) {
            _media.setVolume(_vol);
        });
        mashup.volume = _vol;
    });
    
    mashup.on("setmuted", function(_muted) {
        mashup.getMedias().forEach(function(_media) {
            _media.setMuted(_muted);
        });
        mashup.muted = _muted;
    });
    
    mashup.on("setplay", function() {
        mashup.paused = false;
        changeCurrentAnnotation();
    });
    
    mashup.on("setpause", function() {
        mashup.paused = true;
        if (mashup.currentMedia) {
            mashup.currentMedia.pause();
        }
    });
    
    mashup.on("loadedmetadata", function() {
        changeCurrentAnnotation();
    });
    
}