Introduction
After I read Jon Sagara's excellent article Breadcrumbs in ASP.NET I tried to include Breadcrumbs in my web site.
But there were two problems:
- My Website uses
UrlRewriting
- My Website is localized to the the User's
Browser.AcceptedLanguage[0]
So I decided to write my own Breadcrumb-Control.
Background
This is my first article on CodeProject. I hope Jon Sagara isn't angry about me that i took his and mine ideas together and show what the results are, because he did the main job and gave me the inspiration for this.
What is a breadcrumb navigation
A typical web site has a directory structure. e.g.:
/
/Products
/...
A breadcrumb navigation now takes the path of the current page (e.g. http://companyname/products/default.apsx) and converts it to:
/ CompanyName / Products / Overview
or
/ Products / Default
The Control code
if(HttpContext.Current.Application["HTTP_HOST"]==null)
{
HttpContext.Current.Application["HTTP_HOST"] =
HttpContext.Current.Request.Headers["HOST"];
}
string hostName = HttpContext.Current.Application["HTTP_HOST"];
bool capitalize = false;
string requestBasePath = HttpContext.Current.Request.Path;
string requestPath = requestBasePath;
int queryStringCount = 0;
foreach ( string key in HttpContext.Current.Request.QueryString )
{
if(queryStringCount==0)
{
requestPath += "?";
}
else
{
requestPath += "&";
}
requestPath += key + "=" + HttpContext.Current.Request.QueryString[key];
}
Assembly assmebly = Assembly.GetExecutingAssembly();
string configFile =
System.Web.HttpContext.Current.Request.PhysicalApplicationPath +
"bin\\" + assmebly.GetName().ToString().Split(',')[0] + ".config";
object breadCrumb =
StaticDust.Configuration.ConfigurationSettings.AppSettings(
configFile)[System.Globalization.CultureInfo.CurrentCulture +
"@" + requestPath];
if(breadCrumb==null)
{
breadCrumb = StaticDust.Configuration.ConfigurationSettings.AppSettings(
configFile)[System.Globalization.CultureInfo.CurrentCulture +
"@" + requestBasePath];
if(breadCrumb==null)
{
breadCrumb =
StaticDust.Configuration.ConfigurationSettings.AppSettings(
configFile)[this.m_DefaultCulture +
"@" + requestPath];
if(breadCrumb==null)
{
breadCrumb =
StaticDust.Configuration.ConfigurationSettings.AppSettings(
configFile)[this.m_DefaultCulture +
"@" + requestBasePath];
if(breadCrumb==null)
{
breadCrumb = requestBasePath;
capitalize = true;
}
}
}
}
string[] breadcrumbArr = breadCrumb.ToString().Split('/');
string outputString = "";
string urlpath = "";
for(int i=0; i<breadcrumbArr.Length; i++)
{
if(breadcrumbArr.Length==1)
{
urlpath = "/" + breadcrumbArr[i];
}
else
{
if(i==0)
{
urlpath = "/" + m_DefaultDoc;
}
else if(i==(breadcrumbArr.Length-1))
{
urlpath += requestPath.Substring((requestPath.LastIndexOf("/")),
(requestPath.Length-requestPath.LastIndexOf("/")));
if(this.m_HideFileExt==true)
{
breadcrumbArr[i] = breadcrumbArr[i].Substring(0,
breadcrumbArr[i].LastIndexOf("."));
}
}
else
{
urlpath += "/" + breadcrumbArr[i] + "/" + m_DefaultDoc;
}
}
if(i==(breadcrumbArr.Length-1) && this.m_LinkFiles==false)
{
outputString += ((capitalize == true && breadcrumbArr[i].Length>=2)
? (breadcrumbArr[i].Substring(0,1).ToUpper() +
breadcrumbArr[i].Substring(1,
(breadcrumbArr[i].Length-1)).ToLower()) : breadcrumbArr[i] ) +
this.m_Seperator;
}
else
{
outputString += "<a href=\"" + urlpath + "\">" +
((capitalize == true && breadcrumbArr[i].Length>=2) ?
(breadcrumbArr[i].Substring(0,1).ToUpper() +
breadcrumbArr[i].Substring(1,
(breadcrumbArr[i].Length-1)).ToLower()) : breadcrumbArr[i] ) +
"</a>" + this.m_Seperator;
}
urlpath = urlpath.Replace("/" + m_DefaultDoc,"");
}
outputString = outputString.Substring(0,
(outputString.Length-this.m_Seperator.Length));
output.Write(outputString);
}
To get the path translated to a breadcrumb the control first checks it's configuration file (I used a custom library for that and show details of that in my next article) for an entry looking like this one:
<configuration>
<appSettings>
<add key="en-US@/products/default.aspx" value="CompanyName/Products" />
</appSettings>
</configuration>
The key contains the localized culture (so you can add different values for different languages), an @ as separator and the request path. You can also define a DefaultCulture that can be used if the users culture has net been defined (default is en_US).
To support UrlRewriting via HttpContext.Current.RewritePath(...) you can also add entries looking like this:
<configuration>
<appSettings>
<add key=en-US@/default.aspx?content=products
value="CompanyName/Products" />
</appSettings>
</configuration>
If the retrieved value is null the control looks for the same requested path but without the query string, so a correct bread crumb is shown when you work with query strings.
If you haven't defined anything in the configuration file the directory names and the file name will be capitalized and by default the extension is removed (/products/default.aspx gets /Products/Default).
If you are not using Visual Studio .NET you can compile the code with following command line:
csc.exe /out:StaticDust.Web.UI.Controls.BreadCrumbs.dll /target:library
BreadCrumbs.cs AssemblyInfo.cs /r:StaticDust.Configuration.dll
The ASP.NET code
To use the control in an .asxp page add following line to the head:
<%@ Register TagPrefix="ctrl" Namespace="StaticDust.Web.UI.Controls"
Assembly="StaticDust.Web.UI.Controls.BreadCrumbs" %>
And place the control tag where you want the breadcrumbs to be shown:
<ctrl:BreadCrumbs runat="server" />
History
