WebSideMenu and State

WEB WEB Feature Requests
1

Hello

I Think it will be useful to add 2 or 3 things to TWebSideMenu

  • actual state (3 states available), although we can get it inside the DOM/classes
  • fire an event when state has changed
  • property "ManualState" could be interesting too to self manage the state of menu

Bye
Serge

2

Can you clarify what exact states you are referring to here?

3

States in class/Appearance section:

image
image352×125 3.7 KB

More important is the event when state change. Actually I read state in resize event but it's not very efficient to do this.

To read the state we can retrieve state with classes inside DOM (see below), but it's better do have directly ine the class the property "ActualState" or something like that.

function WebSideMenuGetState( WebSideMenu: TWebSideMenu ): Integer;
var
   JSElt: TJSElement;
begin
     JSElt := WebSideMenu.ElementHandle.querySelector( '.smcontainer' );
     if Assigned( JSElt ) then
       if JSElt.classList.contains( 'smcontainer-open' ) then Result := 0 else   // msExpanded
       if JSElt.classList.contains( 'smcontainer-close' ) then Result := 1 else // msCollapsed
         Result := 2; // msPopup
end;

function WebSideMenuGetPopup( WebSideMenu: TWebSideMenu ): Boolean;
var
   JSElt: TJSElement;
begin
     JSElt := WebSideMenu.ElementHandle.querySelector( '.sidebar' );
     if Assigned( JSElt )
       then Result := JSElt.classList.contains(  'sidebar-open' )
       else Result := False;
end;

procedure WebSideMenuSetPopup( WebSideMenu: TWebSideMenu; BOpen: Boolean );
var
   JSElt: TJSElement;
begin
     JSElt := WebSideMenu.ElementHandle.querySelector( '.sidebar' );
     if Assigned( JSElt ) then
       if BOpen
         then JSElt.classList.add( 'sidebar-open' )
         else JSElt.classList.remove( 'sidebar-open' );
end;