is the ASP.net navigation control really worth it?

Asp.net| Navigation | control

Just started to touch the menu control, it feels so awkward ah.

First, the Data Access section, for the so-called provider pattern, a layer of packaging, and are some black boxes, although the concept is quite advanced, the structure seems very clear, but still let me feel the daze, as well, just want to do a few data-driven menu just. There is that front menu class, so many properties, especially think of the menu class is a black box, do not know, it generated XHTML will be what kind of, and I have only a little bit of CSS knowledge, think of the desire to even try here is gone. You might as well write a menu yourself, online like a lot of ready-made JavaScript classes, such as this:

DIV_CSS structure, although not asp.net control so beautiful, but also very practical, at least are transparent. But backstage a bit of trouble, then the idea is:

1 Design a class sitemap, read the navigation information from the database, and then save it in a dataset.

2 Instantiate a sitemap and a sqlcachedependency in the Application_Start event handler to insert into the cache.

31 Dependency callback function to update data in cache

4 Extract data from cache to generate menu.

This makes it conceivable that the code of the Default.master code would be messy. Far from being easy to write, writing code is not easy to reuse. And there are a lot of questions about cache.

There must be other ways, asp.net I haven't touched a lot of things. But now think provider pattern is still good, a layer of API connection presentation layer, a layer of API to connect the data access layer.

Forced to learn the menu class, hoping it wouldn't be too surprising. Finally understand why open source let so many people excited, open and transparent Ah!

/**//*****************************************************
* Ypslideoutmenu
* 3/04/2001
*
* A nice little script to create exclusive, slide-out
* Menus for NS4, NS6, Mozilla, Opera, IE4, IE5 on
* Mac and Win32. I ' ve got no Linux or UNIX to test on but
* It should (?) work ...
*
* Revised:
*-08/29/2002:added. Hideall ()
*-04/15/2004:added WRITECSS () to support
*



than menus.
*
*--youngpup--
*****************************************************/
Ypslideoutmenu.registry = []
Ypslideoutmenu.anilen = 250
Ypslideoutmenu.hidedelay = 1000
Ypslideoutmenu.mincpuresolution = 10
Constructor
function Ypslideoutmenu (id, dir, left, top, width, height)
... {
this.ie = document.all? 1:0
THIS.NS4 = document.layers? 1:0
This.dom = document.getElementById? 1:0
if (this.ie | | this.ns4 | | this.dom) ... {
This.id = ID
This.dir = Dir
this.orientation = Dir = = "Left" | | dir = = "Right"? "H": "V"
This.dirtype = Dir = = "Right" | | dir = "Down"? "-" : "+"
This.dim = This.orientation = = "h"? Width:height
This.hidetimer = False
This.anitimer = False
This.open = False
This.over = False
This.starttime = 0
This.gref = "Ypslideoutmenu_" +id
Eval (this.gref+ "=this")
Ypslideoutmenu.registry[id] = this
var d = document
var strcss = "";
Strcss + = ' # ' + this.id + ' Container {visibility:hidden; '
Strcss + = ' Left: ' + left + ' px; '
Strcss + = ' top: ' + top + ' px; '
Strcss = ' Overflow:hidden; z-index:10000; }'
Strcss + = ' # ' + this.id + ' Container, # ' + this.id + ' Content {position:absolute; '
Strcss + = ' width: ' + width + ' px; '
Strcss + = ' Height: ' + height + ' px; '
Strcss + = ' clip:rect (0 ' + width + ' + height + ' 0); '
Strcss + = '} '
This.css = Strcss;
This.load ()
}
}
Ypslideoutmenu.writecss = function () ... {
Document.writeln (' <style type= ' text/css ">");
for (Var ID in ypslideoutmenu.registry) ... {
Document.writeln (YPSLIDEOUTMENU.REGISTRY[ID].CSS);
}
Document.writeln (' </style> ');
}
YpSlideOutMenu.prototype.load = function () ... {
var d = document
var lyrId1 = this.id + "Container"
var lyrId2 = this.id + "Content"
var obj1 = this.dom? d.getElementById (LYRID1): this.ie? D.ALL[LYRID1]: D.layers[lyrid1]
if (obj1) var obj2 = this.ns4? OBJ1.LAYERS[LYRID2]: this.ie? D.ALL[LYRID2]: d.getElementById (LYRID2)
var temp
if (!obj1 | |!obj2) window.settimeout (This.gref + ". Load ()", 100)
else ... {
This.container = Obj1
This.menu = Obj2
This.style = this.ns4? This.menu:this.menu.style
This.homepos = eval ("0" + This.dirtype + This.dim)
This.outpos = 0
This.accelconst = (this.outpos-this.homepos)/Ypslideoutmenu.anilen/ypslideoutmenu.anilen
Set event handlers.
if (THIS.NS4) this.menu.captureEvents (Event.mouseover | Event.mouseout);
This.menu.onmouseover = new Function ("Ypslideoutmenu.showmenu (' + this.id + ')")
This.menu.onmouseout = new Function ("Ypslideoutmenu.hidemenu (' + this.id + ')")
Set initial state
This.endslide ()
}
}
Ypslideoutmenu.showmenu = function (ID)
... {
var reg = Ypslideoutmenu.registry
var obj = Ypslideoutmenu.registry[id]
if (Obj.container) ... {
Obj.over = True
for (menu in REG) if (ID!= menu) ypslideoutmenu.hide (menu)
if (Obj.hidetimer) ... {Reg[id].hidetimer = Window.cleartimeout (Reg[id].hidetimer)}
if (!obj.open &&!obj.anitimer) Reg[id].startslide (True)
}
}
Ypslideoutmenu.hidemenu = function (ID)
... {
var obj = Ypslideoutmenu.registry[id]
if (Obj.container) ... {
if (Obj.hidetimer) window.cleartimeout (Obj.hidetimer)
Obj.hidetimer = Window.settimeout ("Ypslideoutmenu.hide ('" + ID + ")", Ypslideoutmenu.hidedelay);
}
}
Ypslideoutmenu.hideall = function ()
... {
var reg = Ypslideoutmenu.registry
for (menu in reg) ... {
Ypslideoutmenu.hide (menu);
if (Menu.hidetimer) window.cleartimeout (Menu.hidetimer);
}
}
Ypslideoutmenu.hide = function (ID)
... {
var obj = Ypslideoutmenu.registry[id]
Obj.over = False
if (Obj.hidetimer) window.cleartimeout (Obj.hidetimer)
Obj.hidetimer = 0
if (Obj.open &&!obj.anitimer) Obj.startslide (false)
}
YpSlideOutMenu.prototype.startSlide = function (Open) ... {
This[open? "OnActivate": "OnDeactivate"] ()
This.open = Open
if (open) this.setvisibility (true)
This.starttime = (new Date ()). GetTime ()
This.anitimer = Window.setinterval (This.gref + ". Slide ()", ypslideoutmenu.mincpuresolution)
}
YpSlideOutMenu.prototype.slide = function () ... {
var elapsed = (new Date ()). GetTime ()-This.starttime
if (Elapsed > Ypslideoutmenu.anilen) this.endslide ()
else ... {
var d = math.round (Math.pow (ypslideoutmenu.anilen-elapsed, 2) * this.accelconst)
if (this.open && this.dirtype = "-") d =-D
else if (this.open && This.dirtype = = "+") d =-D
else if (!this.open && this.dirtype = = "-") d =-this.dim + D
else D = This.dim + D
This.moveto (d)
}
}
YpSlideOutMenu.prototype.endSlide = function () ... {
This.anitimer = Window.cleartimeout (This.anitimer)
This.moveto (This.open This.outPos:this.homePos)
if (!this.open) this.setvisibility (false)
if ((This.open &&!this.over) | | (!this.open && This.over)) ... {
This.startslide (This.over)
}
}
ypSlideOutMenu.prototype.setVisibility = function (bshow) ... {
var s = this.ns4? This.container:this.container.style
S.visibility = bshow? "Visible": "Hidden"
}
YpSlideOutMenu.prototype.moveTo = function (P) ... {
This.style[this.orientation = = "h"? ' Left ': ' top ' = this.ns4? P:p + "px"
}
YpSlideOutMenu.prototype.getPos = function (c) ... {
return parseint (This.style[c])
}
YpSlideOutMenu.prototype.onactivate = function () ... { }
YpSlideOutMenu.prototype.ondeactivate = function () ... { }