Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

bitmovin-player-ui

Package Overview
Dependencies
Maintainers
1
Versions
141
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

bitmovin-player-ui - npm Package Compare versions

Comparing version 3.24.0 to 3.25.0

dist/js/framework/focusvisibilitytracker.d.ts

12

CHANGELOG.md

@@ -7,2 +7,13 @@ # Change Log

## [3.25.0]
### Added
- Build step to publish releases to npm via CI
### Added
- Support for Mobile V3 `PlayerError` and `SourceError` events
### Fixed
- Controls' focus highlighting is shown in case of non-keyboard interaction on some browsers/platforms
## [3.24.0] - 2021-02-16

@@ -711,2 +722,3 @@

[3.25.0]: https://github.com/bitmovin/bitmovin-player-ui/compare/v3.24.0...v3.25.0
[3.24.0]: https://github.com/bitmovin/bitmovin-player-ui/compare/v3.23.0...v3.24.0

@@ -713,0 +725,0 @@ [3.23.0]: https://github.com/bitmovin/bitmovin-player-ui/compare/v3.22.0...v3.23.0

5

dist/js/framework/components/errormessageoverlay.d.ts
import { ContainerConfig, Container } from './container';
import { UIInstanceManager } from '../uimanager';
import { ErrorEvent, PlayerAPI } from 'bitmovin-player';
import { MobileV3PlayerAPI, MobileV3PlayerErrorEvent } from '../mobilev3playerapi';
export interface ErrorMessageTranslator {
(error: ErrorEvent): string;
(error: ErrorEvent | MobileV3PlayerErrorEvent): string;
}

@@ -77,4 +78,4 @@ export interface ErrorMessageMap {

constructor(config?: ErrorMessageOverlayConfig);
configure(player: PlayerAPI, uimanager: UIInstanceManager): void;
configure(player: PlayerAPI | MobileV3PlayerAPI, uimanager: UIInstanceManager): void;
release(): void;
}

57

dist/js/framework/components/errormessageoverlay.js

@@ -21,2 +21,3 @@ "use strict";

var errorutils_1 = require("../errorutils");
var mobilev3playerapi_1 = require("../mobilev3playerapi");
/**

@@ -43,23 +44,6 @@ * Overlays the player and displays error messages.

var config = this.getConfig();
player.on(player.exports.PlayerEvent.Error, function (event) {
var message = errorutils_1.ErrorUtils.defaultErrorMessageTranslator(event);
// errorMessages configured in `UIConfig` take precedence `ErrorMessageOverlayConfig`
var errorMessages = uimanager.getConfig().errorMessages || config.messages;
// Process message vocabularies
if (errorMessages) {
if (typeof errorMessages === 'function') {
// Translation function for all errors
message = errorMessages(event);
}
else if (errorMessages[event.code]) {
// It's not a translation function, so it must be a map of strings or translation functions
var customMessage = errorMessages[event.code];
if (typeof customMessage === 'string') {
message = customMessage;
}
else {
// The message is a translation function, so we call it
message = customMessage(event);
}
}
var handleErrorMessage = function (event, message) {
var customizedMessage = customizeErrorMessage(uimanager.getConfig().errorMessages || config.messages, event);
if (customizedMessage) {
message = customizedMessage;
}

@@ -69,3 +53,17 @@ _this.errorLabel.setText(message);

_this.show();
});
};
if (mobilev3playerapi_1.isMobileV3PlayerAPI(player)) {
var errorEventHandler = function (event) {
var message = errorutils_1.ErrorUtils.defaultMobileV3ErrorMessageTranslator(event);
handleErrorMessage(event, message);
};
player.on(mobilev3playerapi_1.MobileV3PlayerEvent.PlayerError, errorEventHandler);
player.on(mobilev3playerapi_1.MobileV3PlayerEvent.SourceError, errorEventHandler);
}
else {
player.on(player.exports.PlayerEvent.Error, function (event) {
var message = errorutils_1.ErrorUtils.defaultWebErrorMessageTranslator(event);
handleErrorMessage(event, message);
});
}
player.on(player.exports.PlayerEvent.SourceLoaded, function (event) {

@@ -86,1 +84,16 @@ if (_this.isShown()) {

exports.ErrorMessageOverlay = ErrorMessageOverlay;
function customizeErrorMessage(errorMessages, event) {
if (!errorMessages) {
return undefined;
}
// Process message vocabularies
if (typeof errorMessages === 'function') {
// Translation function for all errors
return errorMessages(event);
}
if (errorMessages[event.code]) {
// It's not a translation function, so it must be a map of strings or translation functions
var customMessage = errorMessages[event.code];
return typeof customMessage === 'string' ? customMessage : customMessage(event);
}
}

@@ -97,3 +97,3 @@ "use strict";

else {
this.frameUpdateHandlerId = setTimeout(this.renderFrame.bind(this), this.frameInterval);
this.frameUpdateHandlerId = window.setTimeout(this.renderFrame.bind(this), this.frameInterval);
}

@@ -100,0 +100,0 @@ };

import { ErrorMessageMap, ErrorMessageTranslator } from './components/errormessageoverlay';
import { MobileV3PlayerErrorEvent, MobileV3SourceErrorEvent } from './mobilev3playerapi';
export declare namespace ErrorUtils {
const defaultErrorMessages: ErrorMessageMap;
const defaultErrorMessageTranslator: ErrorMessageTranslator;
const defaultMobileV3ErrorMessageTranslator: (error: MobileV3PlayerErrorEvent | MobileV3SourceErrorEvent) => string;
const defaultWebErrorMessageTranslator: ErrorMessageTranslator;
}

@@ -69,3 +69,6 @@ "use strict";

};
ErrorUtils.defaultErrorMessageTranslator = function (error) {
ErrorUtils.defaultMobileV3ErrorMessageTranslator = function (error) {
return error.message;
};
ErrorUtils.defaultWebErrorMessageTranslator = function (error) {
var errorMessage = ErrorUtils.defaultErrorMessages[error.code];

@@ -72,0 +75,0 @@ if (errorMessage) {

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.version = void 0;
exports.version = '3.24.0';
exports.version = '3.25.0';
// Management

@@ -6,0 +6,0 @@ var uimanager_1 = require("./uimanager");

@@ -86,2 +86,3 @@ import { UIContainer } from './components/uicontainer';

private managerPlayerWrapper;
private focusVisibilityTracker;
private events;

@@ -242,3 +243,3 @@ /**

*/
interface WrappedPlayer extends PlayerAPI {
export interface WrappedPlayer extends PlayerAPI {
/**

@@ -270,2 +271,1 @@ * Fires an event on the player that targets all handlers in the UI but never enters the real player.

}
export {};

@@ -44,2 +44,4 @@ "use strict";

var i18n_1 = require("./localization/i18n");
var focusvisibilitytracker_1 = require("./focusvisibilitytracker");
var mobilev3playerapi_1 = require("./mobilev3playerapi");
var UIManager = /** @class */ (function () {

@@ -102,7 +104,8 @@ function UIManager(player, playerUiOrUiVariants, uiconfig) {

};
this.managerPlayerWrapper.getPlayer().on(this.player.exports.PlayerEvent.SourceLoaded, updateSource);
var wrappedPlayer = this.managerPlayerWrapper.getPlayer();
wrappedPlayer.on(this.player.exports.PlayerEvent.SourceLoaded, updateSource);
// The PlaylistTransition event is only available on Mobile v3 for now.
// This event is fired when a new source becomes active in the player.
if (this.player.exports.PlayerEvent.PlaylistTransition) {
this.managerPlayerWrapper.getPlayer().on(this.player.exports.PlayerEvent.PlaylistTransition, updateSource);
if (mobilev3playerapi_1.isMobileV3PlayerAPI(wrappedPlayer)) {
wrappedPlayer.on(mobilev3playerapi_1.MobileV3PlayerEvent.PlaylistTransition, updateSource);
}

@@ -233,2 +236,3 @@ if (uiconfig.container) {

}
this.focusVisibilityTracker = new focusvisibilitytracker_1.FocusVisibilityTracker('bmpui');
// Initialize the UI

@@ -372,2 +376,3 @@ resolveUiVariant(null);

this.managerPlayerWrapper.clearEventHandlers();
this.focusVisibilityTracker.release();
};

@@ -374,0 +379,0 @@ Object.defineProperty(UIManager.prototype, "onUiVariantResolve", {

{
"name": "bitmovin-player-ui",
"version": "3.24.0",
"version": "3.25.0",
"description": "Bitmovin Player UI Framework",

@@ -23,2 +23,3 @@ "main": "./dist/js/framework/main.js",

"@types/jest": "^24.0.11",
"@types/jsdom": "^12.2.4",
"autoprefixer": "^6.5.2",

@@ -25,0 +26,0 @@ "bitmovin-player": "^8.28.0",

import { InternalUIConfig, PlayerWrapper, UIManager } from '../src/ts/uimanager';
import { PlayerAPI } from 'bitmovin-player';
import { MockHelper, TestingPlayerAPI } from './helper/MockHelper';
import { MobileV3PlayerEvent } from '../src/ts/mobilev3playerapi';

@@ -78,3 +79,5 @@ jest.mock('../src/ts/dom');

beforeEach(() => {
(playerMock.exports.PlayerEvent as any).PlaylistTransition = 'playlisttransition';
(playerMock.exports.PlayerEvent as any).SourceError = MobileV3PlayerEvent.SourceError;
(playerMock.exports.PlayerEvent as any).PlayerError = MobileV3PlayerEvent.PlayerError;
(playerMock.exports.PlayerEvent as any).PlaylistTransition = MobileV3PlayerEvent.PlaylistTransition;
});

@@ -81,0 +84,0 @@ it('attaches the listener', () => {

@@ -5,7 +5,11 @@ import {ContainerConfig, Container} from './container';

import {TvNoiseCanvas} from './tvnoisecanvas';
import {ErrorUtils} from '../errorutils';
import { ErrorUtils } from '../errorutils';
import { ErrorEvent, PlayerAPI, PlayerEventBase } from 'bitmovin-player';
import {
isMobileV3PlayerAPI,
MobileV3PlayerAPI, MobileV3PlayerErrorEvent, MobileV3PlayerEvent, MobileV3SourceErrorEvent,
} from '../mobilev3playerapi';
export interface ErrorMessageTranslator {
(error: ErrorEvent): string;
(error: ErrorEvent | MobileV3PlayerErrorEvent): string;
}

@@ -99,3 +103,3 @@

configure(player: PlayerAPI, uimanager: UIInstanceManager): void {
configure(player: PlayerAPI | MobileV3PlayerAPI, uimanager: UIInstanceManager): void {
super.configure(player, uimanager);

@@ -105,23 +109,9 @@

player.on(player.exports.PlayerEvent.Error, (event: ErrorEvent) => {
let message = ErrorUtils.defaultErrorMessageTranslator(event);
// errorMessages configured in `UIConfig` take precedence `ErrorMessageOverlayConfig`
let errorMessages = uimanager.getConfig().errorMessages || config.messages;
// Process message vocabularies
if (errorMessages) {
if (typeof errorMessages === 'function') {
// Translation function for all errors
message = errorMessages(event);
} else if (errorMessages[event.code]) {
// It's not a translation function, so it must be a map of strings or translation functions
let customMessage = errorMessages[event.code];
if (typeof customMessage === 'string') {
message = customMessage;
} else {
// The message is a translation function, so we call it
message = customMessage(event);
}
}
const handleErrorMessage = (
event: ErrorEvent | MobileV3SourceErrorEvent | MobileV3PlayerErrorEvent,
message: string,
) => {
const customizedMessage = customizeErrorMessage(uimanager.getConfig().errorMessages || config.messages, event);
if (customizedMessage) {
message = customizedMessage;
}

@@ -132,4 +122,19 @@

this.show();
});
};
if (isMobileV3PlayerAPI(player)) {
const errorEventHandler = (event: MobileV3SourceErrorEvent | MobileV3PlayerErrorEvent) => {
const message = ErrorUtils.defaultMobileV3ErrorMessageTranslator(event);
handleErrorMessage(event, message);
};
player.on(MobileV3PlayerEvent.PlayerError, errorEventHandler);
player.on(MobileV3PlayerEvent.SourceError, errorEventHandler);
} else {
player.on(player.exports.PlayerEvent.Error, (event: ErrorEvent) => {
let message = ErrorUtils.defaultWebErrorMessageTranslator(event);
handleErrorMessage(event, message);
});
}
player.on(player.exports.PlayerEvent.SourceLoaded, (event: PlayerEventBase) => {

@@ -149,2 +154,23 @@ if (this.isShown()) {

}
}
}
function customizeErrorMessage(
errorMessages: ErrorMessageTranslator | ErrorMessageMap,
event: ErrorEvent | MobileV3PlayerErrorEvent | MobileV3SourceErrorEvent,
): string | undefined {
if (!errorMessages) {
return undefined;
}
// Process message vocabularies
if (typeof errorMessages === 'function') {
// Translation function for all errors
return errorMessages(event);
}
if (errorMessages[event.code]) {
// It's not a translation function, so it must be a map of strings or translation functions
const customMessage = errorMessages[event.code];
return typeof customMessage === 'string' ? customMessage : customMessage(event);
}
}

@@ -100,5 +100,5 @@ import {Component, ComponentConfig} from './component';

} else {
this.frameUpdateHandlerId = setTimeout(this.renderFrame.bind(this), this.frameInterval);
this.frameUpdateHandlerId = window.setTimeout(this.renderFrame.bind(this), this.frameInterval);
}
}
}
import {ErrorMessageMap, ErrorMessageTranslator} from './components/errormessageoverlay';
import { ErrorEvent } from 'bitmovin-player';
import { MobileV3PlayerErrorEvent, MobileV3SourceErrorEvent } from './mobilev3playerapi';

@@ -70,3 +71,7 @@ export namespace ErrorUtils {

export const defaultErrorMessageTranslator: ErrorMessageTranslator = (error: ErrorEvent) => {
export const defaultMobileV3ErrorMessageTranslator = (error: MobileV3PlayerErrorEvent | MobileV3SourceErrorEvent) => {
return error.message;
};
export const defaultWebErrorMessageTranslator: ErrorMessageTranslator = (error: ErrorEvent) => {
const errorMessage = ErrorUtils.defaultErrorMessages[error.code];

@@ -73,0 +78,0 @@

@@ -14,2 +14,4 @@ import {UIContainer} from './components/uicontainer';

import { i18n, CustomVocabulary, Vocabularies } from './localization/i18n';
import { FocusVisibilityTracker } from './focusvisibilitytracker';
import { isMobileV3PlayerAPI, MobileV3PlayerAPI, MobileV3PlayerEvent } from './mobilev3playerapi';

@@ -99,2 +101,3 @@ export interface LocalizationConfig {

private managerPlayerWrapper: PlayerWrapper;
private focusVisibilityTracker: FocusVisibilityTracker;

@@ -195,11 +198,10 @@ private events = {

this.managerPlayerWrapper.getPlayer().on(this.player.exports.PlayerEvent.SourceLoaded, updateSource);
const wrappedPlayer = this.managerPlayerWrapper.getPlayer();
wrappedPlayer.on(this.player.exports.PlayerEvent.SourceLoaded, updateSource);
// The PlaylistTransition event is only available on Mobile v3 for now.
// This event is fired when a new source becomes active in the player.
if ((this.player.exports.PlayerEvent as any).PlaylistTransition) {
this.managerPlayerWrapper.getPlayer().on(
(this.player.exports.PlayerEvent as any).PlaylistTransition,
updateSource,
);
if (isMobileV3PlayerAPI(wrappedPlayer)) {
wrappedPlayer.on(MobileV3PlayerEvent.PlaylistTransition, updateSource);
}

@@ -337,2 +339,4 @@

this.focusVisibilityTracker = new FocusVisibilityTracker('{{PREFIX}}');
// Initialize the UI

@@ -496,2 +500,3 @@ resolveUiVariant(null);

this.managerPlayerWrapper.clearEventHandlers();
this.focusVisibilityTracker.release();
}

@@ -765,3 +770,3 @@

*/
interface WrappedPlayer extends PlayerAPI {
export interface WrappedPlayer extends PlayerAPI {
/**

@@ -768,0 +773,0 @@ * Fires an event on the player that targets all handlers in the UI but never enters the real player.

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc