Abp nav tag helper

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/AbpTagHelperService.cs

@@ -16,6 +16,7 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
         where TTagHelper : TagHelper
     {
         protected const string FormGroupContents = "FormGroupContents";
+        protected const string NavItemContents = "FormGroupContents";
         protected const string TabItems = "TabItems";
         protected const string AccordionItems = "AccordionItems";
         protected const string BreadcrumbItemsContent = "BreadcrumbItemsContent";
@@ -28,6 +29,9 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers
         protected const string AbpTabItemShowActivePlaceholder = "{_Tab_Show_Active_Placeholder_}";
         protected const string AbpBreadcrumbItemActivePlaceholder = "{_Breadcrumb_Active_Placeholder_}";
         protected const string AbpCarouselItemActivePlaceholder = "{_CarouselItem_Active_Placeholder_}";
+        protected const string AbpNavItemActivePlaceholder = "{_NavItem_Active_Placeholder_}";
+        protected const string AbpNavItemResponsiveFlexPlaceholder = "{_NavItem_Responsive_Flex_Placeholder_}";
+        protected const string AbpNavItemResponsiveAlignPlaceholder = "{_NavItem_Responsive_Align_Placeholder_}";
         protected const string AbpTabItemSelectedPlaceholder = "{_Tab_Selected_Placeholder_}";
         protected const string AbpAccordionParentIdPlaceholder = "{_Parent_Accordion_Id_}";
 

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Breadcrumb/AbpBreadcrumbTagHelperService.cs

@@ -49,7 +49,7 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Breadcrumb
 
         protected virtual void SetLastOneActiveIfThereIsNotAny(TagHelperContext context, TagHelperOutput output, List<BreadcrumbItem> list)
         {
-            if (list.Count > 0 && list.Any(bc => bc.Active))
+            if (list.Count > 0 && !list.Any(bc => bc.Active))
             {
                 list.Last().Active = true;
             }

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavAlign.cs

@@ -0,0 +1,10 @@
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public enum AbpNavAlign
+    {
+        Default,
+        Start,
+        Center,
+        End
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavItemTagHelper.cs

@@ -0,0 +1,17 @@
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public class AbpNavItemTagHelper : AbpTagHelper<AbpNavItemTagHelper, AbpNavItemTagHelperService>
+    {
+        public bool? Active { get; set; } 
+
+        public bool? Disabled { get; set; }
+
+        public string Href { get; set; }
+        
+        public AbpNavItemTagHelper(AbpNavItemTagHelperService tagHelperService)
+            : base(tagHelperService)
+        {
+
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavItemTagHelperService.cs

@@ -0,0 +1,65 @@
+using System.Collections.Generic;
+using System.Text.Encodings.Web;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Razor.TagHelpers;
+using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Microsoft.AspNetCore.Razor.TagHelpers;
+using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Breadcrumb;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public class AbpNavItemTagHelperService : AbpTagHelperService<AbpNavItemTagHelper>
+    {
+        private readonly HtmlEncoder _encoder;
+
+        public AbpNavItemTagHelperService(HtmlEncoder encoder)
+        {
+            _encoder = encoder;
+        }
+
+        public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
+        {
+            output.TagName = "a";
+            output.TagMode = TagMode.StartTagAndEndTag;
+            output.Attributes.Add("href",TagHelper.Href);
+            SetClasses(context, output);
+
+            output.Content.SetHtmlContent(await output.GetChildContentAsync());
+
+            var list = GetValueFromContext<List<NavItem>>(context, NavItemContents);
+
+            list.Add(new NavItem
+            {
+                Html = SurroundTagWithNavItem(context, output,RenderTagHelperOutput(output, _encoder)),
+                Active = TagHelper.Active??false
+            });
+
+            output.SuppressOutput();
+        }
+
+        protected virtual void SetClasses(TagHelperContext context, TagHelperOutput output)
+        {
+            output.Attributes.AddClass("nav-link");
+
+            SetDisabledClass(context, output);
+            SetActiveClass(context, output);
+        }
+
+        protected virtual void SetDisabledClass(TagHelperContext context, TagHelperOutput output)
+        {
+            if (TagHelper.Disabled ?? false)
+            {
+                output.Attributes.AddClass("disabled");
+            }
+        }
+
+        protected virtual void SetActiveClass(TagHelperContext context, TagHelperOutput output)
+        {
+            output.Attributes.AddClass(AbpNavItemActivePlaceholder);
+        }
+
+        protected virtual string SurroundTagWithNavItem(TagHelperContext context, TagHelperOutput output, string html)
+        {
+            return "<li class=\"nav-item "+ AbpNavItemResponsiveAlignPlaceholder +" " + AbpNavItemResponsiveFlexPlaceholder + "\">" + html + "</li>";
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavTagHelper.cs

@@ -0,0 +1,17 @@
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public class AbpNavTagHelper : AbpTagHelper<AbpNavTagHelper, AbpNavTagHelperService>
+    {
+        public AbpNavAlign Align { get; set; } = AbpNavAlign.Default;
+
+        public NavStyle NavStyle { get; set; } = NavStyle.Default;
+
+        public bool? Responsive { get; set; }
+
+        public AbpNavTagHelper(AbpNavTagHelperService tagHelperService)
+            : base(tagHelperService)
+        {
+
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavTagHelperService.cs

@@ -0,0 +1,114 @@
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Razor.TagHelpers;
+using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Microsoft.AspNetCore.Razor.TagHelpers;
+using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Breadcrumb;
+using Volo.Abp.Threading;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public class AbpNavTagHelperService : AbpTagHelperService<AbpNavTagHelper>
+    {
+        public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
+        {
+            output.TagName = "ul";
+            output.TagMode = TagMode.StartTagAndEndTag;
+            output.Attributes.AddClass("nav");
+            SetAlign(context, output);
+            SetNavStyle(context, output);
+            SetResponsiveness(context, output);
+
+            var list = InitilizeFormGroupContentsContext(context, output);
+
+            await output.GetChildContentAsync();
+
+
+            SetInnerList(context, output, list);
+        }
+
+        protected virtual void SetInnerList(TagHelperContext context, TagHelperOutput output, List<NavItem> list)
+        {
+            SetFirstOneActiveIfThereIsNotAny(context, output, list);
+
+            var html = new StringBuilder("");
+
+            foreach (var navItem in list)
+            {
+                var htmlPart = SetPlaceHolderClassesIfActiveAndGetHtml(navItem);
+
+                html.AppendLine(htmlPart);
+            }
+
+            output.Content.SetHtmlContent(html.ToString());
+        }
+
+        protected virtual string SetPlaceHolderClassesIfActiveAndGetHtml(NavItem item)
+        {
+            var html = item.Html;
+
+            html = item.Active ?
+                item.Html.Replace(AbpNavItemActivePlaceholder, " active") :
+                item.Html.Replace(AbpNavItemActivePlaceholder, "");
+
+            html = TagHelper.Responsive?? false? html.Replace(AbpNavItemResponsiveFlexPlaceholder, "flex-sm-fill").Replace(AbpNavItemResponsiveAlignPlaceholder, "text-sm-center") :
+                html.Replace(AbpNavItemResponsiveFlexPlaceholder, "").Replace(AbpNavItemResponsiveAlignPlaceholder, ""); 
+
+            return html;
+        }
+
+        protected virtual void SetFirstOneActiveIfThereIsNotAny(TagHelperContext context, TagHelperOutput output, List<NavItem> list)
+        {
+            if (list.Count > 0 && !list.Any(bc => bc.Active))
+            {
+                list.FirstOrDefault().Active = true;
+            }
+        }
+
+        protected virtual void SetResponsiveness(TagHelperContext context, TagHelperOutput output)
+        {
+            if (TagHelper.Responsive??false)
+            {
+                output.Attributes.AddClass("flex-sm-row");
+                output.Attributes.AddClass("flex-column");
+            }
+        }
+
+        protected virtual List<NavItem> InitilizeFormGroupContentsContext(TagHelperContext context, TagHelperOutput output)
+        {
+            var items = new List<NavItem>();
+            context.Items[NavItemContents] = items;
+            return items;
+        }
+
+        protected virtual void SetAlign(TagHelperContext context, TagHelperOutput output)
+        {
+            if (TagHelper.Align == AbpNavAlign.Default)
+            {
+                return;
+            }
+
+            output.Attributes.AddClass("justify-content-" + TagHelper.Align.ToString().ToLowerInvariant());
+        }
+
+        protected virtual void SetNavStyle(TagHelperContext context, TagHelperOutput output)
+        {
+            switch (TagHelper.NavStyle)
+            {
+                case NavStyle.Default:
+                    return;
+                case NavStyle.Pill:
+                    output.Attributes.AddClass("nav-pills");
+                    break;
+                case NavStyle.Vertical:
+                    output.Attributes.AddClass("flex-column");
+                    break;
+                case NavStyle.PillVertical:
+                    output.Attributes.AddClass("nav-pills");
+                    output.Attributes.AddClass("flex-column");
+                    break;
+            }
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/NavItem.cs

@@ -0,0 +1,9 @@
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public class NavItem
+    {
+        public string Html { get; set; }
+
+        public bool Active { get; set; }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/NavStyle.cs

@@ -0,0 +1,10 @@
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public enum NavStyle
+    {
+        Default,
+        Vertical,
+        Pill,
+        PillVertical
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.csproj

@@ -14,9 +14,5 @@
   <ItemGroup>
     <ProjectReference Include="..\Volo.Abp.AspNetCore.Mvc.UI\Volo.Abp.AspNetCore.Mvc.UI.csproj" />
   </ItemGroup>
-  
-  <ItemGroup>
-    <Folder Include="TagHelpers\Nav\" />
-  </ItemGroup>
 
 </Project>

test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Navs.cshtml

@@ -0,0 +1,34 @@
+@page
+@model Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo.Pages.Components.NavsModel
+@{
+    ViewData["Title"] = "Navs";
+}
+
+<h2>Navs</h2>
+
+<p>Based on <a href="https://getbootstrap.com/docs/4.1/components/navs/" target="_blank"> Bootstrap Navs</a>.</p>
+
+<h4># Navs Examples</h4>
+
+<div class="demo-with-code">
+    <div class="demo-area">
+
+        <abp-nav  nav-style="Pill" responsive="true" align="Center">
+            <abp-nav-item href="#">Active</abp-nav-item>
+            <abp-nav-item href="#">Longer nav link</abp-nav-item>
+            <abp-nav-item href="#">Link</abp-nav-item>
+            <abp-nav-item href="#" disabled="true">Disabled</abp-nav-item>
+        </abp-nav>
+
+    </div>
+    <div class="code-area">
+        <pre>
+&lt;abp-nav  nav-style=&quot;Pill&quot; responsive=&quot;true&quot; align=&quot;Center&quot;&gt;
+     &lt;abp-nav-item href=&quot;#&quot;&gt;Active&lt;/abp-nav-item&gt;
+     &lt;abp-nav-item href=&quot;#&quot;&gt;Longer nav link&lt;/abp-nav-item&gt;
+     &lt;abp-nav-item href=&quot;#&quot;&gt;Link&lt;/abp-nav-item&gt;
+     &lt;abp-nav-item href=&quot;#&quot; disabled=&quot;true&quot;&gt;Disabled&lt;/abp-nav-item&gt;
+&lt;/abp-nav&gt;
+</pre>
+    </div>
+</div>

test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Navs.cshtml.cs

@@ -0,0 +1,17 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo.Pages.Components
+{
+    public class NavsModel : PageModel
+    {
+        public void OnGet()
+        {
+
+        }
+    }
+}

test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Index.cshtml

@@ -26,5 +26,6 @@
     <li><a asp-page="Components/Carousel">Carousel</a></li>
     <li><a asp-page="Components/ListGroup">List Groups</a></li>
     <li><a asp-page="Components/Tables">Tables</a></li>
+    <li><a asp-page="Components/Navs">Navs</a></li>
 </ul>