Its is definitely up to something.. UI customizer can access organise Dashboard, and Dashboard has its own setting page for webcam, which defaults to the default webcam setting, it displays the webcam in the dashboard column perfectly, though right beside it in UI customizers own webcam area the image is letterboxed?
I have just checked the aspect ratio in classic webcam setting and it is 16:9, and with UI customizer disabled none of the webcam images are letterboxed. It is only UI customizer that is doing this.
I sent him a personal message on this forum, and I sent a bug report to Git hub, though I wasn't sure if he was still actively supporting UI Customiser.
Sorry I was being really needy, I didn't mean to come across like that.
I tried disabling dashboard, and there was no change.
I am going to go for a fresh install and see if that changes anything, there are some strange things happening (or not happening), like I can only update plugin configs once then I have to reboot, and even then some configs are locked. Though this has just started to be a thing. I think I may have broken something while I trying to fix other things, and is only one of my systems. I will feed this back once complete.
So, here's the thing, I have reinstalled from fresh, and everything is working as it should, I can't tell you how bizarre this is, and sorry for causing a ruckus. Though 2 systems suffering exactly the same way is a bit weird.
Right I said in this stream that everything is working once I reloaded, well that isn't true (I an embarrassed and annoyed), I did install 1.9.3, and forgot to install 1.10.0RC1.
So I have done as full a diagnostic approach to this as I can, and have ran a number of scenarios (oh so many), here are the findings from 2 of them:-
on my first system: I fresh installed 1.9.3 released 2023-10-09, then installed 1.10.0RC1 update, and confirmed that the webcamera works without letterboxing; then I installed UI Customizer without any other plugins. The webcamera image is letterboxed.
On my second system: I fresh installed 1.9.3 released 2023-10-09, then I installed UI Customizer without any other plugins. The webcamera image was not leterboxing, then installed 1.10.0RC1 update, and the webcamera is again letterboxing.
Also whenever the webcam is letterboxing the maximum column width is 11 not 12.
Sorry for the confusion, its an age thing I am convinced
It is definitely the case that it only has a maximum of 11 in 1.10.0cr1, not that I have to tell you that, I am the stupid one not you! and reinstalling from scratch (when done right, and completely), doesn't change anything.
I didn't add a theme when I did the fresh install testing, I didn't get that far, as soon as I installed UI Customizer, and rebooted, the screen that appears has a webcam view already, and it was letterboxed.
This was the approach I took:
So I have done as full a diagnostic approach to this as I can, and have ran a number of scenarios (oh so many), here are the findings from 2 of them:-
on my first system: I fresh installed 1.9.3 released 2023-10-09, then installed 1.10.0RC1 update, and confirmed that the webcamera works without letterboxing; then I installed UI Customizer without any other plugins. The webcamera image is letterboxed.
On my second system: I fresh installed 1.9.3 released 2023-10-09, then I installed UI Customizer without any other plugins. The webcamera image was not leterboxing, then installed 1.10.0RC1 update, and the webcamera is again letterboxing.
I have formatted and started from scratch so many times now, thinking there could be something relating to the my systems only (not many comments from others suffering the same problem), though no matter what I do, and how basic I make the install, everything appears fine until I install UI Customizer with or without themes.
The only other information is: I am using Raspberry pi Model B (8GB), and my camera is raspicam module 3 noir, and I have 2 systems.
I think UI Customizer is so good that for the time being I am running octoprint 1.9.3, as good as the RC is it lacks the sparkle that UI Customizer brings.
What about monitor resolution and are you running in full screen mode of the browser or not? These can also effect layouts when it comes to webpage design.
I'm yet to fully dig into this, but I found the same issues straight away with 1.10.0rc1 and installing UI customizer. This is basically a barebones instance, no plugins except for my webcam plugin (& now UIC)
It appears to be relevant to just the built in Classic Webcam plugin, not webcam plugins in general. My 'Camera Streamer Control' plugin does not get letterboxed, but the CW view does in both sidebar & control tab:
I can see the same issue that @Ewald_Ikemann pointed out - a '12 column' layout does not fit on the screen anymore. There should be a right sidebar there, but it turns up at the bottom of the page as it won't fit on the right. Not sure why this is the case, as I said these are my initial observations.
OK, think I've found the conflict that makes the stream appear 'letterboxed'.
Previously in OctoPrint, the stream ratio was set using padding values, so a 16/9 stream used 56.25% padding to make the container the right size. I'll be honest, the styling and handling of webcam rotation really annoyed me when I made the 'camera streamer control' plugin, there's a lot of complexity from how the layout had grown up. UI customizer also set 56.25% padding on the webcam, but this was fine since both were the same & OctoPrint's number was used in preference.
OctoPrint has since migrated to use a more intuitive aspect-ratio property, available in more modern browsers than (most likely) 10 years ago when the UI was first built. But this causes a conflict with UIC, which still tries to apply 56.25% padding to the container, so we get a double-whammy of making the box really long. If you remove this, for some reason UIC then tries to apply padding-bottom: 100% which makes it even longer. Removing both resolves the issue.
OctoPrint's commit that changed how it worked:
The number of styles that UIC tries to override is huge, so this type of issue is almost always going to happen. I don't think that OctoPrint should try and restrict changes to individual CSS properties & CSS structure, so it I'd like to say it's the plugin's end to fix. I don't think there's an error in OctoPrint's CSS, just the change of properties has led to it being applied twice.
Brilliant diagnosis, I bow respectfully to your: prowess, sleuthing, and all round knowledge. I don't spend enough time in and around Raspi OS, I use my Raspi systems for 3D printing only, and generally they work, I only really realise they are there when they don't perform as I would like them to.
So thank you for your input, I thought it was going to be something I wasn't able to comprehend I was doing?
Bug has been found and fixed - @Charlie_Powell pointed out there was problems with the aspect ration stuff and alsom a bug in the RC of OctoPrint. For now my update handles both.