iandevlin / iandevlin.github.io Goto Github PK

When I would use your player files in my repository to reproduce your player, the view source code would return a 404 whenever I would clicked on a subtitle.

So to better mimic the action in your player, I shortened the folder name subtitles/vtt ,which would automatically add a vtt folder to the repository (unlike your repository, which added no vtt file) , to plain subtitles, and still the view source delivered a 404 for each subtitle.

So I linked directly to your repository's raw subtitle files, and no 404s, but player's subtitles still not working.

Can I just check - I'm assuming that this code is open licensed per https://developer.mozilla.org/en-US/docs/MDN/About#Copyrights_and_licenses - have I got that right? I couldn't see anything explicit...

Joe

I downloaded the proper files from the video-player-with-captions folder. I reproduced your player.

The captions won't work from my Github account (https://peggysuechan.github.io/video-player-with-captions/) nor from files saved on my computer, no from my reproduction of the player in Blogger (https://iandevlinnewest.blogspot.com/).

Perhaps subtitles work from only your Github site.

I found a way to switch between inline and fullscreen video on iOS since they added a playsinline attribute to safari mobile from iOS 10 and up.

https://webkit.org/blog/6784/new-video-policies-for-ios/

The video would have these attributes:

<video playsinline webkit-playsinline></video>

When clicking the fullscreen button on iOS you would:

vid.removeAttribute('playsinline');
vid.removeAttribute('webkit-playsinline');
vid.play();

Then when you detect the fullscreen closing:

document.addEventListener('fullscreenchange', function() {
  if (!isFullScreen ()) {
    vid.setAttribute('playsinline', '');
    vid.setAttribute('webkit-playsinline', '');
  }
}

Hi!
first of all, thank you for this awesome player.
I've got some issue: when I try to play Hebrew subtitles, It shows only "???" instead of text (for example: "טקסט לדוגמה" - translation from hebrew: "Example Text")
I tried to change the page charset to WINDOWS-1255 but still "???" and even tried to convert the hebrew into unicode and then it showed as &#[...];

How can I fix this? can you help me?

Thanks again, this is really awesome! 👍

Assuming because using the HTML code on multiple elements in the page creates duplicate IDs?

Is there a way to have this style the icons of ALL instances on the page by using GetElementsByClassName rather than GetElementByID?

Custom controls bar is cannot be toggled in full screen mode in Chrome (not sure about other browsers at the moment). It looks to be some quirky z-index by the "video:-webkit-full-screen" user agent Chrome style sheet. I have for some hours try to add new positioning and z-indexing to parents its and the controls without any luck of getting the controls bar z-index to be higher that the video to make it interactive. Please let me know if there is so solution you can help with.

You can replicate the issue but clicking fullscreen mode here and then trying to toggle the custom control bar options. http://iandevlin.github.io/mdn/video-player/