Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't play ultrawide content on Samsung OLED G8 #231

Open
PC-Heini opened this issue Nov 24, 2023 · 18 comments · May be fixed by #315
Open

Can't play ultrawide content on Samsung OLED G8 #231

PC-Heini opened this issue Nov 24, 2023 · 18 comments · May be fixed by #315

Comments

@PC-Heini
Copy link

Like many others, the JellyFin Tizen app does not run in the native resolution of 3440 x 1440 pixels but in a 16:9 box, centered on the screen.
21:9 content gets displayed with 4 black bars or if cropped, displays black bars on the left and right instead of the movie.
I tried putting my resolution in the tizen.js file and some other places but that did not fix the issue.

The Netflix and Prime Video apps also behave like this so I asked the Netflix support about this and they confirmed the issue. "The experts will look into it." They also keep pointing fingers at Samsung because "They have to make sure that first party apps run properly on their devices."

I don't know who is to blame in the case of Netflix but displaying apps in the full resolution has to be possible since the YouTube app does just that. No cropping needed, it displays ultra wide content without any black bars.

@dmitrylyzo
Copy link
Collaborator

During playback, turn on the Playback Info. What resolutions do the player and video have?

@PC-Heini
Copy link
Author

image
I don't see the players resolution.

@dmitrylyzo
Copy link
Collaborator

I don't see the players resolution.

It is skipped. 😕

The idea is to check if the player has the wrong aspect ratio. If it is correct, then it is the HTMLVideoElement that is causing the problem.

I know that HTMLVideoElement has problems displaying rotated video. AVPlay displays it correctly (I still haven't finished the AVPlay player for Jellyfin), so it will probably display wide video correctly as well. This can be verified by trying widescreen video from a USB drive in the built-in player.

@CreaGab
Copy link

CreaGab commented Nov 10, 2024

Hi, still same issue here.
I also have G8 OLED.
I installed the latest branch 10.10.z and Ultrawide 21:9 aspect films are rendered with borders.
Changing in settings doesn't do anything.
Any fix?

Image

@dmitrylyzo
Copy link
Collaborator

@CreaGab It looks like in your case the bands are encoded into the video. You can try changing Player settings / Aspect Ratio / Cover - it will scale (client-side) the video to fill the width.

@CreaGab
Copy link

CreaGab commented Nov 16, 2024

@CreaGab It looks like in your case the bands are encoded into the video. You can try changing Player settings / Aspect Ratio / Cover - it will scale (client-side) the video to fill the width.

Hi, thanks for your reply.
Will try once I geht home.
Will reply.

@Bernat00
Copy link

@dmitrylyzo Same monitor, same issue. The problem is the whole app is in 16:9 aspect ratio not just the movie.

@dmitrylyzo
Copy link
Collaborator

Same monitor, same issue. The problem is the whole app is in 16:9 aspect ratio not just the movie.

🤷‍♂️ The resolution isn't limited:

<feature name="http://tizen.org/feature/screen.size.all"/>

So, do you see the bars on the left and right on the home/login screen?

@Bernat00
Copy link

Bernat00 commented Nov 17, 2024

So, do you see the bars on the left and right on the home/login screen?

Yes it is like this everywhere.
Also i tried a few other apps and the menu seams to be in 16:9 aspect ratio everywhere but for example in youtube if i play a 21:9 video it works correctly.

Edit: I just realised that the docker installer thing i used pulled the app from here:
"https://github.com/jeppevinkel/jellyfin-tizen-builds"

I started the process described in the readme however i don' have time for this right now. I'll probably continue it later.
Still thanks for the help.

Image

@CreaGab
Copy link

CreaGab commented Nov 18, 2024

@CreaGab It looks like in your case the bands are encoded into the video. You can try changing Player settings / Aspect Ratio / Cover - it will scale (client-side) the video to fill the width.

I tried, it unfortunately did nothing.
It stays in a 16:9 box but changing to fill just fills it to 16:9.
I even set Zoom to level 2 on the Odyssey G8 OLED, in case that helped. But nope.
All 2 zoom levels are unfortunately doing nothing with Jellyfin player settings.
Image

@dmitrylyzo dmitrylyzo linked a pull request Nov 21, 2024 that will close this issue
@dmitrylyzo
Copy link
Collaborator

Could someone please test #315?

@CreaGab
Copy link

CreaGab commented Nov 22, 2024

Could someone please test #315?

I probably have to redeploy the Tizen app, am I right?
Will test today.

@CreaGab
Copy link

CreaGab commented Nov 23, 2024

I added < feature name="http://tizen.org/feature/screen.size.all"/ >to the config.xml file, and did all instructions again, but nothing changed.

@CreaGab
Copy link

CreaGab commented Nov 27, 2024

Even though I am not a software dev I searched in the internet for solutions regarding the 32:9 issue.
I couldn't find any thing helpful.

Did you find something new since my last comment?

@dmsvlks
Copy link

dmsvlks commented Dec 15, 2024

@CreaGab If you can build the app could you try these changes? It fixed the problem for my app.
#315 (comment)

@CreaGab
Copy link

CreaGab commented Dec 18, 2024

@CreaGab If you can build the app could you try these changes? It fixed the problem for my app. #315 (comment)

Hi, sorry for the late reply.
I was busy this week finishing business school assignments.
I will update you when I finished building the app :)

@CreaGab
Copy link

CreaGab commented Dec 19, 2024

Image

Image

After changing these two files I get an NPM error 1,


user@DESKTOP-I74KDL4:~$ mkdir /mnt/c/Jellyfin/
user@DESKTOP-I74KDL4:~$ cd /mnt/c/Jellyfin/
user@DESKTOP-I74KDL4:/mnt/c/Jellyfin$ git clone -b release-10.10.z https://github.com/jellyfin/jellyfin-web.git
Cloning into 'jellyfin-web'...
remote: Enumerating objects: 245280, done.
remote: Counting objects: 100% (100/100), done.
remote: Compressing objects: 100% (49/49), done.
remote: Total 245280 (delta 80), reused 55 (delta 51), pack-reused 245180 (from 4)
Receiving objects: 100% (245280/245280), 170.29 MiB | 6.41 MiB/s, done.
Resolving deltas: 100% (171932/171932), done.
Updating files: 100% (1040/1040), done.
user@DESKTOP-I74KDL4:/mnt/c/Jellyfin$ git clone https://github.com/jellyfin/jellyfin-tizen.git
Cloning into 'jellyfin-tizen'...
remote: Enumerating objects: 404, done.
remote: Counting objects: 100% (160/160), done.
remote: Compressing objects: 100% (95/95), done.
remote: Total 404 (delta 99), reused 65 (delta 65), pack-reused 244 (from 2)
Receiving objects: 100% (404/404), 286.16 KiB | 2.29 MiB/s, done.
Resolving deltas: 100% (202/202), done.
user@DESKTOP-I74KDL4:/mnt/c/Jellyfin$ cd jellyfin-web
npm ci --no-audit
USE_SYSTEM_FONTS=1 npm run build:production
npm warn deprecated @types/[email protected]: This is a stub types definition for localforage (https://github.com/localForage/localForage). localforage provides its own type definitions, so you don't need @types/localforage installed!
npm warn deprecated @types/[email protected]: This is a stub types definition. vfile-message provides its own type definitions, so you do not need this installed.
npm warn deprecated [email protected]: See https://github.com/lydell/source-map-url#deprecated
npm warn deprecated [email protected]: flatten is deprecated in favor of utility frameworks such as lodash.
npm warn deprecated @stylelint/[email protected]: Use the original unforked package instead: postcss-markdown
npm warn deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm warn deprecated @humanwhocodes/[email protected]: Use @eslint/config-array instead
npm warn deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm warn deprecated [email protected]: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
npm warn deprecated @humanwhocodes/[email protected]: Use @eslint/object-schema instead
npm warn deprecated [email protected]: See https://github.com/lydell/source-map-resolve#deprecated
npm warn deprecated @stylelint/[email protected]: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

added 1873 packages in 6m

> [email protected] build:production
> cross-env NODE_ENV="production" webpack --config webpack.prod.js

[BABEL] Note: The code generator has deoptimised the styling of /mnt/c/Jellyfin/jellyfin-web/node_modules/pdfjs-dist/build/pdf.js as it exceeds the max of 500KB.
user@DESKTOP-I74KDL4:/mnt/c/Jellyfin/jellyfin-web$ cd -
cd -
/mnt/c/Jellyfin
user@DESKTOP-I74KDL4:/mnt/c/Jellyfin$ cd jellyfin-tizen
user@DESKTOP-I74KDL4:/mnt/c/Jellyfin/jellyfin-tizen$ JELLYFIN_WEB_DIR=../jellyfin-web/dist npm ci --no-audit
npm warn deprecated [email protected]: request-promise-native has been deprecated because it extends the now deprecated request package, see https://github.com/request/request/issues/3142
npm warn deprecated [email protected]: this library is no longer supported
npm warn deprecated [email protected]: Use your platform's native DOMException instead
npm warn deprecated [email protected]: Use your platform's native atob() and btoa() methods instead
npm warn deprecated [email protected]: Use your platform's native performance.now() and performance.timeOrigin.
npm warn deprecated [email protected]: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5
npm warn deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm warn deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142

> [email protected] postinstall
> gulp

[02:24:29] Loaded external module: @babel/register
Error: Cannot find module '@babel/preset-env'
Require stack:
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/plugins.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/index.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/index.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker/babel-core.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker/handle-message.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker-client.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/node.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/nodeWrapper.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/index.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/rechoir/lib/register.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/rechoir/index.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/liftoff/lib/register_loader.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/liftoff/index.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/gulp-cli/index.js
- /mnt/c/Jellyfin/jellyfin-tizen/node_modules/gulp/bin/gulp.js

Make sure that all the Babel plugins and presets you are using
are defined as dependencies or devDependencies in your package.json
file. It's possible that the missing plugin is loaded by a preset
you are using that forgot to add the plugin to its dependencies: you
can workaround this problem by explicitly adding the missing package
to your top-level package.json.

    at Function._resolveFilename (node:internal/modules/cjs/loader:1249:15)
    at resolve (node:internal/modules/helpers:148:19)
    at tryRequireResolve (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/plugins.js:121:11)
    at resolveStandardizedNameForRequire (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/plugins.js:155:19)
    at resolveStandardizedName (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/plugins.js:170:12)
    at loadPreset (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/plugins.js:61:20)
    at loadPreset.next (<anonymous>)
    at createDescriptor (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/config-descriptors.js:140:16)
    at createDescriptor.next (<anonymous>)
    at evaluateSync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:251:28)
    at /mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:31:34
    at Array.map (<anonymous>)
    at Function.sync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:31:22)
    at Function.all (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:210:24)
    at Generator.next (<anonymous>)
    at createDescriptors (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/config-descriptors.js:102:41)
    at createDescriptors.next (<anonymous>)
    at createPresetDescriptors (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/config-descriptors.js:96:17)
    at createPresetDescriptors.next (<anonymous>)
    at /mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/config-descriptors.js:57:32
    at Generator.next (<anonymous>)
    at Function.<anonymous> (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/gensync-utils/async.js:21:3)
    at Generator.next (<anonymous>)
    at evaluateSync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:251:28)
    at Function.sync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:89:14)
    at sync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/gensync-utils/async.js:61:25)
    at sync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:182:19)
    at onFirstPause (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:210:24)
    at Generator.next (<anonymous>)
    at cachedFunction (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/caching.js:52:46)
    at cachedFunction.next (<anonymous>)
    at mergeChainOpts (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/config-chain.js:350:34)
    at mergeChainOpts.next (<anonymous>)
    at chainWalker (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/config-chain.js:316:14)
    at chainWalker.next (<anonymous>)
    at buildRootChain (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/config-chain.js:56:36)
    at buildRootChain.next (<anonymous>)
    at loadPrivatePartialConfig (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/partial.js:72:62)
    at loadPrivatePartialConfig.next (<anonymous>)
    at loadFullConfig (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/full.js:36:46)
    at loadFullConfig.next (<anonymous>)
    at loadOptionsImpl (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/index.js:52:43)
    at loadOptionsImpl.next (<anonymous>)
    at evaluateSync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:251:28)
    at sync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gensync/index.js:89:14)
    at stopHiding - secret - don't use this - v1 (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/errors/rewrite-stack-trace.js:47:12)
    at loadOptionsSync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/index.js:60:78)
    at OptionManager.init (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/index.js:233:42)
    at exports.transformSync (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker/transform.js:67:44)
    at LocalClient.handleMessage (/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker/handle-message.js:18:16) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/plugins.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/config/files/index.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/core/lib/index.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker/babel-core.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker/handle-message.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/worker-client.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/node.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/nodeWrapper.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/@babel/register/lib/index.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/rechoir/lib/register.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/rechoir/index.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/liftoff/lib/register_loader.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/liftoff/index.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gulp-cli/index.js',
    '/mnt/c/Jellyfin/jellyfin-tizen/node_modules/gulp/bin/gulp.js'
  ]
}
npm error code 1
npm error path /mnt/c/Jellyfin/jellyfin-tizen
npm error command failed
npm error command sh -c gulp
npm error A complete log of this run can be found in: /home/user/.npm/_logs/2024-12-19T01_23_51_386Z-debug-0.log
user@DESKTOP-I74KDL4:/mnt/c/Jellyfin/jellyfin-tizen$

@dmitrylyzo
Copy link
Collaborator

After changing these two files I get an NPM error 1

Use NodeJS 22 LTS or add @babel/preset-env (#317 (comment)).

Image

Could you also try not modifying index.html?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants