playable
Version:
Video player based on HTML5Video
72 lines • 3.22 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var view_1 = (0, tslib_1.__importDefault)(require("../core/view"));
var templates_1 = require("./templates");
var htmlToElement_1 = (0, tslib_1.__importDefault)(require("../core/htmlToElement"));
var getElementByHook_1 = (0, tslib_1.__importDefault)(require("../core/getElementByHook"));
var overlay_theme_1 = (0, tslib_1.__importDefault)(require("./overlay.theme"));
var overlay_scss_1 = (0, tslib_1.__importDefault)(require("./overlay.scss"));
var OverlayView = /** @class */ (function (_super) {
(0, tslib_1.__extends)(OverlayView, _super);
function OverlayView(config) {
var _this = _super.call(this, config.theme) || this;
var callbacks = config.callbacks;
_this._callbacks = callbacks;
_this._initDOM();
_this._bindEvents();
return _this;
}
OverlayView.prototype._initDOM = function () {
this._$rootElement = (0, htmlToElement_1.default)((0, templates_1.overlayTemplate)({
styles: this.styleNames,
themeStyles: this.themeStyles,
}));
this._$content = (0, getElementByHook_1.default)(this._$rootElement, 'overlay-content');
this._$playButton = (0, getElementByHook_1.default)(this._$rootElement, 'overlay-play-button');
};
OverlayView.prototype._bindEvents = function () {
this._$playButton.addEventListener('click', this._callbacks.onPlayClick);
};
OverlayView.prototype._unbindEvents = function () {
this._$playButton.removeEventListener('click', this._callbacks.onPlayClick);
};
OverlayView.prototype.getElement = function () {
return this._$rootElement;
};
OverlayView.prototype.hideContent = function () {
this._$rootElement.classList.remove(this.styleNames.active);
};
OverlayView.prototype.showContent = function () {
this._$rootElement.classList.add(this.styleNames.active);
};
OverlayView.prototype.hide = function () {
this._$rootElement.classList.add(this.styleNames.hidden);
};
OverlayView.prototype.show = function () {
this._$rootElement.classList.remove(this.styleNames.hidden);
};
OverlayView.prototype.setPoster = function (src) {
this._$content.style.backgroundImage = src ? "url('".concat(src, "')") : 'none';
};
OverlayView.prototype.turnOnOverlayTransparency = function () {
this._$content.classList.add(this.styleNames.transparency);
};
OverlayView.prototype.turnOffOverlayTransparency = function () {
this._$content.classList.remove(this.styleNames.transparency);
};
OverlayView.prototype.destroy = function () {
this._unbindEvents();
if (this._$rootElement.parentNode) {
this._$rootElement.parentNode.removeChild(this._$rootElement);
}
this._$rootElement = null;
this._$content = null;
this._$playButton = null;
};
return OverlayView;
}(view_1.default));
OverlayView.setTheme(overlay_theme_1.default);
OverlayView.extendStyleNames(overlay_scss_1.default);
exports.default = OverlayView;
//# sourceMappingURL=overlay.view.js.map