Socket
Socket
Sign inDemoInstall

openplayerjs

Package Overview
Dependencies
Maintainers
1
Versions
86
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

openplayerjs - npm Package Compare versions

Comparing version 2.14.3 to 2.14.4

59

dist/esm/controls/captions.js

@@ -37,2 +37,4 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {

this._setDefaultTrack = this._setDefaultTrack.bind(this);
this._showCaptions = this._showCaptions.bind(this);
this._hideCaptions = this._hideCaptions.bind(this);
}

@@ -115,6 +117,8 @@ create() {

button.setAttribute('data-active-captions', 'off');
this._hideCaptions();
}
else {
button.classList.add('op-controls__captions--on');
button.setAttribute('data-active-captions', ((_a = __classPrivateFieldGet(this, _Captions_currentTrack, "f")) === null || _a === void 0 ? void 0 : _a.language) || '');
button.setAttribute('data-active-captions', ((_a = __classPrivateFieldGet(this, _Captions_currentTrack, "f")) === null || _a === void 0 ? void 0 : _a.language) || 'off');
this._showCaptions();
}

@@ -155,2 +159,6 @@ for (const track of __classPrivateFieldGet(this, _Captions_mediaTrackList, "f")) {

const language = option.getAttribute('data-value').replace('captions-', '');
this._hideCaptions();
if (language === 'off') {
__classPrivateFieldSet(this, _Captions_currentTrack, undefined, "f");
}
for (const track of __classPrivateFieldGet(this, _Captions_mediaTrackList, "f")) {

@@ -160,2 +168,3 @@ track.mode = track.language === language ? 'showing' : 'hidden';

__classPrivateFieldSet(this, _Captions_currentTrack, track, "f");
this._showCaptions();
}

@@ -188,30 +197,10 @@ }

var _a;
while (__classPrivateFieldGet(this, _Captions_captions, "f").lastChild) {
__classPrivateFieldGet(this, _Captions_captions, "f").removeChild(__classPrivateFieldGet(this, _Captions_captions, "f").lastChild);
}
this._hideCaptions();
const t = e.target;
if (t.mode !== 'showing') {
if (t.mode !== 'showing' || __classPrivateFieldGet(this, _Captions_button, "f").getAttribute('data-active-captions') === 'off') {
return;
}
if (t.activeCues && ((_a = t.activeCues) === null || _a === void 0 ? void 0 : _a.length) > 0) {
for (const cue of Array.from(t.activeCues)) {
const content = (cue === null || cue === void 0 ? void 0 : cue.text) || '';
if (content) {
__classPrivateFieldGet(this, _Captions_captions, "f").classList.add('op-captions--on');
const caption = document.createElement('span');
caption.innerHTML = content;
__classPrivateFieldGet(this, _Captions_captions, "f").prepend(caption);
}
else {
while (__classPrivateFieldGet(this, _Captions_captions, "f").lastChild) {
__classPrivateFieldGet(this, _Captions_captions, "f").removeChild(__classPrivateFieldGet(this, _Captions_captions, "f").lastChild);
}
}
}
this._showCaptions();
}
else {
while (__classPrivateFieldGet(this, _Captions_captions, "f").lastChild) {
__classPrivateFieldGet(this, _Captions_captions, "f").removeChild(__classPrivateFieldGet(this, _Captions_captions, "f").lastChild);
}
}
};

@@ -293,2 +282,3 @@ if (detachMenus) {

__classPrivateFieldGet(this, _Captions_button, "f").classList.add('op-controls__captions--on');
__classPrivateFieldGet(this, _Captions_captions, "f").classList.add('op-captions--on');
__classPrivateFieldSet(this, _Captions_currentTrack, track, "f");

@@ -302,4 +292,25 @@ const options = document.querySelectorAll('.op-settings__submenu-item') || [];

}
_showCaptions() {
var _a;
for (const cue of Array.from(((_a = __classPrivateFieldGet(this, _Captions_currentTrack, "f")) === null || _a === void 0 ? void 0 : _a.activeCues) || [])) {
const content = (cue === null || cue === void 0 ? void 0 : cue.text) || '';
if (content && __classPrivateFieldGet(this, _Captions_captions, "f")) {
const caption = document.createElement('span');
caption.innerHTML = content;
__classPrivateFieldGet(this, _Captions_captions, "f").prepend(caption);
__classPrivateFieldGet(this, _Captions_captions, "f").classList.add('op-captions--on');
}
else {
this._hideCaptions();
}
}
}
_hideCaptions() {
var _a;
while ((_a = __classPrivateFieldGet(this, _Captions_captions, "f")) === null || _a === void 0 ? void 0 : _a.lastChild) {
__classPrivateFieldGet(this, _Captions_captions, "f").removeChild(__classPrivateFieldGet(this, _Captions_captions, "f").lastChild);
}
}
}
_Captions_player = new WeakMap(), _Captions_button = new WeakMap(), _Captions_captions = new WeakMap(), _Captions_menu = new WeakMap(), _Captions_events = new WeakMap(), _Captions_mediaTrackList = new WeakMap(), _Captions_hasTracks = new WeakMap(), _Captions_currentTrack = new WeakMap(), _Captions_default = new WeakMap(), _Captions_controlPosition = new WeakMap(), _Captions_controlLayer = new WeakMap();
export default Captions;

@@ -105,3 +105,9 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {

set level(level) {
__classPrivateFieldGet(this, _HlsMedia_player, "f").currentLevel = level;
const formattedLevel = Number(level);
if (formattedLevel && formattedLevel > -1) {
__classPrivateFieldGet(this, _HlsMedia_player, "f").loadLevel = formattedLevel;
}
else {
__classPrivateFieldGet(this, _HlsMedia_player, "f").currentLevel = formattedLevel;
}
}

@@ -108,0 +114,0 @@ get level() {

@@ -59,3 +59,3 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {

detachMenus: false,
forceNative: true,
forceNative: false,
height: 0,

@@ -62,0 +62,0 @@ hidePlayBtnTimer: 350,

@@ -120,5 +120,5 @@ # Usage

| `Element` | Description |
| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `detachMenus` | Allow items that have menu items inside `Settings` to be contained in their own separate menu; generally speaking, the menu will float above the control item it belongs to (by default, false). |
| `forceNative` | Player will favor native capabilities rather than third-party plugins (HLS can play natively in Android and iOS, but setting this to `false`, will enable hls.js) |
| `forceNative` | Player will favor native capabilities rather than third-party plugins (HLS.js will be used by default since now Android and iOS support it, but setting this to `true`, will enable native HLS in iOS.js) |
| `mode` | Player stretching mode: `responsive` (default), `fit` (to obtain black bars) or `fill` (crop image) |

@@ -178,3 +178,3 @@ | `hidePlayBtnTimer` | Number of ms that takes the player to hide the Play button once it starts playing (video only). By default, `350`. |

OpenPlayerJS supports *Web Video Text Tracks Format* (WebVTT) and *SubRip Subtitle* (SRT) files for captions and subtitles; however, WebVTT files are encouraged since they are fully compatible with iOS devices, specially when using full screen mode in smartphones. The reason behind this is because iOS will default to the native phone media player, and its player doesn't have support for other formats in terms of captions/subtitles.
OpenPlayerJS supports _Web Video Text Tracks Format_ (WebVTT) and _SubRip Subtitle_ (SRT) files for captions and subtitles; however, WebVTT files are encouraged since they are fully compatible with iOS devices, specially when using full screen mode in smartphones. The reason behind this is because iOS will default to the native phone media player, and its player doesn't have support for other formats in terms of captions/subtitles.

@@ -195,3 +195,3 @@ Also, if you are planning to have full support for captions/subtitles across devices, it is important to note that, for Safari, **at least one track tag needs to be present**. So, if you are looking to add captions/subtitles dynamically, make sure that you have a default track element with an empty.vtt file as source. That way, the empty file won't be displayed at all and the dynamically added ones will be considered. For example:

label: 'English',
default: true
default: true,
});

@@ -202,3 +202,3 @@ player.addCaptions({

kind: 'subtitles',
label: '日本語'
label: '日本語',
});

@@ -260,3 +260,3 @@ player.init();

import OpenPlayerJS from 'openplayerjs';
import 'openplayerjs/dist/openplayer.css'
import 'openplayerjs/dist/openplayer.css';

@@ -271,4 +271,4 @@ export default function Sample() {

<div>
<video id='player' className='op-player__media' controls playsInline>
<source src='https://my.test.com/video.mp4' type='video/mp4' />
<video id="player" className="op-player__media" controls playsInline>
<source src="https://my.test.com/video.mp4" type="video/mp4" />
</video>

@@ -275,0 +275,0 @@ </div>

{
"name": "openplayerjs",
"version": "2.14.3",
"version": "2.14.4",
"homepage": "https://www.openplayerjs.com/",

@@ -52,4 +52,3 @@ "author": {

"test:sources": "karma start --single-run --browsers ChromeHeadless --log-level info karma.conf.js",
"test:dev": "karma start --watch --browsers Chrome karma.conf.js",
"coveralls": "cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js"
"test:dev": "karma start --watch --browsers Chrome karma.conf.js"
},

@@ -77,3 +76,2 @@ "readme": "https://github.com/openplayerjs/openplayerjs/blob/master/README.md",

"copy-webpack-plugin": "^11.0.0",
"coveralls": "^3.1.1",
"cssnano": "^5.1.11",

@@ -80,0 +78,0 @@ "eslint": "^8.17.0",

@@ -108,3 +108,3 @@ # [OpenPlayer.js](https://www.openplayerjs.com)

- [Ads playlist (multiple URLs)](https://codepen.io/rafa8626/pen/wvvxbMN)
- [🆕 - Add a custom element (watermark)](https://codepen.io/rafa8626/pen/JjLQNjo)
- [Add a custom element (watermark)](https://codepen.io/rafa8626/pen/JjLQNjo)

@@ -111,0 +111,0 @@ ### Advanced

@@ -12,3 +12,5 @@ import { PlayerComponent, SettingsItem } from '../interfaces';

private _setDefaultTrack;
private _showCaptions;
private _hideCaptions;
}
export default Captions;

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

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