nextcloud / viewer

🖼 Simple file viewer with slideshow for media
GNU Affero General Public License v3.0
92 stars 53 forks source link

Video aspect ratio wrong in public view #1831

Open philippjeschek opened 1 year ago

philippjeschek commented 1 year ago

Steps to reproduce

  1. Upload video with 9:16 aspect ratio
  2. Share video, hide download and copy public link
  3. Open shared link in new tab

Expected behavior

Video should be displayed in correct aspect ratio.

Actual behavior

Video gets displayed very large/zoomed in and you have to scroll to view the full video

Host OS

Ubuntu 22.04.2 LTS

Nextcloud AIO version

27.0.1

Current channel

Stable

Other valuable info

Only happend after upgrading from 27.0.0 to 27.0.1. In 27.0.0 everything works as expected.

Example file: https://cloud.philippjeschek.com/s/XgYj95qRCntm59d

nicrame commented 1 year ago

I confirm this. Same situation even with videos with landscape ratio video files shared by public link. Control buttons and part of the videos are not visible without scrolling down. Nextcloud 27.0.1, checked with Chrome and Firefox 115.

creopard commented 7 months ago

Also confirmed. Still happening in Nextcloud 28.0.1, also with videos in landscape ratio and shared by public link.

Lawkss commented 4 months ago

Same here on 28...

Lawkss commented 2 months ago

Also on NC 29.

sptcguy commented 2 months ago

In 27.1.11:

If I do:

.view__file {
  margin: 0 auto; 
}

#imgViewer .view__file {
  height: 100%;
  width 45vh;
}

It seems to remedy the issue. Obviously I need to do some more testing but if it looks ok and the NC devs haven't already fixed it I'll create a pull request.

sptcguy commented 2 months ago

I think I tracked it down to the Videos.vue file. It has the max-height attribute set to 100%. If I remove that, the video displays correctly across desktop and mobile.

artonge commented 2 months ago

Could someone open a PR with a fix? :)

sptcguy commented 2 months ago

Could someone open a PR with a fix? :)

Done: https://github.com/nextcloud/viewer/pull/2349

reggermont commented 6 days ago

For those who don't want to wait the PR to be merged, you can fix the bug with the Custom CSS application and by putting this CSS:

#preview video {
  max-height: calc(100vh - var(--header-height) - 65px - 200px - 16px) !important;
}