playable
Version:
Video player based on HTML5Video
91 lines • 4.51 kB
JavaScript
"use strict";
var _a;
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 chromecast_theme_1 = (0, tslib_1.__importDefault)(require("./chromecast.theme"));
var chromecast_scss_1 = (0, tslib_1.__importDefault)(require("./chromecast.scss"));
var TEXT_LABELS;
(function (TEXT_LABELS) {
TEXT_LABELS["START_CHROMECAST_BUTTON_LABEL"] = "start-chromecast-button-label";
TEXT_LABELS["START_CHROMECAST_BUTTON_TOOLTIP"] = "start-chromecast-button-tooltip";
TEXT_LABELS["STOP_CHROMECAST_BUTTON_LABEL"] = "stop-chromecast-button-label";
TEXT_LABELS["STOP_CHROMECAST_BUTTON_TOOLTIP"] = "stop-chromecast-button-tooltip";
})(TEXT_LABELS || (TEXT_LABELS = {}));
var DEFAULT_TEXTS = (_a = {},
_a[TEXT_LABELS.START_CHROMECAST_BUTTON_LABEL] = 'Broadcast video',
_a[TEXT_LABELS.START_CHROMECAST_BUTTON_TOOLTIP] = 'Broadcast Video',
_a[TEXT_LABELS.STOP_CHROMECAST_BUTTON_LABEL] = 'Stop broadcasting video',
_a[TEXT_LABELS.STOP_CHROMECAST_BUTTON_TOOLTIP] = 'Stop Broadcasting video',
_a);
var ChromecastView = /** @class */ (function (_super) {
(0, tslib_1.__extends)(ChromecastView, _super);
function ChromecastView(config) {
var _this = this;
var callbacks = config.callbacks, textMap = config.textMap, tooltipService = config.tooltipService, theme = config.theme;
_this = _super.call(this, theme) || this;
_this._callbacks = callbacks;
_this._textMap = textMap;
_this._$rootElement = (0, htmlToElement_1.default)((0, templates_1.buttonTemplate)({
styles: _this.styleNames,
themeStyles: _this.themeStyles,
texts: {
label: _this._getLabelText(TEXT_LABELS.START_CHROMECAST_BUTTON_LABEL),
},
}));
_this._$downloadButton = (0, getElementByHook_1.default)(_this._$rootElement, 'chromecast-button');
_this._tooltipReference = tooltipService.createReference(_this._$downloadButton, {
text: _this._getLabelText(TEXT_LABELS.START_CHROMECAST_BUTTON_TOOLTIP),
});
_this._bindEvents();
return _this;
}
ChromecastView.prototype._getLabelText = function (label) {
return this._textMap.get(label, null, DEFAULT_TEXTS[label]);
};
ChromecastView.prototype._bindEvents = function () {
this._onButtonClick = this._onButtonClick.bind(this);
this._$downloadButton.addEventListener('click', this._onButtonClick);
};
ChromecastView.prototype._unbindEvents = function () {
this._$downloadButton.removeEventListener('click', this._onButtonClick);
};
ChromecastView.prototype._onButtonClick = function () {
this._$rootElement.focus();
this._callbacks.onButtonClick();
};
ChromecastView.prototype.setCastingState = function (isCasting) {
if (isCasting) {
this._$rootElement.setAttribute('aria-label', this._getLabelText(TEXT_LABELS.STOP_CHROMECAST_BUTTON_LABEL));
this._tooltipReference.setText(this._getLabelText(TEXT_LABELS.STOP_CHROMECAST_BUTTON_TOOLTIP));
}
else {
this._$rootElement.setAttribute('aria-label', this._getLabelText(TEXT_LABELS.START_CHROMECAST_BUTTON_LABEL));
this._tooltipReference.setText(this._getLabelText(TEXT_LABELS.START_CHROMECAST_BUTTON_TOOLTIP));
}
};
ChromecastView.prototype.hide = function () {
this._$rootElement.classList.add(this.styleNames.hidden);
};
ChromecastView.prototype.show = function () {
this._$rootElement.classList.remove(this.styleNames.hidden);
};
ChromecastView.prototype.getElement = function () {
return this._$rootElement;
};
ChromecastView.prototype.destroy = function () {
this._unbindEvents();
this._tooltipReference.destroy();
if (this._$rootElement.parentNode) {
this._$rootElement.parentNode.removeChild(this._$rootElement);
}
};
return ChromecastView;
}(view_1.default));
ChromecastView.setTheme(chromecast_theme_1.default);
ChromecastView.extendStyleNames(chromecast_scss_1.default);
exports.default = ChromecastView;
//# sourceMappingURL=chromecast.view.js.map