Is it possible to directly source a Youtube?

[b0ot]

On the examples page, there is a videojs with the source: https://www.youtube.com/watch?v=I3W1kyp9Jpc, however the actual code uses local video

    <video id="video" class="video-js  vjs-fluid vjs-default-skin vjs-big-play-centered vjs-controls-enabled" crossorigin="anonymous" playsinline="playsinline" controls="" loop="">
        <source src="https://naver.github.io/egjs-view360/examples/panoviewer/etc/img/seven.mp4" type="video/mp4">
        <source src="https://naver.github.io/egjs-view360/examples/panoviewer/etc/img/seven.webm" type="video/webm">
        <p class="vjs-no-js">
            To view this video please enable JavaScript, and consider upgrading to a web browser that
            <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
        </p>
    </video>

Would it be possible to source directly to the YouTube video?

I thought I might be able to use the videojs YouTube plugin
https://github.com/videojs/videojs-youtube

and change the source to

    <video id="video" class="video-js  vjs-fluid vjs-default-skin vjs-big-play-centered vjs-controls-enabled" crossorigin="anonymous" playsinline="playsinline" controls="" loop=""   data-setup='{ "techOrder": ["youtube"], "sources": [{ "type": "video/youtube", "src": "https://www.youtube.com/watch?v=I3W1kyp9Jpc"}]}'>
    </video>

However, this didn't seem to work.

[WoodNeck]

Hello, sorry for being late in answering this, we were busy making the new version of View360.

View360 does not support this feature, and I guess it couldn't be supported used with videojs-youtube also.
I tried the videojs-youtube, and found out that it uses Youtube's iframe player API internally.
The reason View360 doesn't work is that the video element that View360 is referencing is not the actual one that Youtube uses.
You can see the video element is removed from the document (video.parentElement is null)

videojs-youtube creates iframe inside the videojs wrapper, and that's the actual video player that videojs uses.
So, if we can get the actual <video> element inside the iframe View360 will work normally, but that's not possible unless we're using the same domain.

• https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/contentDocument

So basically, it doesn't look possible with the method you mentioned. You should use the downloaded media files unless we find another way to do it.
You can check the DOM structure I mentioned in the demo I made:

• https://codesandbox.io/s/serene-wildflower-hw7xk8?file=/src/App.tsx:0-947