NopCommerce Category Navigation Design - asp.net-mvc

Question

I am trying to edit this category navigation view. What I need is this:
We do not want to see all main categories or all sub categories as well.
When I click a Main Category (ParentCategoryId = 0), I should see only this one and it's sub categories.
When I click one of this sub categories, this sub category should be main category, and this time I should see it's sub categories only.
For ex, navigation system works like this right now:
Women (selected)
Bag
Top
Dress
Sound Systems
Home Decoration
Gardening
or
Women
Bag
Top (selected)
Tshirt
Sweatshirt
Tunic
Dress
Jeans
Suit
Sound Systems
Home Decoration
Gardening
What we want is that:
Women (selected)
Bag
Top
Dress
Jeans
Suit
or
Top (selected)
Tshirt
Sweatshirt
Tunic
#model CategoryNavigationModel
#using Nop.Web.Models.Catalog;
#using Nop.Core.Infrastructure;
#functions{
public bool BreadCrumbContainsCurrentCategoryId(CategorySimpleModel category)
{
if (Model.CurrentCategoryId == 0)
return false;
if (category.Id == Model.CurrentCategoryId)
return true;
foreach (var subCategory in category.SubCategories)
{
if (BreadCrumbContainsCurrentCategoryId(subCategory))
{
return true;
}
}
return false;
}
}
#helper RenderCategoryLine(CategorySimpleModel category)
{
var _categoryService = EngineContext.Current.Resolve<Nop.Services.Catalog.ICategoryService>();
// additional check on whether to set an active class on the parents of the current categories and above. Meaning all categories from the
// breadcrumb will have an "active" class
bool active = false;
if (category.Id == Model.CurrentCategoryId || category.SubCategories.Count(BreadCrumbContainsCurrentCategoryId) > 0)
{
active = true;
}
<li class="#(active ? "active" : "inactive")">
#if (category.ParentCategoryId == Model.CurrentCategoryId || category.Id == Model.CurrentCategoryId)
{
<a href="#Url.RouteUrl("Category", new { SeName = category.SeName })">#category.Name
#if (category.NumberOfProducts.HasValue)
{
<text> </text>#T("Categories.TotalProducts", category.NumberOfProducts.Value)
}
</a>
}
#{
if (category.Id == Model.CurrentCategoryId ||
category.SubCategories.Count(BreadCrumbContainsCurrentCategoryId) > 0)
{
if (category.SubCategories.Count > 0)
{
<ul class="sublist">
#foreach (var subCategory in category.SubCategories)
{
#RenderCategoryLine(subCategory)
}
</ul>
}
}
}
</li>
}
#if (Model.Categories.Count > 0)
{
<div class="block block-category-navigation">
<div class="title">
#if (Model.CurrentCategoryId == 1 || Model.CurrentCategoryId == 3 || Model.CurrentCategoryId == 4 || Model.CurrentCategoryId == 5)
{
<strong>#T("Categories")</strong>
}
else
{
<strong><< Geri Dön</strong>
}
</div>
<div class="listbox">
<ul class="list">
#foreach (var category in Model.Categories)
{
#RenderCategoryLine(category)
}
</ul>
</div>
</div>
}
My code is something like this, but there is a problem. Code is not working when selected category has no sub categories. On this situation it must do something like this:
PS: Sweatshirt has no sub categories.
Top
Tshirt
Sweatshirt (selected)
Tunic
Instead it shows something like this:
Sweatshirt (selected)
I'd hope I can explain myself. How can I solve this problem?
Thanks.