CaritasPWA/Shared/NavMenu.razor

@using cwebplusApp.Shared.Services;
@using cwebplusApp.Components;

@inject AppState AppState;
@inject NavigationManager NavigationManager;
@inject IStringLocalizer<Resources> I18n
@inject IJSRuntime JSRuntime;
@inject PageHistoryManager PageHistoryManager;

@implements IDisposable;


@if (HandleAppBarContainer()) {
    <div class="sidebar">
        <MatAppBarContainer>
            <MatAppBar Fixed="true">
                <MatAppBarRow>
                    <MatAppBarSection>
                        <MatIconButton Icon="menu" OnClick="@((e) => ButtonClicked())"></MatIconButton>
                        @if (PageHistoryManager.CanGoBack()) {
                            <MatIconButton Icon="@MatIconNames.Keyboard_backspace" OnClick="@((e) => ButtonBackClicked())" Disabled="@BackButtonDisabled()"></MatIconButton>
                        }
                        <MatAppBarTitle Class="navBar-title">@LocationUrl</MatAppBarTitle>
                    </MatAppBarSection>
                    <MatAppBarSection align="@MatAppBarSectionAlign.End" Style="max-width:min-content">
                        <NavLink rel="noopener" target="_blank" class="text-white small" href="https://www.caritas.ch" align="@MatAppBarSectionAlign.End" style="padding-right:1em">@I18n["Learnmore"]</NavLink>
                    </MatAppBarSection>
                </MatAppBarRow>
            </MatAppBar>
            <MatAppBarContent>
                <MatDrawerContainer>
                    <MatDrawer @bind-Opened="@opened" Mode="@MatDrawerMode.Modal">
                        <MatList>
                            <MatRipple Class="navmenu-mat-ripple" Color="@MatRippleColor.Default">
                                <MatListItem Class="@((index == 1) ? "bg-primary-color text-white" : "")" Style="margin-left:0;margin-right:0"
                                             Href="caritas_services"
                                             @onclick="@((e) => ButtonClicked(1))">
                                    <MatIcon Icon="@MatIconNames.Apps"></MatIcon>
                                    <MatListItemText Style="padding-left:0.5em">@I18n["CaritasServices"]</MatListItemText>
                                </MatListItem>
                            </MatRipple>
                            <MatRipple Class="navmenu-mat-ripple" Color="@MatRippleColor.Default">
                                <MatListItem Class="@((index == 2) ? "bg-primary-color text-white" : "")" Style="margin-left:0;margin-right:0"
                                             Href="account"
                                             @onclick="@((e) => ButtonClicked(2))">
                                    <MatIcon Icon="@MatIconNames.Person_outline"></MatIcon>
                                    <MatListItemText Style="padding-left:0.5em">@I18n["account"]</MatListItemText>
                                </MatListItem>
                            </MatRipple>
                            <MatNavMenu @ref="extrasNavMenu">
                                <MatNavSubMenu @bind-Expanded="@navSubMenuOpen">
                                    <MatNavSubMenuHeader Title=@I18n["Extras"]>
                                        <MatNavItem AllowSelection="false">
                                            <MatIcon Icon="@MatIconNames.View_quilt" />&nbsp; @I18n["Extras"]
                                        </MatNavItem>
                                    </MatNavSubMenuHeader>
                                    <MatNavSubMenuList>
                                        <MatNavSubMenu>
                                            <MatNavSubMenuHeader>
                                                <MatNavItem AllowSelection="false">
                                                    <MatIcon Icon="@MatIconNames.Directions_bike" />&nbsp; @I18n["fundvelo/lost_found"]
                                                </MatNavItem>
                                            </MatNavSubMenuHeader>
                                            <MatNavSubMenuList>
                                                <MatNavItem Href="fundvelo/history_found" AllowSelection="true" Class="@((index == 3)? "selected": "")" @onclick="@((e) => ButtonClicked(3))">
                                                    <MatIcon Icon="@MatIconNames.History" />&nbsp; @I18n["HistoryFound"]
                                                </MatNavItem>
                                                <MatNavItem Href="fundvelo/history_missing" AllowSelection="true" Class="@((index == 4)? "selected": "")" @onclick="@((e) => ButtonClicked(4))">
                                                    <MatIcon Icon="@MatIconNames.History" />&nbsp; @I18n["HistoryMissing"]
                                                </MatNavItem>
                                                <MatNavItem Href="fundvelo/links" AllowSelection="true" Class="@((index == 5)? "selected": "")" @onclick="@((e) => ButtonClicked(5))">
                                                    <MatIcon Icon="@MatIconNames.Link" />&nbsp; @I18n["FundveloLinks"]
                                                </MatNavItem>
                                            </MatNavSubMenuList>
                                        </MatNavSubMenu>
                                    </MatNavSubMenuList>
                                </MatNavSubMenu>
                            </MatNavMenu>
                            <MatRipple Class="navmenu-mat-ripple" Color="@MatRippleColor.Default">
                                <MatListItem Class="@((index == 5) ? "bg-primary-color text-white" : "")" Style="margin-left:0;margin-right:0"
                                             Href="info"
                                             @onclick="@((e) => ButtonClicked(5))">
                                    <MatIcon Icon="@MatIconNames.Error_outline" Style="transform: rotate(180deg)"></MatIcon>
                                    <MatListItemText Style="padding-left:0.5em">@I18n["info"]</MatListItemText>
                                </MatListItem>
                            </MatRipple>
                        </MatList>
                    </MatDrawer>
                </MatDrawerContainer>
            </MatAppBarContent>
        </MatAppBarContainer>
    </div>
    <OnlineStatusIndicator />
}


@code {

    private MatNavMenu extrasNavMenu;
    private bool navSubMenuOpen = false;
    private bool opened = false;
    private int index = 1;
    private string locUrl;
    private string LocationUrl {
        get => locUrl;
        set {
            locUrl = value;
            StateHasChanged();
        }
    }

    public void Dispose() {
        AppState.OnChange -= StateHasChanged;
        NavigationManager.LocationChanged -= LocationChanged;
    }

    protected override void OnInitialized() {
        base.OnInitialized();
        AppState.OnChange += StateHasChanged;
        NavigationManager.LocationChanged += LocationChanged;
        locUrl = I18n.GetString(NavigationManager.Uri.Replace(NavigationManager.BaseUri, ""));
        StateHasChanged();
    }

    private void ButtonClicked() {
        opened = !opened;
    }

    private void ButtonClicked(int _Index) {
        index = _Index;
        navSubMenuOpen = (index == 3 || index == 4 || index == 5);
        PageHistoryManager.AddPageToHistory(NavigationManager.Uri);
        StateHasChanged();
        ButtonClicked();
    }

    private void ButtonBackClicked() {
        PageHistoryManager.NavigateBack();
    }


    private void LocationChanged(object sender, LocationChangedEventArgs e) {
        locUrl = I18n.GetString(e.Location.Replace(NavigationManager.BaseUri, ""));
        if (IsInServicesUrl(e.Location)) {
            index = 1;
        } else if (e.Location.Contains("account")) {
            index = 2;
        } else if (e.Location.Contains("history_found")) {
            index = 3;
        } else if (e.Location.Contains("history_missing")) {
            index = 4;
        } else if (e.Location.Contains("info")) {
            index = 5;
        } else {
            index = 0;
        }
        StateHasChanged();
    }

    private bool IsInServicesUrl(string location) {
        return (location.Contains("caritas_services") || location.Contains("lost_found") || location.Contains("keydata")
            || location.Contains("account/") || location.Contains("conclusion_"));
    }

    private bool HandleAppBarContainer() {
        string uri = NavigationManager.Uri;
        string baseUri = NavigationManager.BaseUri;
        string delta = uri.Replace(baseUri, "");

        if (delta == null || delta.Equals("")) {
            return false;
        } else {
            if (IsInServicesUrl(delta)) {
                index = 1;
            } else if (delta.Equals("account")) {
                index = 2;
            } else if (delta.Equals("fundvelo/history_found")) {
                index = 3;
            } else if (delta.Equals("fundvelo/history_missing")) {
                index = 4;
            } else if (delta.Equals("info")) {
                index = 5;
            } else {
                index = 0;
            }
            return true;
        }
    }

    private bool BackButtonDisabled() {
        return !PageHistoryManager.CanGoBack();
    }

}