(function() {
"use strict";
// video player is a directive to support legacy parts of the code which may not have angular templating loaded.
angular.module('shared')
    .directive('videoPlayer', ['videoService', function(videoService) {
        return {
            restrict: 'E',
            transclude: true,
            scope: {
                baseUrl: '@?',
                width: '@?',
                height: '@?',
                src: '<',
                videoTitle: '<',
                poster: '<?',
                autoPlay: '<?',
                captionFiles: '<?'
            },
            link: function(scope, elm, attrs, ctrl, transclude) {
                // this only creates elements at link time and doesn't watch for changes, we could change this...
                refreshVideoElem();
                scope.$watchCollection('[src, videoTitle, poster, autoPlay, captionFiles]', refreshVideoElem);

                function refreshVideoElem(){
                    elm.empty();
                    scope.shouldShowErrorContentOnError = true;
                    var videoElm = videoService.createVideoElement({
                        baseUrl: mapOptionalStringAttr(scope.baseUrl),
                        width: mapOptionalStringAttr(scope.width),
                        height: mapOptionalStringAttr(scope.height),
                        filename: mapOptionalStringAttr(scope.src),
                        title: mapOptionalStringAttr(scope.videoTitle),
                        poster: mapOptionalStringAttr(scope.poster),
                        shouldAutoPlay: !!scope.autoPlay,
                        captionFiles: Array.isArray(scope.captionFiles) ? scope.captionFiles : [],
                        onError: function(){
                            if(scope.shouldShowErrorContentOnError && transclude.isSlotFilled()){
                                elem.empty();
                                transclude(scope, function(clone){
                                    elem.append(clone);
                                });
                            }
                            scope.shouldShowErrorContentOnError = false;
                        }
                    });
                    elm.append(videoElm);
                }

                function mapOptionalStringAttr(param){
                    return (param && param.toString()) || undefined;
                }
            }

        }
    }])
})();