From 387d2166f8437a83704a99de67f35df716807ba9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C3=A3o=20Paulo?= Date: Thu, 19 Nov 2020 16:18:40 -0300 Subject: [PATCH] chore(package): bump to 0.4.9 --- dist/clappr-plugins.esm.js | 23 +++++------------------ dist/clappr-plugins.js | 23 +++++------------------ dist/clappr-plugins.min.js | 2 +- package.json | 2 +- 4 files changed, 12 insertions(+), 38 deletions(-) diff --git a/dist/clappr-plugins.esm.js b/dist/clappr-plugins.esm.js index 8a7c1041..8a7f6638 100644 --- a/dist/clappr-plugins.esm.js +++ b/dist/clappr-plugins.esm.js @@ -239,24 +239,11 @@ var ClosedCaptions = /*#__PURE__*/function (_UICorePlugin) { _createClass(ClosedCaptions, [{ key: "bindEvents", value: function bindEvents() { - this.bindCoreEvents(); + this.listenTo(this.core, Events.CORE_ACTIVE_CONTAINER_CHANGED, this.containerChanged); + this.listenTo(this.core.mediaControl, Events.MEDIACONTROL_RENDERED, this.render); + this.listenTo(this.core.mediaControl, Events.MEDIACONTROL_HIDE, this.hideContextMenu); this.bindContainerEvents(); } - }, { - key: "bindCoreEvents", - value: function bindCoreEvents() { - var _this2 = this; - - if (this.core.mediaControl.settings) { - this.listenTo(this.core, Events.CORE_ACTIVE_CONTAINER_CHANGED, this.containerChanged); - this.listenTo(this.core.mediaControl, Events.MEDIACONTROL_RENDERED, this.render); - this.listenTo(this.core.mediaControl, Events.MEDIACONTROL_HIDE, this.hideContextMenu); - } else { - setTimeout(function () { - return _this2.bindCoreEvents(); - }, 100); - } - } }, { key: "bindContainerEvents", value: function bindContainerEvents() { @@ -1506,7 +1493,7 @@ var index = { Kibo: Kibo }; -var css$3 = ".media-control-notransition {\n transition: none !important; }\n\n.media-control[data-media-control] {\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 9999;\n pointer-events: none; }\n .media-control[data-media-control].dragging {\n pointer-events: auto;\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control].dragging * {\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control] .media-control-background[data-background] {\n position: absolute;\n height: 40%;\n width: 100%;\n bottom: 0;\n background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));\n transition: opacity 0.6s ease-out; }\n .media-control[data-media-control] .media-control-icon {\n line-height: 0;\n letter-spacing: 0;\n speak: none;\n color: #fff;\n opacity: 0.5;\n vertical-align: middle;\n text-align: left;\n transition: all 0.1s ease; }\n .media-control[data-media-control] .media-control-icon:hover {\n color: white;\n opacity: 0.75;\n text-shadow: rgba(255, 255, 255, 0.8) 0 0 5px; }\n .media-control[data-media-control].media-control-hide .media-control-background[data-background] {\n opacity: 0; }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] {\n bottom: -50px; }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] {\n position: absolute;\n bottom: 7px;\n width: 100%;\n height: 32px;\n font-size: 0;\n vertical-align: middle;\n pointer-events: auto;\n transition: bottom 0.4s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-left-panel[data-media-control] {\n position: absolute;\n top: 0;\n left: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-center-panel[data-media-control] {\n height: 100%;\n text-align: center;\n line-height: 32px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-right-panel[data-media-control] {\n position: absolute;\n top: 0;\n right: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button {\n background-color: transparent;\n border: 0;\n margin: 0 6px;\n padding: 0;\n cursor: pointer;\n display: inline-block;\n width: 32px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg {\n width: 100%;\n height: 22px; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button:focus {\n outline: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-play] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-pause] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-stop] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-fullscreen] {\n float: right;\n background-color: transparent;\n border: 0;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator] {\n background-color: transparent;\n border: 0;\n cursor: default;\n display: none;\n float: right;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled {\n display: block;\n opacity: 1.0; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled:hover {\n opacity: 1.0;\n text-shadow: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playpause] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playstop] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position], .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n display: inline-block;\n font-size: 10px;\n color: white;\n cursor: default;\n line-height: 32px;\n position: relative; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position] {\n margin: 0 6px 0 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n color: rgba(255, 255, 255, 0.5);\n margin-right: 6px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration]:before {\n content: \"|\";\n margin-right: 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] {\n position: absolute;\n top: -20px;\n left: 0;\n display: inline-block;\n vertical-align: middle;\n width: 100%;\n height: 25px;\n cursor: pointer; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] {\n width: 100%;\n height: 1px;\n position: relative;\n top: 12px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-1[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar]:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled {\n cursor: default; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n position: absolute;\n transform: translateX(-50%);\n top: 2px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] .bar-scrubber-icon[data-seekbar] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] {\n float: right;\n display: inline-block;\n height: 32px;\n cursor: pointer;\n margin: 0 6px;\n box-sizing: border-box; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] {\n float: left;\n bottom: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] {\n background-color: transparent;\n border: 0;\n box-sizing: content-box;\n width: 32px;\n height: 32px;\n opacity: 0.5; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume]:hover {\n opacity: 0.75; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg {\n height: 24px;\n position: relative;\n top: 3px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume].muted svg {\n margin-left: 2px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] {\n float: left;\n position: relative;\n overflow: hidden;\n top: 6px;\n width: 42px;\n height: 18px;\n padding: 3px 0;\n transition: width .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] {\n height: 1px;\n position: relative;\n top: 7px;\n margin: 0 3px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-1[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-2[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-hover[data-volume] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] {\n position: absolute;\n transform: translateX(-50%);\n top: 0px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] .bar-scrubber-icon[data-volume] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume] {\n float: left;\n width: 4px;\n padding-left: 2px;\n height: 12px;\n opacity: 0.5;\n box-shadow: inset 2px 0 0 white;\n transition: transform .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume].fill {\n box-shadow: inset 2px 0 0 #fff;\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:nth-of-type(1) {\n padding-left: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:hover {\n transform: scaleY(1.5); }\n .media-control[data-media-control].w320 .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume].volume-bar-hide {\n width: 0;\n height: 12px;\n top: 9px;\n padding: 0; }\n"; +var css$3 = ".media-control-notransition {\n transition: none !important; }\n\n.media-control[data-media-control] {\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 9999;\n pointer-events: none; }\n .media-control[data-media-control].dragging {\n pointer-events: auto;\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control].dragging * {\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control] .media-control-background[data-background] {\n position: absolute;\n height: 40%;\n width: 100%;\n bottom: 0;\n background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));\n will-change: transform, opacity;\n transition: opacity 0.6s ease-out; }\n .media-control[data-media-control] .media-control-icon {\n line-height: 0;\n letter-spacing: 0;\n speak: none;\n color: #fff;\n opacity: 0.5;\n vertical-align: middle;\n text-align: left;\n transition: all 0.1s ease; }\n .media-control[data-media-control] .media-control-icon:hover {\n color: white;\n opacity: 0.75;\n text-shadow: rgba(255, 255, 255, 0.8) 0 0 5px; }\n .media-control[data-media-control].media-control-hide .media-control-background[data-background] {\n opacity: 0; }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] {\n transform: translateY(50px); }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] {\n position: absolute;\n transform: translateY(-7px);\n bottom: 0;\n width: 100%;\n height: 32px;\n font-size: 0;\n vertical-align: middle;\n pointer-events: auto;\n transition: bottom 0.4s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-left-panel[data-media-control] {\n position: absolute;\n top: 0;\n left: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-center-panel[data-media-control] {\n height: 100%;\n text-align: center;\n line-height: 32px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-right-panel[data-media-control] {\n position: absolute;\n top: 0;\n right: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button {\n background-color: transparent;\n border: 0;\n margin: 0 6px;\n padding: 0;\n cursor: pointer;\n display: inline-block;\n width: 32px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg {\n width: 100%;\n height: 22px; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button:focus {\n outline: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-play] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-pause] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-stop] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-fullscreen] {\n float: right;\n background-color: transparent;\n border: 0;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator] {\n background-color: transparent;\n border: 0;\n cursor: default;\n display: none;\n float: right;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled {\n display: block;\n opacity: 1.0; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled:hover {\n opacity: 1.0;\n text-shadow: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playpause] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playstop] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position], .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n display: inline-block;\n font-size: 10px;\n color: white;\n cursor: default;\n line-height: 32px;\n position: relative; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position] {\n margin: 0 6px 0 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n color: rgba(255, 255, 255, 0.5);\n margin-right: 6px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration]:before {\n content: \"|\";\n margin-right: 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] {\n position: absolute;\n top: -20px;\n left: 0;\n display: inline-block;\n vertical-align: middle;\n width: 100%;\n height: 25px;\n cursor: pointer; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] {\n width: 100%;\n height: 1px;\n position: relative;\n top: 12px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-1[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar]:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled {\n cursor: default; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n position: absolute;\n transform: translateX(-50%);\n top: 2px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] .bar-scrubber-icon[data-seekbar] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] {\n float: right;\n display: inline-block;\n height: 32px;\n cursor: pointer;\n margin: 0 6px;\n box-sizing: border-box; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] {\n float: left;\n bottom: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] {\n background-color: transparent;\n border: 0;\n box-sizing: content-box;\n width: 32px;\n height: 32px;\n opacity: 0.5; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume]:hover {\n opacity: 0.75; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg {\n height: 24px;\n position: relative;\n top: 3px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume].muted svg {\n margin-left: 2px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] {\n float: left;\n position: relative;\n overflow: hidden;\n top: 6px;\n width: 42px;\n height: 18px;\n padding: 3px 0;\n transition: width .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] {\n height: 1px;\n position: relative;\n top: 7px;\n margin: 0 3px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-1[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-2[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-hover[data-volume] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] {\n position: absolute;\n transform: translateX(-50%);\n top: 0px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] .bar-scrubber-icon[data-volume] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume] {\n float: left;\n width: 4px;\n padding-left: 2px;\n height: 12px;\n opacity: 0.5;\n box-shadow: inset 2px 0 0 white;\n transition: transform .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume].fill {\n box-shadow: inset 2px 0 0 #fff;\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:nth-of-type(1) {\n padding-left: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:hover {\n transform: scaleY(1.5); }\n .media-control[data-media-control].w320 .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume].volume-bar-hide {\n width: 0;\n height: 12px;\n top: 9px;\n padding: 0; }\n"; styleInject(css$3); var mediaControlHTML = "
\n
\n <% var renderBar = function(name) { %>\n
>\n
>\n
>
\n
>
\n
>
\n
\n
>\n
>
\n
\n
\n <% }; %>\n <% var renderSegmentedBar = function(name, segments) {\n segments = segments || 10; %>\n
>\n <% for (var i = 0; i < segments; i++) { %>\n
>
\n <% } %>\n
\n <% }; %>\n <% var renderDrawer = function(name, renderContent) { %>\n
>\n
>\n
>
\n >\n
\n <% renderContent(name); %>\n
\n <% }; %>\n <% var renderIndicator = function(name) { %>\n
>
\n <% }; %>\n <% var renderButton = function(name) { %>\n \n <% }; %>\n <% var templates = {\n bar: renderBar,\n segmentedBar: renderSegmentedBar,\n };\n var render = function(settingsList) {\n settingsList.forEach(function(setting) {\n if(setting === \"seekbar\") {\n renderBar(setting);\n } else if (setting === \"volume\") {\n renderDrawer(setting, settings.volumeBarTemplate ? templates[settings.volumeBarTemplate] : function(name) { return renderSegmentedBar(name); });\n } else if (setting === \"duration\" || setting === \"position\") {\n renderIndicator(setting);\n } else {\n renderButton(setting);\n }\n });\n }; %>\n <% if (settings.default && settings.default.length) { %>\n
\n <% render(settings.default); %>\n
\n <% } %>\n <% if (settings.left && settings.left.length) { %>\n
\n <% render(settings.left); %>\n
\n <% } %>\n <% if (settings.right && settings.right.length) { %>\n
\n <% render(settings.right); %>\n
\n <% } %>\n
\n"; @@ -3146,7 +3133,7 @@ var WaterMarkPlugin = /*#__PURE__*/function (_UIContainerPlugin) { }(UIContainerPlugin); // Copyright 2014 Globo.com Player authors. All rights reserved. -var version = "0.4.8"; +var version = "0.4.9"; var Plugins = { ClickToPause: ClickToPausePlugin, ClosedCaptions: ClosedCaptions, diff --git a/dist/clappr-plugins.js b/dist/clappr-plugins.js index 371fc0f4..0e3f91e2 100644 --- a/dist/clappr-plugins.js +++ b/dist/clappr-plugins.js @@ -243,24 +243,11 @@ _createClass(ClosedCaptions, [{ key: "bindEvents", value: function bindEvents() { - this.bindCoreEvents(); + this.listenTo(this.core, core.Events.CORE_ACTIVE_CONTAINER_CHANGED, this.containerChanged); + this.listenTo(this.core.mediaControl, core.Events.MEDIACONTROL_RENDERED, this.render); + this.listenTo(this.core.mediaControl, core.Events.MEDIACONTROL_HIDE, this.hideContextMenu); this.bindContainerEvents(); } - }, { - key: "bindCoreEvents", - value: function bindCoreEvents() { - var _this2 = this; - - if (this.core.mediaControl.settings) { - this.listenTo(this.core, core.Events.CORE_ACTIVE_CONTAINER_CHANGED, this.containerChanged); - this.listenTo(this.core.mediaControl, core.Events.MEDIACONTROL_RENDERED, this.render); - this.listenTo(this.core.mediaControl, core.Events.MEDIACONTROL_HIDE, this.hideContextMenu); - } else { - setTimeout(function () { - return _this2.bindCoreEvents(); - }, 100); - } - } }, { key: "bindContainerEvents", value: function bindContainerEvents() { @@ -1510,7 +1497,7 @@ Kibo: Kibo }; - var css$3 = ".media-control-notransition {\n transition: none !important; }\n\n.media-control[data-media-control] {\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 9999;\n pointer-events: none; }\n .media-control[data-media-control].dragging {\n pointer-events: auto;\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control].dragging * {\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control] .media-control-background[data-background] {\n position: absolute;\n height: 40%;\n width: 100%;\n bottom: 0;\n background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));\n transition: opacity 0.6s ease-out; }\n .media-control[data-media-control] .media-control-icon {\n line-height: 0;\n letter-spacing: 0;\n speak: none;\n color: #fff;\n opacity: 0.5;\n vertical-align: middle;\n text-align: left;\n transition: all 0.1s ease; }\n .media-control[data-media-control] .media-control-icon:hover {\n color: white;\n opacity: 0.75;\n text-shadow: rgba(255, 255, 255, 0.8) 0 0 5px; }\n .media-control[data-media-control].media-control-hide .media-control-background[data-background] {\n opacity: 0; }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] {\n bottom: -50px; }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] {\n position: absolute;\n bottom: 7px;\n width: 100%;\n height: 32px;\n font-size: 0;\n vertical-align: middle;\n pointer-events: auto;\n transition: bottom 0.4s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-left-panel[data-media-control] {\n position: absolute;\n top: 0;\n left: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-center-panel[data-media-control] {\n height: 100%;\n text-align: center;\n line-height: 32px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-right-panel[data-media-control] {\n position: absolute;\n top: 0;\n right: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button {\n background-color: transparent;\n border: 0;\n margin: 0 6px;\n padding: 0;\n cursor: pointer;\n display: inline-block;\n width: 32px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg {\n width: 100%;\n height: 22px; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button:focus {\n outline: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-play] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-pause] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-stop] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-fullscreen] {\n float: right;\n background-color: transparent;\n border: 0;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator] {\n background-color: transparent;\n border: 0;\n cursor: default;\n display: none;\n float: right;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled {\n display: block;\n opacity: 1.0; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled:hover {\n opacity: 1.0;\n text-shadow: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playpause] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playstop] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position], .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n display: inline-block;\n font-size: 10px;\n color: white;\n cursor: default;\n line-height: 32px;\n position: relative; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position] {\n margin: 0 6px 0 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n color: rgba(255, 255, 255, 0.5);\n margin-right: 6px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration]:before {\n content: \"|\";\n margin-right: 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] {\n position: absolute;\n top: -20px;\n left: 0;\n display: inline-block;\n vertical-align: middle;\n width: 100%;\n height: 25px;\n cursor: pointer; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] {\n width: 100%;\n height: 1px;\n position: relative;\n top: 12px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-1[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar]:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled {\n cursor: default; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n position: absolute;\n transform: translateX(-50%);\n top: 2px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] .bar-scrubber-icon[data-seekbar] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] {\n float: right;\n display: inline-block;\n height: 32px;\n cursor: pointer;\n margin: 0 6px;\n box-sizing: border-box; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] {\n float: left;\n bottom: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] {\n background-color: transparent;\n border: 0;\n box-sizing: content-box;\n width: 32px;\n height: 32px;\n opacity: 0.5; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume]:hover {\n opacity: 0.75; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg {\n height: 24px;\n position: relative;\n top: 3px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume].muted svg {\n margin-left: 2px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] {\n float: left;\n position: relative;\n overflow: hidden;\n top: 6px;\n width: 42px;\n height: 18px;\n padding: 3px 0;\n transition: width .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] {\n height: 1px;\n position: relative;\n top: 7px;\n margin: 0 3px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-1[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-2[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-hover[data-volume] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] {\n position: absolute;\n transform: translateX(-50%);\n top: 0px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] .bar-scrubber-icon[data-volume] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume] {\n float: left;\n width: 4px;\n padding-left: 2px;\n height: 12px;\n opacity: 0.5;\n box-shadow: inset 2px 0 0 white;\n transition: transform .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume].fill {\n box-shadow: inset 2px 0 0 #fff;\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:nth-of-type(1) {\n padding-left: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:hover {\n transform: scaleY(1.5); }\n .media-control[data-media-control].w320 .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume].volume-bar-hide {\n width: 0;\n height: 12px;\n top: 9px;\n padding: 0; }\n"; + var css$3 = ".media-control-notransition {\n transition: none !important; }\n\n.media-control[data-media-control] {\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 9999;\n pointer-events: none; }\n .media-control[data-media-control].dragging {\n pointer-events: auto;\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control].dragging * {\n cursor: -webkit-grabbing !important;\n cursor: grabbing !important;\n cursor: url(\"closed-hand.cur\"), move; }\n .media-control[data-media-control] .media-control-background[data-background] {\n position: absolute;\n height: 40%;\n width: 100%;\n bottom: 0;\n background: linear-gradient(transparent, rgba(0, 0, 0, 0.9));\n will-change: transform, opacity;\n transition: opacity 0.6s ease-out; }\n .media-control[data-media-control] .media-control-icon {\n line-height: 0;\n letter-spacing: 0;\n speak: none;\n color: #fff;\n opacity: 0.5;\n vertical-align: middle;\n text-align: left;\n transition: all 0.1s ease; }\n .media-control[data-media-control] .media-control-icon:hover {\n color: white;\n opacity: 0.75;\n text-shadow: rgba(255, 255, 255, 0.8) 0 0 5px; }\n .media-control[data-media-control].media-control-hide .media-control-background[data-background] {\n opacity: 0; }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] {\n transform: translateY(50px); }\n .media-control[data-media-control].media-control-hide .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] {\n position: absolute;\n transform: translateY(-7px);\n bottom: 0;\n width: 100%;\n height: 32px;\n font-size: 0;\n vertical-align: middle;\n pointer-events: auto;\n transition: bottom 0.4s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-left-panel[data-media-control] {\n position: absolute;\n top: 0;\n left: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-center-panel[data-media-control] {\n height: 100%;\n text-align: center;\n line-height: 32px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-right-panel[data-media-control] {\n position: absolute;\n top: 0;\n right: 4px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button {\n background-color: transparent;\n border: 0;\n margin: 0 6px;\n padding: 0;\n cursor: pointer;\n display: inline-block;\n width: 32px;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg {\n width: 100%;\n height: 22px; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button:focus {\n outline: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-play] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-pause] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-stop] {\n float: left;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-fullscreen] {\n float: right;\n background-color: transparent;\n border: 0;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator] {\n background-color: transparent;\n border: 0;\n cursor: default;\n display: none;\n float: right;\n height: 100%; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled {\n display: block;\n opacity: 1.0; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-hd-indicator].enabled:hover {\n opacity: 1.0;\n text-shadow: none; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playpause] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] button.media-control-button[data-playstop] {\n float: left; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position], .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n display: inline-block;\n font-size: 10px;\n color: white;\n cursor: default;\n line-height: 32px;\n position: relative; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-position] {\n margin: 0 6px 0 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration] {\n color: rgba(255, 255, 255, 0.5);\n margin-right: 6px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .media-control-indicator[data-duration]:before {\n content: \"|\";\n margin-right: 7px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] {\n position: absolute;\n top: -20px;\n left: 0;\n display: inline-block;\n vertical-align: middle;\n width: 100%;\n height: 25px;\n cursor: pointer; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] {\n width: 100%;\n height: 1px;\n position: relative;\n top: 12px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-1[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar]:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled {\n cursor: default; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar].seek-disabled:hover .bar-background[data-seekbar] .bar-hover[data-seekbar] {\n opacity: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] {\n position: absolute;\n transform: translateX(-50%);\n top: 2px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-scrubber[data-seekbar] .bar-scrubber-icon[data-seekbar] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] {\n float: right;\n display: inline-block;\n height: 32px;\n cursor: pointer;\n margin: 0 6px;\n box-sizing: border-box; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] {\n float: left;\n bottom: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] {\n background-color: transparent;\n border: 0;\n box-sizing: content-box;\n width: 32px;\n height: 32px;\n opacity: 0.5; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume]:hover {\n opacity: 0.75; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg {\n height: 24px;\n position: relative;\n top: 3px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume] svg path {\n fill: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .drawer-icon-container[data-volume] .drawer-icon[data-volume].muted svg {\n margin-left: 2px; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] {\n float: left;\n position: relative;\n overflow: hidden;\n top: 6px;\n width: 42px;\n height: 18px;\n padding: 3px 0;\n transition: width .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] {\n height: 1px;\n position: relative;\n top: 7px;\n margin: 0 3px;\n background-color: #666666; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-1[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #c2c2c2;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-fill-2[data-volume] {\n position: absolute;\n top: 0;\n left: 0;\n width: 0;\n height: 100%;\n background-color: #005aff;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-background[data-volume] .bar-hover[data-volume] {\n opacity: 0;\n position: absolute;\n top: -3px;\n width: 5px;\n height: 7px;\n background-color: rgba(255, 255, 255, 0.5);\n transition: opacity 0.1s ease; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] {\n position: absolute;\n transform: translateX(-50%);\n top: 0px;\n left: 0;\n width: 20px;\n height: 20px;\n opacity: 1;\n transition: all 0.1s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .bar-scrubber[data-volume] .bar-scrubber-icon[data-volume] {\n position: absolute;\n left: 6px;\n top: 6px;\n width: 8px;\n height: 8px;\n border-radius: 10px;\n box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.2);\n background-color: white; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume] {\n float: left;\n width: 4px;\n padding-left: 2px;\n height: 12px;\n opacity: 0.5;\n box-shadow: inset 2px 0 0 white;\n transition: transform .2s ease-out; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume].fill {\n box-shadow: inset 2px 0 0 #fff;\n opacity: 1; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:nth-of-type(1) {\n padding-left: 0; }\n .media-control[data-media-control] .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume] .segmented-bar-element[data-volume]:hover {\n transform: scaleY(1.5); }\n .media-control[data-media-control].w320 .media-control-layer[data-controls] .drawer-container[data-volume] .bar-container[data-volume].volume-bar-hide {\n width: 0;\n height: 12px;\n top: 9px;\n padding: 0; }\n"; styleInject(css$3); var mediaControlHTML = "
\n
\n <% var renderBar = function(name) { %>\n
>\n
>\n
>
\n
>
\n
>
\n
\n
>\n
>
\n
\n
\n <% }; %>\n <% var renderSegmentedBar = function(name, segments) {\n segments = segments || 10; %>\n
>\n <% for (var i = 0; i < segments; i++) { %>\n
>
\n <% } %>\n
\n <% }; %>\n <% var renderDrawer = function(name, renderContent) { %>\n
>\n
>\n
>
\n >\n
\n <% renderContent(name); %>\n
\n <% }; %>\n <% var renderIndicator = function(name) { %>\n
>
\n <% }; %>\n <% var renderButton = function(name) { %>\n \n <% }; %>\n <% var templates = {\n bar: renderBar,\n segmentedBar: renderSegmentedBar,\n };\n var render = function(settingsList) {\n settingsList.forEach(function(setting) {\n if(setting === \"seekbar\") {\n renderBar(setting);\n } else if (setting === \"volume\") {\n renderDrawer(setting, settings.volumeBarTemplate ? templates[settings.volumeBarTemplate] : function(name) { return renderSegmentedBar(name); });\n } else if (setting === \"duration\" || setting === \"position\") {\n renderIndicator(setting);\n } else {\n renderButton(setting);\n }\n });\n }; %>\n <% if (settings.default && settings.default.length) { %>\n
\n <% render(settings.default); %>\n
\n <% } %>\n <% if (settings.left && settings.left.length) { %>\n
\n <% render(settings.left); %>\n
\n <% } %>\n <% if (settings.right && settings.right.length) { %>\n
\n <% render(settings.right); %>\n
\n <% } %>\n
\n"; @@ -3150,7 +3137,7 @@ }(core.UIContainerPlugin); // Copyright 2014 Globo.com Player authors. All rights reserved. - var version = "0.4.8"; + var version = "0.4.9"; var Plugins = { ClickToPause: ClickToPausePlugin, ClosedCaptions: ClosedCaptions, diff --git a/dist/clappr-plugins.min.js b/dist/clappr-plugins.min.js index a6311b4c..b8f5e26f 100644 --- a/dist/clappr-plugins.min.js +++ b/dist/clappr-plugins.min.js @@ -1 +1 @@ -!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@clappr/core")):"function"==typeof define&&define.amd?define(["exports","@clappr/core"],e):e((t=t||self).ClapprPlugins={},t.Clappr)}(this,(function(t,e){"use strict";function n(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){for(var n=0;n ul {\n list-style-type: none;\n position: absolute;\n bottom: 25px;\n border: 1px solid black;\n display: none;\n background-color: #e6e6e6; }\n .cc-controls[data-cc-controls] li {\n font-size: 10px; }\n .cc-controls[data-cc-controls] li[data-title] {\n background-color: #c3c2c2;\n padding: 5px; }\n .cc-controls[data-cc-controls] li a {\n color: #444;\n padding: 2px 10px;\n display: block;\n text-decoration: none; }\n .cc-controls[data-cc-controls] li a:hover {\n background-color: #555;\n color: white; }\n .cc-controls[data-cc-controls] li a:hover a {\n color: white;\n text-decoration: none; }\n .cc-controls[data-cc-controls] li.current a {\n color: #f00; }\n");var u=function(t){function i(t){var e;n(this,i),e=l(this,r(i).call(this,t));var a=t.options.closedCaptionsConfig;return e._title=a&&a.title?a.title:null,e._ariaLabel=a&&a.ariaLabel?a.ariaLabel:"cc-button",e._labelCb=a&&a.labelCallback&&"function"==typeof a.labelCallback?a.labelCallback:function(t){return t.name},e}return o(i,t),a(i,[{key:"name",get:function(){return"closed_captions"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('\n\n')}},{key:"events",get:function(){return{"click [data-cc-button]":"toggleContextMenu","click [data-cc-select]":"onTrackSelect"}}},{key:"attributes",get:function(){return{class:"cc-controls","data-cc-controls":""}}}]),a(i,[{key:"bindEvents",value:function(){this.bindCoreEvents(),this.bindContainerEvents()}},{key:"bindCoreEvents",value:function(){var t=this;this.core.mediaControl.settings?(this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.containerChanged),this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_RENDERED,this.render),this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_HIDE,this.hideContextMenu)):setTimeout((function(){return t.bindCoreEvents()}),100)}},{key:"bindContainerEvents",value:function(){this.container=this.core.activeContainer,this.container&&(this.listenTo(this.container,e.Events.CONTAINER_SUBTITLE_AVAILABLE,this.onSubtitleAvailable),this.listenTo(this.container,e.Events.CONTAINER_SUBTITLE_CHANGED,this.onSubtitleChanged),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onContainerStop))}},{key:"onContainerStop",value:function(){this.ccAvailable(!1)}},{key:"containerChanged",value:function(){this.ccAvailable(!1),this.stopListening(),this.bindEvents()}},{key:"onSubtitleAvailable",value:function(){this.renderCcButton(),this.ccAvailable(!0)}},{key:"onSubtitleChanged",value:function(t){this.setCurrentContextMenuElement(t.id)}},{key:"onTrackSelect",value:function(t){var e=parseInt(t.target.dataset.ccSelect,10);return this.container.closedCaptionsTrackId=e,this.hideContextMenu(),t.stopPropagation(),!1}},{key:"ccAvailable",value:function(t){var e=t?"addClass":"removeClass";this.$el[e]("available")}},{key:"toggleContextMenu",value:function(){this.$el.find("ul").toggle()}},{key:"hideContextMenu",value:function(){this.$el.find("ul").hide()}},{key:"contextMenuElement",value:function(t){return this.$el.find("ul a"+(isNaN(t)?"":'[data-cc-select="'+t+'"]')).parent()}},{key:"setCurrentContextMenuElement",value:function(t){if(this._trackId!==t){this.contextMenuElement().removeClass("current"),this.contextMenuElement(t).addClass("current");var e=t>-1?"addClass":"removeClass";this.$ccButton[e]("enabled"),this._trackId=t}}},{key:"renderCcButton",value:function(){for(var t=this.container?this.container.closedCaptionsTracks:[],e=0;e\n\n'),this.$el.append(this.style)}},{key:"render",value:function(){this.renderCcButton();var t=this.core.mediaControl.$el.find("button[data-fullscreen]");return t[0]?this.$el.insertAfter(t):this.core.mediaControl.$el.find(".media-control-right-panel[data-media-control]").prepend(this.$el),this}}]),i}(e.UICorePlugin);h('.dvr-controls[data-dvr-controls] {\n display: inline-block;\n float: left;\n color: #fff;\n line-height: 32px;\n font-size: 10px;\n font-weight: bold;\n margin-left: 6px; }\n .dvr-controls[data-dvr-controls] .live-info {\n cursor: default;\n font-family: "Roboto", "Open Sans", Arial, sans-serif;\n text-transform: uppercase; }\n .dvr-controls[data-dvr-controls] .live-info:before {\n content: "";\n display: inline-block;\n position: relative;\n width: 7px;\n height: 7px;\n border-radius: 3.5px;\n margin-right: 3.5px;\n background-color: #ff0101; }\n .dvr-controls[data-dvr-controls] .live-info.disabled {\n opacity: 0.3; }\n .dvr-controls[data-dvr-controls] .live-info.disabled:before {\n background-color: #fff; }\n .dvr-controls[data-dvr-controls] .live-button {\n cursor: pointer;\n outline: none;\n display: none;\n border: 0;\n color: #fff;\n background-color: transparent;\n height: 32px;\n padding: 0;\n opacity: 0.7;\n font-family: "Roboto", "Open Sans", Arial, sans-serif;\n text-transform: uppercase;\n transition: all 0.1s ease; }\n .dvr-controls[data-dvr-controls] .live-button:before {\n content: "";\n display: inline-block;\n position: relative;\n width: 7px;\n height: 7px;\n border-radius: 3.5px;\n margin-right: 3.5px;\n background-color: #fff; }\n .dvr-controls[data-dvr-controls] .live-button:hover {\n opacity: 1;\n text-shadow: rgba(255, 255, 255, 0.75) 0 0 5px; }\n\n.dvr .dvr-controls[data-dvr-controls] .live-info {\n display: none; }\n\n.dvr .dvr-controls[data-dvr-controls] .live-button {\n display: block; }\n\n.dvr.media-control.live[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n background-color: #005aff; }\n\n.media-control.live[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n background-color: #ff0101; }\n');var p=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).settingsUpdate(),e}return o(i,t),a(i,[{key:"template",get:function(){return e.template('
<%= live %>
\n\n')}},{key:"name",get:function(){return"dvr_controls"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"events",get:function(){return{"click .live-button":"click"}}},{key:"attributes",get:function(){return{class:"dvr-controls","data-dvr-controls":""}}}]),a(i,[{key:"bindEvents",value:function(){this.bindCoreEvents(),this.bindContainerEvents()}},{key:"bindCoreEvents",value:function(){var t=this;this.core.mediaControl.settings?(this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_CONTAINERCHANGED,this.containerChanged),this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_RENDERED,this.settingsUpdate),this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.render)):setTimeout((function(){return t.bindCoreEvents()}),100)}},{key:"bindContainerEvents",value:function(){this.core.activeContainer&&(this.listenToOnce(this.core.activeContainer,e.Events.CONTAINER_TIMEUPDATE,this.render),this.listenTo(this.core.activeContainer,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.dvrChanged))}},{key:"containerChanged",value:function(){this.stopListening(),this.bindEvents()}},{key:"dvrChanged",value:function(t){this.core.getPlaybackType()===e.Playback.LIVE&&(this.settingsUpdate(),this.core.mediaControl.$el.addClass("live"),t?(this.core.mediaControl.$el.addClass("dvr"),this.core.mediaControl.$el.find(".media-control-indicator[data-position], .media-control-indicator[data-duration]").hide()):this.core.mediaControl.$el.removeClass("dvr"))}},{key:"click",value:function(){var t=this.core.mediaControl,e=t.container;e.isPlaying()||e.play(),t.$el.hasClass("dvr")&&e.seek(e.getDuration())}},{key:"settingsUpdate",value:function(){var t=this;this.stopListening(),this.core.mediaControl.$el.removeClass("live"),this.shouldRender()&&(this.render(),this.$el.click((function(){return t.click()}))),this.bindEvents()}},{key:"shouldRender",value:function(){return(void 0===this.core.options.useDvrControls||!!this.core.options.useDvrControls)&&this.core.getPlaybackType()===e.Playback.LIVE}},{key:"render",value:function(){return this.$el.html(this.template({live:this.core.i18n.t("live"),backToLive:this.core.i18n.t("back_to_live")})),this.shouldRender()&&(this.core.mediaControl.$el.addClass("live"),this.core.mediaControl.$(".media-control-left-panel[data-media-control]").append(this.$el)),this}}]),i}(e.UICorePlugin),m=function(t){function i(){return n(this,i),l(this,r(i).apply(this,arguments))}return o(i,t),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.containerChanged);var t=this.core.activeContainer;t&&(this.listenTo(t,e.Events.CONTAINER_ENDED,this.ended),this.listenTo(t,e.Events.CONTAINER_STOP,this.ended))}},{key:"containerChanged",value:function(){this.stopListening(),this.bindEvents()}},{key:"ended",value:function(){(void 0===this.core.options.exitFullscreenOnEnd||this.core.options.exitFullscreenOnEnd)&&this.core.isFullscreen()&&this.core.toggleFullscreen()}},{key:"name",get:function(){return"end_video"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}}]),i}(e.CorePlugin);h("div.player-error-screen {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n color: #CCCACA;\n position: absolute;\n top: 0;\n height: 100%;\n width: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n z-index: 2000;\n display: flex;\n flex-direction: column;\n justify-content: center; }\n div.player-error-screen__content[data-error-screen] {\n font-size: 14px;\n color: #CCCACA;\n margin-top: 45px; }\n div.player-error-screen__title[data-error-screen] {\n font-weight: bold;\n line-height: 30px;\n font-size: 18px; }\n div.player-error-screen__message[data-error-screen] {\n width: 90%;\n margin: 0 auto; }\n div.player-error-screen__code[data-error-screen] {\n font-size: 13px;\n margin-top: 15px; }\n div.player-error-screen__reload {\n cursor: pointer;\n width: 30px;\n margin: 15px auto 0; }\n");var v=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).options.disableErrorScreen?l(e,e.disable()):e}return o(i,t),a(i,[{key:"name",get:function(){return"error_screen"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('
\n <% if (icon) { %>\n
<%= icon %>
\n <% } %>\n
<%= title %>
\n
<%= message %>
\n
Error code: <%= code %>
\n
<%= reloadIcon %>
\n
\n')}},{key:"container",get:function(){return this.core.getCurrentContainer()}},{key:"attributes",get:function(){return{class:"player-error-screen","data-error-screen":""}}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.core,e.Events.ERROR,this.onError),this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.onContainerChanged)}},{key:"bindReload",value:function(){this.reloadButton=this.$el.find(".player-error-screen__reload"),this.reloadButton&&this.reloadButton.on("click",this.reload.bind(this))}},{key:"reload",value:function(){var t=this;this.listenToOnce(this.core,e.Events.CORE_READY,(function(){return t.container.play()})),this.core.load(this.options.sources,this.options.mimeType),this.unbindReload()}},{key:"unbindReload",value:function(){this.reloadButton&&this.reloadButton.off("click")}},{key:"onContainerChanged",value:function(){this.err=null,this.unbindReload(),this.hide()}},{key:"onError",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};t.level===e.PlayerError.Levels.FATAL&&(this.err=t,this.container.disableMediaControl(),this.container.stop(),this.show())}},{key:"show",value:function(){this.render(),this.$el.show()}},{key:"hide",value:function(){this.$el.hide()}},{key:"render",value:function(){if(this.err)return this.$el.html(this.template({title:this.err.UI.title,message:this.err.UI.message,code:this.err.code,icon:this.err.UI.icon||"",reloadIcon:'\n \n \n'})),this.core.$el.append(this.el),this.bindReload(),this}}]),i}(e.UICorePlugin),f='\n \n',g='\n \n',b=e.$('link[rel="shortcut icon"]'),y=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t)))._container=null,e.configure(),e}return o(i,t),a(i,[{key:"name",get:function(){return"favicon"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"oldIcon",get:function(){return b}}]),a(i,[{key:"configure",value:function(){this.core.options.changeFavicon?this.enabled||(this.stopListening(this.core,e.Events.CORE_OPTIONS_CHANGE),this.enable()):this.enabled&&(this.disable(),this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.configure))}},{key:"bindEvents",value:function(){this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.configure),this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.containerChanged),this.core.activeContainer&&this.containerChanged()}},{key:"containerChanged",value:function(){this._container&&this.stopListening(this._container),this._container=this.core.activeContainer,this.listenTo(this._container,e.Events.CONTAINER_PLAY,this.setPlayIcon),this.listenTo(this._container,e.Events.CONTAINER_PAUSE,this.setPauseIcon),this.listenTo(this._container,e.Events.CONTAINER_STOP,this.resetIcon),this.listenTo(this._container,e.Events.CONTAINER_ENDED,this.resetIcon),this.listenTo(this._container,e.Events.CONTAINER_ERROR,this.resetIcon),this.resetIcon()}},{key:"disable",value:function(){c(r(i.prototype),"disable",this).call(this),this.resetIcon()}},{key:"destroy",value:function(){c(r(i.prototype),"destroy",this).call(this),this.resetIcon()}},{key:"createIcon",value:function(t){var n=e.$("");n[0].width=16,n[0].height=16;var i=n[0].getContext("2d");i.fillStyle="#000";var a=e.$(t).find("path").attr("d"),o=new Path2D(a);i.fill(o);var r=e.$('');return r.attr("href",n[0].toDataURL("image/png")),r}},{key:"setPlayIcon",value:function(){this.playIcon||(this.playIcon=this.createIcon(f)),this.changeIcon(this.playIcon)}},{key:"setPauseIcon",value:function(){this.pauseIcon||(this.pauseIcon=this.createIcon(g)),this.changeIcon(this.pauseIcon)}},{key:"resetIcon",value:function(){e.$('link[rel="shortcut icon"]').remove(),e.$("head").append(this.oldIcon)}},{key:"changeIcon",value:function(t){t&&(e.$('link[rel="shortcut icon"]').remove(),e.$("head").append(t))}}]),i}(e.CorePlugin),k=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).container.options.gaAccount&&(e.account=e.container.options.gaAccount,e.trackerName=e.container.options.gaTrackerName?e.container.options.gaTrackerName+".":"Clappr.",e.domainName=e.container.options.gaDomainName,e.currentHDState=void 0,e.embedScript()),e}return o(i,t),a(i,[{key:"name",get:function(){return"google_analytics"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}}]),a(i,[{key:"embedScript",value:function(){var t=this;if(window._gat)this.addEventListeners();else{var e=document.createElement("script");e.setAttribute("type","text/javascript"),e.setAttribute("async","async"),e.setAttribute("src","//www.google-analytics.com/ga.js"),e.onload=function(){return t.addEventListeners()},document.body.appendChild(e)}}},{key:"addEventListeners",value:function(){var t=this;this.container&&(this.listenTo(this.container,e.Events.CONTAINER_READY,this.onReady),this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_PAUSE,this.onPause),this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.onEnded),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERING,this.onBuffering),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERFULL,this.onBufferFull),this.listenTo(this.container,e.Events.CONTAINER_ERROR,this.onError),this.listenTo(this.container,e.Events.CONTAINER_PLAYBACKSTATE,this.onPlaybackChanged),this.listenTo(this.container,e.Events.CONTAINER_VOLUME,(function(e){return t.onVolumeChanged(e)})),this.listenTo(this.container,e.Events.CONTAINER_SEEK,(function(e){return t.onSeek(e)})),this.listenTo(this.container,e.Events.CONTAINER_FULL_SCREEN,this.onFullscreen),this.listenTo(this.container,e.Events.CONTAINER_HIGHDEFINITIONUPDATE,this.onHD),this.listenTo(this.container,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.onDVR)),_gaq.push([this.trackerName+"_setAccount",this.account]),this.domainName&&_gaq.push([this.trackerName+"_setDomainName",this.domainName])}},{key:"onReady",value:function(){this.push(["Video","Playback",this.container.playback.name])}},{key:"onPlay",value:function(){this.push(["Video","Play",this.container.playback.src])}},{key:"onStop",value:function(){this.push(["Video","Stop",this.container.playback.src])}},{key:"onEnded",value:function(){this.push(["Video","Ended",this.container.playback.src])}},{key:"onBuffering",value:function(){this.push(["Video","Buffering",this.container.playback.src])}},{key:"onBufferFull",value:function(){this.push(["Video","Bufferfull",this.container.playback.src])}},{key:"onError",value:function(){this.push(["Video","Error",this.container.playback.src])}},{key:"onHD",value:function(t){var e=t?"ON":"OFF";e!==this.currentHDState&&(this.currentHDState=e,this.push(["Video","HD - "+e,this.container.playback.src]))}},{key:"onPlaybackChanged",value:function(t){null!==t.type&&this.push(["Video","Playback Type - "+t.type,this.container.playback.src])}},{key:"onDVR",value:function(t){var e=t?"ON":"OFF";this.push(["Interaction","DVR - "+e,this.container.playback.src])}},{key:"onPause",value:function(){this.push(["Video","Pause",this.container.playback.src])}},{key:"onSeek",value:function(){this.push(["Video","Seek",this.container.playback.src])}},{key:"onVolumeChanged",value:function(){this.push(["Interaction","Volume",this.container.playback.src])}},{key:"onFullscreen",value:function(){this.push(["Interaction","Fullscreen",this.container.playback.src])}},{key:"push",value:function(t){var e=[this.trackerName+"_trackEvent"].concat(t);_gaq.push(e)}}]),i}(e.ContainerPlugin),E="undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{};function C(){throw new Error("setTimeout has not been defined")}function T(){throw new Error("clearTimeout has not been defined")}var w=C,I=T;function N(t){if(w===setTimeout)return setTimeout(t,0);if((w===C||!w)&&setTimeout)return w=setTimeout,setTimeout(t,0);try{return w(t,0)}catch(e){try{return w.call(null,t,0)}catch(e){return w.call(this,t,0)}}}"function"==typeof E.setTimeout&&(w=setTimeout),"function"==typeof E.clearTimeout&&(I=clearTimeout);var O,A=[],S=!1,_=-1;function R(){S&&O&&(S=!1,O.length?A=O.concat(A):_=-1,A.length&&x())}function x(){if(!S){var t=N(R);S=!0;for(var e=A.length;e;){for(O=A,A=[];++_1)for(var n=1;n\n
\n <% var renderBar = function(name) { %>\n
>\n
>\n
>
\n
>
\n
>
\n
\n
>\n
>
\n
\n
\n <% }; %>\n <% var renderSegmentedBar = function(name, segments) {\n segments = segments || 10; %>\n
>\n <% for (var i = 0; i < segments; i++) { %>\n
>
\n <% } %>\n
\n <% }; %>\n <% var renderDrawer = function(name, renderContent) { %>\n
>\n
>\n
>
\n >\n
\n <% renderContent(name); %>\n
\n <% }; %>\n <% var renderIndicator = function(name) { %>\n
>
\n <% }; %>\n <% var renderButton = function(name) { %>\n \n <% }; %>\n <% var templates = {\n bar: renderBar,\n segmentedBar: renderSegmentedBar,\n };\n var render = function(settingsList) {\n settingsList.forEach(function(setting) {\n if(setting === "seekbar") {\n renderBar(setting);\n } else if (setting === "volume") {\n renderDrawer(setting, settings.volumeBarTemplate ? templates[settings.volumeBarTemplate] : function(name) { return renderSegmentedBar(name); });\n } else if (setting === "duration" || setting === "position") {\n renderIndicator(setting);\n } else {\n renderButton(setting);\n }\n });\n }; %>\n <% if (settings.default && settings.default.length) { %>\n
\n <% render(settings.default); %>\n
\n <% } %>\n <% if (settings.left && settings.left.length) { %>\n
\n <% render(settings.left); %>\n
\n <% } %>\n <% if (settings.right && settings.right.length) { %>\n
\n <% render(settings.right); %>\n
\n <% } %>\n
\n')}},{key:"volume",get:function(){return this.container&&this.container.isReady?this.container.volume:this.intendedVolume}},{key:"muted",get:function(){return 0===this.volume}}]),a(i,[{key:"getExternalInterface",value:function(){var t=this;return{setVolume:this.setVolume,getVolume:function(){return t.volume}}}},{key:"bindEvents",value:function(){var t=this;this.stopListening(),this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.onActiveContainerChanged),this.listenTo(this.core,e.Events.CORE_MOUSE_MOVE,this.show),this.listenTo(this.core,e.Events.CORE_MOUSE_LEAVE,(function(){return t.hide(t.options.hideMediaControlDelay)})),this.listenTo(this.core,e.Events.CORE_FULLSCREEN,this.show),this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.configure),this.listenTo(this.core,e.Events.CORE_RESIZE,this.playerResize),this.bindContainerEvents()}},{key:"bindContainerEvents",value:function(){this.container&&(this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.changeTogglePlay),this.listenTo(this.container,e.Events.CONTAINER_PAUSE,this.changeTogglePlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.changeTogglePlay),this.listenTo(this.container,e.Events.CONTAINER_DBLCLICK,this.toggleFullscreen),this.listenTo(this.container,e.Events.CONTAINER_TIMEUPDATE,this.onTimeUpdate),this.listenTo(this.container,e.Events.CONTAINER_PROGRESS,this.updateProgressBar),this.listenTo(this.container,e.Events.CONTAINER_SETTINGSUPDATE,this.settingsUpdate),this.listenTo(this.container,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.settingsUpdate),this.listenTo(this.container,e.Events.CONTAINER_HIGHDEFINITIONUPDATE,this.highDefinitionUpdate),this.listenTo(this.container,e.Events.CONTAINER_MEDIACONTROL_DISABLE,this.disable),this.listenTo(this.container,e.Events.CONTAINER_MEDIACONTROL_ENABLE,this.enable),this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.ended),this.listenTo(this.container,e.Events.CONTAINER_VOLUME,this.onVolumeChanged),this.listenTo(this.container,e.Events.CONTAINER_OPTIONS_CHANGE,this.setInitialVolume),"video"===this.container.playback.el.nodeName.toLowerCase()&&this.listenToOnce(this.container,e.Events.CONTAINER_LOADEDMETADATA,this.onLoadedMetadataOnVideoTag))}},{key:"disable",value:function(){this.userDisabled=!0,this.hide(),this.unbindKeyEvents(),this.$el.hide()}},{key:"enable",value:function(){this.options.chromeless||(this.userDisabled=!1,this.bindKeyEvents(),this.show())}},{key:"play",value:function(){this.container&&this.container.play()}},{key:"pause",value:function(){this.container&&this.container.pause()}},{key:"stop",value:function(){this.container&&this.container.stop()}},{key:"setInitialVolume",value:function(){var t=this.persistConfig?U.restore("volume"):100,e=this.container&&this.container.options||this.options;this.setVolume(e.mute?0:t,!0)}},{key:"onVolumeChanged",value:function(){this.updateVolumeUI()}},{key:"onLoadedMetadataOnVideoTag",value:function(){var t=this.playback&&this.playback.el;!H.fullscreenEnabled()&&t.webkitSupportsFullscreen&&(this.fullScreenOnVideoTagSupported=!0,this.settingsUpdate())}},{key:"updateVolumeUI",value:function(){if(this.rendered){this.$volumeBarContainer.find(".bar-fill-2").css({});var t=this.$volumeBarContainer.width(),e=this.$volumeBarBackground.width(),n=(t-e)/2,i=e*this.volume/100+n;this.$volumeBarFill.css({width:"".concat(this.volume,"%")}),this.$volumeBarScrubber.css({left:i}),this.$volumeBarContainer.find(".segmented-bar-element").removeClass("fill");var a=Math.ceil(this.volume/10);this.$volumeBarContainer.find(".segmented-bar-element").slice(0,a).addClass("fill"),this.$volumeIcon.html(""),this.$volumeIcon.removeClass("muted"),this.muted?(this.$volumeIcon.append('\n \n'),this.$volumeIcon.addClass("muted")):this.$volumeIcon.append(M),this.applyButtonStyle(this.$volumeIcon)}}},{key:"changeTogglePlay",value:function(){this.$playPauseToggle.html(""),this.$playStopToggle.html(""),this.container&&this.container.isPlaying()?(this.$playPauseToggle.append(g),this.$playStopToggle.append(L),this.trigger(e.Events.MEDIACONTROL_PLAYING)):(this.$playPauseToggle.append(f),this.$playStopToggle.append(f),this.trigger(e.Events.MEDIACONTROL_NOTPLAYING),e.Browser.isMobile&&this.show()),this.applyButtonStyle(this.$playPauseToggle),this.applyButtonStyle(this.$playStopToggle)}},{key:"mousemoveOnSeekBar",value:function(t){if(this.settings.seekEnabled){var n=t.pageX-this.$seekBarContainer.offset().left-this.$seekBarHover.width()/2;this.$seekBarHover.css({left:n})}this.trigger(e.Events.MEDIACONTROL_MOUSEMOVE_SEEKBAR,t)}},{key:"mouseleaveOnSeekBar",value:function(t){this.trigger(e.Events.MEDIACONTROL_MOUSELEAVE_SEEKBAR,t)}},{key:"onVolumeClick",value:function(t){this.setVolume(this.getVolumeFromUIEvent(t))}},{key:"mousemoveOnVolumeBar",value:function(t){this.draggingVolumeBar&&this.setVolume(this.getVolumeFromUIEvent(t))}},{key:"playerResize",value:function(t){this.$fullscreenToggle.html("");var e=this.core.isFullscreen()?'\n \n':F;this.$fullscreenToggle.append(e),this.applyButtonStyle(this.$fullscreenToggle),0!==this.$el.find(".media-control").length&&this.$el.removeClass("w320"),(t.width<=320||this.options.hideVolumeBar)&&this.$el.addClass("w320")}},{key:"togglePlayPause",value:function(){return this.container.isPlaying()?this.container.pause():this.container.play(),!1}},{key:"togglePlayStop",value:function(){this.container.isPlaying()?this.container.stop():this.container.play()}},{key:"startSeekDrag",value:function(t){this.settings.seekEnabled&&(this.draggingSeekBar=!0,this.$el.addClass("dragging"),this.$seekBarLoaded.addClass("media-control-notransition"),this.$seekBarPosition.addClass("media-control-notransition"),this.$seekBarScrubber.addClass("media-control-notransition"),t&&t.preventDefault())}},{key:"startVolumeDrag",value:function(t){this.draggingVolumeBar=!0,this.$el.addClass("dragging"),t&&t.preventDefault()}},{key:"stopDrag",value:function(t){this.draggingSeekBar&&this.seek(t),this.$el.removeClass("dragging"),this.$seekBarLoaded.removeClass("media-control-notransition"),this.$seekBarPosition.removeClass("media-control-notransition"),this.$seekBarScrubber.removeClass("media-control-notransition dragging"),this.draggingSeekBar=!1,this.draggingVolumeBar=!1}},{key:"updateDrag",value:function(t){if(this.draggingSeekBar){t.preventDefault();var e=(t.pageX-this.$seekBarContainer.offset().left)/this.$seekBarContainer.width()*100;e=Math.min(100,Math.max(e,0)),this.setSeekPercentage(e)}else this.draggingVolumeBar&&(t.preventDefault(),this.setVolume(this.getVolumeFromUIEvent(t)))}},{key:"getVolumeFromUIEvent",value:function(t){return(t.pageX-this.$volumeBarContainer.offset().left)/this.$volumeBarContainer.width()*100}},{key:"toggleMute",value:function(){this.setVolume(this.muted?100:0)}},{key:"setVolume",value:function(t){var n=this,i=arguments.length>1&&void 0!==arguments[1]&&arguments[1];t=Math.min(100,Math.max(t,0)),this.intendedVolume=t,this.persistConfig&&!i&&U.persist("volume",t);var a=function(){n.container&&n.container.isReady?n.container.setVolume(t):n.listenToOnce(n.container,e.Events.CONTAINER_READY,(function(){n.container.setVolume(t)}))};this.container?a():this.listenToOnce(this,e.Events.MEDIACONTROL_CONTAINERCHANGED,(function(){return a()}))}},{key:"toggleFullscreen",value:function(){this.trigger(e.Events.MEDIACONTROL_FULLSCREEN,this.name),this.container.fullscreen(),this.core.toggleFullscreen(),this.resetUserKeepVisible()}},{key:"onActiveContainerChanged",value:function(){this.fullScreenOnVideoTagSupported=null,this.bindEvents(),this.setInitialVolume(),this.changeTogglePlay(),this.bindContainerEvents(),this.settingsUpdate(),this.container&&this.container.trigger(e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.container.isDvrInUse()),this.container&&this.container.mediaControlDisabled&&this.disable(),this.trigger(e.Events.MEDIACONTROL_CONTAINERCHANGED)}},{key:"showVolumeBar",value:function(){this.hideVolumeId&&clearTimeout(this.hideVolumeId),this.$volumeBarContainer.removeClass("volume-bar-hide")}},{key:"hideVolumeBar",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:400;this.$volumeBarContainer&&(this.draggingVolumeBar?this.hideVolumeId=setTimeout((function(){return t.hideVolumeBar()}),e):(this.hideVolumeId&&clearTimeout(this.hideVolumeId),this.hideVolumeId=setTimeout((function(){return t.$volumeBarContainer.addClass("volume-bar-hide")}),e)))}},{key:"ended",value:function(){this.changeTogglePlay()}},{key:"updateProgressBar",value:function(t){var e=t.start/t.total*100,n=t.current/t.total*100;this.$seekBarLoaded.css({left:"".concat(e,"%"),width:"".concat(n-e,"%")})}},{key:"onTimeUpdate",value:function(t){if(!this.draggingSeekBar){var e=t.current<0?t.total:t.current;this.currentPositionValue=e,this.currentDurationValue=t.total,this.renderSeekBar()}}},{key:"renderSeekBar",value:function(){if(null!==this.currentPositionValue&&null!==this.currentDurationValue){this.currentSeekBarPercentage=100,this.container&&(this.container.getPlaybackType()!==e.Playback.LIVE||this.container.isDvrInUse())&&(this.currentSeekBarPercentage=this.currentPositionValue/this.currentDurationValue*100),this.setSeekPercentage(this.currentSeekBarPercentage);var t=K(this.currentPositionValue),n=K(this.currentDurationValue);t!==this.displayedPosition&&(this.$position.text(t),this.displayedPosition=t),n!==this.displayedDuration&&(this.$duration.text(n),this.displayedDuration=n)}}},{key:"seek",value:function(t){if(this.settings.seekEnabled){var e=(t.pageX-this.$seekBarContainer.offset().left)/this.$seekBarContainer.width()*100;return e=Math.min(100,Math.max(e,0)),this.container&&this.container.seekPercentage(e),this.setSeekPercentage(e),!1}}},{key:"setKeepVisible",value:function(){this.keepVisible=!0}},{key:"resetKeepVisible",value:function(){this.keepVisible=!1}},{key:"setUserKeepVisible",value:function(){this.userKeepVisible=!0}},{key:"resetUserKeepVisible",value:function(){this.userKeepVisible=!1}},{key:"isVisible",value:function(){return!this.$el.hasClass("media-control-hide")}},{key:"show",value:function(t){var n=this;if(!this.disabled){var i=t&&t.clientX!==this.lastMouseX&&t.clientY!==this.lastMouseY;(!t||i||navigator.userAgent.match(/firefox/i))&&(clearTimeout(this.hideId),this.$el.show(),this.trigger(e.Events.MEDIACONTROL_SHOW,this.name),this.container&&this.container.trigger(e.Events.CONTAINER_MEDIACONTROL_SHOW,this.name),this.$el.removeClass("media-control-hide"),this.hideId=setTimeout((function(){return n.hide()}),2e3),t&&(this.lastMouseX=t.clientX,this.lastMouseY=t.clientY));this.updateCursorStyle(!0)}}},{key:"hide",value:function(){var t=this,n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0;if(this.isVisible()){var i=n||2e3;if(clearTimeout(this.hideId),this.disabled||!1!==this.options.hideMediaControl){var a=this.userKeepVisible||this.keepVisible,o=this.draggingSeekBar||this.draggingVolumeBar;if(!this.disabled&&(n||a||o))this.hideId=setTimeout((function(){return t.hide()}),i);else{this.trigger(e.Events.MEDIACONTROL_HIDE,this.name),this.container&&this.container.trigger(e.Events.CONTAINER_MEDIACONTROL_HIDE,this.name),this.$el.addClass("media-control-hide"),this.hideVolumeBar(0);var r=!1;this.updateCursorStyle(r)}}}}},{key:"updateCursorStyle",value:function(t){t?this.core.$el.removeClass("nocursor"):this.core.isFullscreen()&&this.core.$el.addClass("nocursor")}},{key:"settingsUpdate",value:function(){var t=this.getSettings();!t||this.fullScreenOnVideoTagSupported||H.fullscreenEnabled()||(t.default&&Y(t.default,"fullscreen"),t.left&&Y(t.left,"fullscreen"),t.right&&Y(t.right,"fullscreen")),JSON.stringify(this.settings)!==JSON.stringify(t)&&(this.settings=t,this.render())}},{key:"getSettings",value:function(){return e.$.extend(!0,{},this.container&&this.container.settings)}},{key:"highDefinitionUpdate",value:function(t){this.isHD=t;var e=t?"addClass":"removeClass";this.$hdIndicator[e]("enabled")}},{key:"createCachedElements",value:function(){var t=this.$el.find(".media-control-layer");this.$duration=t.find(".media-control-indicator[data-duration]"),this.$fullscreenToggle=t.find("button.media-control-button[data-fullscreen]"),this.$playPauseToggle=t.find("button.media-control-button[data-playpause]"),this.$playStopToggle=t.find("button.media-control-button[data-playstop]"),this.$position=t.find(".media-control-indicator[data-position]"),this.$seekBarContainer=t.find(".bar-container[data-seekbar]"),this.$seekBarHover=t.find(".bar-hover[data-seekbar]"),this.$seekBarLoaded=t.find(".bar-fill-1[data-seekbar]"),this.$seekBarPosition=t.find(".bar-fill-2[data-seekbar]"),this.$seekBarScrubber=t.find(".bar-scrubber[data-seekbar]"),this.$volumeBarContainer=t.find(".bar-container[data-volume]"),this.$volumeContainer=t.find(".drawer-container[data-volume]"),this.$volumeIcon=t.find(".drawer-icon[data-volume]"),this.$volumeBarBackground=this.$el.find(".bar-background[data-volume]"),this.$volumeBarFill=this.$el.find(".bar-fill-1[data-volume]"),this.$volumeBarScrubber=this.$el.find(".bar-scrubber[data-volume]"),this.$hdIndicator=this.$el.find("button.media-control-button[data-hd-indicator]"),this.resetIndicators(),this.initializeIcons()}},{key:"resetIndicators",value:function(){this.displayedPosition=this.$position.text(),this.displayedDuration=this.$duration.text()}},{key:"initializeIcons",value:function(){var t=this.$el.find(".media-control-layer");t.find("button.media-control-button[data-play]").append(f),t.find("button.media-control-button[data-pause]").append(g),t.find("button.media-control-button[data-stop]").append(L),this.$playPauseToggle.append(f),this.$playStopToggle.append(f),this.$volumeIcon.append(M),this.$fullscreenToggle.append(F),this.$hdIndicator.append('\n \n')}},{key:"setSeekPercentage",value:function(t){t=Math.max(Math.min(t,100),0),this.displayedSeekBarPercentage!==t&&(this.displayedSeekBarPercentage=t,this.$seekBarPosition.removeClass("media-control-notransition"),this.$seekBarScrubber.removeClass("media-control-notransition"),this.$seekBarPosition.css({width:"".concat(t,"%")}),this.$seekBarScrubber.css({left:"".concat(t,"%")}))}},{key:"seekRelative",value:function(t){if(this.settings.seekEnabled){var e=this.container.getCurrentTime(),n=this.container.getDuration(),i=Math.min(Math.max(e+t,0),n);i=Math.min(100*i/n,100),this.container.seekPercentage(i)}}},{key:"bindKeyAndShow",value:function(t,e){var n=this;this.kibo.down(t,(function(){return n.show(),e()}))}},{key:"bindKeyEvents",value:function(){var t=this;if(!e.Browser.isMobile&&!this.options.disableKeyboardShortcuts){this.unbindKeyEvents(),this.kibo=new B(this.options.focusElement||this.options.parentElement),this.bindKeyAndShow("space",(function(){return t.togglePlayPause()})),this.bindKeyAndShow("left",(function(){return t.seekRelative(-5)})),this.bindKeyAndShow("right",(function(){return t.seekRelative(5)})),this.bindKeyAndShow("shift left",(function(){return t.seekRelative(-10)})),this.bindKeyAndShow("shift right",(function(){return t.seekRelative(10)})),this.bindKeyAndShow("shift ctrl left",(function(){return t.seekRelative(-15)})),this.bindKeyAndShow("shift ctrl right",(function(){return t.seekRelative(15)}));["1","2","3","4","5","6","7","8","9","0"].forEach((function(e){t.bindKeyAndShow(e,(function(){t.settings.seekEnabled&&t.container&&t.container.seekPercentage(10*e)}))}))}}},{key:"unbindKeyEvents",value:function(){this.kibo&&(this.kibo.off("space"),this.kibo.off("left"),this.kibo.off("right"),this.kibo.off("shift left"),this.kibo.off("shift right"),this.kibo.off("shift ctrl left"),this.kibo.off("shift ctrl right"),this.kibo.off(["1","2","3","4","5","6","7","8","9","0"]))}},{key:"parseColors",value:function(){if(this.options.mediacontrol){this.buttonsColor=this.options.mediacontrol.buttons;var t=this.options.mediacontrol.seekbar;this.$el.find(".bar-fill-2[data-seekbar]").css("background-color",t),this.$el.find(".media-control-icon svg path").css("fill",this.buttonsColor),this.$el.find(".segmented-bar-element[data-volume]").css("boxShadow","inset 2px 0 0 "+this.buttonsColor)}}},{key:"applyButtonStyle",value:function(t){this.buttonsColor&&t&&e.$(t).find("svg path").css("fill",this.buttonsColor)}},{key:"destroy",value:function(){e.$(document).unbind("mouseup",this.stopDragHandler),e.$(document).unbind("mousemove",this.updateDragHandler),this.unbindKeyEvents(),this.stopListening(),c(r(i.prototype),"destroy",this).call(this)}},{key:"configure",value:function(t){this.options.chromeless||t.source||t.sources?this.disable():this.enable(),this.trigger(e.Events.MEDIACONTROL_OPTIONS_CHANGE)}},{key:"render",value:function(){var t=this,n=this.options.hideMediaControlDelay||2e3;this.settings&&this.$el.html(this.template({settings:this.settings})),this.createCachedElements(),this.$playPauseToggle.addClass("paused"),this.$playStopToggle.addClass("stopped"),this.changeTogglePlay(),this.container&&(this.hideId=setTimeout((function(){return t.hide()}),n),this.disabled&&this.hide()),e.Browser.isSafari&&e.Browser.isMobile&&(e.Browser.version<10?this.$volumeContainer.css("display","none"):this.$volumeBarContainer.css("display","none")),this.$seekBarPosition.addClass("media-control-notransition"),this.$seekBarScrubber.addClass("media-control-notransition");var i=0;return this.displayedSeekBarPercentage&&(i=this.displayedSeekBarPercentage),this.displayedSeekBarPercentage=null,this.setSeekPercentage(i),D((function(){!t.settings.seekEnabled&&t.$seekBarContainer.addClass("seek-disabled"),!e.Browser.isMobile&&!t.options.disableKeyboardShortcuts&&t.bindKeyEvents(),t.playerResize({width:t.options.width,height:t.options.height}),t.hideVolumeBar(0)})),this.parseColors(),this.highDefinitionUpdate(this.isHD),this.core.$el.append(this.el),this.rendered=!0,this.updateVolumeUI(),this.trigger(e.Events.MEDIACONTROL_RENDERED),this}}]),i}(e.UICorePlugin);G.extend=function(t){return z(G,t)};h(".player-poster[data-poster] {\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n height: 100%;\n width: 100%;\n z-index: 998;\n top: 0;\n left: 0;\n background-color: transparent;\n background-size: cover;\n background-repeat: no-repeat;\n background-position: 50% 50%; }\n .player-poster[data-poster].clickable {\n cursor: pointer; }\n .player-poster[data-poster]:hover .play-wrapper[data-poster] {\n opacity: 1; }\n .player-poster[data-poster] .play-wrapper[data-poster] {\n width: 100%;\n height: 25%;\n margin: 0 auto;\n opacity: 0.75;\n transition: opacity 0.1s ease; }\n .player-poster[data-poster] .play-wrapper[data-poster] svg {\n height: 100%; }\n .player-poster[data-poster] .play-wrapper[data-poster] svg path {\n fill: #fff; }\n");var j=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).hasStartedPlaying=!1,e.playRequested=!1,e.render(),D((function(){return e.update()})),e}return o(i,t),a(i,[{key:"name",get:function(){return"poster"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('
\n')}},{key:"shouldRender",get:function(){var t=!(!this.options.poster||!this.options.poster.showForNoOp);return"html_img"!==this.container.playback.name&&(this.container.playback.getPlaybackType()!==e.Playback.NO_OP||t)}},{key:"attributes",get:function(){return{class:"player-poster","data-poster":""}}},{key:"events",get:function(){return{click:"clicked"}}},{key:"showOnVideoEnd",get:function(){return!this.options.poster||this.options.poster.showOnVideoEnd||void 0===this.options.poster.showOnVideoEnd}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERING,this.update),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERFULL,this.update),this.listenTo(this.container,e.Events.CONTAINER_OPTIONS_CHANGE,this.render),this.listenTo(this.container,e.Events.CONTAINER_ERROR,this.onError),this.showOnVideoEnd&&this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.onStop)}},{key:"onError",value:function(t){this.hasFatalError=t.level===e.PlayerError.Levels.FATAL,this.hasFatalError&&(this.hasStartedPlaying=!1,this.playRequested=!1,this.showPlayButton())}},{key:"onPlay",value:function(){this.hasStartedPlaying=!0,this.update()}},{key:"onStop",value:function(){this.hasStartedPlaying=!1,this.playRequested=!1,this.update()}},{key:"updatePlayButton",value:function(t){!t||this.options.chromeless&&!this.options.allowUserInteraction?this.hidePlayButton():this.showPlayButton()}},{key:"showPlayButton",value:function(){this.hasFatalError&&!this.options.disableErrorScreen||(this.$playButton.show(),this.$el.addClass("clickable"))}},{key:"hidePlayButton",value:function(){this.$playButton.hide(),this.$el.removeClass("clickable")}},{key:"clicked",value:function(){if(!this.hasStartedPlaying)return this.options.chromeless&&!this.options.allowUserInteraction||(this.playRequested=!0,this.update(),this.container.playback&&this.container.playback.consent(),this.container.play()),!1}},{key:"shouldHideOnPlay",value:function(){return!this.container.playback.isAudioOnly}},{key:"update",value:function(){if(this.shouldRender){var t=!this.playRequested&&!this.hasStartedPlaying&&!this.container.buffering;this.updatePlayButton(t),this.updatePoster()}}},{key:"updatePoster",value:function(){this.hasStartedPlaying?this.hidePoster():this.showPoster()}},{key:"showPoster",value:function(){this.container.disableMediaControl(),this.$el.show()}},{key:"hidePoster",value:function(){this.container.enableMediaControl(),this.shouldHideOnPlay()&&this.$el.hide()}},{key:"render",value:function(){if(this.shouldRender){if(this.$el.html(this.template()),this.options.poster&&void 0===this.options.poster.custom){var t=this.options.poster.url||this.options.poster;this.$el.css({"background-image":"url("+t+")"})}else this.options.poster&&this.$el.css({background:this.options.poster.custom});this.container.$el.append(this.el),this.$playWrapper=this.$el.find(".play-wrapper"),this.$playWrapper.append(f),this.$playButton=this.$playWrapper.find("svg"),this.$playButton.addClass("poster-icon"),this.$playButton.attr("data-poster","");var e=this.options.mediacontrol&&this.options.mediacontrol.buttons;return e&&this.$el.find("svg path").css("fill",e),this.options.mediacontrol&&this.options.mediacontrol.buttons&&(e=this.options.mediacontrol.buttons,this.$playButton.css("color",e)),this.update(),this}}}]),i}(e.UIContainerPlugin);h('.seek-time[data-seek-time] {\n position: absolute;\n white-space: nowrap;\n height: 20px;\n line-height: 20px;\n font-size: 0;\n left: -100%;\n bottom: 55px;\n background-color: rgba(2, 2, 2, 0.5);\n z-index: 9999;\n transition: opacity 0.1s ease; }\n .seek-time[data-seek-time].hidden[data-seek-time] {\n opacity: 0; }\n .seek-time[data-seek-time] [data-seek-time] {\n display: inline-block;\n color: white;\n font-size: 10px;\n padding-left: 7px;\n padding-right: 7px;\n vertical-align: top; }\n .seek-time[data-seek-time] [data-duration] {\n display: inline-block;\n color: rgba(255, 255, 255, 0.5);\n font-size: 10px;\n padding-right: 7px;\n vertical-align: top; }\n .seek-time[data-seek-time] [data-duration]:before {\n content: "|";\n margin-right: 7px; }\n');var W=e.Utils.formatTime,X=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).hoveringOverSeekBar=!1,e.hoverPosition=null,e.duration=null,e.firstFragDateTime=null,e.actualLiveTime=!!e.mediaControl.options.actualLiveTime,e.actualLiveTime&&(e.mediaControl.options.actualLiveServerTime?e.actualLiveServerTimeDiff=(new Date).getTime()-new Date(e.mediaControl.options.actualLiveServerTime).getTime():e.actualLiveServerTimeDiff=0),e}return o(i,t),a(i,[{key:"name",get:function(){return"seek_time"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template("\n\n")}},{key:"attributes",get:function(){return{class:"seek-time","data-seek-time":""}}},{key:"mediaControl",get:function(){return this.core.mediaControl}},{key:"mediaControlContainer",get:function(){return this.mediaControl.container}},{key:"isLiveStreamWithDvr",get:function(){return this.mediaControlContainer&&this.mediaControlContainer.getPlaybackType()===e.Playback.LIVE&&this.mediaControlContainer.isDvrEnabled()}},{key:"durationShown",get:function(){return this.isLiveStreamWithDvr&&!this.actualLiveTime}},{key:"useActualLiveTime",get:function(){return this.actualLiveTime&&this.isLiveStreamWithDvr}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_RENDERED,this.render),this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_MOUSEMOVE_SEEKBAR,this.showTime),this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_MOUSELEAVE_SEEKBAR,this.hideTime),this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_CONTAINERCHANGED,this.onContainerChanged),this.mediaControlContainer&&(this.listenTo(this.mediaControlContainer,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.update),this.listenTo(this.mediaControlContainer,e.Events.CONTAINER_TIMEUPDATE,this.updateDuration))}},{key:"onContainerChanged",value:function(){this.stopListening(),this.bindEvents()}},{key:"updateDuration",value:function(t){this.duration=t.total,this.firstFragDateTime=t.firstFragDateTime,this.update()}},{key:"showTime",value:function(t){this.hoveringOverSeekBar=!0,this.calculateHoverPosition(t),this.update()}},{key:"hideTime",value:function(){this.hoveringOverSeekBar=!1,this.update()}},{key:"calculateHoverPosition",value:function(t){var e=t.pageX-this.mediaControl.$seekBarContainer.offset().left;this.hoverPosition=Math.min(1,Math.max(e/this.mediaControl.$seekBarContainer.width(),0))}},{key:"getSeekTime",value:function(){var t,e,n,i;return this.useActualLiveTime?(this.firstFragDateTime?(i=new Date(this.firstFragDateTime),(n=new Date(this.firstFragDateTime)).setHours(0,0,0,0),e=(i.getTime()-n.getTime())/1e3+this.duration):(n=new Date((new Date).getTime()-this.actualLiveServerTimeDiff),e=((i=new Date(n))-n.setHours(0,0,0,0))/1e3),(t=e-this.duration+this.hoverPosition*this.duration)<0&&(t+=86400)):t=this.hoverPosition*this.duration,{seekTime:t,secondsSinceMidnight:e}}},{key:"update",value:function(){if(this.rendered)if(this.shouldBeVisible()){var t=this.getSeekTime(),e=W(t.seekTime,this.useActualLiveTime);if(e!==this.displayedSeekTime&&(this.$seekTimeEl.text(e),this.displayedSeekTime=e),this.durationShown){this.$durationEl.show();var n=W(this.actualLiveTime?t.secondsSinceMidnight:this.duration,this.actualLiveTime);n!==this.displayedDuration&&(this.$durationEl.text(n),this.displayedDuration=n)}else this.$durationEl.hide();this.$el.show();var i=this.mediaControl.$seekBarContainer.width(),a=this.$el.width(),o=this.hoverPosition*i;o-=a/2,o=Math.max(0,Math.min(o,i-a)),this.$el.css("left",o)}else this.$el.hide(),this.$el.css("left","-100%")}},{key:"shouldBeVisible",value:function(){return this.mediaControlContainer&&this.mediaControlContainer.settings.seekEnabled&&this.hoveringOverSeekBar&&null!==this.hoverPosition&&null!==this.duration}},{key:"render",value:function(){this.rendered=!0,this.displayedDuration=null,this.displayedSeekTime=null,this.$el.html(this.template()),this.$el.hide(),this.mediaControl.$el.append(this.el),this.$seekTimeEl=this.$el.find("[data-seek-time]"),this.$durationEl=this.$el.find("[data-duration]"),this.$durationEl.hide(),this.update()}}]),i}(e.UICorePlugin);h(".spinner-three-bounce[data-spinner] {\n position: absolute;\n margin: 0 auto;\n width: 70px;\n text-align: center;\n z-index: 999;\n left: 0;\n right: 0;\n margin-left: auto;\n margin-right: auto;\n /* center vertically */\n top: 50%;\n transform: translateY(-50%); }\n .spinner-three-bounce[data-spinner] > div {\n width: 18px;\n height: 18px;\n background-color: #FFFFFF;\n border-radius: 100%;\n display: inline-block;\n -webkit-animation: bouncedelay 1.4s infinite ease-in-out;\n animation: bouncedelay 1.4s infinite ease-in-out;\n /* Prevent first frame from flickering when animation starts */\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both; }\n .spinner-three-bounce[data-spinner] [data-bounce1] {\n -webkit-animation-delay: -0.32s;\n animation-delay: -0.32s; }\n .spinner-three-bounce[data-spinner] [data-bounce2] {\n -webkit-animation-delay: -0.16s;\n animation-delay: -0.16s; }\n\n@-webkit-keyframes bouncedelay {\n 0%, 80%, 100% {\n transform: scale(0); }\n 40% {\n transform: scale(1); } }\n\n@keyframes bouncedelay {\n 0%, 80%, 100% {\n transform: scale(0); }\n 40% {\n transform: scale(1); } }\n");var q=function(t){function i(t){var a;return n(this,i),(a=l(this,r(i).call(this,t))).template=e.template("
\n"),a.showTimeout=null,a.listenTo(a.container,e.Events.CONTAINER_STATE_BUFFERING,a.onBuffering),a.listenTo(a.container,e.Events.CONTAINER_STATE_BUFFERFULL,a.onBufferFull),a.listenTo(a.container,e.Events.CONTAINER_STOP,a.onStop),a.listenTo(a.container,e.Events.CONTAINER_ENDED,a.onStop),a.listenTo(a.container,e.Events.CONTAINER_ERROR,a.onStop),a.render(),a}return o(i,t),a(i,[{key:"name",get:function(){return"spinner"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"attributes",get:function(){return{"data-spinner":"",class:"spinner-three-bounce"}}}]),a(i,[{key:"onBuffering",value:function(){this.show()}},{key:"onBufferFull",value:function(){this.hide()}},{key:"onStop",value:function(){this.hide()}},{key:"show",value:function(){var t=this;null===this.showTimeout&&(this.showTimeout=setTimeout((function(){return t.$el.show()}),300))}},{key:"hide",value:function(){null!==this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.$el.hide()}},{key:"render",value:function(){return this.$el.html(this.template()),this.container.$el.append(this.$el),this.$el.hide(),this.container.buffering&&this.onBuffering(),this}}]),i}(e.UIContainerPlugin),J=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).setInitialAttrs(),e.reportInterval=e.options.reportInterval||5e3,e.state="IDLE",e}return o(i,t),a(i,[{key:"name",get:function(){return"stats"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.container.playback,e.Events.PLAYBACK_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_DESTROYED,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERING,this.onBuffering),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERFULL,this.onBufferFull),this.listenTo(this.container,e.Events.CONTAINER_STATS_ADD,this.onStatsAdd),this.listenTo(this.container,e.Events.CONTAINER_BITRATE,this.onStatsAdd),this.listenTo(this.container.playback,e.Events.PLAYBACK_STATS_ADD,this.onStatsAdd)}},{key:"setInitialAttrs",value:function(){this.firstPlay=!0,this.startupTime=0,this.rebufferingTime=0,this.watchingTime=0,this.rebuffers=0,this.externalMetrics={}}},{key:"onPlay",value:function(){this.state="PLAYING",this.watchingTimeInit=Date.now(),this.intervalId||(this.intervalId=setInterval(this.report.bind(this),this.reportInterval))}},{key:"onStop",value:function(){clearInterval(this.intervalId),this.report(),this.intervalId=void 0,this.state="STOPPED"}},{key:"onBuffering",value:function(){this.firstPlay?this.startupTimeInit=Date.now():this.rebufferingTimeInit=Date.now(),this.state="BUFFERING",this.rebuffers++}},{key:"onBufferFull",value:function(){this.firstPlay&&this.startupTimeInit?(this.firstPlay=!1,this.startupTime=Date.now()-this.startupTimeInit,this.watchingTimeInit=Date.now()):this.rebufferingTimeInit&&(this.rebufferingTime+=this.getRebufferingTime()),this.rebufferingTimeInit=void 0,this.state="PLAYING"}},{key:"getRebufferingTime",value:function(){return Date.now()-this.rebufferingTimeInit}},{key:"getWatchingTime",value:function(){return Date.now()-this.watchingTimeInit-this.rebufferingTime}},{key:"isRebuffering",value:function(){return!!this.rebufferingTimeInit}},{key:"onStatsAdd",value:function(t){e.$.extend(this.externalMetrics,t)}},{key:"getStats",value:function(){var t={startupTime:this.startupTime,rebuffers:this.rebuffers,rebufferingTime:this.isRebuffering()?this.rebufferingTime+this.getRebufferingTime():this.rebufferingTime,watchingTime:this.isRebuffering()?this.getWatchingTime()-this.getRebufferingTime():this.getWatchingTime()};return e.$.extend(t,this.externalMetrics),t}},{key:"report",value:function(){this.container.statsReport(this.getStats())}}]),i}(e.ContainerPlugin);h(".clappr-watermark[data-watermark] {\n position: absolute;\n min-width: 70px;\n max-width: 200px;\n width: 12%;\n text-align: center;\n z-index: 10; }\n\n.clappr-watermark[data-watermark] a {\n outline: none;\n cursor: pointer; }\n\n.clappr-watermark[data-watermark] img {\n max-width: 100%; }\n\n.clappr-watermark[data-watermark-bottom-left] {\n bottom: 10px;\n left: 10px; }\n\n.clappr-watermark[data-watermark-bottom-right] {\n bottom: 10px;\n right: 42px; }\n\n.clappr-watermark[data-watermark-top-left] {\n top: 10px;\n left: 10px; }\n\n.clappr-watermark[data-watermark-top-right] {\n top: 10px;\n right: 37px; }\n");var Z=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).configure(),e}return o(i,t),a(i,[{key:"name",get:function(){return"watermark"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('
>\n<% if(typeof imageLink !== \'undefined\') { %>\n\n<% } %>\n\n<% if(typeof imageLink !== \'undefined\') { %>\n\n<% } %>\n
\n')}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_OPTIONS_CHANGE,this.configure)}},{key:"configure",value:function(){this.position=this.options.position||"bottom-right",this.options.watermark?(this.imageUrl=this.options.watermark,this.imageLink=this.options.watermarkLink,this.render()):this.$el.remove()}},{key:"onPlay",value:function(){this.hidden||this.$el.show()}},{key:"onStop",value:function(){this.$el.hide()}},{key:"render",value:function(){this.$el.hide();var t={position:this.position,imageUrl:this.imageUrl,imageLink:this.imageLink};return this.$el.html(this.template(t)),this.container.$el.append(this.$el),this}}]),i}(e.UIContainerPlugin),Q={ClickToPause:d,ClosedCaptions:u,DVRControls:p,EndVideo:m,ErrorScreen:v,Favicon:y,GoogleAnalytics:k,MediaControl:G,Poster:j,SeekTime:X,SpinnerThreeBounce:q,Stats:J,WaterMark:Z};t.ClickToPause=d,t.ClosedCaptions=u,t.DVRControls=p,t.EndVideo=m,t.ErrorScreen=v,t.Favicon=y,t.GoogleAnalytics=k,t.MediaControl=G,t.Plugins=Q,t.Poster=j,t.SeekTime=X,t.SpinnerThreeBounce=q,t.Stats=J,t.Vendor=V,t.WaterMark=Z,t.version="0.4.8",Object.defineProperty(t,"__esModule",{value:!0})})); +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@clappr/core")):"function"==typeof define&&define.amd?define(["exports","@clappr/core"],e):e((t=t||self).ClapprPlugins={},t.Clappr)}(this,(function(t,e){"use strict";function n(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){for(var n=0;n ul {\n list-style-type: none;\n position: absolute;\n bottom: 25px;\n border: 1px solid black;\n display: none;\n background-color: #e6e6e6; }\n .cc-controls[data-cc-controls] li {\n font-size: 10px; }\n .cc-controls[data-cc-controls] li[data-title] {\n background-color: #c3c2c2;\n padding: 5px; }\n .cc-controls[data-cc-controls] li a {\n color: #444;\n padding: 2px 10px;\n display: block;\n text-decoration: none; }\n .cc-controls[data-cc-controls] li a:hover {\n background-color: #555;\n color: white; }\n .cc-controls[data-cc-controls] li a:hover a {\n color: white;\n text-decoration: none; }\n .cc-controls[data-cc-controls] li.current a {\n color: #f00; }\n");var u=function(t){function i(t){var e;n(this,i),e=l(this,r(i).call(this,t));var a=t.options.closedCaptionsConfig;return e._title=a&&a.title?a.title:null,e._ariaLabel=a&&a.ariaLabel?a.ariaLabel:"cc-button",e._labelCb=a&&a.labelCallback&&"function"==typeof a.labelCallback?a.labelCallback:function(t){return t.name},e}return o(i,t),a(i,[{key:"name",get:function(){return"closed_captions"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('\n\n')}},{key:"events",get:function(){return{"click [data-cc-button]":"toggleContextMenu","click [data-cc-select]":"onTrackSelect"}}},{key:"attributes",get:function(){return{class:"cc-controls","data-cc-controls":""}}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.containerChanged),this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_RENDERED,this.render),this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_HIDE,this.hideContextMenu),this.bindContainerEvents()}},{key:"bindContainerEvents",value:function(){this.container=this.core.activeContainer,this.container&&(this.listenTo(this.container,e.Events.CONTAINER_SUBTITLE_AVAILABLE,this.onSubtitleAvailable),this.listenTo(this.container,e.Events.CONTAINER_SUBTITLE_CHANGED,this.onSubtitleChanged),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onContainerStop))}},{key:"onContainerStop",value:function(){this.ccAvailable(!1)}},{key:"containerChanged",value:function(){this.ccAvailable(!1),this.stopListening(),this.bindEvents()}},{key:"onSubtitleAvailable",value:function(){this.renderCcButton(),this.ccAvailable(!0)}},{key:"onSubtitleChanged",value:function(t){this.setCurrentContextMenuElement(t.id)}},{key:"onTrackSelect",value:function(t){var e=parseInt(t.target.dataset.ccSelect,10);return this.container.closedCaptionsTrackId=e,this.hideContextMenu(),t.stopPropagation(),!1}},{key:"ccAvailable",value:function(t){var e=t?"addClass":"removeClass";this.$el[e]("available")}},{key:"toggleContextMenu",value:function(){this.$el.find("ul").toggle()}},{key:"hideContextMenu",value:function(){this.$el.find("ul").hide()}},{key:"contextMenuElement",value:function(t){return this.$el.find("ul a"+(isNaN(t)?"":'[data-cc-select="'+t+'"]')).parent()}},{key:"setCurrentContextMenuElement",value:function(t){if(this._trackId!==t){this.contextMenuElement().removeClass("current"),this.contextMenuElement(t).addClass("current");var e=t>-1?"addClass":"removeClass";this.$ccButton[e]("enabled"),this._trackId=t}}},{key:"renderCcButton",value:function(){for(var t=this.container?this.container.closedCaptionsTracks:[],e=0;e\n\n'),this.$el.append(this.style)}},{key:"render",value:function(){this.renderCcButton();var t=this.core.mediaControl.$el.find("button[data-fullscreen]");return t[0]?this.$el.insertAfter(t):this.core.mediaControl.$el.find(".media-control-right-panel[data-media-control]").prepend(this.$el),this}}]),i}(e.UICorePlugin);h('.dvr-controls[data-dvr-controls] {\n display: inline-block;\n float: left;\n color: #fff;\n line-height: 32px;\n font-size: 10px;\n font-weight: bold;\n margin-left: 6px; }\n .dvr-controls[data-dvr-controls] .live-info {\n cursor: default;\n font-family: "Roboto", "Open Sans", Arial, sans-serif;\n text-transform: uppercase; }\n .dvr-controls[data-dvr-controls] .live-info:before {\n content: "";\n display: inline-block;\n position: relative;\n width: 7px;\n height: 7px;\n border-radius: 3.5px;\n margin-right: 3.5px;\n background-color: #ff0101; }\n .dvr-controls[data-dvr-controls] .live-info.disabled {\n opacity: 0.3; }\n .dvr-controls[data-dvr-controls] .live-info.disabled:before {\n background-color: #fff; }\n .dvr-controls[data-dvr-controls] .live-button {\n cursor: pointer;\n outline: none;\n display: none;\n border: 0;\n color: #fff;\n background-color: transparent;\n height: 32px;\n padding: 0;\n opacity: 0.7;\n font-family: "Roboto", "Open Sans", Arial, sans-serif;\n text-transform: uppercase;\n transition: all 0.1s ease; }\n .dvr-controls[data-dvr-controls] .live-button:before {\n content: "";\n display: inline-block;\n position: relative;\n width: 7px;\n height: 7px;\n border-radius: 3.5px;\n margin-right: 3.5px;\n background-color: #fff; }\n .dvr-controls[data-dvr-controls] .live-button:hover {\n opacity: 1;\n text-shadow: rgba(255, 255, 255, 0.75) 0 0 5px; }\n\n.dvr .dvr-controls[data-dvr-controls] .live-info {\n display: none; }\n\n.dvr .dvr-controls[data-dvr-controls] .live-button {\n display: block; }\n\n.dvr.media-control.live[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n background-color: #005aff; }\n\n.media-control.live[data-media-control] .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {\n background-color: #ff0101; }\n');var p=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).settingsUpdate(),e}return o(i,t),a(i,[{key:"template",get:function(){return e.template('
<%= live %>
\n\n')}},{key:"name",get:function(){return"dvr_controls"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"events",get:function(){return{"click .live-button":"click"}}},{key:"attributes",get:function(){return{class:"dvr-controls","data-dvr-controls":""}}}]),a(i,[{key:"bindEvents",value:function(){this.bindCoreEvents(),this.bindContainerEvents()}},{key:"bindCoreEvents",value:function(){var t=this;this.core.mediaControl.settings?(this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_CONTAINERCHANGED,this.containerChanged),this.listenTo(this.core.mediaControl,e.Events.MEDIACONTROL_RENDERED,this.settingsUpdate),this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.render)):setTimeout((function(){return t.bindCoreEvents()}),100)}},{key:"bindContainerEvents",value:function(){this.core.activeContainer&&(this.listenToOnce(this.core.activeContainer,e.Events.CONTAINER_TIMEUPDATE,this.render),this.listenTo(this.core.activeContainer,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.dvrChanged))}},{key:"containerChanged",value:function(){this.stopListening(),this.bindEvents()}},{key:"dvrChanged",value:function(t){this.core.getPlaybackType()===e.Playback.LIVE&&(this.settingsUpdate(),this.core.mediaControl.$el.addClass("live"),t?(this.core.mediaControl.$el.addClass("dvr"),this.core.mediaControl.$el.find(".media-control-indicator[data-position], .media-control-indicator[data-duration]").hide()):this.core.mediaControl.$el.removeClass("dvr"))}},{key:"click",value:function(){var t=this.core.mediaControl,e=t.container;e.isPlaying()||e.play(),t.$el.hasClass("dvr")&&e.seek(e.getDuration())}},{key:"settingsUpdate",value:function(){var t=this;this.stopListening(),this.core.mediaControl.$el.removeClass("live"),this.shouldRender()&&(this.render(),this.$el.click((function(){return t.click()}))),this.bindEvents()}},{key:"shouldRender",value:function(){return(void 0===this.core.options.useDvrControls||!!this.core.options.useDvrControls)&&this.core.getPlaybackType()===e.Playback.LIVE}},{key:"render",value:function(){return this.$el.html(this.template({live:this.core.i18n.t("live"),backToLive:this.core.i18n.t("back_to_live")})),this.shouldRender()&&(this.core.mediaControl.$el.addClass("live"),this.core.mediaControl.$(".media-control-left-panel[data-media-control]").append(this.$el)),this}}]),i}(e.UICorePlugin),m=function(t){function i(){return n(this,i),l(this,r(i).apply(this,arguments))}return o(i,t),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.containerChanged);var t=this.core.activeContainer;t&&(this.listenTo(t,e.Events.CONTAINER_ENDED,this.ended),this.listenTo(t,e.Events.CONTAINER_STOP,this.ended))}},{key:"containerChanged",value:function(){this.stopListening(),this.bindEvents()}},{key:"ended",value:function(){(void 0===this.core.options.exitFullscreenOnEnd||this.core.options.exitFullscreenOnEnd)&&this.core.isFullscreen()&&this.core.toggleFullscreen()}},{key:"name",get:function(){return"end_video"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}}]),i}(e.CorePlugin);h("div.player-error-screen {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n color: #CCCACA;\n position: absolute;\n top: 0;\n height: 100%;\n width: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n z-index: 2000;\n display: flex;\n flex-direction: column;\n justify-content: center; }\n div.player-error-screen__content[data-error-screen] {\n font-size: 14px;\n color: #CCCACA;\n margin-top: 45px; }\n div.player-error-screen__title[data-error-screen] {\n font-weight: bold;\n line-height: 30px;\n font-size: 18px; }\n div.player-error-screen__message[data-error-screen] {\n width: 90%;\n margin: 0 auto; }\n div.player-error-screen__code[data-error-screen] {\n font-size: 13px;\n margin-top: 15px; }\n div.player-error-screen__reload {\n cursor: pointer;\n width: 30px;\n margin: 15px auto 0; }\n");var v=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).options.disableErrorScreen?l(e,e.disable()):e}return o(i,t),a(i,[{key:"name",get:function(){return"error_screen"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('
\n <% if (icon) { %>\n
<%= icon %>
\n <% } %>\n
<%= title %>
\n
<%= message %>
\n
Error code: <%= code %>
\n
<%= reloadIcon %>
\n
\n')}},{key:"container",get:function(){return this.core.getCurrentContainer()}},{key:"attributes",get:function(){return{class:"player-error-screen","data-error-screen":""}}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.core,e.Events.ERROR,this.onError),this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.onContainerChanged)}},{key:"bindReload",value:function(){this.reloadButton=this.$el.find(".player-error-screen__reload"),this.reloadButton&&this.reloadButton.on("click",this.reload.bind(this))}},{key:"reload",value:function(){var t=this;this.listenToOnce(this.core,e.Events.CORE_READY,(function(){return t.container.play()})),this.core.load(this.options.sources,this.options.mimeType),this.unbindReload()}},{key:"unbindReload",value:function(){this.reloadButton&&this.reloadButton.off("click")}},{key:"onContainerChanged",value:function(){this.err=null,this.unbindReload(),this.hide()}},{key:"onError",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};t.level===e.PlayerError.Levels.FATAL&&(this.err=t,this.container.disableMediaControl(),this.container.stop(),this.show())}},{key:"show",value:function(){this.render(),this.$el.show()}},{key:"hide",value:function(){this.$el.hide()}},{key:"render",value:function(){if(this.err)return this.$el.html(this.template({title:this.err.UI.title,message:this.err.UI.message,code:this.err.code,icon:this.err.UI.icon||"",reloadIcon:'\n \n \n'})),this.core.$el.append(this.el),this.bindReload(),this}}]),i}(e.UICorePlugin),f='\n \n',g='\n \n',b=e.$('link[rel="shortcut icon"]'),y=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t)))._container=null,e.configure(),e}return o(i,t),a(i,[{key:"name",get:function(){return"favicon"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"oldIcon",get:function(){return b}}]),a(i,[{key:"configure",value:function(){this.core.options.changeFavicon?this.enabled||(this.stopListening(this.core,e.Events.CORE_OPTIONS_CHANGE),this.enable()):this.enabled&&(this.disable(),this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.configure))}},{key:"bindEvents",value:function(){this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.configure),this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.containerChanged),this.core.activeContainer&&this.containerChanged()}},{key:"containerChanged",value:function(){this._container&&this.stopListening(this._container),this._container=this.core.activeContainer,this.listenTo(this._container,e.Events.CONTAINER_PLAY,this.setPlayIcon),this.listenTo(this._container,e.Events.CONTAINER_PAUSE,this.setPauseIcon),this.listenTo(this._container,e.Events.CONTAINER_STOP,this.resetIcon),this.listenTo(this._container,e.Events.CONTAINER_ENDED,this.resetIcon),this.listenTo(this._container,e.Events.CONTAINER_ERROR,this.resetIcon),this.resetIcon()}},{key:"disable",value:function(){c(r(i.prototype),"disable",this).call(this),this.resetIcon()}},{key:"destroy",value:function(){c(r(i.prototype),"destroy",this).call(this),this.resetIcon()}},{key:"createIcon",value:function(t){var n=e.$("");n[0].width=16,n[0].height=16;var i=n[0].getContext("2d");i.fillStyle="#000";var a=e.$(t).find("path").attr("d"),o=new Path2D(a);i.fill(o);var r=e.$('');return r.attr("href",n[0].toDataURL("image/png")),r}},{key:"setPlayIcon",value:function(){this.playIcon||(this.playIcon=this.createIcon(f)),this.changeIcon(this.playIcon)}},{key:"setPauseIcon",value:function(){this.pauseIcon||(this.pauseIcon=this.createIcon(g)),this.changeIcon(this.pauseIcon)}},{key:"resetIcon",value:function(){e.$('link[rel="shortcut icon"]').remove(),e.$("head").append(this.oldIcon)}},{key:"changeIcon",value:function(t){t&&(e.$('link[rel="shortcut icon"]').remove(),e.$("head").append(t))}}]),i}(e.CorePlugin),k=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).container.options.gaAccount&&(e.account=e.container.options.gaAccount,e.trackerName=e.container.options.gaTrackerName?e.container.options.gaTrackerName+".":"Clappr.",e.domainName=e.container.options.gaDomainName,e.currentHDState=void 0,e.embedScript()),e}return o(i,t),a(i,[{key:"name",get:function(){return"google_analytics"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}}]),a(i,[{key:"embedScript",value:function(){var t=this;if(window._gat)this.addEventListeners();else{var e=document.createElement("script");e.setAttribute("type","text/javascript"),e.setAttribute("async","async"),e.setAttribute("src","//www.google-analytics.com/ga.js"),e.onload=function(){return t.addEventListeners()},document.body.appendChild(e)}}},{key:"addEventListeners",value:function(){var t=this;this.container&&(this.listenTo(this.container,e.Events.CONTAINER_READY,this.onReady),this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_PAUSE,this.onPause),this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.onEnded),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERING,this.onBuffering),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERFULL,this.onBufferFull),this.listenTo(this.container,e.Events.CONTAINER_ERROR,this.onError),this.listenTo(this.container,e.Events.CONTAINER_PLAYBACKSTATE,this.onPlaybackChanged),this.listenTo(this.container,e.Events.CONTAINER_VOLUME,(function(e){return t.onVolumeChanged(e)})),this.listenTo(this.container,e.Events.CONTAINER_SEEK,(function(e){return t.onSeek(e)})),this.listenTo(this.container,e.Events.CONTAINER_FULL_SCREEN,this.onFullscreen),this.listenTo(this.container,e.Events.CONTAINER_HIGHDEFINITIONUPDATE,this.onHD),this.listenTo(this.container,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.onDVR)),_gaq.push([this.trackerName+"_setAccount",this.account]),this.domainName&&_gaq.push([this.trackerName+"_setDomainName",this.domainName])}},{key:"onReady",value:function(){this.push(["Video","Playback",this.container.playback.name])}},{key:"onPlay",value:function(){this.push(["Video","Play",this.container.playback.src])}},{key:"onStop",value:function(){this.push(["Video","Stop",this.container.playback.src])}},{key:"onEnded",value:function(){this.push(["Video","Ended",this.container.playback.src])}},{key:"onBuffering",value:function(){this.push(["Video","Buffering",this.container.playback.src])}},{key:"onBufferFull",value:function(){this.push(["Video","Bufferfull",this.container.playback.src])}},{key:"onError",value:function(){this.push(["Video","Error",this.container.playback.src])}},{key:"onHD",value:function(t){var e=t?"ON":"OFF";e!==this.currentHDState&&(this.currentHDState=e,this.push(["Video","HD - "+e,this.container.playback.src]))}},{key:"onPlaybackChanged",value:function(t){null!==t.type&&this.push(["Video","Playback Type - "+t.type,this.container.playback.src])}},{key:"onDVR",value:function(t){var e=t?"ON":"OFF";this.push(["Interaction","DVR - "+e,this.container.playback.src])}},{key:"onPause",value:function(){this.push(["Video","Pause",this.container.playback.src])}},{key:"onSeek",value:function(){this.push(["Video","Seek",this.container.playback.src])}},{key:"onVolumeChanged",value:function(){this.push(["Interaction","Volume",this.container.playback.src])}},{key:"onFullscreen",value:function(){this.push(["Interaction","Fullscreen",this.container.playback.src])}},{key:"push",value:function(t){var e=[this.trackerName+"_trackEvent"].concat(t);_gaq.push(e)}}]),i}(e.ContainerPlugin),E="undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{};function C(){throw new Error("setTimeout has not been defined")}function T(){throw new Error("clearTimeout has not been defined")}var w=C,I=T;function N(t){if(w===setTimeout)return setTimeout(t,0);if((w===C||!w)&&setTimeout)return w=setTimeout,setTimeout(t,0);try{return w(t,0)}catch(e){try{return w.call(null,t,0)}catch(e){return w.call(this,t,0)}}}"function"==typeof E.setTimeout&&(w=setTimeout),"function"==typeof E.clearTimeout&&(I=clearTimeout);var O,A=[],S=!1,_=-1;function R(){S&&O&&(S=!1,O.length?A=O.concat(A):_=-1,A.length&&x())}function x(){if(!S){var t=N(R);S=!0;for(var e=A.length;e;){for(O=A,A=[];++_1)for(var n=1;n\n
\n <% var renderBar = function(name) { %>\n
>\n
>\n
>
\n
>
\n
>
\n
\n
>\n
>
\n
\n
\n <% }; %>\n <% var renderSegmentedBar = function(name, segments) {\n segments = segments || 10; %>\n
>\n <% for (var i = 0; i < segments; i++) { %>\n
>
\n <% } %>\n
\n <% }; %>\n <% var renderDrawer = function(name, renderContent) { %>\n
>\n
>\n
>
\n >\n
\n <% renderContent(name); %>\n
\n <% }; %>\n <% var renderIndicator = function(name) { %>\n
>
\n <% }; %>\n <% var renderButton = function(name) { %>\n \n <% }; %>\n <% var templates = {\n bar: renderBar,\n segmentedBar: renderSegmentedBar,\n };\n var render = function(settingsList) {\n settingsList.forEach(function(setting) {\n if(setting === "seekbar") {\n renderBar(setting);\n } else if (setting === "volume") {\n renderDrawer(setting, settings.volumeBarTemplate ? templates[settings.volumeBarTemplate] : function(name) { return renderSegmentedBar(name); });\n } else if (setting === "duration" || setting === "position") {\n renderIndicator(setting);\n } else {\n renderButton(setting);\n }\n });\n }; %>\n <% if (settings.default && settings.default.length) { %>\n
\n <% render(settings.default); %>\n
\n <% } %>\n <% if (settings.left && settings.left.length) { %>\n
\n <% render(settings.left); %>\n
\n <% } %>\n <% if (settings.right && settings.right.length) { %>\n
\n <% render(settings.right); %>\n
\n <% } %>\n
\n')}},{key:"volume",get:function(){return this.container&&this.container.isReady?this.container.volume:this.intendedVolume}},{key:"muted",get:function(){return 0===this.volume}}]),a(i,[{key:"getExternalInterface",value:function(){var t=this;return{setVolume:this.setVolume,getVolume:function(){return t.volume}}}},{key:"bindEvents",value:function(){var t=this;this.stopListening(),this.listenTo(this.core,e.Events.CORE_ACTIVE_CONTAINER_CHANGED,this.onActiveContainerChanged),this.listenTo(this.core,e.Events.CORE_MOUSE_MOVE,this.show),this.listenTo(this.core,e.Events.CORE_MOUSE_LEAVE,(function(){return t.hide(t.options.hideMediaControlDelay)})),this.listenTo(this.core,e.Events.CORE_FULLSCREEN,this.show),this.listenTo(this.core,e.Events.CORE_OPTIONS_CHANGE,this.configure),this.listenTo(this.core,e.Events.CORE_RESIZE,this.playerResize),this.bindContainerEvents()}},{key:"bindContainerEvents",value:function(){this.container&&(this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.changeTogglePlay),this.listenTo(this.container,e.Events.CONTAINER_PAUSE,this.changeTogglePlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.changeTogglePlay),this.listenTo(this.container,e.Events.CONTAINER_DBLCLICK,this.toggleFullscreen),this.listenTo(this.container,e.Events.CONTAINER_TIMEUPDATE,this.onTimeUpdate),this.listenTo(this.container,e.Events.CONTAINER_PROGRESS,this.updateProgressBar),this.listenTo(this.container,e.Events.CONTAINER_SETTINGSUPDATE,this.settingsUpdate),this.listenTo(this.container,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.settingsUpdate),this.listenTo(this.container,e.Events.CONTAINER_HIGHDEFINITIONUPDATE,this.highDefinitionUpdate),this.listenTo(this.container,e.Events.CONTAINER_MEDIACONTROL_DISABLE,this.disable),this.listenTo(this.container,e.Events.CONTAINER_MEDIACONTROL_ENABLE,this.enable),this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.ended),this.listenTo(this.container,e.Events.CONTAINER_VOLUME,this.onVolumeChanged),this.listenTo(this.container,e.Events.CONTAINER_OPTIONS_CHANGE,this.setInitialVolume),"video"===this.container.playback.el.nodeName.toLowerCase()&&this.listenToOnce(this.container,e.Events.CONTAINER_LOADEDMETADATA,this.onLoadedMetadataOnVideoTag))}},{key:"disable",value:function(){this.userDisabled=!0,this.hide(),this.unbindKeyEvents(),this.$el.hide()}},{key:"enable",value:function(){this.options.chromeless||(this.userDisabled=!1,this.bindKeyEvents(),this.show())}},{key:"play",value:function(){this.container&&this.container.play()}},{key:"pause",value:function(){this.container&&this.container.pause()}},{key:"stop",value:function(){this.container&&this.container.stop()}},{key:"setInitialVolume",value:function(){var t=this.persistConfig?U.restore("volume"):100,e=this.container&&this.container.options||this.options;this.setVolume(e.mute?0:t,!0)}},{key:"onVolumeChanged",value:function(){this.updateVolumeUI()}},{key:"onLoadedMetadataOnVideoTag",value:function(){var t=this.playback&&this.playback.el;!H.fullscreenEnabled()&&t.webkitSupportsFullscreen&&(this.fullScreenOnVideoTagSupported=!0,this.settingsUpdate())}},{key:"updateVolumeUI",value:function(){if(this.rendered){this.$volumeBarContainer.find(".bar-fill-2").css({});var t=this.$volumeBarContainer.width(),e=this.$volumeBarBackground.width(),n=(t-e)/2,i=e*this.volume/100+n;this.$volumeBarFill.css({width:"".concat(this.volume,"%")}),this.$volumeBarScrubber.css({left:i}),this.$volumeBarContainer.find(".segmented-bar-element").removeClass("fill");var a=Math.ceil(this.volume/10);this.$volumeBarContainer.find(".segmented-bar-element").slice(0,a).addClass("fill"),this.$volumeIcon.html(""),this.$volumeIcon.removeClass("muted"),this.muted?(this.$volumeIcon.append('\n \n'),this.$volumeIcon.addClass("muted")):this.$volumeIcon.append(M),this.applyButtonStyle(this.$volumeIcon)}}},{key:"changeTogglePlay",value:function(){this.$playPauseToggle.html(""),this.$playStopToggle.html(""),this.container&&this.container.isPlaying()?(this.$playPauseToggle.append(g),this.$playStopToggle.append(L),this.trigger(e.Events.MEDIACONTROL_PLAYING)):(this.$playPauseToggle.append(f),this.$playStopToggle.append(f),this.trigger(e.Events.MEDIACONTROL_NOTPLAYING),e.Browser.isMobile&&this.show()),this.applyButtonStyle(this.$playPauseToggle),this.applyButtonStyle(this.$playStopToggle)}},{key:"mousemoveOnSeekBar",value:function(t){if(this.settings.seekEnabled){var n=t.pageX-this.$seekBarContainer.offset().left-this.$seekBarHover.width()/2;this.$seekBarHover.css({left:n})}this.trigger(e.Events.MEDIACONTROL_MOUSEMOVE_SEEKBAR,t)}},{key:"mouseleaveOnSeekBar",value:function(t){this.trigger(e.Events.MEDIACONTROL_MOUSELEAVE_SEEKBAR,t)}},{key:"onVolumeClick",value:function(t){this.setVolume(this.getVolumeFromUIEvent(t))}},{key:"mousemoveOnVolumeBar",value:function(t){this.draggingVolumeBar&&this.setVolume(this.getVolumeFromUIEvent(t))}},{key:"playerResize",value:function(t){this.$fullscreenToggle.html("");var e=this.core.isFullscreen()?'\n \n':F;this.$fullscreenToggle.append(e),this.applyButtonStyle(this.$fullscreenToggle),0!==this.$el.find(".media-control").length&&this.$el.removeClass("w320"),(t.width<=320||this.options.hideVolumeBar)&&this.$el.addClass("w320")}},{key:"togglePlayPause",value:function(){return this.container.isPlaying()?this.container.pause():this.container.play(),!1}},{key:"togglePlayStop",value:function(){this.container.isPlaying()?this.container.stop():this.container.play()}},{key:"startSeekDrag",value:function(t){this.settings.seekEnabled&&(this.draggingSeekBar=!0,this.$el.addClass("dragging"),this.$seekBarLoaded.addClass("media-control-notransition"),this.$seekBarPosition.addClass("media-control-notransition"),this.$seekBarScrubber.addClass("media-control-notransition"),t&&t.preventDefault())}},{key:"startVolumeDrag",value:function(t){this.draggingVolumeBar=!0,this.$el.addClass("dragging"),t&&t.preventDefault()}},{key:"stopDrag",value:function(t){this.draggingSeekBar&&this.seek(t),this.$el.removeClass("dragging"),this.$seekBarLoaded.removeClass("media-control-notransition"),this.$seekBarPosition.removeClass("media-control-notransition"),this.$seekBarScrubber.removeClass("media-control-notransition dragging"),this.draggingSeekBar=!1,this.draggingVolumeBar=!1}},{key:"updateDrag",value:function(t){if(this.draggingSeekBar){t.preventDefault();var e=(t.pageX-this.$seekBarContainer.offset().left)/this.$seekBarContainer.width()*100;e=Math.min(100,Math.max(e,0)),this.setSeekPercentage(e)}else this.draggingVolumeBar&&(t.preventDefault(),this.setVolume(this.getVolumeFromUIEvent(t)))}},{key:"getVolumeFromUIEvent",value:function(t){return(t.pageX-this.$volumeBarContainer.offset().left)/this.$volumeBarContainer.width()*100}},{key:"toggleMute",value:function(){this.setVolume(this.muted?100:0)}},{key:"setVolume",value:function(t){var n=this,i=arguments.length>1&&void 0!==arguments[1]&&arguments[1];t=Math.min(100,Math.max(t,0)),this.intendedVolume=t,this.persistConfig&&!i&&U.persist("volume",t);var a=function(){n.container&&n.container.isReady?n.container.setVolume(t):n.listenToOnce(n.container,e.Events.CONTAINER_READY,(function(){n.container.setVolume(t)}))};this.container?a():this.listenToOnce(this,e.Events.MEDIACONTROL_CONTAINERCHANGED,(function(){return a()}))}},{key:"toggleFullscreen",value:function(){this.trigger(e.Events.MEDIACONTROL_FULLSCREEN,this.name),this.container.fullscreen(),this.core.toggleFullscreen(),this.resetUserKeepVisible()}},{key:"onActiveContainerChanged",value:function(){this.fullScreenOnVideoTagSupported=null,this.bindEvents(),this.setInitialVolume(),this.changeTogglePlay(),this.bindContainerEvents(),this.settingsUpdate(),this.container&&this.container.trigger(e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.container.isDvrInUse()),this.container&&this.container.mediaControlDisabled&&this.disable(),this.trigger(e.Events.MEDIACONTROL_CONTAINERCHANGED)}},{key:"showVolumeBar",value:function(){this.hideVolumeId&&clearTimeout(this.hideVolumeId),this.$volumeBarContainer.removeClass("volume-bar-hide")}},{key:"hideVolumeBar",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:400;this.$volumeBarContainer&&(this.draggingVolumeBar?this.hideVolumeId=setTimeout((function(){return t.hideVolumeBar()}),e):(this.hideVolumeId&&clearTimeout(this.hideVolumeId),this.hideVolumeId=setTimeout((function(){return t.$volumeBarContainer.addClass("volume-bar-hide")}),e)))}},{key:"ended",value:function(){this.changeTogglePlay()}},{key:"updateProgressBar",value:function(t){var e=t.start/t.total*100,n=t.current/t.total*100;this.$seekBarLoaded.css({left:"".concat(e,"%"),width:"".concat(n-e,"%")})}},{key:"onTimeUpdate",value:function(t){if(!this.draggingSeekBar){var e=t.current<0?t.total:t.current;this.currentPositionValue=e,this.currentDurationValue=t.total,this.renderSeekBar()}}},{key:"renderSeekBar",value:function(){if(null!==this.currentPositionValue&&null!==this.currentDurationValue){this.currentSeekBarPercentage=100,this.container&&(this.container.getPlaybackType()!==e.Playback.LIVE||this.container.isDvrInUse())&&(this.currentSeekBarPercentage=this.currentPositionValue/this.currentDurationValue*100),this.setSeekPercentage(this.currentSeekBarPercentage);var t=K(this.currentPositionValue),n=K(this.currentDurationValue);t!==this.displayedPosition&&(this.$position.text(t),this.displayedPosition=t),n!==this.displayedDuration&&(this.$duration.text(n),this.displayedDuration=n)}}},{key:"seek",value:function(t){if(this.settings.seekEnabled){var e=(t.pageX-this.$seekBarContainer.offset().left)/this.$seekBarContainer.width()*100;return e=Math.min(100,Math.max(e,0)),this.container&&this.container.seekPercentage(e),this.setSeekPercentage(e),!1}}},{key:"setKeepVisible",value:function(){this.keepVisible=!0}},{key:"resetKeepVisible",value:function(){this.keepVisible=!1}},{key:"setUserKeepVisible",value:function(){this.userKeepVisible=!0}},{key:"resetUserKeepVisible",value:function(){this.userKeepVisible=!1}},{key:"isVisible",value:function(){return!this.$el.hasClass("media-control-hide")}},{key:"show",value:function(t){var n=this;if(!this.disabled){var i=t&&t.clientX!==this.lastMouseX&&t.clientY!==this.lastMouseY;(!t||i||navigator.userAgent.match(/firefox/i))&&(clearTimeout(this.hideId),this.$el.show(),this.trigger(e.Events.MEDIACONTROL_SHOW,this.name),this.container&&this.container.trigger(e.Events.CONTAINER_MEDIACONTROL_SHOW,this.name),this.$el.removeClass("media-control-hide"),this.hideId=setTimeout((function(){return n.hide()}),2e3),t&&(this.lastMouseX=t.clientX,this.lastMouseY=t.clientY));this.updateCursorStyle(!0)}}},{key:"hide",value:function(){var t=this,n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0;if(this.isVisible()){var i=n||2e3;if(clearTimeout(this.hideId),this.disabled||!1!==this.options.hideMediaControl){var a=this.userKeepVisible||this.keepVisible,o=this.draggingSeekBar||this.draggingVolumeBar;if(!this.disabled&&(n||a||o))this.hideId=setTimeout((function(){return t.hide()}),i);else{this.trigger(e.Events.MEDIACONTROL_HIDE,this.name),this.container&&this.container.trigger(e.Events.CONTAINER_MEDIACONTROL_HIDE,this.name),this.$el.addClass("media-control-hide"),this.hideVolumeBar(0);var r=!1;this.updateCursorStyle(r)}}}}},{key:"updateCursorStyle",value:function(t){t?this.core.$el.removeClass("nocursor"):this.core.isFullscreen()&&this.core.$el.addClass("nocursor")}},{key:"settingsUpdate",value:function(){var t=this.getSettings();!t||this.fullScreenOnVideoTagSupported||H.fullscreenEnabled()||(t.default&&Y(t.default,"fullscreen"),t.left&&Y(t.left,"fullscreen"),t.right&&Y(t.right,"fullscreen")),JSON.stringify(this.settings)!==JSON.stringify(t)&&(this.settings=t,this.render())}},{key:"getSettings",value:function(){return e.$.extend(!0,{},this.container&&this.container.settings)}},{key:"highDefinitionUpdate",value:function(t){this.isHD=t;var e=t?"addClass":"removeClass";this.$hdIndicator[e]("enabled")}},{key:"createCachedElements",value:function(){var t=this.$el.find(".media-control-layer");this.$duration=t.find(".media-control-indicator[data-duration]"),this.$fullscreenToggle=t.find("button.media-control-button[data-fullscreen]"),this.$playPauseToggle=t.find("button.media-control-button[data-playpause]"),this.$playStopToggle=t.find("button.media-control-button[data-playstop]"),this.$position=t.find(".media-control-indicator[data-position]"),this.$seekBarContainer=t.find(".bar-container[data-seekbar]"),this.$seekBarHover=t.find(".bar-hover[data-seekbar]"),this.$seekBarLoaded=t.find(".bar-fill-1[data-seekbar]"),this.$seekBarPosition=t.find(".bar-fill-2[data-seekbar]"),this.$seekBarScrubber=t.find(".bar-scrubber[data-seekbar]"),this.$volumeBarContainer=t.find(".bar-container[data-volume]"),this.$volumeContainer=t.find(".drawer-container[data-volume]"),this.$volumeIcon=t.find(".drawer-icon[data-volume]"),this.$volumeBarBackground=this.$el.find(".bar-background[data-volume]"),this.$volumeBarFill=this.$el.find(".bar-fill-1[data-volume]"),this.$volumeBarScrubber=this.$el.find(".bar-scrubber[data-volume]"),this.$hdIndicator=this.$el.find("button.media-control-button[data-hd-indicator]"),this.resetIndicators(),this.initializeIcons()}},{key:"resetIndicators",value:function(){this.displayedPosition=this.$position.text(),this.displayedDuration=this.$duration.text()}},{key:"initializeIcons",value:function(){var t=this.$el.find(".media-control-layer");t.find("button.media-control-button[data-play]").append(f),t.find("button.media-control-button[data-pause]").append(g),t.find("button.media-control-button[data-stop]").append(L),this.$playPauseToggle.append(f),this.$playStopToggle.append(f),this.$volumeIcon.append(M),this.$fullscreenToggle.append(F),this.$hdIndicator.append('\n \n')}},{key:"setSeekPercentage",value:function(t){t=Math.max(Math.min(t,100),0),this.displayedSeekBarPercentage!==t&&(this.displayedSeekBarPercentage=t,this.$seekBarPosition.removeClass("media-control-notransition"),this.$seekBarScrubber.removeClass("media-control-notransition"),this.$seekBarPosition.css({width:"".concat(t,"%")}),this.$seekBarScrubber.css({left:"".concat(t,"%")}))}},{key:"seekRelative",value:function(t){if(this.settings.seekEnabled){var e=this.container.getCurrentTime(),n=this.container.getDuration(),i=Math.min(Math.max(e+t,0),n);i=Math.min(100*i/n,100),this.container.seekPercentage(i)}}},{key:"bindKeyAndShow",value:function(t,e){var n=this;this.kibo.down(t,(function(){return n.show(),e()}))}},{key:"bindKeyEvents",value:function(){var t=this;if(!e.Browser.isMobile&&!this.options.disableKeyboardShortcuts){this.unbindKeyEvents(),this.kibo=new B(this.options.focusElement||this.options.parentElement),this.bindKeyAndShow("space",(function(){return t.togglePlayPause()})),this.bindKeyAndShow("left",(function(){return t.seekRelative(-5)})),this.bindKeyAndShow("right",(function(){return t.seekRelative(5)})),this.bindKeyAndShow("shift left",(function(){return t.seekRelative(-10)})),this.bindKeyAndShow("shift right",(function(){return t.seekRelative(10)})),this.bindKeyAndShow("shift ctrl left",(function(){return t.seekRelative(-15)})),this.bindKeyAndShow("shift ctrl right",(function(){return t.seekRelative(15)}));["1","2","3","4","5","6","7","8","9","0"].forEach((function(e){t.bindKeyAndShow(e,(function(){t.settings.seekEnabled&&t.container&&t.container.seekPercentage(10*e)}))}))}}},{key:"unbindKeyEvents",value:function(){this.kibo&&(this.kibo.off("space"),this.kibo.off("left"),this.kibo.off("right"),this.kibo.off("shift left"),this.kibo.off("shift right"),this.kibo.off("shift ctrl left"),this.kibo.off("shift ctrl right"),this.kibo.off(["1","2","3","4","5","6","7","8","9","0"]))}},{key:"parseColors",value:function(){if(this.options.mediacontrol){this.buttonsColor=this.options.mediacontrol.buttons;var t=this.options.mediacontrol.seekbar;this.$el.find(".bar-fill-2[data-seekbar]").css("background-color",t),this.$el.find(".media-control-icon svg path").css("fill",this.buttonsColor),this.$el.find(".segmented-bar-element[data-volume]").css("boxShadow","inset 2px 0 0 "+this.buttonsColor)}}},{key:"applyButtonStyle",value:function(t){this.buttonsColor&&t&&e.$(t).find("svg path").css("fill",this.buttonsColor)}},{key:"destroy",value:function(){e.$(document).unbind("mouseup",this.stopDragHandler),e.$(document).unbind("mousemove",this.updateDragHandler),this.unbindKeyEvents(),this.stopListening(),c(r(i.prototype),"destroy",this).call(this)}},{key:"configure",value:function(t){this.options.chromeless||t.source||t.sources?this.disable():this.enable(),this.trigger(e.Events.MEDIACONTROL_OPTIONS_CHANGE)}},{key:"render",value:function(){var t=this,n=this.options.hideMediaControlDelay||2e3;this.settings&&this.$el.html(this.template({settings:this.settings})),this.createCachedElements(),this.$playPauseToggle.addClass("paused"),this.$playStopToggle.addClass("stopped"),this.changeTogglePlay(),this.container&&(this.hideId=setTimeout((function(){return t.hide()}),n),this.disabled&&this.hide()),e.Browser.isSafari&&e.Browser.isMobile&&(e.Browser.version<10?this.$volumeContainer.css("display","none"):this.$volumeBarContainer.css("display","none")),this.$seekBarPosition.addClass("media-control-notransition"),this.$seekBarScrubber.addClass("media-control-notransition");var i=0;return this.displayedSeekBarPercentage&&(i=this.displayedSeekBarPercentage),this.displayedSeekBarPercentage=null,this.setSeekPercentage(i),D((function(){!t.settings.seekEnabled&&t.$seekBarContainer.addClass("seek-disabled"),!e.Browser.isMobile&&!t.options.disableKeyboardShortcuts&&t.bindKeyEvents(),t.playerResize({width:t.options.width,height:t.options.height}),t.hideVolumeBar(0)})),this.parseColors(),this.highDefinitionUpdate(this.isHD),this.core.$el.append(this.el),this.rendered=!0,this.updateVolumeUI(),this.trigger(e.Events.MEDIACONTROL_RENDERED),this}}]),i}(e.UICorePlugin);G.extend=function(t){return z(G,t)};h(".player-poster[data-poster] {\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n height: 100%;\n width: 100%;\n z-index: 998;\n top: 0;\n left: 0;\n background-color: transparent;\n background-size: cover;\n background-repeat: no-repeat;\n background-position: 50% 50%; }\n .player-poster[data-poster].clickable {\n cursor: pointer; }\n .player-poster[data-poster]:hover .play-wrapper[data-poster] {\n opacity: 1; }\n .player-poster[data-poster] .play-wrapper[data-poster] {\n width: 100%;\n height: 25%;\n margin: 0 auto;\n opacity: 0.75;\n transition: opacity 0.1s ease; }\n .player-poster[data-poster] .play-wrapper[data-poster] svg {\n height: 100%; }\n .player-poster[data-poster] .play-wrapper[data-poster] svg path {\n fill: #fff; }\n");var j=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).hasStartedPlaying=!1,e.playRequested=!1,e.render(),D((function(){return e.update()})),e}return o(i,t),a(i,[{key:"name",get:function(){return"poster"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('
\n')}},{key:"shouldRender",get:function(){var t=!(!this.options.poster||!this.options.poster.showForNoOp);return"html_img"!==this.container.playback.name&&(this.container.playback.getPlaybackType()!==e.Playback.NO_OP||t)}},{key:"attributes",get:function(){return{class:"player-poster","data-poster":""}}},{key:"events",get:function(){return{click:"clicked"}}},{key:"showOnVideoEnd",get:function(){return!this.options.poster||this.options.poster.showOnVideoEnd||void 0===this.options.poster.showOnVideoEnd}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERING,this.update),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERFULL,this.update),this.listenTo(this.container,e.Events.CONTAINER_OPTIONS_CHANGE,this.render),this.listenTo(this.container,e.Events.CONTAINER_ERROR,this.onError),this.showOnVideoEnd&&this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.onStop)}},{key:"onError",value:function(t){this.hasFatalError=t.level===e.PlayerError.Levels.FATAL,this.hasFatalError&&(this.hasStartedPlaying=!1,this.playRequested=!1,this.showPlayButton())}},{key:"onPlay",value:function(){this.hasStartedPlaying=!0,this.update()}},{key:"onStop",value:function(){this.hasStartedPlaying=!1,this.playRequested=!1,this.update()}},{key:"updatePlayButton",value:function(t){!t||this.options.chromeless&&!this.options.allowUserInteraction?this.hidePlayButton():this.showPlayButton()}},{key:"showPlayButton",value:function(){this.hasFatalError&&!this.options.disableErrorScreen||(this.$playButton.show(),this.$el.addClass("clickable"))}},{key:"hidePlayButton",value:function(){this.$playButton.hide(),this.$el.removeClass("clickable")}},{key:"clicked",value:function(){if(!this.hasStartedPlaying)return this.options.chromeless&&!this.options.allowUserInteraction||(this.playRequested=!0,this.update(),this.container.playback&&this.container.playback.consent(),this.container.play()),!1}},{key:"shouldHideOnPlay",value:function(){return!this.container.playback.isAudioOnly}},{key:"update",value:function(){if(this.shouldRender){var t=!this.playRequested&&!this.hasStartedPlaying&&!this.container.buffering;this.updatePlayButton(t),this.updatePoster()}}},{key:"updatePoster",value:function(){this.hasStartedPlaying?this.hidePoster():this.showPoster()}},{key:"showPoster",value:function(){this.container.disableMediaControl(),this.$el.show()}},{key:"hidePoster",value:function(){this.container.enableMediaControl(),this.shouldHideOnPlay()&&this.$el.hide()}},{key:"render",value:function(){if(this.shouldRender){if(this.$el.html(this.template()),this.options.poster&&void 0===this.options.poster.custom){var t=this.options.poster.url||this.options.poster;this.$el.css({"background-image":"url("+t+")"})}else this.options.poster&&this.$el.css({background:this.options.poster.custom});this.container.$el.append(this.el),this.$playWrapper=this.$el.find(".play-wrapper"),this.$playWrapper.append(f),this.$playButton=this.$playWrapper.find("svg"),this.$playButton.addClass("poster-icon"),this.$playButton.attr("data-poster","");var e=this.options.mediacontrol&&this.options.mediacontrol.buttons;return e&&this.$el.find("svg path").css("fill",e),this.options.mediacontrol&&this.options.mediacontrol.buttons&&(e=this.options.mediacontrol.buttons,this.$playButton.css("color",e)),this.update(),this}}}]),i}(e.UIContainerPlugin);h('.seek-time[data-seek-time] {\n position: absolute;\n white-space: nowrap;\n height: 20px;\n line-height: 20px;\n font-size: 0;\n left: -100%;\n bottom: 55px;\n background-color: rgba(2, 2, 2, 0.5);\n z-index: 9999;\n transition: opacity 0.1s ease; }\n .seek-time[data-seek-time].hidden[data-seek-time] {\n opacity: 0; }\n .seek-time[data-seek-time] [data-seek-time] {\n display: inline-block;\n color: white;\n font-size: 10px;\n padding-left: 7px;\n padding-right: 7px;\n vertical-align: top; }\n .seek-time[data-seek-time] [data-duration] {\n display: inline-block;\n color: rgba(255, 255, 255, 0.5);\n font-size: 10px;\n padding-right: 7px;\n vertical-align: top; }\n .seek-time[data-seek-time] [data-duration]:before {\n content: "|";\n margin-right: 7px; }\n');var W=e.Utils.formatTime,X=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).hoveringOverSeekBar=!1,e.hoverPosition=null,e.duration=null,e.firstFragDateTime=null,e.actualLiveTime=!!e.mediaControl.options.actualLiveTime,e.actualLiveTime&&(e.mediaControl.options.actualLiveServerTime?e.actualLiveServerTimeDiff=(new Date).getTime()-new Date(e.mediaControl.options.actualLiveServerTime).getTime():e.actualLiveServerTimeDiff=0),e}return o(i,t),a(i,[{key:"name",get:function(){return"seek_time"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template("\n\n")}},{key:"attributes",get:function(){return{class:"seek-time","data-seek-time":""}}},{key:"mediaControl",get:function(){return this.core.mediaControl}},{key:"mediaControlContainer",get:function(){return this.mediaControl.container}},{key:"isLiveStreamWithDvr",get:function(){return this.mediaControlContainer&&this.mediaControlContainer.getPlaybackType()===e.Playback.LIVE&&this.mediaControlContainer.isDvrEnabled()}},{key:"durationShown",get:function(){return this.isLiveStreamWithDvr&&!this.actualLiveTime}},{key:"useActualLiveTime",get:function(){return this.actualLiveTime&&this.isLiveStreamWithDvr}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_RENDERED,this.render),this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_MOUSEMOVE_SEEKBAR,this.showTime),this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_MOUSELEAVE_SEEKBAR,this.hideTime),this.listenTo(this.mediaControl,e.Events.MEDIACONTROL_CONTAINERCHANGED,this.onContainerChanged),this.mediaControlContainer&&(this.listenTo(this.mediaControlContainer,e.Events.CONTAINER_PLAYBACKDVRSTATECHANGED,this.update),this.listenTo(this.mediaControlContainer,e.Events.CONTAINER_TIMEUPDATE,this.updateDuration))}},{key:"onContainerChanged",value:function(){this.stopListening(),this.bindEvents()}},{key:"updateDuration",value:function(t){this.duration=t.total,this.firstFragDateTime=t.firstFragDateTime,this.update()}},{key:"showTime",value:function(t){this.hoveringOverSeekBar=!0,this.calculateHoverPosition(t),this.update()}},{key:"hideTime",value:function(){this.hoveringOverSeekBar=!1,this.update()}},{key:"calculateHoverPosition",value:function(t){var e=t.pageX-this.mediaControl.$seekBarContainer.offset().left;this.hoverPosition=Math.min(1,Math.max(e/this.mediaControl.$seekBarContainer.width(),0))}},{key:"getSeekTime",value:function(){var t,e,n,i;return this.useActualLiveTime?(this.firstFragDateTime?(i=new Date(this.firstFragDateTime),(n=new Date(this.firstFragDateTime)).setHours(0,0,0,0),e=(i.getTime()-n.getTime())/1e3+this.duration):(n=new Date((new Date).getTime()-this.actualLiveServerTimeDiff),e=((i=new Date(n))-n.setHours(0,0,0,0))/1e3),(t=e-this.duration+this.hoverPosition*this.duration)<0&&(t+=86400)):t=this.hoverPosition*this.duration,{seekTime:t,secondsSinceMidnight:e}}},{key:"update",value:function(){if(this.rendered)if(this.shouldBeVisible()){var t=this.getSeekTime(),e=W(t.seekTime,this.useActualLiveTime);if(e!==this.displayedSeekTime&&(this.$seekTimeEl.text(e),this.displayedSeekTime=e),this.durationShown){this.$durationEl.show();var n=W(this.actualLiveTime?t.secondsSinceMidnight:this.duration,this.actualLiveTime);n!==this.displayedDuration&&(this.$durationEl.text(n),this.displayedDuration=n)}else this.$durationEl.hide();this.$el.show();var i=this.mediaControl.$seekBarContainer.width(),a=this.$el.width(),o=this.hoverPosition*i;o-=a/2,o=Math.max(0,Math.min(o,i-a)),this.$el.css("left",o)}else this.$el.hide(),this.$el.css("left","-100%")}},{key:"shouldBeVisible",value:function(){return this.mediaControlContainer&&this.mediaControlContainer.settings.seekEnabled&&this.hoveringOverSeekBar&&null!==this.hoverPosition&&null!==this.duration}},{key:"render",value:function(){this.rendered=!0,this.displayedDuration=null,this.displayedSeekTime=null,this.$el.html(this.template()),this.$el.hide(),this.mediaControl.$el.append(this.el),this.$seekTimeEl=this.$el.find("[data-seek-time]"),this.$durationEl=this.$el.find("[data-duration]"),this.$durationEl.hide(),this.update()}}]),i}(e.UICorePlugin);h(".spinner-three-bounce[data-spinner] {\n position: absolute;\n margin: 0 auto;\n width: 70px;\n text-align: center;\n z-index: 999;\n left: 0;\n right: 0;\n margin-left: auto;\n margin-right: auto;\n /* center vertically */\n top: 50%;\n transform: translateY(-50%); }\n .spinner-three-bounce[data-spinner] > div {\n width: 18px;\n height: 18px;\n background-color: #FFFFFF;\n border-radius: 100%;\n display: inline-block;\n -webkit-animation: bouncedelay 1.4s infinite ease-in-out;\n animation: bouncedelay 1.4s infinite ease-in-out;\n /* Prevent first frame from flickering when animation starts */\n -webkit-animation-fill-mode: both;\n animation-fill-mode: both; }\n .spinner-three-bounce[data-spinner] [data-bounce1] {\n -webkit-animation-delay: -0.32s;\n animation-delay: -0.32s; }\n .spinner-three-bounce[data-spinner] [data-bounce2] {\n -webkit-animation-delay: -0.16s;\n animation-delay: -0.16s; }\n\n@-webkit-keyframes bouncedelay {\n 0%, 80%, 100% {\n transform: scale(0); }\n 40% {\n transform: scale(1); } }\n\n@keyframes bouncedelay {\n 0%, 80%, 100% {\n transform: scale(0); }\n 40% {\n transform: scale(1); } }\n");var q=function(t){function i(t){var a;return n(this,i),(a=l(this,r(i).call(this,t))).template=e.template("
\n"),a.showTimeout=null,a.listenTo(a.container,e.Events.CONTAINER_STATE_BUFFERING,a.onBuffering),a.listenTo(a.container,e.Events.CONTAINER_STATE_BUFFERFULL,a.onBufferFull),a.listenTo(a.container,e.Events.CONTAINER_STOP,a.onStop),a.listenTo(a.container,e.Events.CONTAINER_ENDED,a.onStop),a.listenTo(a.container,e.Events.CONTAINER_ERROR,a.onStop),a.render(),a}return o(i,t),a(i,[{key:"name",get:function(){return"spinner"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"attributes",get:function(){return{"data-spinner":"",class:"spinner-three-bounce"}}}]),a(i,[{key:"onBuffering",value:function(){this.show()}},{key:"onBufferFull",value:function(){this.hide()}},{key:"onStop",value:function(){this.hide()}},{key:"show",value:function(){var t=this;null===this.showTimeout&&(this.showTimeout=setTimeout((function(){return t.$el.show()}),300))}},{key:"hide",value:function(){null!==this.showTimeout&&(clearTimeout(this.showTimeout),this.showTimeout=null),this.$el.hide()}},{key:"render",value:function(){return this.$el.html(this.template()),this.container.$el.append(this.$el),this.$el.hide(),this.container.buffering&&this.onBuffering(),this}}]),i}(e.UIContainerPlugin),J=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).setInitialAttrs(),e.reportInterval=e.options.reportInterval||5e3,e.state="IDLE",e}return o(i,t),a(i,[{key:"name",get:function(){return"stats"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.container.playback,e.Events.PLAYBACK_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_ENDED,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_DESTROYED,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERING,this.onBuffering),this.listenTo(this.container,e.Events.CONTAINER_STATE_BUFFERFULL,this.onBufferFull),this.listenTo(this.container,e.Events.CONTAINER_STATS_ADD,this.onStatsAdd),this.listenTo(this.container,e.Events.CONTAINER_BITRATE,this.onStatsAdd),this.listenTo(this.container.playback,e.Events.PLAYBACK_STATS_ADD,this.onStatsAdd)}},{key:"setInitialAttrs",value:function(){this.firstPlay=!0,this.startupTime=0,this.rebufferingTime=0,this.watchingTime=0,this.rebuffers=0,this.externalMetrics={}}},{key:"onPlay",value:function(){this.state="PLAYING",this.watchingTimeInit=Date.now(),this.intervalId||(this.intervalId=setInterval(this.report.bind(this),this.reportInterval))}},{key:"onStop",value:function(){clearInterval(this.intervalId),this.report(),this.intervalId=void 0,this.state="STOPPED"}},{key:"onBuffering",value:function(){this.firstPlay?this.startupTimeInit=Date.now():this.rebufferingTimeInit=Date.now(),this.state="BUFFERING",this.rebuffers++}},{key:"onBufferFull",value:function(){this.firstPlay&&this.startupTimeInit?(this.firstPlay=!1,this.startupTime=Date.now()-this.startupTimeInit,this.watchingTimeInit=Date.now()):this.rebufferingTimeInit&&(this.rebufferingTime+=this.getRebufferingTime()),this.rebufferingTimeInit=void 0,this.state="PLAYING"}},{key:"getRebufferingTime",value:function(){return Date.now()-this.rebufferingTimeInit}},{key:"getWatchingTime",value:function(){return Date.now()-this.watchingTimeInit-this.rebufferingTime}},{key:"isRebuffering",value:function(){return!!this.rebufferingTimeInit}},{key:"onStatsAdd",value:function(t){e.$.extend(this.externalMetrics,t)}},{key:"getStats",value:function(){var t={startupTime:this.startupTime,rebuffers:this.rebuffers,rebufferingTime:this.isRebuffering()?this.rebufferingTime+this.getRebufferingTime():this.rebufferingTime,watchingTime:this.isRebuffering()?this.getWatchingTime()-this.getRebufferingTime():this.getWatchingTime()};return e.$.extend(t,this.externalMetrics),t}},{key:"report",value:function(){this.container.statsReport(this.getStats())}}]),i}(e.ContainerPlugin);h(".clappr-watermark[data-watermark] {\n position: absolute;\n min-width: 70px;\n max-width: 200px;\n width: 12%;\n text-align: center;\n z-index: 10; }\n\n.clappr-watermark[data-watermark] a {\n outline: none;\n cursor: pointer; }\n\n.clappr-watermark[data-watermark] img {\n max-width: 100%; }\n\n.clappr-watermark[data-watermark-bottom-left] {\n bottom: 10px;\n left: 10px; }\n\n.clappr-watermark[data-watermark-bottom-right] {\n bottom: 10px;\n right: 42px; }\n\n.clappr-watermark[data-watermark-top-left] {\n top: 10px;\n left: 10px; }\n\n.clappr-watermark[data-watermark-top-right] {\n top: 10px;\n right: 37px; }\n");var Z=function(t){function i(t){var e;return n(this,i),(e=l(this,r(i).call(this,t))).configure(),e}return o(i,t),a(i,[{key:"name",get:function(){return"watermark"}},{key:"supportedVersion",get:function(){return{min:"0.4.9"}}},{key:"template",get:function(){return e.template('
>\n<% if(typeof imageLink !== \'undefined\') { %>\n\n<% } %>\n\n<% if(typeof imageLink !== \'undefined\') { %>\n\n<% } %>\n
\n')}}]),a(i,[{key:"bindEvents",value:function(){this.listenTo(this.container,e.Events.CONTAINER_PLAY,this.onPlay),this.listenTo(this.container,e.Events.CONTAINER_STOP,this.onStop),this.listenTo(this.container,e.Events.CONTAINER_OPTIONS_CHANGE,this.configure)}},{key:"configure",value:function(){this.position=this.options.position||"bottom-right",this.options.watermark?(this.imageUrl=this.options.watermark,this.imageLink=this.options.watermarkLink,this.render()):this.$el.remove()}},{key:"onPlay",value:function(){this.hidden||this.$el.show()}},{key:"onStop",value:function(){this.$el.hide()}},{key:"render",value:function(){this.$el.hide();var t={position:this.position,imageUrl:this.imageUrl,imageLink:this.imageLink};return this.$el.html(this.template(t)),this.container.$el.append(this.$el),this}}]),i}(e.UIContainerPlugin),Q={ClickToPause:d,ClosedCaptions:u,DVRControls:p,EndVideo:m,ErrorScreen:v,Favicon:y,GoogleAnalytics:k,MediaControl:G,Poster:j,SeekTime:X,SpinnerThreeBounce:q,Stats:J,WaterMark:Z};t.ClickToPause=d,t.ClosedCaptions=u,t.DVRControls=p,t.EndVideo=m,t.ErrorScreen=v,t.Favicon=y,t.GoogleAnalytics=k,t.MediaControl=G,t.Plugins=Q,t.Poster=j,t.SeekTime=X,t.SpinnerThreeBounce=q,t.Stats=J,t.Vendor=V,t.WaterMark=Z,t.version="0.4.9",Object.defineProperty(t,"__esModule",{value:!0})})); diff --git a/package.json b/package.json index 7dadc33d..7dd0c1a8 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@clappr/plugins", - "version": "0.4.8", + "version": "0.4.9", "description": "Main plugins for the Clappr project", "main": "./dist/clappr-plugins.js", "module": "./dist/clappr-plugins.esm.js",