IriSP.Widgets.SlideVideoPlayer = function(player, config) {

    IriSP.loadCss(IriSP.getLib("cssSplitter"));

    IriSP.Widgets.Widget.call(this, player, config);

};

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

IriSP.Widgets.SlideVideoPlayer.prototype.defaults = {

};

IriSP.Widgets.SlideVideoPlayer.prototype.template = '<div class="Ldt-SlideVideoPlayer">\

<div class="Ldt-SlideVideoPlayer-slide Ldt-SlideVideoPlayer-panel">\

</div>\

<div class="Ldt-SlideVideoPlayer-video Ldt-SlideVideoPlayer-panel"></div>\

</div>';

IriSP.Widgets.SlideVideoPlayer.prototype.draw = function() {

    var _this = this;

    _this.renderTemplate();

    this.insertSubwidget(

        _this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-slide"),

            {

                type: "ImageDisplay",

                annotation_type: _this.annotation_type,

                width: '100%'

            },

            "slide"

        );

    this.insertSubwidget(

        _this.$.find(".Ldt-SlideVideoPlayer-panel.Ldt-SlideVideoPlayer-video"),

            {

                type: "HtmlPlayer",

                video: _this.video,

                width: '100%',

                url_transform: _this.url_transform

            },

            "player"

        );

    // FIXME: this should be better implemented through a signal sent

    // when widgets are ready (and not just loaded)

    window.setTimeout(function () {

        _this.$.find(".Ldt-SlideVideoPlayer").split({ orientation: 'vertical' });

    }, 1000);

}