Skip to content

Commit

Permalink
Log stuff from YT JS API
Browse files Browse the repository at this point in the history
  • Loading branch information
Foxocube committed Jan 1, 2025
1 parent 3218b23 commit 74a1c76
Show file tree
Hide file tree
Showing 2 changed files with 54 additions and 84 deletions.
53 changes: 32 additions & 21 deletions MediaFeeder/MediaFeeder/Providers/Youtube/VideoFrame.razor
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,65 +16,77 @@
{
if (firstRender)
{
var _youtubeLibraryModule = await JsRuntime.InvokeAsync<IJSObjectReference>("import", "/iframe_api.js");
var youtubeLibraryModule = await JsRuntime.InvokeAsync<IJSObjectReference>("import", "/iframe_api.js");
_youtubeCustomModule = await JsRuntime.InvokeAsync<IJSObjectReference>("import", "/youtube.js");

Console.WriteLine($"_youtubeLibraryModule: {JsonSerializer.Serialize(youtubeLibraryModule)}");
Console.WriteLine($"_youtubeCustomModule: {JsonSerializer.Serialize(_youtubeCustomModule)}");

_videoFrameRef ??= DotNetObjectReference.Create(this);
await _youtubeCustomModule.InvokeVoidAsync("initPlayer", _videoFrameRef, VideoId);
}
}
var player = await _youtubeCustomModule.InvokeAsync<object>("initPlayer", _videoFrameRef, VideoId);

protected override async Task OnParametersSetAsync()
{
if (_youtubeCustomModule != null)
{
Console.WriteLine($"player: {JsonSerializer.Serialize(player)}");
}
}

[JSInvokable]
public Task onPlayerReady(JsonElement eventData)
public Task OnPlayerReady(JsonElement eventData)
{
Console.WriteLine("Player Ready: ");
Console.WriteLine($"Player Ready: {JsonSerializer.Serialize(eventData)}");
// event.target.playVideo();
return Task.CompletedTask;
}

[JSInvokable]
public Task onPlaybackQualityChange(JsonElement eventData)
public Task OnPlaybackQualityChange(JsonElement eventData)
{
Console.WriteLine("Quality change: ");
Console.WriteLine($"Quality change: {JsonSerializer.Serialize(eventData)}");

return Task.CompletedTask;
}

[JSInvokable]
public Task onPlaybackRateChange(object eventData)
public Task OnPlaybackRateChange(object eventData)
{
Console.WriteLine("Playback rate change: ");
Console.WriteLine($"Playback rate change: {JsonSerializer.Serialize(eventData)}");

return Task.CompletedTask;
}

[JSInvokable]
public Task onError(object eventData)
public Task OnError(object eventData)
{
Console.WriteLine("Playback Error: ");
Console.WriteLine($"Playback Error: {JsonSerializer.Serialize(eventData)}");

// if(eventData.data == 150) {
// // "This error is the same as 101. It's just a 101 error in disguise!" - from the YT API Documentation, not 100% this is true.
// // Skip to the next video after 10 seconds, do not mark as watched.
// setTimeout(goNextVideo, 10 * 1000);
// }
return Task.CompletedTask;
}

[JSInvokable]
public Task onApiChange(object eventData)
public Task OnApiChange(object eventData)
{
Console.WriteLine("API Change: ");
Console.WriteLine($"API Change: {JsonSerializer.Serialize(eventData)}");

return Task.CompletedTask;
}

[JSInvokable]
public Task onPlayerStateChange(JsonElement eventData)
public Task OnPlayerStateChange(JsonElement eventData)
{
Console.WriteLine("State change: ");
Console.WriteLine($"State change: {JsonSerializer.Serialize(eventData)}");

// if (event.data == YT.PlayerState.ENDED) {
// console.log("Video finished!");
// setWatchedStatus(1);
// } else if (event.data == YT.PlayerState.UNSTARTED) {
// player.playVideo();
// }
return Task.CompletedTask;
}
Expand All @@ -85,5 +97,4 @@
// _youtubeLibraryModule?.DisposeAsync();
_youtubeCustomModule?.DisposeAsync();
}

}
85 changes: 22 additions & 63 deletions MediaFeeder/MediaFeeder/wwwroot/youtube.js
View file
Original file line number Diff line number Diff line change
@@ -1,68 +1,27 @@
let player;
let dotNetHelper;

export function initPlayer(DotNetHelper, videoId) {
function initPlayer(DotNetHelper, videoId)
{
"use strict";
console.log("Starting player init");
dotNetHelper = DotNetHelper;
player = new YT.Player('ytplayer', {
height: '100%',
width: '100%',
videoId: videoId,
playerVars: {
origin: window.location,
autoplay: 1,
},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange,
'onPlaybackQualityChange': onPlaybackQualityChange,
'onPlaybackRateChange': onPlaybackRateChange,
'onError': onError,
'onApiChange': onApiChange
}
});
}

function onPlayerReady(event) {
dotNetHelper.invokeMethodAsync('onPlayerReady', event);
console.log("Player Ready: ", event);
event.target.playVideo();
}

function onPlaybackQualityChange(event) {
dotNetHelper.invokeMethodAsync('onPlaybackQualityChange', event);
console.log("Quality change: ", event);
}

function onPlaybackRateChange(event) {
dotNetHelper.invokeMethodAsync('onPlaybackRateChange', event);
console.log("Playback rate change: ", event);
}

function onError(event) {
dotNetHelper.invokeMethodAsync('onError', event);
console.log("Playback Error: ", event);
if(event.data == 150) {
// "This error is the same as 101. It's just a 101 error in disguise!" - from the YT API Documentation, not 100% this is true.
// Skip to the next video after 10 seconds, do not mark as watched.
setTimeout(goNextVideo, 10 * 1000);
}
}

function onApiChange(event) {
dotNetHelper.invokeMethodAsync('onApiChange', event);
console.log("API Change: ", event);
}

function onPlayerStateChange(event) {
dotNetHelper.invokeMethodAsync('onPlayerStateChange', event);
console.log("State change: ", event);
if (event.data == YT.PlayerState.ENDED) {
console.log("Video finished!");
setWatchedStatus(1);
} else if (event.data == YT.PlayerState.UNSTARTED) {
player.playVideo();
}
return new YT.Player(
'ytplayer',
{
height: '100%',
width: '100%',
videoId: videoId,
playerVars: {
origin: window.location,
autoplay: 1,
},
events: {
'onReady': (event => DotNetHelper.invokeMethodAsync('OnPlayerReady', event)),
'onStateChange': (event => DotNetHelper.invokeMethodAsync('OnPlayerStateChange', event)),
'onPlaybackQualityChange': (event => DotNetHelper.invokeMethodAsync('OnPlaybackQualityChange', event)),
'onPlaybackRateChange': (event => DotNetHelper.invokeMethodAsync('OnPlaybackRateChange', event)),
'onError': (event => DotNetHelper.invokeMethodAsync('OnError', event)),
'onApiChange': (event => DotNetHelper.invokeMethodAsync('OnApiChange', event)),
}
});
}

// function isFullScreen() {
Expand Down

0 comments on commit 74a1c76

Please sign in to comment.