Request for information on jellyfin web files

sudo-kraken commented 2 years ago

I map Jellyfins web config to an external docker volume, so that I can modify the UI, please can you tell me which files exactly you have modified in here so that I can reintroduce my modifications into the web ui. I also want to make a modified Jellyfin android tv apk and windows client to work with intro-skipper so this would help massively.

Thanks and great work.

sudo-kraken commented 2 years ago

Or do you have any way to get this to work on all clients other than just the browser player?

JamsRepos commented 2 years ago

This is the same with me, my front end is heavily modified. I'd love to know the edits I can make myself to do this. It would be beneficial to have docs on how to manually do the amends for people in the same boat.

ConfusedPolarBear commented 2 years ago

Web interface source code:

The source code for the modified web interface is in my fork of the jellyfin-web repo. The only modified files in it are:

src/assets/css/videoosd.scss
src/controllers/playback/video/index.html
src/controllers/playback/video/index.js

Implementation details:

When playback starts, the added code makes an authenticated GET request to [jellyfin server]/Episode/[item id]/IntroTimestamps. If an intro was found, a JSON object will be returned, similar to the following:

{
    "EpisodeId": "[item id]",
    "Valid": true,
    "IntroStart": 100,
    "IntroEnd": 130,
    "ShowSkipPromptAt": 95,
    "HideSkipPromptAt": 110
}

All timestamps are in seconds.

JamsRepos commented 2 years ago

Thanks! Might be good to document it out still for the future as people would need to wait for you to post a new version of Jellyfin before they could fix it up. Just allows people to not have to depend on the repo owner :) I'll give it a go now and report back if I have any issues, thanks!

sudo-kraken commented 2 years ago

Web interface source code:

The source code for the modified web interface is in my fork of the jellyfin-web repo. The only modified files in it are:

src/assets/css/videoosd.scss

src/controllers/playback/video/index.html

src/controllers/playback/video/index.js

Implementation details:

When playback starts, the added code makes an authenticated GET request to [jellyfin server]/Episode/[item id]/IntroTimestamps. If an intro was found, a JSON object will be returned, similar to the following:
{
    "EpisodeId": "[item id]",
    "Valid": true,
    "IntroStart": 100,
    "IntroEnd": 130,
    "ShowSkipPromptAt": 95,
    "HideSkipPromptAt": 110
}
All timestamps are in seconds.

Do you know which post build files are modified ?

Fallenbagel commented 2 years ago

Web interface source code:

The source code for the modified web interface is in my fork of the jellyfin-web repo. The only modified files in it are:

src/assets/css/videoosd.scss

src/controllers/playback/video/index.html

src/controllers/playback/video/index.js

Implementation details:

When playback starts, the added code makes an authenticated GET request to [jellyfin server]/Episode/[item id]/IntroTimestamps. If an intro was found, a JSON object will be returned, similar to the following:
{
    "EpisodeId": "[item id]",
    "Valid": true,
    "IntroStart": 100,
    "IntroEnd": 130,
    "ShowSkipPromptAt": 95,
    "HideSkipPromptAt": 110
}
All timestamps are in seconds.

I just build the jellyfin TizenOS with your modified web client. Thanks for the info!

Fallenbagel commented 2 years ago

I just build the jellyfin TizenOS with your modified web client. Thanks for the info!

However, I had to remove Line #448 playbackManager.playPause(currentPlayer); as from my testing i found out that it just pauses it after skipping. After I removed the line, it worked as intended. Any reason why you added it?

Fallenbagel commented 2 years ago

@ConfusedPolarBear Also I just wanted to thank again. Just compiled Jellyfin Media Player with your modifications and works like a charm!

https://user-images.githubusercontent.com/98979876/173155392-e84f1dc8-a675-46a0-b878-c5c7b2a4b412.mp4

ConfusedPolarBear commented 2 years ago

I just build the jellyfin TizenOS with your modified web client. Thanks for the info!

However, I had to remove Line #448 playbackManager.playPause(currentPlayer); as from my testing i found out that it just pauses it after skipping. After I removed the line, it worked as intended. Any reason why you added it?

I was running into issues with Chrome pausing playback after it skipped the intro.

Fallenbagel commented 2 years ago

I just build the jellyfin TizenOS with your modified web client. Thanks for the info!

However, I had to remove Line #448 playbackManager.playPause(currentPlayer); as from my testing i found out that it just pauses it after skipping. After I removed the line, it worked as intended. Any reason why you added it?

I was running into issues with Chrome pausing playback after it skipped the intro.

Ah. Well removing the line worked for tizenOS and keeping as is worked for jellyfin media player

ma-karai commented 2 years ago

src/controllers/playback/video/index.html

is it not simpler to just overwrite this with the docker compose, instead of setting up a whole fork ?

DigitalWriting-Dev commented 2 years ago

Web interface source code: The source code for the modified web interface is in my fork of the jellyfin-web repo. The only modified files in it are:

src/assets/css/videoosd.scss

src/controllers/playback/video/index.html

src/controllers/playback/video/index.js

Implementation details: When playback starts, the added code makes an authenticated GET request to [jellyfin server]/Episode/[item id]/IntroTimestamps. If an intro was found, a JSON object will be returned, similar to the following:
{
    "EpisodeId": "[item id]",
    "Valid": true,
    "IntroStart": 100,
    "IntroEnd": 130,
    "ShowSkipPromptAt": 95,
    "HideSkipPromptAt": 110
}
All timestamps are in seconds.
Do you know which post build files are modified ?

I would also like to know.

I've edited playback-video-index-html.*********************.chunk.js which enabled the UI element to show, and added the CSS to my custom CSS, but I'm not sure exactly where and how to add the actual script that displays the button and skips.

Pfuenzle commented 2 years ago

Did anyone manage to make a modified Android-TV client? I looked into the code and its Kotlin and doesn't use the HTML Web-UI from what Ive seen, so it probably will be some extra changes. I have basically no experience in Kotlin, but I have some experience with Android development, so if no one has tackled the Android client I think I will get to it when I'm back at home next week.

Also, @Fallenbagel, do you plan on publishing your Jellyfin Desktop fork? Would be great :) Or even better, try to make a pull request to the official repo? If I'm not wrong, the changes should not influence non-plugin users and will only be one additional request per stream, so maybe they will accept it in the client?

Fallenbagel commented 2 years ago

Did anyone manage to make a modified Android-TV client? I looked into the code and its Kotlin and doesn't use the HTML Web-UI from what Ive seen, so it probably will be some extra changes. I have basically no experience in Kotlin, but I have some experience with Android development, so if no one has tackled the Android client I think I will get to it when I'm back at home next week.

I started this but I got busy with my application (jellyseerr). And I also dont know kotlin much so I was struggling a bit but I'll still see if i can get it done too

Also, @Fallenbagel, do you plan on publishing your Jellyfin Desktop fork? Would be great :) Or even better, try to make a pull request to the official repo?

Do you think me distributing that would be a breach of license?(if not i could upload it to my forked repo) I do have it forked in my repo w the instructions on how to build it tho (its a bit of a hassle as it requires a lot of pre-requisites) (btw i I love this plugin i also CSS'd it to look nicer)

https://user-images.githubusercontent.com/98979876/173851298-ba996bab-4b51-47d6-a149-b7ba121f094c.mp4

If I'm not wrong, the changes should not influence non-plugin users and will only be one additional request per stream, so maybe they will accept it in the client?

Would they accept is my question? because it is not an official plugin? Like would they add a functionality that will only work if the community based plugin is installed?

Pfuenzle commented 2 years ago

I started this but I got busy with my application (jellyseerr). And I also dont know kotlin much so I was struggling a bit but I'll still see if i can get it done too

That would be great, if you are still busy by next week I'm happy to help you with it. Great work on jellyseer btw. Saw it on Reddit some time ago but did not recognize you here, also thanks for the updated anilist-sync plugin :D

Do you think me distributing that would be a breach of license?

I dont think so, they are releasing under https://github.com/jellyfin/jellyfin-media-player/blob/master/LICENSE, you could even sell your fork commercially, so you should be fine

do have it forked in my repo w the instructions on how to build it tho

I feel like I'm blind, but are you sure the repo is public? I did not see it on your profile. Also if you want to release pre-built releases that would be great, but I'm also happy to build it myself.

i also CSS'd it to look nicer

This looks great! Do you want to add this to ConfusedPolarBears's Jellyfin-Web repo if hes okay with it? Looks really pleasing.

Would they accept is my question?

Well, that is a good question. In itself probably not, but its a pretty minor change and does not influence the non-plugin users at all. The worst thing that could happen is an additional request to the server on every stream start, which is basically nothing. Even if they don't accept it, in my opinion it is worth a try.

Fallenbagel commented 2 years ago

That would be great, if you are still busy by next week I'm happy to help you with it. Great work on jellyseer btw. Saw it on Reddit some time ago but did not recognize you here, also thanks for the updated anilist-sync plugin :D

Any help would be really appreciated because I'm going in with no clues either. Also thanks c:

I feel like I'm blind, but are you sure the repo is public? I did not see it on your profile. Also if you want to release pre-built releases that would be great, but I'm also happy to build it myself.

OH. My dumbass did not make it public sorry. Let me make it public and upload it if it is not going to be any issue with the devs.

This looks great! Do you want to add this to ConfusedPolarBears's Jellyfin-Web repo if hes okay with it? Looks really pleasing.

I opened a pull request in ConfusedPolarBear's jellyfin-web repo sometime ago but I don't think they saw

Well, that is a good question. In itself probably not, but its a pretty minor change and does not influence the non-plugin users at all. The worst thing that could happen is an additional request to the server on every stream start, which is basically nothing. Even if they don't accept it, in my opinion it is worth a try.

I'll give it a try tonight. Let me first upload it rn

EDIT: @Pfuenzle I have uploaded it Jellyfin Media Player v1.7.0 with the intro-skip button

ma-karai commented 2 years ago

Besides running a new Jellyfin server image, is there another way to incorporate the button?

ConfusedPolarBear commented 2 years ago

Besides running a new Jellyfin server image, is there another way to incorporate the button?

I added instructions on how to do this here - let me know if method 1 works for you.

Arbitrate3280 commented 2 years ago

I've added this line:

- '/full/path/to/extracted/archive/dist:/jellyfin/jellyfin-web:ro' # <== add this line

unfortunately it doesn't seem to do anything. Do you have any directions on how I should go about figuring out why it's not working?

I'm not using the official docker image btw, but the linuxserver one, just in case it's relevant.

edit: it works as expected in the official docker image.

edit2: use this if using the linuxserver image - '/full/path/to/extracted/archive/dist:/usr/share/jellyfin/web # <== add this line

thyme676 commented 2 years ago

Besides running a new Jellyfin server image, is there another way to incorporate the button?

I added instructions on how to do this here - let me know if method 1 works for you.

Can we get a little more information on how to do this with a non-containerized setup? Maybe with an example?

Sorry - I figured it out, Thank you!

ma-karai commented 2 years ago

Besides running a new Jellyfin server image, is there another way to incorporate the button?

I added instructions on how to do this here - let me know if method 1 works for you.

can I use the same approach for the linuxserver image?

florensie commented 1 year ago

Besides running a new Jellyfin server image, is there another way to incorporate the button?

I added instructions on how to do this here - let me know if method 1 works for you.

I really wish it just worked out of the box: Jellyscrub manages to do it. Neither of those options listed are particularly great.

ConfusedPolarBear / intro-skipper

Request for information on jellyfin web files #10