OpenCube QuickMenu and Web.sitemap

noname-2013

Rate me:

4.00/5 (1 vote)

20 Nov 2008GPL3

27.2K

How an Open Cube dynamic menu can be used with an ASP.NET Web.sitemap.

Download source code - 20.9 KB

Introduction

Maybe you have heard about http://www.opencube.com/ and their menu projects.. Cool, really cool. But their cool menu stays on its own. So, two classes were implemented to learn their menu 'talk' with the Web.sitemap file of ASP.NET web applications. This menu is generated using the HTML class ykorotia_eu.Web.HTMLwriter, with the code snippet assigned in ykorotia_eu.OpenCube.QuickMenu.

A working example can be seen here on my personal page: ykorotia.eu.

Using the code

Here is a test and working page with their menu:

ASP.NET

======== Default.aspx =======
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

<link href="OpenCube_QuickMenu/1.css" rel="stylesheet" type="text/css" />
<script src="OpenCube_QuickMenu/MenuInit.js" type="text/javascript"></script>
<script src="OpenCube_QuickMenu/Core.js" type="text/javascript"></script>
    <script src="OpenCube_QuickMenu/Add-On/RoundedItems.js" 
       type="text/javascript"></script>

    <script src="OpenCube_QuickMenu/Add-On/RoundedCorners.js" 
       type="text/javascript"></script>
    <script src="OpenCube_QuickMenu/Add-On/MergeAnimation.js" 
       type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <%=ykorotia_eu.OpenCube.QuickMenu.GetMenuFromSitemap() %>      

<script type="text/javascript">
    qm_create(0, false, 0, 500, false, false, false, false, false);
    </script>
    
    DEFAULT
    
    </div>
    </form>
</body>
</html>

The background menu looks like this:

==== QuickMenu.cs ====
public static string GetMenuFromSitemap()
{
    SitemapLevel lvl = SitemapLevel.three;

    string qmDivider = "[qmDivider]";
    string qmTitle = "[qmTitle]";
    string qmCss_Parent = "qmparent";

    StringBuilder sb = new StringBuilder();
    ykorotia_eu.Web.HTMLwriter wri = new ykorotia_eu.Web.HTMLwriter();

    //prelude
    //<ul id="qm0" class="qmmc"
    sb.Append(wri.AddTag("ul","qmmc","", "qm0"));

    // Doing from ROOT and so on
    //p.s. Root node is hidden
    if (SiteMap.RootNode.HasChildNodes && lvl >= SitemapLevel.one)
    {
        ........

where SitemapLevel allows you to assign how deep should we read menu nodes from Web.sitemap.

To enable features like 'title', 'divider line', the description parameter is used:

XML

==== Web.sitemap ====
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
  <siteMapNode url="~/" title="root"  description="">
    <siteMapNode url="~/1/1.aspx" title="I-CONTENT"  description="">
      <siteMapNode title="Online Tools" url="~/1" 
               description="[qmTitle] | [qmDivider]" />
        <siteMapNode title="Online Tools" url="~/1/" >
        <siteMapNode title="IPv4toNumber" url="~/1/2.aspx"/>
      </siteMapNode>
    </siteMapNode>
  </siteMapNode>
</siteMap>

The deepest HTML generation starts in HTMLwriter.cs.

Web.sitemap needs to have unique URLs, but sometimes, the first links in the menu should be non-clickable. You can do this by placing this code in QuickMenu.cs:

//.....
// Doing from ROOT and so on
//p.s. Root node is hidden
if (SiteMap.RootNode.HasChildNodes && lvl >= SitemapLevel.one)
{
    //=== 1st LEVEL ===
    #region 1st level
    foreach (SiteMapNode child_nodes1 in SiteMap.RootNode.ChildNodes)
    {
        // main menu nodes
        sb.Append(wri.AddTag("li") + wri.AddLink(child_nodes1.Title, 
            //child_nodes1.Url - ignoring url in web.sitemap
            "javascript:void(0);", 
            qmCss_Parent, "", false));
.....

History

First version: Added some tips.

License

This article, along with any associated source code and files, is licensed under The GNU General Public License (GPLv3)

Written By

noname-2013

Ukraine

This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

OpenCube QuickMenu and Web.sitemap

Introduction

Using the code

History

License

Comments and Discussions