@vime/core
Version:
Customizable, extensible, accessible and framework agnostic media player.
88 lines (87 loc) • 3.52 kB
JavaScript
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
import { getElement, writeTask } from '@stencil/core';
import { Disposal } from '../../utils/Disposal';
import { listen } from '../../utils/dom';
import { createStencilHook } from '../../utils/stencil';
import { Provider } from './Provider';
import { PROVIDER_CHANGE_EVENT } from './ProviderDispatcher';
import { isProviderWritableProp } from './ProviderProps';
export const PROVIDER_CACHE_KEY = Symbol('vmProviderCache');
export const PROVIDER_CONNECT_EVENT = 'vmMediaProviderConnect';
export const PROVIDER_DISCONNECT_EVENT = 'vmMediaProviderDisconnect';
function buildProviderConnectEvent(name, host) {
return new CustomEvent(name, {
bubbles: true,
composed: true,
detail: host,
});
}
export function withProviderHost(connector) {
const el = getElement(connector);
const disposal = new Disposal();
const cache = new Map();
connector[PROVIDER_CACHE_KEY] = cache;
function initCache() {
Object.keys(connector).forEach(prop => {
cache.set(prop, connector[prop]);
});
}
function onDisconnect() {
writeTask(() => __awaiter(this, void 0, void 0, function* () {
var _a;
connector.ready = false;
connector.provider = undefined;
cache.clear();
(_a = connector.onProviderDisconnect) === null || _a === void 0 ? void 0 : _a.call(connector);
el.dispatchEvent(buildProviderConnectEvent(PROVIDER_DISCONNECT_EVENT));
}));
}
function onConnect(event) {
event.stopImmediatePropagation();
initCache();
const hostRef = event.detail;
const host = getElement(event.detail);
if (connector.provider === host)
return;
const name = host === null || host === void 0 ? void 0 : host.nodeName.toLowerCase().replace('vm-', '');
writeTask(() => __awaiter(this, void 0, void 0, function* () {
connector.provider = host;
connector.currentProvider = Object.values(Provider).find(provider => name === provider);
createStencilHook(hostRef, undefined, () => onDisconnect());
}));
}
function onChange(event) {
var _a;
event.stopImmediatePropagation();
const { by, prop, value } = event.detail;
if (!isProviderWritableProp(prop)) {
(_a = connector.logger) === null || _a === void 0 ? void 0 : _a.warn(`${by.nodeName} tried to change \`${prop}\` but it is readonly.`);
return;
}
writeTask(() => {
cache.set(prop, value);
connector[prop] = value;
});
}
createStencilHook(connector, () => {
disposal.add(listen(el, PROVIDER_CONNECT_EVENT, onConnect));
disposal.add(listen(el, PROVIDER_CHANGE_EVENT, onChange));
}, () => {
disposal.empty();
cache.clear();
});
}
export function withProviderConnect(ref) {
const connectEvent = buildProviderConnectEvent(PROVIDER_CONNECT_EVENT, ref);
createStencilHook(ref, () => {
getElement(ref).dispatchEvent(connectEvent);
});
}