Option to have navbar to use the full webpage width

[NovaViper]

It's a bit odd that the rest of the page expands but the navigation bar doesn't (Shown below)

The navbar should also use the full width of the browser just like the rest of the UI does

[LazeMSS]

Strange, what browser and os? What settings do you have turned on, fixed header?

[Guilouz]

Same here, I use Chrome on MacOS. Fixed Header or not same issue.

When installing OctoPrint-WideScreen nav bar is ok

[NovaViper]

Strange, what browser and os? What settings do you have turned on, fixed header?

The browser is Vivaldi, and the OS is EndeavourOS KDE. I have all of the default settings on

[LazeMSS]

Does this page behave the same: https://getbootstrap.com/2.3.2/examples/fluid.html or is that full width?

[NovaViper]

Does this page behave the same: https://getbootstrap.com/2.3.2/examples/fluid.html or is that full width?

It's full width there

[LazeMSS]

Does this page behave the same: https://getbootstrap.com/2.3.2/examples/fluid.html or is that full width?

It's full width there

Try running the following in a developer console in your browser: $('#navbar div.navbar-inner a.btn-navbar').remove();

Then run this: $('#navbar > div.navbar-inner.default > div:first').prepend('<a class="btn btn-navbar collapsed" data-toggle="collapse" data-target=".UICMainMenu"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></a>');

... in octoprint UI of course

[NovaViper]

Um.. how do I run it in the developer console? It's the same developer console as for Chrome (since the browser is based on Chrome)

[LazeMSS]

Um.. how do I run it in the developer console? It's the same developer console as for Chrome (since the browser is based on Chrome)

https://help.vivaldi.com/article/developer-tools/

[LazeMSS]

Should be now fixed - please update and test :)

[Guilouz]

No not working, same issue with latest update.

[LazeMSS]

I'm sorry to say but there must be a plugin installed that messes with your installation. This is how it looks in Vilvadi for me:

[NovaViper]

It's not working for me either, even when I only have UI Customizer loaded

[Guilouz]

I'm sorry to say but there must be a plugin installed that messes with your installation. This is how it looks in Vilvadi for me:

I use Google Chrome and it's working when I use Octoprint widescreen plugin so I think there is a mistake in your code.

Without Widescreen plugin, only UICustomizer :

With Widescreen plugin + UICustomizer :

[LazeMSS]

I will look ASAP

[LazeMSS]

I have looked and looked - it must be related in one of the plugins. The way the Widescreen plugin does the widescreen is not pretty. I would rather find the real source to the problem and fix it together with the author of that plugin. I know it sounds weird but that way my hack wont later on destroy somebody elses plugins - trying to keep it clean.

In a developer console in the browser you can run this: $('#settings_plugin_pluginmanager_pluginlist tr td').find('div:first > span:first').map(function(){return $(this).text()}).toArray().join("\n -")

[LazeMSS]

It's not working for me either, even when I only have UI Customizer loaded

So it does not work in full widescreen? - even when you just have UI Customizer loaded as 3rd party plugin? In which browsers? Have you tried Chrome.

[knopancakes]

FYI, I am seeing the same behavior in Firefox 83.0 with OctoPrinti 1.5.1 and OctoPrint-UICustomizer 0.1.0.5

[LazeMSS]

FYI, I am seeing the same behavior in Firefox 83.0 with OctoPrinti 1.5.1 and OctoPrint-UICustomizer 0.1.0.5

Could you post a list of plugins you are using?

[NovaViper]

It's not working for me either, even when I only have UI Customizer loaded

So it does not work in full widescreen? - even when you just have UI Customizer loaded as 3rd party plugin? In which browsers? Have you tried Chrome.

It didn't work in either maximixed mode or full screen, tried it on multiple computers (one with Chrome and one with Vivaldi), all have the same issue.

[LazeMSS]

It's not working for me either, even when I only have UI Customizer loaded

So it does not work in full widescreen? - even when you just have UI Customizer loaded as 3rd party plugin? In which browsers? Have you tried Chrome.

It didn't work in either maximixed mode or full screen, tried it on multiple computers (one with Chrome and one with Vivaldi), all have the same issue.

Can you post a list of plugins?

[knopancakes]

Full list of plugins running on my setup: DisplayLayerProgress Fullscreen Plugin Octolapse PrintTimeGenius UI Customizer

[LazeMSS]

Printer Dialogs Printer Notifications

Cant find these plugins

[NovaViper]

It's not working for me either, even when I only have UI Customizer loaded

So it does not work in full widescreen? - even when you just have UI Customizer loaded as 3rd party plugin? In which browsers? Have you tried Chrome.

It didn't work in either maximixed mode or full screen, tried it on multiple computers (one with Chrome and one with Vivaldi), all have the same issue.

Can you post a list of plugins?

I ran it after uninstalling all of the plugins

[LazeMSS]

It's not working for me either, even when I only have UI Customizer loaded

So it does not work in full widescreen? - even when you just have UI Customizer loaded as 3rd party plugin? In which browsers? Have you tried Chrome.

It didn't work in either maximixed mode or full screen, tried it on multiple computers (one with Chrome and one with Vivaldi), all have the same issue.

Can you post a list of plugins?

I ran it after uninstalling all of the plugins

So you have no other than my plugin installed as a 3rd party plugin?

[knopancakes]

Printer Dialogs Printer Notifications

Cant find these plugins

Those are built in, not 3rd party

[NovaViper]

It's not working for me either, even when I only have UI Customizer loaded

So it does not work in full widescreen? - even when you just have UI Customizer loaded as 3rd party plugin? In which browsers? Have you tried Chrome.

It didn't work in either maximixed mode or full screen, tried it on multiple computers (one with Chrome and one with Vivaldi), all have the same issue.

Can you post a list of plugins?

I ran it after uninstalling all of the plugins

So you have no other than my plugin installed as a 3rd party plugin?

Yes

[LazeMSS]

So you have no other than my plugin installed as a 3rd party plugin?

Yes

I can't figure it out - did uninstall and clean all the plugins or just disabled them - because the latter doesn't always cleanup properly.

And just to compare - this is my list: I have just uninstalled everything aswell - this is my list of 3rd party:

• OctoPrint-WiFiStatus
• UI Customizer

And built-in/bundled:

• Action Command Notification Support
• Action Command Prompt Support
• Announcement Plugin
• Anonymous Usage Tracking
• Application Keys Plugin
• Backup & Restore
• Core Wizard
• Discovery
• Error Tracking
• File Check
• Firmware Check
• GCode Viewer
• Logging
• Pi Support Plugin
• Software Update
• Virtual Printer

I cant understand it - if anyone of you guys are willing 5 minutes with teamviewer would help alot.

[knopancakes]

I lied to you all about the plugins I had installed. The original comment has been edited to reflect only 3rd party plugins, including the Fullscreen Plugin I had missed. I did try to disable all of these 3rd party plugins except UI Customizer, and the issue is present.

[LazeMSS]

Fullscreen Plugin

Does it work uninstalling it - is it the fullscreen webcam?

[knopancakes]

Yes, the Fullscreen Plugin is the webcam one. Disabling the Fullscreen Plugin resolves the oddities with the webcam widget, but not the top bar

[LazeMSS]

Yes, the Fullscreen Plugin is the webcam one. Disabling the Fullscreen Plugin resolves the oddities with the webcam widget, but not the top bar

I will try your list now - but I still have no idea what could be causing it - a quick teamviewer session might help me out :)

Edit: The only difference i can see in your installation and mine is the fact you are running the old python 2.7 - and im 3.7 but that shouldn't affect anything in the UI.

What are your settings in my plugin?

[knopancakes]

I'll have to work on getting teamviewer installed. Got some other things I need to take care of first. Among them, hungry cats to feed.

Re: python, that also jumped out at me... @NovaViper is also running 2.7, but @Guilouz has 3.7 and also experiences the issue.

Settings:

[LazeMSS]

Thanks - if you have the time try running this in your browsers console: $('#navbar > div.navbar-inner > div:first').removeClass("container").addClass("container-fluid").removeAttr("style",""); $('div.UICMainCont').removeClass("container").addClass("container-fluid"); $('div.UICMainCont > div.row:first').removeClass("row").addClass("row-fluid");

[Guilouz]

$('#navbar > div.navbar-inner > div:first').removeClass("container").addClass("container-fluid").removeAttr("style",""); $('div.UICMainCont').removeClass("container").addClass("container-fluid"); $('div.UICMainCont > div.row:first').removeClass("row").addClass("row-fluid");

With this in browser console it's working.

[LazeMSS]

$('#navbar > div.navbar-inner > div:first').removeClass("container").addClass("container-fluid").removeAttr("style",""); $('div.UICMainCont').removeClass("container").addClass("container-fluid"); $('div.UICMainCont > div.row:first').removeClass("row").addClass("row-fluid");

With this in browser console it's working.

Thanks - I knew somewhere something was tampering with the layout - this is included in the next version then!

[knopancakes]

Works for me too, thanks!

[LazeMSS]

Thanks everyone for testing.

I will try and get the new release out soon.

[LazeMSS]

Please test to confirm its fixed in the latest version 0.1.0.9

[Guilouz]

Please test to confirm its fixed in the latest version 0.1.0.9

Working with latest release. Thanks.

[NovaViper]

It's works in the latest version for me as well! Thanks :D