Jump to content
chef

4.50.50 That's just lovely... is there a option to toggle navbar expansion closed by default?

Recommended Posts

chef

Some extremely welcoming additions to the Server Dashboard.

I didn't even know that I wanted to have have an expansion toggle on  each navbar section until I got it. That makes things much tidier. Very nice...😉!

 

Is there an option somewhere, that I can enable, that would have the sections 'closed' by default on load? 

I don't even care if it's in the javascript somewhere. I'm sure I'll find it sooner or later, but maybe there is an option.

 

Thanks for the hard work on the new options in the UI. All the little things that make it great.

 

 

 

 

Share this post


Link to post
Share on other sites
Happy2Play

I know it was added in 4.5.0.21 and removed from the dashboard after that version.  But I know this is all beyond me but would look in \system\dashboard-ui\modules\navdrawer.

  • Thanks 1

Share this post


Link to post
Share on other sites
chef

Oh... ticky, tricky... 😆

 

Inside "navdrawercontent.js" the nav has a data attribute 

data-expanded="true"

 

this must be set to:

data-expanded="false"

 

And it will load the dashboard with everything collapsed.

 

I'm gonna put a conditional in there to load them all collapsed, except for "Server".

 

 

 

 

Share this post


Link to post
Share on other sites
chef

 I did this to change all navbar sections collapsed except "Server" on load :)

 

From:

data-expanded="true"

To:

data-expanded='+(item.name=="Server"?"true":"false")+'

This makes sense because the dashboard loads on the "Dashboard" navbar item, which is under the heading "Server", so this should be open, with "Dashboard" highlighted.

Perfect!

 

Edited by chef

Share this post


Link to post
Share on other sites
chef

Hey @Happy2Play check this out. this is how my dashboard loads now. 

But the best part, I switched material icons to material  SVG icons, and now it scales really nicely. 👍

It was little tricky to find everything, but I found most of it. I put most of the code in js file that can be thrown into the root after an update to remake the changes. Cool eh  :)

 

 

DashboardEdits.png

Edited by chef
  • Like 1

Share this post


Link to post
Share on other sites
PenkethBoy

cant seem to get the dashboard to be expanded with the Server query?

[edit]

can you be selective with which element is collapsed?

@chef

Edited by PenkethBoy

Share this post


Link to post
Share on other sites
chef
1 hour ago, PenkethBoy said:

cant seem to get the dashboard to be expanded with the Server query?

[edit]

can you be selective with which element is collapsed?

@chef

Yes you can be selective.

this is the snippet code taken from the navdrawercontent.js in it's default mode

menuHtml+='<div is="emby-collapse" title="'+item.name+'" data-expanded="true" class="navDrawerCollapseSection" 

 

If we look at the navbar we can see each section has a title:

navTitles.png.999eb4f265d2f86d2f7c7ca3cd0605b1.png

 

Which is the:

title="'+item.name+'"

 

The nav sections are being created in a loop, which is grabbing the "item.name" (the "Title" for each section)

Since we know it gets created there, we can create a conditional which will target the "item.name" in the loop and set the "data-expanded" as needed.

The new code would look like this:

menuHtml+='<div is="emby-collapse" title="'+item.name+'" data-expanded=' + (item.name == "Server" ? "true" : "false") +' class="navDrawerCollapseSection" 

We can do it for each section, by lengthening the conditional statement

menuHtml+='<div is="emby-collapse" title="'+item.name+'" data-expanded=' + (item.name == "Server" || item.name == "Admin" ? "true" : "false") +' class="navDrawerCollapseSection" 

which would keep only Server, and Admin open with the rest closed.

 

Let me know if I've made sense :) 

 

Or we could be like Luke and start using "!0" or "!1" as boolean values all over, LOL!

!0  = "not false" = "true"

!1 = "not true" = "false"

We almost have DeMorgans law there... LOL!

Edited by chef
  • Like 2

Share this post


Link to post
Share on other sites
cochize1

works like a charm, thank you

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...