iv-org/videojs-vtt-thumbnails
1
0
Fork 0
mirror of https://github.com/iv-org/videojs-vtt-thumbnails.git synced 2024-10-01 03:05:36 -04:00
Code Issues Packages Projects Releases Wiki Activity

Now the thumbnails are contained in the video area

Browse Source
This commit is contained in:
agomez@bitcentral.net 2019-08-01 17:09:32 -05:00
parent d2ef719bfb
commit ac065249e3
1 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/plugin.js
View File

@ -25,7 +25,7 @@ const registerPlugin = videojs.registerPlugin || videojs.plugin
*/ */
const onPlayerReady = (player, options) => { const onPlayerReady = (player, options) => {
player.addClass('vjs-vtt-thumbnails'); player.addClass('vjs-vtt-thumbnails');
player.vttThumbnails = new vttThumbnailsPlugin(player, options) player.vttThumbnails = new vttThumbnailsPlugin(player, options);
} }
/** /**
@ -230,9 +230,19 @@ class vttThumbnailsPlugin {
} }
const xPos = percent * width const xPos = percent * width
const thumbnailWidth=parseInt(currentStyle.width)
this.thumbnailHolder.style.transform = 'translateX(' + xPos + 'px)' const halfthumbnailWidth= thumbnailWidth>> 1
this.thumbnailHolder.style.marginLeft = '-' + (parseInt(currentStyle.width) / 2) + 'px' const marginRight= width-(xPos+halfthumbnailWidth);
const marginLeft= xPos-halfthumbnailWidth;
if(marginLeft >0 && marginRight>0) {
this.thumbnailHolder.style.transform = 'translateX(' + (xPos-halfthumbnailWidth) + 'px)'
}
else if(marginLeft <= 0) {
this.thumbnailHolder.style.transform = 'translateX(' + 0 + 'px)'
}
else if(marginRight <=0 ) {
this.thumbnailHolder.style.transform = 'translateX(' + (width-thumbnailWidth) + 'px)'
}
if (this.lastStyle && this.lastStyle === currentStyle) { if (this.lastStyle && this.lastStyle === currentStyle) {
return return