Jellyfin Forum
Featured Content Bar - Printable Version

+- Jellyfin Forum (https://forum.jellyfin.org)
+-- Forum: Support (https://forum.jellyfin.org/f-support)
+--- Forum: General Questions (https://forum.jellyfin.org/f-general-questions)
+--- Thread: Featured Content Bar (/t-featured-content-bar)

Pages: 1 2 3 4 5 6 7 8 9


RE: Featured Content Bar - EduardoUK - 2024-09-28

Thank you for helping, when adding the volumes my web client / interface stops working so while i think we are on the right track I must be doing something wrong.

If I can get things working I'm happy to write a guide for anyone else strugling with this configuration.


RE: Featured Content Bar - TheDreadPirate - 2024-09-28

TLDR, you can't. I've seen many try and I don't recall any succeeding. The only way I can think of, though I haven't tried this, would be to install the jellyfin-web package directly in the OS without the server package and then mount the the host path for jellyfin-web into the container. A hybrid docker/package Jellyfin setup. Sounds like a PITA, though.


RE: Featured Content Bar - EduardoUK - 2024-09-28

(2024-09-28, 04:39 PM)TheDreadPirate Wrote: TLDR, you can't.  I've seen many try and I don't recall any succeeding.  The only way I can think of, though I haven't tried this, would be to install the jellyfin-web package directly in the OS without the server package and then mount the the host path for jellyfin-web into the container.  A hybrid docker/package Jellyfin setup.  Sounds like a PITA, though.


Oh darn... this is a shame. I will keep digging and hoping that some fine forum member proves you wrong  Smiling-face-with-sunglasses Thanks


RE: Featured Content Bar - EduardoUK - 2024-09-28

Ok, after spending some time trying to understand whats going on most of the day, I've figured out how to mount folders and files like "spotlight.html". Mounting an existing folder creates an empty folder, which isn't useful. However, mounting a new folder like "ui" allows files like "spotlight.html" to be added and accessed.

Thats where my luck ran out however, as I was unable to edit existing files within the container, such as "home-html.RANDOMSTRINGHERE.chunk.js". In theory, I could mount a copy of 'home-html.RANDOMSTRINGHERE.chunk.js' file directly if I could obtain the file and identify the random string. This techically worked when I mounted a test.js file.

But whilst I can replace these files, making the existing files editable or persistent outside of the container seems challenging. This would likely require either detaching and manually updating the source files from the container image or making significant changes to the "Featured Content Bar" code.

Disappointing, but I wanted to share what I've learned in hopes that it might help others.

Thanks Guys.


RE: Featured Content Bar - vbxlive - 2024-09-30

   

Slider shows cut bottom side, not round corner on bottom on mobile device, is their require to increase iframe size


RE: Featured Content Bar - Ted Hinklater - 2024-09-30

(2024-09-30, 09:50 AM)vbxlive Wrote: Slider shows cut bottom side, not round corner on bottom on mobile device, is their require to increase iframe size


Oh my bad it wasn't set up for 400px, this is the updated home-html.chunk.js snippet

Code:
<style>.featurediframe {width: 95vw; height: 23.5em; display: block; border: 0px solid #000; margin: 0 auto; margin-bottom: 0em; margin-top: 1em;} @media (min-width: 2000px) {.featurediframe {height: 18em; font-size: 175%;} .layout-desktop #homeTab .sections.homeSectionsContainer {margin-top: -3em !important;}} @media (max-width:1000px) and (orientation:portrait) {.featurediframe {height: 46vh;}} @media (max-width:1000px) and (orientation:landscape) {.featurediframe {height: 98vh;}} @media (max-width:400px) and (orientation:portrait) {.featurediframe {height: 52vh;}} @media (max-height: 400px) and (orientation:landscape) {.featurediframe {height: 100vh;}} @media screen and (aspect-ratio: 4/3) {.featurediframe {height: 27em;}} @media screen and (aspect-ratio: 3/4) {.featurediframe {height: 27em;}} @media screen and (aspect-ratio: 16/10) and (max-height: 1200px) {.featurediframe {height: 34em;}} @media screen and (aspect-ratio: 10/16) and (max-height: 1280px) {.featurediframe {height: 25em;}} </style><iframe class="featurediframe" src="/web/ui/spotlight.html"></iframe>

Cheers for letting me know
edit: added iPad & Kindle HDX support


RE: Featured Content Bar - jennystreaming - 2024-09-30

This is seriously gods work! and so important, all my users coming from other platforms are dwelling on this feature (and how I was missing it before)


RE: Featured Content Bar - vbxlive - 2024-10-01

1) attach custom trailer links to slider rather than IMDb data
2)Can we display same trailer in movies and series page,


RE: Featured Content Bar - EduardoUK - 2024-10-01

(2024-09-28, 09:18 PM)EduardoUK Wrote: Ok, after spending some time trying to understand whats going on most of the day, I've figured out how to mount folders and files like "spotlight.html". Mounting an existing folder creates an empty folder, which isn't useful. However, mounting a new folder like "ui" allows files like "spotlight.html" to be added and accessed.

Thats where my luck ran out however, as I was unable to edit existing files within the container, such as "home-html.RANDOMSTRINGHERE.chunk.js". In theory, I could mount a copy of 'home-html.RANDOMSTRINGHERE.chunk.js' file directly if I could obtain the file and identify the random string. This techically worked when I mounted a test.js file.

But whilst I can replace these files, making the existing files editable or persistent outside of the container seems challenging. This would likely require either detaching and manually updating the source files from the container image or making significant changes to the "Featured Content Bar" code.

Disappointing, but I wanted to share what I've learned in hopes that it might help others.

Thanks Guys.

Ok, although not eligant any way, I have managed to get this working while running from a container. 

The key is to mount the "UI" folder and also a copy of the  "home-html.RANDOMSTRINGHERE.chunk.js". I simply downloaded a copy of the latest portable version of Jellyfin and copied the file from there. I presume the random string may change with different versions of the file so this will need to be taken into account when updating the container - but I guess this goes for any other install aswel?

My mount points for refrence (added to the container file)

     - [volume path here]/Jellyfin-web/home-html.RANDOMSTRINGHERE.chunk.js :/usr/share/jellyfin/web/home-html.RANDOMSTRINGHERE.chunk.js
     - [volume path here]/Jellyfin-web/ui:/usr/share/jellyfin/web/ui

The above allows me to edit the files and folders needed for the featured content bar to work.

I can now find somthing to watch from my collection in a timely fashion! Happy to help anyone else in the same boat.


RE: Featured Content Bar - Ted Hinklater - 2024-10-01

Yet again, anything is possible if you just keep banging your head on the wall for long enough Grinning-face thanks for sharing!