ProximaEntertainment/plyr
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use div for poster, Vimeo fixes, Tooltip fixes

Browse Source
This commit is contained in:
Sam Potts
2018-05-08 12:57:24 +10:00
parent 1491b017a0
commit 90919411e9
21 changed files with 140 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
demo/dist/demo.css vendored
View File

File diff suppressed because one or more lines are too long

33
demo/dist/demo.js vendored
View File

@ -3948,6 +3948,39 @@ singleton.Client = Client;
'airplay',
'fullscreen',
], */
/* i18n: {
restart: '重新開始',
rewind: '快退{seektime}秒',
play: '播放',
pause: '暫停',
fastForward: '快進{seektime}秒',
seek: '尋求',
played: '發揮',
buffered: '緩衝的',
currentTime: '當前時間戳',
duration: '長短',
volume: '音量',
mute: '靜音',
unmute: '取消靜音',
enableCaptions: '開啟字幕',
disableCaptions: '關閉字幕',
enterFullscreen: '進入全螢幕',
exitFullscreen: '退出全螢幕',
frameTitle: '球員為{title}',
captions: '字幕',
settings: '設定',
speed: '速度',
normal: '正常',
quality: '質量',
loop: '循環',
start: 'Start',
end: 'End',
all: 'All',
reset: '重啟',
disabled: '殘',
enabled: '啟用',
advertisement: '廣告',
}, */
captions: {
active: true
},

2
demo/dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
demo/dist/demo.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

33
demo/src/js/demo.js
View File

@ -74,6 +74,39 @@ import Raven from 'raven-js';
'airplay',
'fullscreen',
], */
/* i18n: {
restart: '重新開始',
rewind: '快退{seektime}秒',
play: '播放',
pause: '暫停',
fastForward: '快進{seektime}秒',
seek: '尋求',
played: '發揮',
buffered: '緩衝的',
currentTime: '當前時間戳',
duration: '長短',
volume: '音量',
mute: '靜音',
unmute: '取消靜音',
enableCaptions: '開啟字幕',
disableCaptions: '關閉字幕',
enterFullscreen: '進入全螢幕',
exitFullscreen: '退出全螢幕',
frameTitle: '球員為{title}',
captions: '字幕',
settings: '設定',
speed: '速度',
normal: '正常',
quality: '質量',
loop: '循環',
start: 'Start',
end: 'End',
all: 'All',
reset: '重啟',
disabled: '殘',
enabled: '啟用',
advertisement: '廣告',
}, */
captions: {
active: true,
},

2
dist/plyr.css vendored
View File

File diff suppressed because one or more lines are too long

16
dist/plyr.js vendored
View File

@ -1214,7 +1214,7 @@ var utils = {
}
// Vimeo
if (/^https?:\/\/player.vimeo.com\/video\/\d{8,}(?=\b|\/)/.test(url)) {
if (/^https?:\/\/player.vimeo.com\/video\/\d{0,9}(?=\b|\/)/.test(url)) {
return providers.vimeo;
}
@ -3814,10 +3814,10 @@ var defaults$1 = {
// Localisation
i18n: {
restart: 'Restart',
rewind: 'Rewind {seektime} secs',
rewind: 'Rewind {seektime}s',
play: 'Play',
pause: 'Pause',
fastForward: 'Forward {seektime} secs',
fastForward: 'Forward {seektime}s',
seek: 'Seek',
played: 'Played',
buffered: 'Buffered',
@ -3946,13 +3946,14 @@ var defaults$1 = {
// Class hooks added to the player in different states
classNames: {
type: 'plyr--{0}',
provider: 'plyr--{0}',
video: 'plyr__video-wrapper',
embed: 'plyr__video-embed',
embedContainer: 'plyr__video-embed__container',
poster: 'plyr__poster',
ads: 'plyr__ads',
control: 'plyr__control',
type: 'plyr--{0}',
provider: 'plyr--{0}',
playing: 'plyr--playing',
paused: 'plyr--paused',
stopped: 'plyr--stopped',
@ -4920,6 +4921,7 @@ var vimeo = {
var options = {
loop: player.config.loop.active,
autoplay: player.autoplay,
// muted: player.muted,
byline: false,
portrait: false,
title: false,
@ -4949,7 +4951,7 @@ var vimeo = {
iframe.setAttribute('allow', 'autoplay');
// Inject the package
var wrapper = utils.createElement('div');
var wrapper = utils.createElement('div', { class: player.config.classNames.embedContainer });
wrapper.appendChild(iframe);
player.media = utils.replaceElement(wrapper, player.media);
@ -5769,7 +5771,7 @@ var media = {
utils.wrap(this.media, this.elements.wrapper);
// Faux poster container
this.elements.poster = utils.createElement('span', {
this.elements.poster = utils.createElement('div', {
class: this.config.classNames.poster
});

2
dist/plyr.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/plyr.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/plyr.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

48
dist/plyr.polyfilled.js vendored
View File

@ -6248,7 +6248,7 @@ var utils = {
}
// Vimeo
if (/^https?:\/\/player.vimeo.com\/video\/\d{8,}(?=\b|\/)/.test(url)) {
if (/^https?:\/\/player.vimeo.com\/video\/\d{0,9}(?=\b|\/)/.test(url)) {
return providers.vimeo;
}
@ -8848,10 +8848,10 @@ var defaults$1 = {
// Localisation
i18n: {
restart: 'Restart',
rewind: 'Rewind {seektime} secs',
rewind: 'Rewind {seektime}s',
play: 'Play',
pause: 'Pause',
fastForward: 'Forward {seektime} secs',
fastForward: 'Forward {seektime}s',
seek: 'Seek',
played: 'Played',
buffered: 'Buffered',
@ -8980,13 +8980,14 @@ var defaults$1 = {
// Class hooks added to the player in different states
classNames: {
type: 'plyr--{0}',
provider: 'plyr--{0}',
video: 'plyr__video-wrapper',
embed: 'plyr__video-embed',
embedContainer: 'plyr__video-embed__container',
poster: 'plyr__poster',
ads: 'plyr__ads',
control: 'plyr__control',
type: 'plyr--{0}',
provider: 'plyr--{0}',
playing: 'plyr--playing',
paused: 'plyr--paused',
stopped: 'plyr--stopped',
@ -9954,6 +9955,7 @@ var vimeo = {
var options = {
loop: player.config.loop.active,
autoplay: player.autoplay,
// muted: player.muted,
byline: false,
portrait: false,
title: false,
@ -9983,7 +9985,7 @@ var vimeo = {
iframe.setAttribute('allow', 'autoplay');
// Inject the package
var wrapper = utils.createElement('div');
var wrapper = utils.createElement('div', { class: player.config.classNames.embedContainer });
wrapper.appendChild(iframe);
player.media = utils.replaceElement(wrapper, player.media);
@ -10803,7 +10805,7 @@ var media = {
utils.wrap(this.media, this.elements.wrapper);
// Faux poster container
this.elements.poster = utils.createElement('span', {
this.elements.poster = utils.createElement('div', {
class: this.config.classNames.poster
});
@ -13075,6 +13077,38 @@ var Plyr = function () {
value: function loadSprite(url, id) {
return utils.loadSprite(url, id);
}
/**
* Setup multiple instances
* @param {*} selector
* @param {object} options
*/
}, {
key: 'setup',
value: function setup(selector) {
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var targets = null;
if (utils.is.string(selector)) {
targets = Array.from(document.querySelectorAll(selector));
} else if (utils.is.nodeList(selector)) {
targets = Array.from(selector);
} else if (utils.is.array(selector)) {
targets = selector.filter(function (i) {
return utils.is.element(i);
});
}
if (utils.is.empty(targets)) {
return null;
}
return targets.map(function (t) {
return new Plyr(t, options);
});
}
}]);
return Plyr;
}();

2
dist/plyr.polyfilled.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/plyr.polyfilled.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/plyr.polyfilled.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

9
src/js/defaults.js
View File

@ -157,10 +157,10 @@ const defaults = {
// Localisation
i18n: {
restart: 'Restart',
rewind: 'Rewind {seektime} secs',
rewind: 'Rewind {seektime}s',
play: 'Play',
pause: 'Pause',
fastForward: 'Forward {seektime} secs',
fastForward: 'Forward {seektime}s',
seek: 'Seek',
played: 'Played',
buffered: 'Buffered',
@ -326,13 +326,14 @@ const defaults = {
// Class hooks added to the player in different states
classNames: {
type: 'plyr--{0}',
provider: 'plyr--{0}',
video: 'plyr__video-wrapper',
embed: 'plyr__video-embed',
embedContainer: 'plyr__video-embed__container',
poster: 'plyr__poster',
ads: 'plyr__ads',
control: 'plyr__control',
type: 'plyr--{0}',
provider: 'plyr--{0}',
playing: 'plyr--playing',
paused: 'plyr--paused',
stopped: 'plyr--stopped',

2
src/js/media.js
View File

@ -39,7 +39,7 @@ const media = {
utils.wrap(this.media, this.elements.wrapper);
// Faux poster container
this.elements.poster = utils.createElement('span', {
this.elements.poster = utils.createElement('div', {
class: this.config.classNames.poster,
});

3
src/js/plugins/vimeo.js
View File

@ -53,6 +53,7 @@ const vimeo = {
const options = {
loop: player.config.loop.active,
autoplay: player.autoplay,
// muted: player.muted,
byline: false,
portrait: false,
title: false,
@ -82,7 +83,7 @@ const vimeo = {
iframe.setAttribute('allow', 'autoplay');
// Inject the package
const wrapper = utils.createElement('div');
const wrapper = utils.createElement('div', { class: player.config.classNames.embedContainer });
wrapper.appendChild(iframe);
player.media = utils.replaceElement(wrapper, player.media);

2
src/js/utils.js
View File

@ -723,7 +723,7 @@ const utils = {
}
// Vimeo
if (/^https?:\/\/player.vimeo.com\/video\/\d{8,}(?=\b|\/)/.test(url)) {
if (/^https?:\/\/player.vimeo.com\/video\/\d{0,9}(?=\b|\/)/.test(url)) {
return providers.vimeo;
}

4
src/sass/components/embed.scss
View File

@ -32,8 +32,8 @@ $embed-padding: ((100 / 16) * 9);
pointer-events: none;
}
// Vimeo hack
> div {
// Only used for Vimeo
> .plyr__video-embed__container {
padding-bottom: to-percentage($height);
position: relative;
transform: translateY(-$offset);

1
src/sass/components/tooltips.scss
View File

@ -19,6 +19,7 @@
transform: translate(-50%, 10px) scale(0.8);
transform-origin: 50% 100%;
transition: transform 0.2s 0.1s ease, opacity 0.2s 0.1s ease;
white-space: nowrap;
z-index: 2;
// The background triangle

4
yarn.lock
View File

@ -4857,8 +4857,8 @@ nanomatch@^1.2.9:
to-regex "^3.0.1"
natives@^1.1.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/natives/-/natives-1.1.1.tgz#011acce1f7cbd87f7ba6b3093d6cd9392be1c574"
version "1.1.3"
resolved "https://registry.yarnpkg.com/natives/-/natives-1.1.3.tgz#44a579be64507ea2d6ed1ca04a9415915cf75558"
natural-compare@^1.4.0:
version "1.4.0"