MVCMenuMaker 1.1.0

MVCMenuMaker

This library provides methods to help create a menu or a footer in HTML format from a configuration file in JSON format, which can be customized through CSS sheets. Moreover, it also gives the possibility to manage a translation for each label through the use of resource files.

Example :

In the layout :

...
Menu menu = new Menu(
    Helper.JsonMenu,
    ViewContext.RequestContext,
    Resources.ResourceManager
);

<nav role="navigation" class="navbar navbar-expand-lg navbar-dark bg-dark">
    <a class="navbar-brand" href="#">MY COMPANY</a>

    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#nav-menu" aria-controls="nav-menu" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>

    @menu.RenderMenu(new List<MenuItem> { account })
</nav>

<main role="main">
    @RenderBody()
</main>

@menu.RenderFooter()
...

Helper :

public static class Helper
{
    public static string JsonMenu
    {
        get
        {
            string cacheKey = "JsonMenu";

            if (HttpRuntime.Cache[cacheKey] == null)
            {
                using (StreamReader sr = new StreamReader(HttpContext.Current.Server.MapPath("~/menu.jsonconfig")))
                {
                    string json = sr.ReadToEnd();

                    HttpRuntime.Cache.Insert(cacheKey, json, null, DateTime.UtcNow.AddHours(24 * 7), TimeSpan.Zero);
                }
            }

            return (HttpRuntime.Cache[cacheKey] as string);
        }
    }
}

menu.jsonconfig :

[
  {
    "Route": {
      "Controller": "Home",
      "Action": "Index"
    },
    "Title": "Home",
    "Items": []
  },
  {
    "Route": {
      "Controller": "AnotherController",
      "Action": null
    },
    "Title": "SomeAction",
    "Items": [
      {
        "Route": {
          "Controller": "AnotherController",
          "Action": "Index"
        },
        "Title": "AnotherControllerHome",
        "Items": []
      },
      {
        "Route": {
          "Controller": "AnotherController",
          "Action": "SomeAction"
        },
        "Title": "AnotherControllerSomeAction",
        "Items": [
        ]
      }
    ]
  }
]

Menu default HTML :

<div class="collapse navbar-collapse">
  <ul class="navbar-nav mr-auto">
    <li class="nav-item active">
      <a class="nav-link" href="#">Home</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Link</a>
    </li>
    <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" href="http://example.com" id="navbarDropdownMenuLink[XX]" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
      <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink[XX]">
        <a class="dropdown-item" href="#">Action</a>
        <a class="dropdown-item" href="#">Another action</a>
        <a class="dropdown-item" href="#">Something else here</a>
      </div>
    </li>
  </ul>
</div>

Footer default HTML :

 <footer>
      <div class="container text-center text-md-left">
           <div class="row">
                <div class="col-lg mx-auto">
                     <h5 class="font-weight-bold text-uppercase mt-3 mb-4">
                          <a href="">A link</a>
                     </h5>
                </div>
                <div class="col-lg mx-auto">
                     <h5 class="font-weight-bold text-uppercase mt-3 mb-4">
                          <a href="">Another link</a>
                     </h5>
                </div>
                <div class="col-lg mx-auto">
                     <h5 class="font-weight-bold text-uppercase mt-3 mb-4">
                          <a href="">And another link with sub links</a>
                     </h5>
                     <ul class="list-unstyled">
                          <li>
                               <a href=""></a>
                          </li>
                     </ul>
                </div>
           </div>
      </div>
 </footer>