![](https://img-my.csdn.net/uploads/201206/05/1338849557_3123.gif)
![](https://img-my.csdn.net/uploads/201206/05/1338849557_3123.gif)
CM_ADD-IN - hideselectboxes (last updated: 11/13/02)
IE5+ and NS6+ only - ignores the other browsers
1 cm_addins.js
Because of the selectbox bug in the browsers that makes
selectboxes have the highest z-index whatever you do
this script will check for selectboxes that interfear with
your menu items and then hide them.
Just add this code to the coolmenus js file
or link the cm_addins.js file to your page as well.
*****************************************/
if(bw.dom&&!bw.op){
makeCM.prototype.sel=0
makeCM.prototype.onshow+=";this.hideselectboxes(pm,pm.subx,pm.suby,maxw,maxh,pm.lev)"
makeCM.prototype.hideselectboxes=function(pm,x,y,w,h,l){
var selx,sely,selw,selh,i
if(!this.sel){
this.sel=this.doc.getElementsByTagName("SELECT")
this.sel.level=0
}
var sel=this.sel
for(i=0;i<sel.length;i++){
selx=0; sely=0; var selp;
if(sel[i].offsetParent){selp=sel[i]; while(selp.offsetParent){selp=selp.offsetParent; selx+=selp.offsetLeft; sely+=selp.offsetTop;}}
selx+=sel[i].offsetLeft; sely+=sel[i].offsetTop
selw=sel[i].offsetWidth; selh=sel[i].offsetHeight
if(selx+selw>x && selx<x+w && sely+selh>y && sely<y+h){
if(sel[i].style.visibility!="hidden"){sel[i].level=l; sel[i].style.visibility="hidden"; if(pm){ if(!pm.mout) pm.mout=""; pm.mout+=this.name+".sel["+i+"].style.visibility='visible';"}}
}else if(l<=sel[i].level && !(pm&&l==0)) sel[i].style.visibility="visible"
}
}
}
/******************
CM_ADD-IN - filterIt (last updated: 01/26/02)
Explorer5.5+ only. Other browser will ignore it.
This function uses filters for Explorer to show
the subitems.
If you use this add-in you will get 1 new
level property called "filter". You have
to specify which filter to use and what
level to use them on.
(this properties will also be inherited though)
Example setting:
oCMenu.level[3].filter="progid:DXImageTransform.Microsoft.Fade(duration=0.5)"
Examples on how to use this will come later.
Just add this code to the coolmenus js file
or link the cm_addins.js file to your page as well.
*****************/
bw.filter=(bw.ie55||bw.ie6) && !bw.mac
makeCM.prototype.onshow+=";if(c.l[pm.lev].filter) b.filterIt(c.l[pm.lev].filter)"
cm_makeLevel.prototype.filter=null
cm_makeObj.prototype.filterIt=function(f){
if(bw.filter){
if(this.evnt.filters[0]) this.evnt.filters[0].Stop();
else this.css.filter=f;
this.evnt.filters[0].Apply();
this.showIt();
this.evnt.filters[0].Play();
}
}
/******************
CM_ADD-IN - slide (last updated: 01/26/02)
This works in all browsers, but it can be
unstable on all other browsers then Explorer.
This function shows the submenus in a sliding
effect. If you use this add-in you get two
new level properties called "slidepx" and
"slidetim". You have to specify this for
the levels you want this to happen on
(these properties will also be inherited though)
slidepx is the number of pixels you want the
div to slide each setTimout, while "slidetim"
is the setTimeout speed (in milliseconds)
Example setting:
oCMenu.level[3].slidepx=10
oCMenu.level[3].slidetim=20
Just add this code to the coolmenus js file
or link the cm_addins.js file to your page as well.
*****************/
makeCM.prototype.onshow+="; if(c.l[pm.lev].slidepx){b.moveIt(x,b.y-b.h); b.showIt(); b.tim=null; b.slide(y,c.l[pm.lev].slidepx,c.l[pm.lev].slidetim,c,pm.lev,pm.name)}"
makeCM.prototype.going=0
cm_makeObj.prototype.tim=10;
cm_makeLevel.prototype.slidepx=null
cm_makeLevel.prototype.slidetim=30
cm_makeObj.prototype.slide=function(end,px,tim,c,l,name){
if(!this.vis || c.l[l].a!=name) return
if(this.y<end-px){
if(this.y>(end-px*px-px) && px>1) px-=px/5; this.moveIt(this.x,this.y+px)
this.clipTo(end-this.y,this.w,this.h,0)
this.tim=setTimeout(this.obj+".slide("+end+","+px+","+tim+","+c.name+","+l+",'"+name+"')",tim)
}else{this.moveIt(this.x,end)}
}
/******************
CM_ADD-IN - clipout (last updated: 01/26/02)
This works in all browsers, but it can be
unstable on all other browsers then Explorer.
This function shows the submenus with a clipping
effect. If you use this add-in you get two
new level properties called "clippx" and
"cliptim". You have to specify this for
the levels you want this to happen on
(these properties will also be inherited though)
"clippx" is the number of pixels you want the
div to slide each setTimout, while "cliptim"
is the setTimeout speed (in milliseconds)
Example setting:
oCMenu.level[3].clippx=10
oCMenu.level[3].cliptim=20
Just add this code to the coolmenus js file
or link the cm_addins.js file to your page as well.
*****************/
makeCM.prototype.onshow+="if(c.l[pm.lev].clippx){h=b.h; if(!rows) b.clipTo(0,maxw,0,0,1); else b.clipTo(0,0,maxh,0,1); b.clipxy=0; b.showIt(); clearTimeout(b.tim); b.clipout(c.l[pm.lev].clippx,!rows?maxw:maxh,!rows?maxh:maxw,c.l[pm.lev].cliptim,rows)}"
cm_makeObj.prototype.tim=10;
cm_makeLevel.prototype.clippx=null
cm_makeLevel.prototype.cliptim=30
cm_makeObj.prototype.clipxy=0
cm_makeObj.prototype.clipout=function(px,w,stop,tim,rows){
if(!this.vis) return; if(this.clipxy<stop-px){this.clipxy+=px;
if(!rows) this.clipTo(0,w,this.clipxy,0,1);
else this.clipTo(0,this.clipxy,w,0,1);
this.tim=setTimeout(this.obj+".clipout("+px+","+w+","+stop+","+tim+","+rows+")",tim)
}else{if(bw.ns6){this.hideIt();}; if(!rows) this.clipTo(0,w,stop,0,1); else this.clipTo(0,stop,w,0,1);if(bw.ns6){this.showIt()}}
}
2 cookies.js
// =========================================================================
// Cookie functions
// =========================================================================
/* This function is used to set cookies */
function setCookie(name,value,expires,path,domain,secure) {
document.cookie = name + "=" + escape (value) +
((expires) ? "; expires=" + expires.toGMTString() : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : "");
}
/* This function is used to get cookies */
function getCookie(name) {
var prefix = name + "="
var start = document.cookie.indexOf(prefix)
if (start==-1) {
return null;
}
var end = document.cookie.indexOf(";", start+prefix.length)
if (end==-1) {
end=document.cookie.length;
}
var value=document.cookie.substring(start+prefix.length, end)
return unescape(value);
}
/* This function is used to delete cookies */
function deleteCookie(name,path,domain) {
if (getCookie(name)) {
document.cookie = name + "=" +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT";
}
}
3 coolmenu-config.js
/*****************************************************************************
Default browsercheck - Leave this one
******************************************************************************/
function lib_bwcheck(){ //Browsercheck (needed)
this.ver=navigator.appVersion; this.agent=navigator.userAgent
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ie=this.ie4||this.ie5||this.ie6
this.mac=this.agent.indexOf("Mac")>-1
this.opera5=this.agent.indexOf("Opera 5")>-1
this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5 || this.dom)
return this
}
var bw=new lib_bwcheck() //Making browsercheck object
var mDebugging=2 //General debugging variable. Set to 0 for no debugging, 1 for alerts or 2 for status debugging.
oCMenu=new makeCoolMenu("oCMenu") //Making the menu object. Argument: menuname
oCMenu.useframes=0 //Do you want to use the menus as coolframemenu or not? (in frames or not) - Value: 0 || 1
oCMenu.frame="" //The name of your main frame (where the menus should appear). Leave empty if you're not using frames - Value: "main_frame_name"
oCMenu.useclick=0 //If you want the menu to be activated and deactivated onclick only set this to 1. - Value: 0 || 1
/*If you set this to 1 you will get a "hand" cursor when moving over the links in NS4.
NOTE: This does not apply to the submenus if the menu is used in frames due some mayor problems with NS4*/
oCMenu.useNS4links=1
//After adding the "hover effect" for netscape as well, all styles are lost. But if you want padding add it here.
oCMenu.NS4padding=2
//If you have select boxes close to your menu the menu will check for that and hide them if they are in the way of the menu.
//This feature does unfortunatly not work in NS4!
oCMenu.checkselect=1
/*If you choose to have this code inside a linked js, or if your using frames it's important to set these variables.
This will help you get your links to link to the right place even if your files are in different folders.
The offlineUrl variable is the actual path to the directory where you js file are locally.
This is just so you can test it without uploading. Remember to start it with file:/// and only use slashes, no backward slashes!
Also remember to end with a slash */
oCMenu.offlineUrl="file:///C|/Inetpub/wwwroot/dhtmlcentral/" //Value: "path_to_menu_file_offline/"
//The onlineUrl variable is the online path to your script. Place in the full path to where your js file is. Remember to end with a slash.
oCMenu.onlineUrl="http://www.dhtmlcentral.com/coolmenus/examples/withoutframes/" //Value: "path_to_menu_file_online/"
oCMenu.pagecheck=1 //Do you want the menu to check whether any of the subitems are out of the bouderies of the page and move them in again (this is not perfect but it hould work) - Value: 0 || 1
oCMenu.checkscroll=0 //Do you want the menu to check whether the page have scrolled or not? For frames you should always set this to 1. You can set this to 2 if you want this feature only on explorer since netscape doesn't support the window.onscroll this will make netscape slower (only if not using frames) - Value: 0 || 1 || 2
oCMenu.resizecheck=1 //Do you want the page to reload if it's resized (This should be on or the menu will crash in Netscape4) - Value: 0 || 1
oCMenu.wait=1000 //How long to wait before hiding the menu on mouseout. Netscape 6 is a lot slower then Explorer, so to be sure that it works good enough there you should not have this lower then 500 - Value: milliseconds
//Background bar properties
oCMenu.usebar=1 //If you want to use a background-bar for the top items set this on - Value: 1 || 0
oCMenu.barcolor="lightblue" //The color of the background bar - Value: "color"
oCMenu.barwidth="850" //The width of the background bar. Set this to "menu" if you want it to be the same width as the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.barheight="menu" //The height of the background bar. Set this to "menu" if you want it to be the same height as the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.barx=0 //The left position of the bar. Set this to "menu" if you want it be the same as the left position of the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.bary="menu" //The top position of the bar Set this to "menu" if you want it be the same as the top position of the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.barinheritborder=0 //Set this to 1 if you want the bar to have the same border as the top menus - Value: 0 || 1
//Placement properties
oCMenu.rows=1 //This controls whether the top items is supposed to be laid out in rows or columns. Set to 0 for columns and 1 for row - Value 0 || 1
oCMenu.fromleft=20 //This is the left position of the menu. (Only in use if menuplacement below is 0 or aligned) (will change to adapt any borders) - Value: px || "%"
oCMenu.fromtop=50 //This is the left position of the menu. (Only in use if menuplacement below is 0 or aligned) (will change to adapt any borders) - Value: px || "%"
oCMenu.pxbetween=30 //How much space you want between each of the top items. - Value: px || "%"
/*You have several different ways to place the top items.
You can have them right beside eachother (only adding the pxbetween variable)
oCMenu.menuplacement=0
You can have them aligned to one of the sides - This is mostly when not using frames, but can be used in both conditions
Values: (If you get strange results check the fromleft,fromtop and pxbetween variables above)
For menus that are placed in columns (align=left or align=right (se below)) you can align them to the "right" or "center"
For menus that are placed in rows (align=top or align=bottom (se below)) you can align them to the "bottom", "center" or "bottomcenter"
oCMenu.menuplacement="center"
You can also set them directly in pixels: (Remember to have as many array members as you have top items)
oCMenu.menuplacement=new Array(10,200,400,600)
Or you can place in percentage: (remember to use the ' ' around the numbers)
Choose one of those options to get the desired results.
*/
oCMenu.menuplacement=0
/*
Now we are ready for the properties of each level. For those of that have used the old
coolmenus for coolframemenu I will try and explain how this works like this:
level[0] = top items
level[1] = sub items
level[2] = sub2 items
level[3] = sub3 items and so on....
All menus will inherit the properties, and all properties does only HAVE to be spesifed on the top level.
If a level doesn't have on property spesified it will look for it on the last level that was spesified,
if it still doesn't exist it will get the properties from level[0]
Which means that if you set the background color on level[0] to "black" and doesn't spesify any more levels or doesn't
spesify the background color on the last level you spesified ALL menus will get the color from level[0]
Did that make sense at all? This can be a little hard to understand, look at the different examples on my site
and play with and I am sure you'll get what I mean.
*/
//TOP LEVEL PROPERTIES - ALL OF THESE MUST BE SPESIFIED FOR LEVEL[0]
oCMenu.level[0]=new Array() //Add this for each new level
oCMenu.level[0].width=110 //The default width for each level[0] (top) items. You can override this on each item by spesifying the width when making the item. - Value: px || "%"
oCMenu.level[0].height=20 //The default height for each level[0] (top) items. You can override this on each item by spesifying the height when making the item. - Value: px || "%"
oCMenu.level[0].bgcoloroff="lightblue" //The default background color for each level[0] (top) items. You can override this on each item by spesifying the backgroundcolor when making the item. - Value: "color"
oCMenu.level[0].bgcoloron="blue" //The default "on" background color for each level[0] (top) items. You can override this on each item by spesifying the "on" background color when making the item. - Value: "color"
oCMenu.level[0].textcolor="black" //The default text color for each level[0] (top) items. You can override this on each item by spesifying the text color when making the item. - Value: "color"
oCMenu.level[0].hovercolor="white" //The default "on" text color for each level[0] (top) items. You can override this on each item by spesifying the "on" text color when making the item. - Value: "color"
oCMenu.level[0].style="padding:2px; font-family:tahoma,arial,helvetica; font-size:12px; font-weight:bold" //The style for all level[0] (top) items. - Value: "style_settings"
oCMenu.level[0].border=0 //The border size for all level[0] (top) items. - Value: px
oCMenu.level[0].bordercolor="blue" //The border color for all level[0] (top) items. - Value: "color"
oCMenu.level[0].offsetX=1 //The X offset of the submenus of this item. This does not affect the first submenus, but you need it here so it can be the default value for all levels. - Value: px
oCMenu.level[0].offsetY=1 //The Y offset of the submenus of this item. This does not affect the first submenus, but you need it here so it can be the default value for all levels. - Value: px
oCMenu.level[0].NS4font="tahoma,arial,helvetica"
oCMenu.level[0].NS4fontSize="2"
/*New: Added animation features that can be controlled on each level.*/
oCMenu.level[0].clip=0 //Set this to 1 if you want the submenus of this level to "slide" open in a animated clip effect. - Value: 0 || 1
oCMenu.level[0].clippx=0 //If you have clip spesified you can set how many pixels it will clip each timer in here to control the speed of the animation. - Value: px
oCMenu.level[0].cliptim=0 //This is the speed of the timer for the clip effect. Play with this and the clippx to get the desired speed for the clip effect (be carefull though and try and keep this value as high or possible or you can get problems with NS4). - Value: milliseconds
//Filters - This can be used to get some very nice effect like fade, slide, stars and so on. EXPLORER5.5+ ONLY - If you set this to a value it will override the clip on the supported browsers
oCMenu.level[0].filter=0 //VALUE: 0 || "filter specs"
/*And last but not least the align variable.
This spesifies how the submenus of this level comes out.
Values:
"bottom": The sub menus of this level will come out on the top of this item
"top": The sub menus of this level will come out on the bottom of this item
"left": The sub menus of this level will come out on the right of this item
"right": The sub menus of this level will come out on the left of this item
In generally "left" and "right" works best for menus in columns and "top" and "bottom" works best for menus in rows.
But by all means feel free to play with it.
If you have set pagecheck to 1 above this is what the pagecheck will change when reaching the bounderies of the page.
If it reaches the right boundery and it's aligned left it will change the align to right and so on.
*/
oCMenu.level[0].align="bottom" //Value: "top" || "bottom" || "left" || "right"
//EXAMPLE SUB LEVEL[1] PROPERTIES - You have to spesify the properties you want different from LEVEL[0] - If you want all items to look the same just remove this
oCMenu.level[1]=new Array() //Add this for each new level (adding one to the number)
oCMenu.level[1].width=150
oCMenu.level[1].height=20
oCMenu.level[1].style="padding:2px; font-family:tahoma, arial,helvetica; font-size:8pt"
oCMenu.level[1].align="bottom"
oCMenu.level[1].offsetX=-4
oCMenu.level[1].offsetY=0
oCMenu.level[1].border=1
oCMenu.level[1].bordercolor="#006699"
//EXAMPLE SUB LEVEL[2] PROPERTIES - You have to spesify the properties you want different from LEVEL[1] OR LEVEL[0] - If you want all items to look the same just remove this
oCMenu.level[2]=new Array() //Add this for each new level (adding one to the number)
oCMenu.level[2].width=oCMenu.level[0].width
oCMenu.level[2].height=20
//oCMenu.level[2].bgcoloroff="#009999"
//oCMenu.level[2].bgcoloron="#0099cc"
oCMenu.level[2].style="padding:2px; font-family:tahoma,arial,helvetica; font-size:8pt"
oCMenu.level[2].align="bottom"
oCMenu.level[2].offsetX=0
oCMenu.level[2].offsetY=0
oCMenu.level[2].border=1
oCMenu.level[2].bordercolor="#006699"
oCMenu.level[2].NS4font="tahoma,arial,helvetica"
oCMenu.level[2].NS4fontSize="1"
// Struts Menu specific javascript variables
// menu arrows
cmTopMenuImage=' <img src="images/Darrow.gif">'
cmSubMenuImage=' <img src="images/Rarrow.gif">'
// normal menu colors
// this is required!
cmBGColorOn=''
cmBGColorOff=''
cmTxtColor=''
cmHoverColor=''
4 coolmenu2-config.js
/*****************************************************************************
Default browsercheck - Leave this one
******************************************************************************/
function lib_bwcheck(){ //Browsercheck (needed)
this.ver=navigator.appVersion; this.agent=navigator.userAgent
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ie=this.ie4||this.ie5||this.ie6
this.mac=this.agent.indexOf("Mac")>-1
this.opera5=this.agent.indexOf("Opera 5")>-1
this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5 || this.dom)
return this
}
var bw=new lib_bwcheck() //Making browsercheck object
var mDebugging=2 //General debugging variable. Set to 0 for no debugging, 1 for alerts or 2 for status debugging.
oCMenu=new makeCoolMenu("oCMenu") //Making the menu object. Argument: menuname
oCMenu.useframes=0 //Do you want to use the menus as coolframemenu or not? (in frames or not) - Value: 0 || 1
oCMenu.frame="" //The name of your main frame (where the menus should appear). Leave empty if you're not using frames - Value: "main_frame_name"
oCMenu.useclick=0 //If you want the menu to be activated and deactivated onclick only set this to 1. - Value: 0 || 1
/*If you set this to 1 you will get a "hand" cursor when moving over the links in NS4.
NOTE: This does not apply to the submenus if the menu is used in frames due some mayor problems with NS4*/
oCMenu.useNS4links=1
//After adding the "hover effect" for netscape as well, all styles are lost. But if you want padding add it here.
oCMenu.NS4padding=2
//If you have select boxes close to your menu the menu will check for that and hide them if they are in the way of the menu.
//This feature does unfortunatly not work in NS4!
oCMenu.checkselect=1
/*If you choose to have this code inside a linked js, or if your using frames it's important to set these variables.
This will help you get your links to link to the right place even if your files are in different folders.
The offlineUrl variable is the actual path to the directory where you js file are locally.
This is just so you can test it without uploading. Remember to start it with file:/// and only use slashes, no backward slashes!
Also remember to end with a slash */
oCMenu.offlineUrl="file:///C|/Inetpub/wwwroot/dhtmlcentral/" //Value: "path_to_menu_file_offline/"
//The onlineUrl variable is the online path to your script. Place in the full path to where your js file is. Remember to end with a slash.
oCMenu.onlineUrl="http://www.dhtmlcentral.com/coolmenus/examples/withoutframes/" //Value: "path_to_menu_file_online/"
oCMenu.pagecheck=1 //Do you want the menu to check whether any of the subitems are out of the bouderies of the page and move them in again (this is not perfect but it hould work) - Value: 0 || 1
oCMenu.checkscroll=0 //Do you want the menu to check whether the page have scrolled or not? For frames you should always set this to 1. You can set this to 2 if you want this feature only on explorer since netscape doesn't support the window.onscroll this will make netscape slower (only if not using frames) - Value: 0 || 1 || 2
oCMenu.resizecheck=1 //Do you want the page to reload if it's resized (This should be on or the menu will crash in Netscape4) - Value: 0 || 1
oCMenu.wait=1000 //How long to wait before hiding the menu on mouseout. Netscape 6 is a lot slower then Explorer, so to be sure that it works good enough there you should not have this lower then 500 - Value: milliseconds
//Background bar properties
oCMenu.usebar=1 //If you want to use a background-bar for the top items set this on - Value: 1 || 0
oCMenu.barcolor="lightblue" //The color of the background bar - Value: "color"
oCMenu.barwidth="850" //The width of the background bar. Set this to "menu" if you want it to be the same width as the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.barheight="menu" //The height of the background bar. Set this to "menu" if you want it to be the same height as the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.barx=0 //The left position of the bar. Set this to "menu" if you want it be the same as the left position of the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.bary="menu" //The top position of the bar Set this to "menu" if you want it be the same as the top position of the menu. (this will change to match the border if you have one) - Value: px || "%" || "menu"
oCMenu.barinheritborder=0 //Set this to 1 if you want the bar to have the same border as the top menus - Value: 0 || 1
//Placement properties
oCMenu.rows=1 //This controls whether the top items is supposed to be laid out in rows or columns. Set to 0 for columns and 1 for row - Value 0 || 1
oCMenu.fromleft=20 //This is the left position of the menu. (Only in use if menuplacement below is 0 or aligned) (will change to adapt any borders) - Value: px || "%"
oCMenu.fromtop=0 //This is the left position of the menu. (Only in use if menuplacement below is 0 or aligned) (will change to adapt any borders) - Value: px || "%"
oCMenu.pxbetween=30 //How much space you want between each of the top items. - Value: px || "%"
/*You have several different ways to place the top items.
You can have them right beside eachother (only adding the pxbetween variable)
oCMenu.menuplacement=0
You can have them aligned to one of the sides - This is mostly when not using frames, but can be used in both conditions
Values: (If you get strange results check the fromleft,fromtop and pxbetween variables above)
For menus that are placed in columns (align=left or align=right (se below)) you can align them to the "right" or "center"
For menus that are placed in rows (align=top or align=bottom (se below)) you can align them to the "bottom", "center" or "bottomcenter"
oCMenu.menuplacement="center"
You can also set them directly in pixels: (Remember to have as many array members as you have top items)
oCMenu.menuplacement=new Array(10,200,400,600)
Or you can place in percentage: (remember to use the ' ' around the numbers)
Choose one of those options to get the desired results.
*/
oCMenu.menuplacement=0
/*
Now we are ready for the properties of each level. For those of that have used the old
coolmenus for coolframemenu I will try and explain how this works like this:
level[0] = top items
level[1] = sub items
level[2] = sub2 items
level[3] = sub3 items and so on....
All menus will inherit the properties, and all properties does only HAVE to be spesifed on the top level.
If a level doesn't have on property spesified it will look for it on the last level that was spesified,
if it still doesn't exist it will get the properties from level[0]
Which means that if you set the background color on level[0] to "black" and doesn't spesify any more levels or doesn't
spesify the background color on the last level you spesified ALL menus will get the color from level[0]
Did that make sense at all? This can be a little hard to understand, look at the different examples on my site
and play with and I am sure you'll get what I mean.
*/
//TOP LEVEL PROPERTIES - ALL OF THESE MUST BE SPESIFIED FOR LEVEL[0]
oCMenu.level[0]=new Array() //Add this for each new level
oCMenu.level[0].width=110 //The default width for each level[0] (top) items. You can override this on each item by spesifying the width when making the item. - Value: px || "%"
oCMenu.level[0].height=20 //The default height for each level[0] (top) items. You can override this on each item by spesifying the height when making the item. - Value: px || "%"
oCMenu.level[0].bgcoloroff="lightblue" //The default background color for each level[0] (top) items. You can override this on each item by spesifying the backgroundcolor when making the item. - Value: "color"
oCMenu.level[0].bgcoloron="blue" //The default "on" background color for each level[0] (top) items. You can override this on each item by spesifying the "on" background color when making the item. - Value: "color"
oCMenu.level[0].textcolor="black" //The default text color for each level[0] (top) items. You can override this on each item by spesifying the text color when making the item. - Value: "color"
oCMenu.level[0].hovercolor="white" //The default "on" text color for each level[0] (top) items. You can override this on each item by spesifying the "on" text color when making the item. - Value: "color"
oCMenu.level[0].style="padding:2px; font-family:tahoma,arial,helvetica; font-size:12px; font-weight:bold" //The style for all level[0] (top) items. - Value: "style_settings"
oCMenu.level[0].border=0 //The border size for all level[0] (top) items. - Value: px
oCMenu.level[0].bordercolor="blue" //The border color for all level[0] (top) items. - Value: "color"
oCMenu.level[0].offsetX=1 //The X offset of the submenus of this item. This does not affect the first submenus, but you need it here so it can be the default value for all levels. - Value: px
oCMenu.level[0].offsetY=1 //The Y offset of the submenus of this item. This does not affect the first submenus, but you need it here so it can be the default value for all levels. - Value: px
oCMenu.level[0].NS4font="tahoma,arial,helvetica"
oCMenu.level[0].NS4fontSize="1"
/*New: Added animation features that can be controlled on each level.*/
oCMenu.level[0].clip=0 //Set this to 1 if you want the submenus of this level to "slide" open in a animated clip effect. - Value: 0 || 1
oCMenu.level[0].clippx=0 //If you have clip spesified you can set how many pixels it will clip each timer in here to control the speed of the animation. - Value: px
oCMenu.level[0].cliptim=0 //This is the speed of the timer for the clip effect. Play with this and the clippx to get the desired speed for the clip effect (be carefull though and try and keep this value as high or possible or you can get problems with NS4). - Value: milliseconds
//Filters - This can be used to get some very nice effect like fade, slide, stars and so on. EXPLORER5.5+ ONLY - If you set this to a value it will override the clip on the supported browsers
oCMenu.level[0].filter=0 //VALUE: 0 || "filter specs"
/*And last but not least the align variable.
This spesifies how the submenus of this level comes out.
Values:
"bottom": The sub menus of this level will come out on the top of this item
"top": The sub menus of this level will come out on the bottom of this item
"left": The sub menus of this level will come out on the right of this item
"right": The sub menus of this level will come out on the left of this item
In generally "left" and "right" works best for menus in columns and "top" and "bottom" works best for menus in rows.
But by all means feel free to play with it.
If you have set pagecheck to 1 above this is what the pagecheck will change when reaching the bounderies of the page.
If it reaches the right boundery and it's aligned left it will change the align to right and so on.
*/
oCMenu.level[0].align="bottom" //Value: "top" || "bottom" || "left" || "right"
//EXAMPLE SUB LEVEL[1] PROPERTIES - You have to spesify the properties you want different from LEVEL[0] - If you want all items to look the same just remove this
oCMenu.level[1]=new Array() //Add this for each new level (adding one to the number)
oCMenu.level[1].width=150
oCMenu.level[1].height=20
oCMenu.level[1].style="padding:2px; font-family:tahoma, arial,helvetica; font-size:8pt"
oCMenu.level[1].align="bottom"
oCMenu.level[1].offsetX=-4
oCMenu.level[1].offsetY=0
oCMenu.level[1].border=1
oCMenu.level[1].bordercolor="#006699"
//EXAMPLE SUB LEVEL[2] PROPERTIES - You have to spesify the properties you want different from LEVEL[1] OR LEVEL[0] - If you want all items to look the same just remove this
oCMenu.level[2]=new Array() //Add this for each new level (adding one to the number)
oCMenu.level[2].width=oCMenu.level[0].width
oCMenu.level[2].height=20
//oCMenu.level[2].bgcoloroff="#009999"
//oCMenu.level[2].bgcoloron="#0099cc"
oCMenu.level[2].style="padding:2px; font-family:tahoma,arial,helvetica; font-size:8pt"
oCMenu.level[2].align="bottom"
oCMenu.level[2].offsetX=0
oCMenu.level[2].offsetY=0
oCMenu.level[2].border=1
oCMenu.level[2].bordercolor="#006699"
oCMenu.level[2].NS4font="tahoma,arial,helvetica"
oCMenu.level[2].NS4fontSize="1"
oCMenu.hideForm="document.formlayer" //Values: "" || "document.LAYER_NAME"
// Struts Menu specific javascript variables
// menu arrows
cmTopMenuImage=' <img src="images/Rarrow.gif">'
cmSubMenuImage=' <img src="images/Rarrow.gif">'
// normal menu colors
// this is required!
cmBGColorOn=''
cmBGColorOff=''
cmTxtColor=''
cmHoverColor=''
5 coolmenu4-config.js
/***
This is the menu creation code - place it right after you body tag
Feel free to add this to a stand-alone js file and link it to your page.
**/
//Menu object creation
oCMenu=new makeCM("oCMenu") //Making the menu object. Argument: menuname
oCMenu.frames = 0
//Menu properties
oCMenu.pxBetween=0
oCMenu.fromLeft=40
oCMenu.fromTop=0
oCMenu.rows=1
oCMenu.menuPlacement="left"
oCMenu.offlineRoot="file:///C|/Inetpub/wwwroot/dhtmlcentral/projects/coolmenus/examples/"
oCMenu.onlineRoot=""
oCMenu.resizeCheck=1
oCMenu.wait=100
oCMenu.fillImg="../images/cm_fill.gif"
oCMenu.zIndex=400
oCMenu.pagecheck=0
oCMenu.checkscroll=0
//Background bar properties
oCMenu.useBar=1
oCMenu.barWidth="100%"
oCMenu.barHeight="menu"
oCMenu.barClass="clBar"
oCMenu.barX=0
oCMenu.barY=0
oCMenu.barBorderX=0
oCMenu.barBorderY=0
oCMenu.barBorderClass=""
//Level properties - ALL properties have to be spesified in level 0
oCMenu.level[0]=new cm_makeLevel() //Add this for each new level
oCMenu.level[0].width=100
oCMenu.level[0].height=25
oCMenu.level[0].regClass="cmMenu"
oCMenu.level[0].overClass="cmMenuOver"
oCMenu.level[0].borderX=1
oCMenu.level[0].borderY=1
oCMenu.level[0].borderClass="cmMenuBorder"
oCMenu.level[0].offsetX=0
oCMenu.level[0].offsetY=0
oCMenu.level[0].rows=0
oCMenu.level[0].arrow=0
oCMenu.level[0].arrowWidth=0
oCMenu.level[0].arrowHeight=0
oCMenu.level[0].align="bottom"
oCMenu.level[0].filter="progid:DXImageTransform.Microsoft.Fade(duration=0.5)"
oCMenu.level[0].arrow="images/Rarrow.gif"
oCMenu.level[0].arrowWidth=12
oCMenu.level[0].arrowHeight=12
//EXAMPLE SUB LEVEL[1] PROPERTIES - You have to specify the properties you want different from LEVEL[0] - If you want all items to look the same just remove this
oCMenu.level[1]=new cm_makeLevel() //Add this for each new level (adding one to the number)
oCMenu.level[1].width=oCMenu.level[0].width-2
oCMenu.level[1].height=22
oCMenu.level[1].regClass="cmItem"
oCMenu.level[1].overClass="cmItemOver"
oCMenu.level[1].borderX=1
oCMenu.level[1].borderY=1
oCMenu.level[1].align="right"
oCMenu.level[1].offsetX=-5
oCMenu.level[1].offsetY=0
oCMenu.level[1].borderClass="cmItemBorder"
6 coolmenus3.js
/**************
Copyright (c) 2001 Thomas Brattli (www.dhtmlcentral.com)
eXperience DHTML coolMenus - Get it at www.dhtmlcentral.com
Version 3.02
This script can be used freely as long as all copyright messages are
intact.
(You can delete the comments below to save space)
This script takes over for the old Coolmenus2 and CoolFrameMenu
Visit www.dhtmlcentral.com/coolmenus/
for the latest version of the script.
Tutorial: http://www.dhtmlcentral.com/tutorial.asp
Support: http://www.dhtmlcentral.com/forums/forum.asp?FORUM_ID=2&CAT_ID=1&Forum_Title=CoolMenus
Known bugs:
Netscape 6: When using padding in the layers you can sometimes get
strange visual effects on the lowest menu item. Only way to fix is to not use padding.
Opera: This menu is very close to working on Opera, but as far as I could
figure out opera don't support innerHTML or document.createElement() which
makes the changing of the text inside the submenus immpossible. If anyone
know a solution to this please let me know.
Explorer 4 for mac: It will not work in this browser, nothing does.
Explorer 5 for mac: It works fine, but like Netscape 6 it's a little slow and you can get strange visual effects sometimes.
Script checked and working with:
PC:
Netscape 4.03 - Netscape 4.04 -Netscape 4.08 - Netscape 4.73 - Netscape 6 - Netscape 6.01
Internet Explorer 5.0 - Internet Explorer 5.5 -Internet Explorer 6.0
MAC:
Netscape 4 - Explorer 5
Btw: There is basically just one explanation to why this code is sort of "scrambled": I wanted this file be as small as possible..
If you want it to be smaller feel free to remove all comments (except for the copyright)
**************/
/*************
Pageobject
***************/
function makePageCoords(win,fr){
if(!win) win=window
this.x=0;this.x2=(bw.ns4 || bw.ns6)?win.innerWidth-1:win.document.body.offsetWidth;
if(!fr&&bw.ie) this.x2-=20; else if(!fr&&bw.ns4) this.x2-=4; else if(bw.ns6) this.x2+=1
this.y=0;this.y2=(bw.ns4 || bw.ns6)?win.innerHeight:win.document.body.offsetHeight;
if(bw.ns4&&!win.rows) this.x2+=5; if(!fr&&bw.ie) this.y2-=4; else if(bw.ns4&&fr) this.y2+=4
this.y2orig=this.y2; this.x50=this.x2/2; this.y50=this.y2/2; return this;
}
/*************
Debugging function
***************/
function debug(txt,ev){if(mDebugging==2) self.status=txt; else alert(txt); if(ev) eval(ev); return false}
/************
Scroll function
*************/
function cm_checkScrolled(obj){
if(bw.ns4 || bw.ns6) obj.scrolledY=obj.win.pageYOffset
else obj.scrolledY=obj.win.document.body.scrollTop
if(obj.scrolledY!=obj.lastScrolled){
if(!obj.useframes){
for(i=0;i<obj.l[0].num;i++){var sobj=obj.l[0].o[i].oBorder; sobj.moveY(sobj.y+(obj.scrolledY-obj.lastScrolled))}
if(obj.usebar) obj.oBar.moveY(obj.oBar.y+(obj.scrolledY-obj.lastScrolled))
}
obj.lastScrolled=obj.scrolledY; page.y=obj.scrolledY; page.y2=page.y2orig+obj.scrolledY
if(!obj.useframes || bw.ie){ clearTimeout(obj.tim); obj.isover=0; obj.hideSubs(1,0)}
}if((bw.ns4 || bw.ns6) && !obj.useframes) setTimeout("cm_checkScrolled("+obj.name+")",200)
}
/***********************
Checking if the values are % or not.
***************/
function cm_checkp(num,w,check,istop,ds){
if(num){ var p=istop?toppage:page
if(num.toString().indexOf("%")!=-1){if(w || (check && this.rows)) num=(p.x2*parseFloat(num)/100)
else num=(p.y2*parseFloat(num)/100)
}else num=eval(num)
}else num=0; return num
}
/************
Making DIV objects + DIV objects code
*************/
function cm_makeObj(obj,name,level,win,nest,o){
if(o&&(bw.ns4||bw.ns6)) this.evnt=o
else this.evnt=bw.dom?win.document.getElementById(obj):bw.ie4?win.document.all[obj]:bw.ns4?nest?win.document[nest].document[obj]:win.document[obj]:0;
if(!this.evnt) return debug('There seems to be an error with this layer:\nFrame: '+win+'\nLayer: '+nest + "." + obj)
this.css=bw.dom||bw.ie4?this.evnt.style:bw.ns4?this.evnt:0; this.ref=bw.dom || bw.ie4?win.document:bw.ns4?this.css.document:0;
this.hideIt=cm_hideIt; this.showIt=cm_showIt; this.writeIt=cm_writeIt; this.setactive=cm_setactive; this.addEvents=cm_addEvents;
this.moveIt=cm_moveIt; this.clipTo=cm_clipTo; if(name) this.parent=name; this.moveY=cm_moveY; this.l=level; this.clipOut=cm_clipOut;
this.filterIt=cm_filterIt; this.obj = obj + "Object"; eval(this.obj + "=this"); this.tim=10; this.clipy=0; return this
}
function cm_writeIt(text){if(!this.img1){if(bw.ns4){this.ref.write(text);
this.ref.close()}else this.evnt.innerHTML=text}}; function cm_moveY(y){this.y=y; this.css.top=y}
function cm_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x;this.css.top=this.y}
function cm_showIt(){this.css.visibility="visible"; this.vis=1}; function cm_hideIt(){this.css.visibility="hidden"; this.vis=0}
function cm_clipOut(px,w,ystop,tim,name){
if(!this.vis) return; if(this.clipy<ystop-px){this.clipy+=px; this.clipTo(0,w,this.clipy,0,1)
this.tim=setTimeout(this.obj+".clipOut("+px+","+w+","+ystop+","+tim+",'"+name+"')",tim)
}else{if(bw.ns6){this.hideIt();}; this.clipTo(0,w,ystop,0,1); if(bw.ns6){this.showIt()}}
}
function cm_filterIt(f){if(this.evnt.filters[0]) this.evnt.filters[0].Stop(); else this.css.filter=f; this.evnt.filters[0].Apply(); this.showIt(); this.evnt.filters[0].Play();}
function cm_setactive(on,name,frmmouse){
if(!name) name=this.name; var tobj=this.parent.m[name]
if(tobj.img){if(tobj.img2){if(on) this.ref.images[tobj.img].src=tobj.img2; else this.ref.images[tobj.img].src=tobj.img1}
}else{
if(on){var color=tobj.c2; var fcolor=tobj.c4; var re=tobj.c3}else{var color=tobj.c1; var fcolor=tobj.c3; var re=tobj.c4}
if(color){if(bw.dom || bw.ie4) this.css.backgroundColor=color; else if(bw.ns4) if(color=="transparent") color=null; this.css.bgColor=color}
if(fcolor && !bw.ns4){if(bw.ie4) this.evnt.style.color=fcolor; else if(this.evnt.childNodes[0]) this.evnt.style.color=fcolor
}else if(fcolor&&frmmouse){t=this.parent.m[name].text; t=t.replace(re,fcolor); this.writeIt(t); if(on) this.addEvents(name,this.parent.name,tobj.lnk,this.parent.useclick)}
if(tobj.l==0&&bw.ns6){this.parent.l[0].o[tobj.num].oBorder.hideIt(); this.parent.l[0].o[tobj.num].oBorder.showIt();} //Stupid fix for netscape 6....
}
}
function cm_clipTo(t,r,b,l,w){if(bw.ns4){this.css.clip.top=t;this.css.clip.right=r; this.css.clip.bottom=b;this.css.clip.left=l
}else{this.css.clip="rect("+t+","+r+","+b+","+l+")"; if(w){this.css.width=r; this.css.height=b}}; this.width=r; this.height=b}
function cm_addEvents(n,name,url,useclick){
this.evnt.οnmοuseοver=new Function(name+".mover('"+n+"')");
this.evnt.οnmοuseοut=new Function(name+".mmout('"+n+"')")
if(!url && useclick) ev=new Function(name+".mover('"+n+"',1)")
else ev=new Function(name+".go('"+n+"')")
if(bw.ns4){this.ref.captureEvents(Event.MOUSEDOWN); this.ref.οnmοusedοwn=ev}
else this.evnt.οnclick=ev
}
/************
Making menu object
*************/
function cm_makeMenu(name,parent,text,link,target,width,height,img1,img2,bgcoloroff,bgcoloron,textcolor,hovercolor,onclick,onmouseover,onmouseout){
this.m[name]=new Object(); var obj=this.m[name]; obj.name=name; obj.subs=new Array(); obj.parent=parent; var tt
obj.lnk=(link==0||link=='')?"":link; obj.target=target
if(parent!="" && parent){this.m[parent].subs[this.m[parent].subs.length]=name; l=this.m[parent].l+1} else l=0
obj.l=l; prop1=l<this.level.length?this.level[l]:this.level[this.level.length-1]; prop2=this.level[0]
if(this.l.length<=l){
this.l[l]=new Object(); this.l[l].num=0; if(l==0) this.l[l].names=new Array()
this.l[l].clip=prop1["clip"]||prop2["clip"]||0; this.l[l].clippx=prop1["clippx"]||prop2["clippx"]||0
this.l[l].cliptim=prop1["cliptim"]||prop2["cliptim"]||0; this.l[l].filter=prop1["filter"]||prop2["filter"]||0
this.l[l].border=prop1["border"]||prop2["border"]; this.l[l].maxnum=0
this.l[l].bordercolor=prop1["bordercolor"]||prop2["bordercolor"];
s=prop1["align"]||prop2["align"]; if(s=="left") s=1; else if(s=="right") s=0;
else if(s=="top") s=3; else if(s=="bottom") s=2; this.l[l].align=s; this.aobj[l]=-1;
this.l[l].height=prop1["height"]||prop2["height"]; this.l[l].width=prop1["width"]||prop2["width"];
this.l[l].style=prop1["style"]||prop2["style"]; this.l[l].tc=textcolor||prop1.textcolor||prop2.textcolor;
this.l[l].offsetX=String(prop1["offsetX"])!="undefined"?prop1["offsetX"]:prop2["offsetX"]
this.l[l].offsetY=String(prop1["offsetY"])!="undefined"?prop1["offsetY"]:prop2["offsetY"]
}if(l==0) this.l[l].names[this.l[l].names.length]=name
if(parent!="" && parent){obj.num=this.m[parent].subs.length-1}else obj.num=this.l[l].num
this.l[l].num++; prop=l<this.level.length?this.level[l]:this.level[this.level.length-1]
obj.width=this.checkp(width?width:prop1.width?prop1.width:prop2.width,1,0,1);
obj.height=this.checkp(height?height:prop1.height?prop1.height:prop2.height,0,0,1);
if(parent!="" && parent){if(this.m[parent].subs.length>this.l[l].maxnum) this.l[l].maxnum=this.m[parent].subs.length
if(this.m[parent].totheight==0) this.m[parent].totheight=this.l[l].border
this.m[parent].totheight+=obj.height+ this.l[l].border
if(this.m[parent].maxwidth<obj.width) this.m[parent].maxwidth=obj.width+this.l[l].border*2
}else{this.l[l].maxnum=this.l[l].names.length; this.totwidth+=obj.width; this.totheight+=obj.height
this.maxwidth=this.maxwidth>obj.width?this.maxwidth:obj.width; this.maxheight=this.maxheight>obj.height?this.maxwidth:obj.height
}if(img1) text='<img src="'+img1+'" border="0" name="imgCMenu'+name+'">'
else if(bw.ns4){text='<font size="'+(prop1.NS4fontSize||prop2.NS4fontSize)+'" face="'+(prop1.NS4font||prop2.NS4font)+'" color="'+(textcolor||this.l[l].tc)+'">'+text+'</font>'}
if(bw.ns4&&this.useNS4links&&(l==0||!this.useframes) ||(l==0&&img1)){tt=img1&&l==0?this.useclick?this.name+".mover('"+name+"',1);":this.name+".go('"+name+"');":"";text='<a href="#" οnclick="'+tt+'return false" class="clNS4">'+text+'</a>'}
if(img1){obj.preimg1=new Image(); obj.preimg1.src=img1}; if(img2){obj.preimg2=new Image(); obj.preimg2.src=img2}
if(img2) obj.img="imgCMenu"+name; else obj.img=0; obj.img1=img1||""; obj.img2=img2||""; obj.text=text; obj.subx=-1;
obj.c1=bgcoloroff||prop1.bgcoloroff||prop2.bgcoloroff; obj.c2=bgcoloron||prop1.bgcoloron||prop2.bgcoloron;
obj.c3=textcolor||this.l[l].tc; obj.c4=hovercolor||prop1.hovercolor||prop2.hovercolor; obj.suby=-1;
obj.mclick=onclick||""; obj.mover=onmouseover||""; obj.mout=onmouseout||""; obj.totheight=0; obj.maxwidth=0;
}
/************
Onmouseout
*************/
function cm_mout(name,cl){
if(!name&&cl&&!this.isover){this.isclicked=0; this.hideSubs(1,0,0,0,1); this.aobj[0]=-1; return}
if(!name) return; var l=this.m[name].l;
if((this.m[name].subs.length==0||!this.loaded)||(this.useclick&&!this.isclicked)){if((this.aobj[l+1]==-1||l>=this.l.length-1)&&this.aobj[l]!=-1){this.aobj[l].setactive(0,0,1); this.aobj[l]=-1;}}
if(this.m[name].mout!="") eval(this.m[name].mout)
if(this.useclick){this.isover=0; return}; clearTimeout(this.tim);
if(!(!bw.ie&&this.useframes&&l==0&&this.aobj1)){ this.isover=0; this.aobj1=0; this.tim=setTimeout(this.name+".hideSubs(1,0,0,0,1)",this.wait)}
}
/************
Onmouseover
*************/
function cm_mover(name,cl){
clearTimeout(this.tim); this.isover=1; var l=this.m[name].l;
if(this.aobj[l].name==name){
if(this.aobj[l+1]!=-1 && l<this.l.length-1){
this.aobj[l+1].setactive(0,0,1); this.aobj[l+1]=-1; this.hideSubs(l+2,1); return
}else if((!this.useclick)||(this.useclick&&this.isclicked)) return
}if(this.m[name].mover!="") eval(this.m[name].mover)
var num=this.m[name].num; var obj=this.l[l].o[num]
if(this.aobj[l].name!=name){if(this.aobj[l]!=-1) this.aobj[l].setactive(0,0,1); this.aobj[l]=obj; this.aobj[l].name=name; obj.setactive(1,0,1)}
if(l==1)this.aobj1=1; if(l==0 && cl && this.useclick) this.isclicked=1;
if(!this.isclicked&&this.useclick) return; if(!this.loaded) return;
this.showSubs(name,l,num,cl)
}
/************
Hiding subelements
*************/
function cm_hideSubs(l,system,cl,sys2,hc){
if(this.isover && !system) return
if(l==1 && this.aobj[0]!=-1&&!sys2){this.aobj[0].setactive(0,0,1);this.aobj[0]=-1}
if(!this.loaded) return; if(cl==1) return
for(i=l;i<this.l.length;i++){if(this.l[i].oBorder.vis==0) break; this.l[i].oBorder.hideIt(); this.aobj[i]=-1;}
if(hc&&this.hcode){eval(this.hcode); this.hcode=""}
}
/************
Get x/y coords. Only the first time :)
*************/
function cm_getCoords(name,l,num,topalign,align,ln,border,cn,lev1b){
if(cn==5){ this.m[name].subx=0; this.m[name].suby=0; return }//Just in case infinitive loops
if(l==1) var pobj=this.l[l-1].o[num].oBorder
else var pobj=this.l[l-1].oBorder
var x=pobj.x; var y=pobj.y;
if(l!=1){y+=this.l[l-1].o[num].y}
pborder=this.l[l-1].border;
lx=x+pobj.width; rx=x-this.m[name].maxwidth- (this.l[l-1].offsetX*2)
if(align==0){if(l==1){y+=border} if(l==1&&this.useframes) x=0; else x=lx
}else if(align==1){x=rx; if(l==1){if(this.useframes) x=page.x2 - this.m[name].maxwidth; y+=border}}
if((align==2||topalign==2)&&lev1b!=3){
if(l!=1 && (align!=1&&align!=0)){if(topalign==1) x=rx; else x=lx}
if(l==1) if(this.useframes) y=0; else y+=this.m[name].height+border+pborder;
}if((align==3||topalign==3)&&lev1b!=2){
if(l!=1&&align!=1&&align!=0){if(topalign==1) x=rx; else x=lx}
if(this.useframes&&l==1) y=page.y2 - this.m[name].totheight - this.l[l-1].offsetY*2
else y-=this.m[name].totheight - this.l[l].offsetY*2; if(l!=1||lev1b==3) y+=this.m[name].height
}this.m[name].scrollY=this.lastScrolled; this.m[name].subx=x+this.l[l-1].offsetX;
this.m[name].suby=y+this.l[l-1].offsetY; if(this.useframes&&l==1&&align!=3) this.m[name].suby+=this.lastScrolled
if(this.pagecheck&&(l!=1||!this.useframes)) this.checkPage(name,l,num,topalign,align,ln,border,cn)
}
/************
Checking page coords
*************/
function cm_checkPage(name,l,num,topalign,align,ln,border,cn){
cn++;
if(this.m[name].subx+this.m[name].maxwidth>page.x2){
if(align!=1){if(align==3&&topalign!=0) topalign=3; align=1; this.getCoords(name,l,num,topalign,align,ln,border,cn)}
}else if(this.m[name].subx<page.x){
if(align!=0){if(align==3) topalign=3; align=0; this.getCoords(name,l,num,topalign,align,ln,border,cn)}
}else if((this.m[name].suby+this.m[name].totheight)>page.y2){
if(l==1){topalign=3; this.getCoords(name,l,num,topalign,align,ln,border,cn,3)}
else if(align!=3){ align=3; this.getCoords(name,l,num,topalign,align,ln,border,cn)}
}else if(this.m[name].suby<page.y){
if(l==1){topalign=2; this.getCoords(name,l,num,topalign,align,ln,border,cn,2)}
else if(align!=2){align=2; this.getCoords(name,l,num,topalign,align,ln,border,cn)}
}
}
/************
Showing subelements
*************/
function cm_showSubs(name,l,num,cl){
l+=1; if(l>=this.l.length) return; ln=this.m[name].subs.length
if(ln==0){this.hideSubs(l,1,0,1); return}
else this.hideSubs(l+1,1); var border=this.l[l].border; this.aobj[l]=-1
if(this.useframes&&(bw.ns4||bw.ns6)) cm_checkScrolled(this)
if((this.m[name].subx==-1 || this.m[name].suby==-1) || this.m[name].scrollY!=this.lastScrolled || this.isresized){
var topalign=this.l[0].align; var align=this.l[l-1].align;
this.getCoords(name,l,num,topalign,align,ln,border,0)
}var x=this.m[name].subx; var y=this.m[name].suby;
var bobj=this.l[l].oBorder; bobj.hideIt();
if(this.l[l-1].clip&&!(this.l[l-1].filter&&bw.filter)){
clearTimeout(bobj.tim); bobj.clipy=0; bobj.clipTo(0,this.m[name].maxwidth,0,0);
}else bobj.clipTo(0,this.m[name].maxwidth,this.m[name].totheight,0,1)
bobj.moveIt(x,y); var yy=border
for(i=0;i<this.l[l].maxnum;i++){
var obj=this.l[l].o[i]
if(i<ln){
var n=this.m[name].subs[i]; obj.aname=n; if(!bw.ns4||!this.NS4hover) obj.writeIt(this.m[n].text)
obj.addEvents(n,this.name,this.m[n].lnk,this.useclick); var w=this.m[n].width; var h=this.m[n].height
if(obj.y!=yy) obj.moveY(yy); yy+=h+border; if(!obj.img) obj.setactive(0,n,1);
if(obj.width!=w||obj.height!=h) obj.clipTo(0,w,h,0,1); obj.css.visibility="inherit"
}else obj.hideIt()
}if(this.l[l-1].filter&&bw.filter) bobj.filterIt(this.l[l-1].filter)
else if(this.l[l-1].clip){bobj.showIt(); bobj.clipOut(this.l[l-1].clippx,this.m[name].maxwidth,this.m[name].totheight,this.l[l-1].cliptim,name);}
else bobj.showIt();
if(!bw.ns4&&this.checkselect){ //CHECKING FOR SELECT BOXES
for(i=0;i<this.sel.length;i++){
selx=0; sely=0; var selp;
if(this.sel[i].offsetParent){selp=this.sel[i]; while(selp.offsetParent){selp=selp.offsetParent; selx+=selp.offsetLeft; sely+=selp.offsetTop;}}
selx+=this.sel[i].offsetLeft; sely+=this.sel[i].offsetTop
selw=this.sel[i].offsetWidth; selh=this.sel[i].offsetHeight
if(((selx+selw)>this.m[name].subx && selx<(this.m[name].subx+this.m[name].maxwidth))
&&((sely+selh)>this.m[name].suby && sely<(this.m[name].suby+this.m[name].totheight))){
if(this.sel[i].style.visibility!="hidden"){this.sel[i].level=l; this.sel[i].style.visibility="hidden"; this.hcode+=this.name+".sel["+i+"].style.visibility='visible';"}
}else if(l<=this.sel[i].level) this.sel[i].style.visibility="visible"
}
}else if(bw.ns4&&this.hideForm){eval(this.hideForm+".visibility='hide'"); this.hcode=this.hideForm+".visibility='show'"}
}
/************
Making all top elements
*************/
function cm_makeTop(rr){
var m,rows,border,x,y,mpa
m=this.menuplacement; rows=this.rows; this.pxbetween=this.checkp(this.pxbetween,0,1,1)
border=this.l[0].border;y=this.checkp(this.fromtop,0,0,1)+border;x=this.checkp(this.fromleft,0,0,1)+border
if(m=="bottomcenter"||m=="bottom"){
if(m=="bottomcenter") x=toppage.x2/2-(this.totwidth+border*this.l[0].num+this.pxbetween*(this.l[0].num-1))/2
y=toppage.y2-this.maxheight-border
}else if(m=="right") x=toppage.x2-this.maxwidth-border*2
else if(m=="bottom") y=toppage.y2-this.maxheight-border*2
else if(m=="center"){if(rows==0) x=toppage.x2/2 - (this.maxwidth+border*2)/2; else x=toppage.x2/2 - (this.totwidth + border*this.l[0].num +this.pxbetween*(this.l[0].num-1))/2}
else if(m.toString().indexOf(",")>-1) mpa=1
if(this.usebar){ var bx,by,bww,bh,oBb
oNS=bw.ns6?this.oNS[this.l[0].maxnum]:0
this.oBar=new cm_makeObj('div'+this.name+'Bar',0,0,window,0,oNS)
if(this.barx=="menu") bx=mpa&&rows?this.checkp(m[0],1,0,1)-border:x-border; else{ bx=this.checkp(this.barx,1,0,1) }
if(this.bary=="menu") by=mpa&&!rows?this.checkp(m[0],0,0,1)-border:y-border; else by=this.checkp(this.bary,0,0,1); this.oBar.moveIt(bx,by)
if(this.barwidth=="menu"){bww=rows?mpa?(this.checkp(m[m.length-1],1,0,1)-bx)+this.m[this.l[0].names[this.l[0].num-1]].width+border:(this.totwidth +this.pxbetween*(this.l[0].num-1)):this.maxwidth;
bww+=!rows?border*2:0;}else bww=this.checkp(this.barwidth,1,0,1);
if(bw.ie&&rows&&this.barwidth=="100%"&&this.useframes) bww+=parseInt(self.document.body.leftMargin)*2
if(this.barheight=="menu"){bh=!rows?mpa?(this.checkp(m[m.length-1],0,0,1)-by)+this.m[this.l[0].names[this.l[0].num-1]].height+border:(this.totheight + this.pxbetween*(this.l[0].num-1)):this.maxheight;
bh+=rows?this.l[0].border*2:0;} else bh=this.checkp(this.barheight,0,0,1);
this.oBar.clipTo(0,bww,bh,0,1);
if(this.barinheritborder&&border){oBb=new cm_makeObj('div'+this.name+'Barb',0,0,window,'div'+this.name+'Bar');
oBb.moveIt(border,border); oBb.clipTo(0,bww-border*2,bh-border*2,0,1); oBb=null;}
}this.l[0].o=new Array()
for(j=0;j<this.l[0].maxnum;j++){
this.l[0].o[j]=new cm_makeObj('div'+this.name+'0_'+j,this,0,window,'div'+this.name+'0_'+j+'b'); if(bw.ns6) oNS=this.oNS[j]; else oNS=0
this.l[0].o[j].oBorder=new cm_makeObj('div'+this.name+'0_'+j+'b',0,0,window,0,oNS)
obj=this.l[0].o[j]; w=this.m[this.l[0].names[j]].width; h=this.m[this.l[0].names[j]].height
obj.addEvents(this.l[0].names[j],this.name,this.m[this.l[0].names[j]].lnk,this.useclick); obj.clipTo(0,w,h,0,1)
if(mpa){if(rows==1) x=this.checkp(m[j],0,1,1); else y=this.checkp(m[j],0,0,1)}
obj.moveIt(border,border);
obj.setactive(0,this.l[0].names[j])
obj.oBorder.moveIt(x-border,y-border); obj.oBorder.clipTo(0,w+border*2,h+border*2,0,1); obj.oBorder.showIt()
if(rows==0) y+=h+border+this.pxbetween
else x+=w+border+this.pxbetween; obj.showIt()
}if(!rr){
if(this.useclick) coolFMouseup+=this.name+".mmout('',1);"; if(!this.useframes&&!bw.ns4) this.refresh()
else if(!this.useframes&&bw.ns4){l=""; if(onload){l=String(onload.toString()); l=l.replace("function onload(event)",""); l=l.slice(25,l.length-2)} l+=this.name+ ".refresh();"; οnlοad=new Function(l)}
if(this.resizecheck) setTimeout('window.οnresize=new Function("'+this.name+'.resized()")',500)
if(this.checkscroll){if(bw.ns4 || bw.ns6){if(this.checkscroll!=2&&this.useframes!=1){setTimeout("cm_checkScrolled("+this.name+")",200)}}}
if(this.useframes&&!rr) this.checkFrame(0); else this.win=window
}
}
/************
Refreshing/making all sub elements
*************/
function cm_refresh(ev){
var border,obj,oNS,oNS2
if(this.useframes) page=new makePageCoords(this.win,this.useframes); else page=toppage
for(i=1;i<this.l.length;i++){
this.l[i].o=new Array();
border=this.l[i].border; defheight=this.checkp(this.l[i].height)
if(bw.ns4){oNS=new Layer(this.l[i].width,this.win); oNS.zIndex=(500+i); if(this.l[i].border) oNS.bgColor=this.l[i].bordercolor;}
else if(bw.ns6){oNS=document.createElement("DIV"); oNS.setAttribute("style",this.ns6styleb[i]); this.win.document.body.appendChild(oNS)}
this.l[i].oBorder=new cm_makeObj('div'+this.name+i+"b",0,0,this.win,0,oNS)
for(j=0;j<this.l[i].maxnum;j++){
if(bw.ns4){oNS2=new Layer(this.l[i].width,oNS);}
else if(bw.ns6){oNS2=document.createElement("DIV"); oNS2.setAttribute("style",this.ns6style[i]); oNS.appendChild(oNS2)}
this.l[i].o[j]=new cm_makeObj('div'+this.name+i+'_'+j,this,i,this.win,0,oNS2)
obj=this.l[i].o[j]; if(!obj.addEvents) return; obj.moveIt(border,(border+defheight)*j + border)
}
}this.loaded=1;
if(this.checkscroll&&bw.ie){this.win.document.body.οnscrοll=new Function("cm_checkScrolled("+this.name+")"); cm_checkScrolled(this)}
if(this.useclick){this.win.document.οnmοuseup=new Function(coolFMouseup); if(this.useframes) document.οnmοuseup=new Function(coolFMouseup); }
if(!bw.ns4&&this.checkselect) this.sel=bw.ie4?this.win.document.all.tags("SELECT"):this.win.document.getElementsByTagName("SELECT")
}
function cm_NS6_createElement(st,inn){el=document.createElement("DIV"); if(st) el.setAttribute("style",st); if(inn) el.innerHTML=inn; document.body.appendChild(el); return el}
/************
Making code
*************/
function cm_construct(){
this.level=null; var str=""; var str2=""; var frstr=""; var tempstr; num=bw.ie?this.l.length:1;
for(i=0;i<num;i++){
if(i!=0) frstr+='<div id="div'+this.name+i+'b" style="'+this.ns6styleb[i]+'" class="cl'+this.name+i+'b">\n'
for(j=0;j<this.l[i].maxnum;j++){
tempstr='<div id="div'+this.name+i+'_'+j+'" '; if(i!=0) tempstr+='style="'+this.ns6style[i]+'"'
if(i==0){n=this.l[0].names[j]; txt=this.m[n].text
if(!bw.ns6){
str+='<div id="div'+this.name+'0_'+j+'b" class="cl'+this.name+'b'+i+'">'
str+=tempstr+' class="cl'+this.name+i+'">'+txt+'</div>'; str+='</div>\n'
}else this.oNS[j]=cm_NS6_createElement(this.ns6styleb[i],tempstr+' class="cl'+this.name+i+'">'+txt+'</div>')
}else frstr+=tempstr+'"></div>\n'
}if(i!=0){frstr+='</div>\n'}
}if(this.usebar){
if(this.barinheritborder) str2='<div id="div'+this.name+'Barb"></div>';
if(bw.ns6) this.oNS[this.l[0].maxnum]=cm_NS6_createElement(this.ns6styleb[this.ns6styleb.length-1],str2)
else{str+='<div id="div'+this.name+'Bar">';str+=str2+'</div>\n'}
}if(!this.useframes&&bw.ie) str+=frstr; else this.frstr=frstr; if(!bw.ns6) document.write(str)
this.makeTop(); if(this.useframes) window.οnerrοr=cm_check_error;
}
coolFrameError=0//Trapping external pages in frame error!
function cm_check_error(e){e=e.toLowerCase(); if(e.indexOf("access")>-1||e.indexOf("permission")>-1){coolFrameError=1; return true;}else return false}
/**************
Make styles
**************/
function cm_makeStyle(){
var str="<style>\n"; var zindex=150; var c,w,st,bg
this.ns6style=new Array(); this.ns6styleb=new Array()
for(i=0;i<this.l.length;i++){
if(i==0){if(bw.ns4){w="width:" +this.l[0].width+";"; this.l[i].style=""} else w=""; str+='.cl'+this.name+i+'{position:absolute; '+w+' background-color:transparent; color:'+this.l[i].tc+';'+this.l[i].style+'; cursor:pointer; cursor:hand; visibility:inherit; z-index:'+zindex+'}\n'}
else{st='position:absolute; '+this.l[i].style+'; cursor:pointer; cursor:hand; visibility:inherit; z-index:'+zindex; this.ns6style[i]=st}
bc=this.l[i].border?bw.ns4?'layer-background-color:'+this.l[i].bordercolor:'; background-color:'+this.l[i].bordercolor:"";
if(!bw.ns4) bc+="; overflow:hidden"
tempstr='position:absolute; clip:rect(0,0,0,0); visibility:hidden; '+bc+'; z-index:'+(zindex-50)
if(i==0&&!bw.ns6) str+='.cl'+this.name+'b'+i+'{'+tempstr+'}\n';
else this.ns6styleb[i]=tempstr; zindex+=100
}
if(this.usebar){
bg=this.barinheritborder?this.l[0].bordercolor:this.barcolor
st='z-index:80; position:absolute; background-color:'+bg+'; layer-background-color:'+bg
if(!bw.ns6) str+='#div'+this.name+'Bar{'+st+'}\n'; else this.ns6styleb[this.ns6styleb.length]=st
if(this.barinheritborder){str+='#div'+this.name+'Barb{z-index:85; position:absolute; background-color:'+this.barcolor+'; layer-background-color:'+this.barcolor+'}\n'}
}
if(bw.ns4) str+="A.clNS4{text-decoration:none; padding:"+this.NS4padding+"}\n"; document.write(str+"\n</style>\n")
}
/************
Refreshing page if it's resized
*************/
function cm_resized(){
page2=new makePageCoords(window,this.useframes);
if(page2.x2!=toppage.x2 || page2.y2!=toppage.y2){
if(!bw.ns4){
toppage=new makePageCoords(window,this.useframes); this.makeTop(1)
if(!this.useframes) page=toppage; this.isresized=1; eval(this.resizecode)
}else{this.win.location.reload(); location.reload()}
}if(!bw.ns4&&this.useframes){page=new makePageCoords(this.win,this.useframes)}
}
/************
Going to another page
*************/
function cm_go(name){
obj=this.m[name]; url=obj.lnk; target=obj.target; fc=obj.mclick
if(url){
if(this.useframes&&!coolFrameError) loc=this.win.location.href; else loc=location.href
if(fc) eval(fc); url=this.checkFolder(loc.toString(),url); this.isover=0;
this.hideSubs(1,0,1); this.isclicked=0; this.aobj[0]=-1
if(String(target)=="undefined" || target=="" || target==0 || target=="_self"){
this.win.location.href=url
}else if(target=="_blank") window.open(url)
else if(target=="_top" || target=="window") top.location.href=url
else if(top[target]) top[target].location.href=url
else{fr=findFrame(target); if(fr) fr.location.href=url}
}else if(fc) eval(fc)
}
/************
Getting folders - THANKS TO DCAGE FOR THIS FIX
*************/
function cm_checkFolder(tmp,url){
if(url.indexOf("mailto:")>-1 || url.indexOf("/")==0 || url.indexOf("http://")==0) return url
else if(this.useframes && bw.ie || bw.ns6) return url
var addr=''; var lvl=''; var off_cnt=0; var cnt=0;
if(tmp.indexOf('file:')>-1 || tmp.charAt(1)==':') addr=this.offlineUrl;
else if(tmp.indexOf('http:')>-1) addr=this.onlineUrl;
for(var i=0;i<addr.length;i++){if(addr.charAt(i)=='\/') off_cnt+=1}
for(var i=0;i<tmp.length;i++){if(tmp.charAt(i)=='\/'){ cnt+=1; if(cnt>off_cnt) lvl+='../'; }}
return lvl + url
}
/************
Checkloaded for the frames version
*************/
function cm_checkLoaded(ev,ns){
coolFName=eval(coolFName)
var ok=0
if(document.layers){
if(ns){coolFName.refresh(); coolFName.nsload=1; ok=1; coolFrameError=0
}else if(ev.target.name==coolFName.frame&&!coolFName.nsload){coolFName.refresh(); ok=1; coolFrameError=0; routeEvent(ev)}
}else if(bw.ie){
if (coolFName.win.document.readyState == "complete"){
coolFName.win.document.body.insertAdjacentHTML("beforeEnd",coolFName.frstr)
coolFName.win.document.body.οnunlοad=cm_unloaded; coolFName.refresh(); ok=1; coolFrameError=0
}else setTimeout("cm_checkLoaded()",200)
}else if(bw.ns6){
if(coolFName.win.document){
if(coolFName.win.document.body){coolFName.win.addEventListener("unload", cm_unloaded, true); coolFName.refresh(); ok=1; coolFrameError=0}
else setTimeout("cm_checkLoaded()",200)
}else setTimeout("cm_checkLoaded()",200)
}
}
function cm_unloaded(ev){coolFName=eval(coolFName); if(!coolFName) return; if(document.layers && ev.target.name!=coolFName.frame) return; else coolFName.nsload=0; coolFName.loaded=0; if(!document.layers) setTimeout("cm_checkLoaded()",200)}
/************
Make menu object
*************/
var coolFName=""; var onload; var coolFMouseup="";
function makeCoolMenu(name){
coolFName=name; this.name=name; this.lastScrolled=0;
this.win=window; toppage=new makePageCoords(window,parent.frames.length);
this.aobj=new Array(); this.m=new Array(); this.l=new Array()
this.level=new Array(); this.resized=cm_resized;
this.makeMenu=cm_makeMenu; this.showSubs=cm_showSubs; this.makeTop=cm_makeTop;
this.getCoords=cm_getCoords; this.checkPage=cm_checkPage;
this.mmout=cm_mout; this.mover=cm_mover; this.checkp=cm_checkp;
this.hideSubs=cm_hideSubs; this.construct=cm_construct;
this.makeStyle=cm_makeStyle; this.refresh=cm_refresh;
this.go=cm_go; this.frstr=""; this.mobj=new Array()
this.totwidth=0; this.totheight=0; this.maxwidth=0; this.maxheight=0
this.tim=10; this.loaded=0; this.isover=false; this.checkFrame=cm_checkFrame;
this.checkFolder=cm_checkFolder; this.hcode=""; this.oNS=new Array(); this.oNS2=new Array()
bw.filter=(bw.ie6||bw.ver.indexOf("MSIE 5.5")>-1) && !bw.mac
}
/************
Find frame
*************/
function findFrame(frameName){
obj=top; var frameObj=0;
for(i=0;i<obj.frames.length;i++){
if(obj.frames[i].name==frameName){frameObj=obj.frames[i]; break;}; ln=obj.frames[i].frames.length
for(j=0;j<ln;j++){
if(obj.frames[i].frames[j].name==frameName){frameObj=obj.frames[i].frames[j]; break}; ln2=obj.frames[i].frames[j].frames.length
for(a=0;a<ln2;a++){
if(obj.frames[i].frames[j].frames[a].name==frameName){frameObj=obj.frames[i].frames[j].frames[a]; break}
}
}
}return frameObj
}
/************
Checking for frame
*************/
function cm_checkFrame(num){
var fr; if(num==10){debug('Frame: '+this.frame+' doesn\'t exist - Value: '+fr + " - Could not build menus."); return}
if(!top.frames[this.frame]) fr=findFrame(this.frame); else fr=top.frames[this.frame]
if(!fr){num++; setTimeout(this.name+".checkFrame("+num+")",500)
}else{ this.win=fr
if(bw.ns4){
top.frames.captureEvents(Event.UNLOAD); top.frames.captureEvents(Event.LOAD); top.frames.οnunlοad=cm_unloaded;
top.frames.onload = cm_checkLoaded; setTimeout("cm_checkLoaded(0,1)",1000)
}else if((bw.ie||bw.ns6)) setTimeout("cm_checkLoaded()",200)
}
}
7 coolmenus4.js
/************************************************************
Coolmenus Beta 4.06 - Copyright Thomas Brattli - www.dhtmlcentral.com
Last updated: 11.13.02
v4.06 - with basic frame support
*************************************************************/
/*Browsercheck object*/
function cm_bwcheck(){
//In theory we should use object detection, but this script needs work-arounds for almost every browser...
this.ver=navigator.appVersion
this.agent=navigator.userAgent.toLowerCase()
this.dom=document.getElementById?1:0
this.ns4=(!this.dom && document.layers)?1:0;
this.op=window.opera
this.moz=(this.agent.indexOf("gecko")>-1 || window.sidebar)
this.ie=this.agent.indexOf("msie")>-1 && !this.op
if(this.op){
this.op5=(this.agent.indexOf("opera 5")>-1 || this.agent.indexOf("opera/5")>-1)
this.op6=(this.agent.indexOf("opera 6")>-1 || this.agent.indexOf("opera/6")>-1)
this.op7=this.dom&&!this.op5&&!this.op6 //So all higher opera versions will use it
}else if(this.moz) this.ns6 = 1
else if(this.ie){
this.ie4 = !this.dom && document.all
this.ie5 = (this.agent.indexOf("msie 5")>-1)
this.ie55 = (this.ie5 && this.agent.indexOf("msie 5.5")>-1)
this.ie6 = this.dom && !this.ie4 && !this.ie5 && ! this.ie55
}
this.mac=(this.agent.indexOf("mac")>-1)
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.op5 || this.op6 || this.op7)
this.usedom= this.ns6||this.op7//Use dom creation
this.reuse = this.ie||this.op7||this.usedom //Reuse layers
this.px=this.dom&&!this.op5?"px":""
return this
}
var bw=new cm_bwcheck()
/*Variable declaration*/
var cmpage
/*Crossbrowser objects functions*/
function cm_message(txt){alert(txt); return false}
function cm_makeObj(obj,nest,o,doc){ //Changed in v4.05
if(!doc) doc=document
if(bw.usedom&&o) this.evnt=o
else{nest=(!nest) ? "doc.":'doc.layers.'+nest+'.'
this.evnt=bw.dom? doc.getElementById(obj):
bw.ie4?doc.all[obj]:bw.ns4?eval(nest+"layers." +obj):0;
}
if(!this.evnt) return cm_message('The layer does not exist ('+obj+')'
+'- \nIf your using Netscape please check the nesting of your tags (on the entire page)\nNest:'+nest)
this.css=bw.dom||bw.ie4?this.evnt.style:this.evnt; this.ok=0
this.ref=bw.dom||bw.ie4?doc:this.css.document;
this.obj = obj + "Object"; eval(this.obj + "=this");
this.x=0; this.y=0; this.w=0; this.h=0; this.vis=0; return this
}
cm_makeObj.prototype.moveIt = function(x,y){this.x=x;this.y=y; this.css.left=x+bw.px;this.css.top=y+bw.px}
cm_makeObj.prototype.showIt = function(o){this.css.visibility="visible"; this.vis=1; if(bw.op5&&this.arr){ this.arr.showIt(); }}//alert('showing arrow')}}
cm_makeObj.prototype.hideIt = function(no){this.css.visibility="hidden"; this.vis=0;}
cm_makeObj.prototype.clipTo = function(t,r,b,l,setwidth){
this.w=r; this.h=b; if(bw.ns4){this.css.clip.top=t;this.css.clip.right=r; this.css.clip.bottom=b;this.css.clip.left=l
}else{if(t<0)t=0;if(r<0)r=0;if(b<0)b=0;if(b<0)b=0; this.css.clip="rect("+t+bw.px+","+r+bw.px+","+b+bw.px+","+l+bw.px+")";
if(setwidth){if(bw.op5||bw.op6){this.css.pixelWidth=r; this.css.pixelHeight=b;}else{this.css.width=r+bw.px; this.css.height=b+bw.px;}}}}
function cm_active(on,h){
if(this.o.arr) on?this.o.arr.hideIt():bw.op5?this.o.arr.showIt():this.o.arr.css.visibility="inherit"
if(bw.reuse||bw.usedom){
if(!this.img2) this.o.evnt.className=on?this.cl2:this.cl
else{
this.o.ref.images["img"+this.name].src=on?this.img2.src:this.img1.src; //Changed v4.05
this.o.ref.images["img"+this.name].οnclick=on?"alert('test3');":"alert('test4');";
}
if(on && bw.ns6){this.o.hideIt(); this.o.css.visibility='inherit' }; //netscape 6 bug fix
}else{
if(!this.img2){ if(on) this.o.over.showIt(); else this.o.over.hideIt();
}else{ this.o.ref.images["img"+this.name].src=on?this.img2.src:this.img1.src;
this.o.ref.images["img"+this.name].οnclick=on?"alert('test1');":"alert('test2');";
}
}this.isactive=on?1:0
}
/***Pageobject **/
function cm_page(frame){ //Changed v4.05
if(!frame) frame = self
this.x=0; this.x2 =(!bw.ie)?frame.innerWidth:frame.document.body.offsetWidth-20;
this.y=0; this.orgy=this.y2= (!bw.ie)?frame.innerHeight:frame.document.body.offsetHeight-6;
this.x50=this.x2/2; this.y50=this.y2/2; return this
}
/***check positions**/
function cm_cp(num,w,minus){
if(num){if(num.toString().indexOf("%")!=-1){var t = w?cmpage.x2:cmpage.y2; num=parseInt((t*parseFloat(num)/100))
if(minus) num-=minus }else num=eval(num);} else num=0; return num
}
/**Level object**/
function cm_makeLevel(){//changed 4.06
var c=this, a=arguments; c.width=a[0]||null; c.height=a[1]||null;
c.regClass=a[2]||null; c.overClass=a[3]||null; c.borderX=a[4]>-1?a[4]:null;
c.borderY=a[5]>-1?a[5]:null; c.borderClass=a[6]||null; c.rows=a[7]>-1?a[7]:null;
c.align=a[8]||null; c.offsetX=a[9]||null; c.offsetY=a[10]||null; c.arrow=a[11]||null;
c.arrowWidth=a[12]||null; c.arrowHeight=a[13]||null; c.roundBorder=a[14]||null; return c
}
/***Making the main menu object**/
function makeCM(name){ //Changed v4.06
var c=this; c.mc=0; c.name = name; c.m=new Array(); c.scrollY=-1; c.level=new Array(); c.l=new Array(); c.tim=100; c.isresized=0;
c.isover=0; c.zIndex=100; c.frameStartLevel=1; c.bar=0; c.z=0; c.totw=0; c.toth=0; c.maxw=0; c.maxh=0; cmpage = new cm_page(); c.constructed = 0;
return this
}//events
makeCM.prototype.οnshοw=""; makeCM.prototype.onhide=""; makeCM.prototype.onconstruct="";
/***Creating layers**/
function cm_divCreate(id,cl,txt,w,c,app,ex,txt2){
if(bw.usedom){var div=document.createElement("DIV"); div.className=cl; div.id=id;
if(txt) div.innerHTML=txt; if(app){app.appendChild(div); return div}
if(w) document.body.appendChild(div); return div
}else{var dstr='<div id="'+id+'" class="'+cl+'"'
if(ex&&bw.reuse) dstr+=" "+ex; dstr+=">"+txt; ; if(txt2) dstr+=txt2;
if(c) dstr+='</div>'; if(w) document.write(dstr); else return dstr
}return ""
}
/***Getting layer string for each menu**/
function cm_getLayerStr(m,app,name,fill,clb,arrow,ah,aw,root,evt){
var imgClick = '';
if(evt!=null){
imgClick=' '+evt+'="'+name+'.showsub(\''+m.name+'\');"';
}else{
imgClick=' οnmοuseοver="'+name+'.showsub(\''+m.name+'\');"';
}
var no=m.nolink,arrstr='',l=m.lev,str='',txt=m.txt,ev='', id=name + '_' + m.name,d1; if(app) d1=app
if((!bw.reuse||l==0) && !no){
//change this to onclick for suite menu to open on onclick
//ev=' οnclick="'+name+'.showsub(\''+m.name+'\')"'
// alert('m.name:'+m.name);
if(evt!=null){
ev=' '+evt+'="'+name+'.showsub(\''+m.name+'\')"'
+' οnmοuseοut="'+name+'.mout(\''+m.name+'\')"'
+' οnclick="'+name+'.onclck(\''+m.name+'\'); return false" '
}else{
ev=' οnmοuseοver="'+name+'.showsub(\''+m.name+'\')"'
+' οnmοuseοut="'+name+'.mout(\''+m.name+'\')"'
+' οnclick="'+name+'.onclck(\''+m.name+'\'); return false" '
}
}
if(bw.reuse&&l!=0) txt=''; if(l==0) str+=d1=cm_divCreate(id+'_0',clb,''); str+=m.d2=cm_divCreate(id,m.cl,txt,0,0,d1,ev)
if(l==0&&bw.usedom){
m.d2.οnclick=new Function(name+'.onclck("'+m.name+'")');
m.d1=d1;
//change this to onclick for suite menu to open on onclick
//if(evt!=null && evt=='onmouseover')
//m.d2.οnmοuseοver=new Function(name+'.showsub("'+m.name+'")');
if(evt!=null && evt=='onclick')
m.d2.οnclick=new Function(name+'.showsub("'+m.name+'")');
else
m.d2.οnmοuseοver=new Function(name+'.showsub("'+m.name+'")');
m.d2.οnmοuseοut=new Function(name+'.mout("'+m.name+'")')
}if(!bw.reuse && !m.img1 && !no){
str+=cm_divCreate(id+'_1',m.cl2,txt,0,1)
str+=cm_divCreate(id+'_3',"clCMAbs",'<a href="#" '+ev+'><img alt="" src="'+root+fill+'" width="'+m.w+'" height="'+m.h+'" border="0" /></a>',0,1)
}str+='</div>';
if(l==0){
if(arrow)
str+=m.d3=cm_divCreate(id+'_a','clCMAbs','<img alt="" height="'+aw+'" width="'+ah+'" src="'+root+arrow+'" '+imgClick+'/>',0,1,d1); str+="</div>"}
str+="\n"; if(!bw.reuse){m.txt=null; m.d2=null; m.d3=null;}
if(bw.usedom){ if(l==0) document.body.appendChild(d1); str=''}
return str
}
/***get align num from text (better to evaluate numbers later)**/
function cm_checkalign(a){
switch(a){
case "right": return 1; break; case "left": return 2; break;
case "bottom": return 3; break; case "top": return 4; break;
case "righttop": return 5; break; case "lefttop": return 6; break;
case "bottomleft": return 7; break; case "topleft": return 8; break;
}return null
}
/**Making each individual menu **/
makeCM.prototype.makeMenu=function(name,parent,txt,lnk,targ,w,h,img1,img2,cl,cl2,align,rows,nolink,onclick,onmouseover,onmouseout){
var c = this; if(!name) name = c.name+""+c.mc; var p = parent!=""&&parent&&c.m[parent]?parent:0;
if(c.mc==0){
//Added 4.07 - bug(?) in opera 7 - you cannot dom-add layers created in one document to another one (or so it seems) - so turn of usedom
if(bw.op7 && this.frames) bw.usedom=0
var tmp=location.href;
if(tmp.indexOf('file:')>-1||tmp.charAt(1)==':') c.root=c.offlineRoot; else c.root=c.onlineRoot
if(c.useBar){if(!c.barBorderClass) c.barBorderClass=c.barClass; c.bar1 = cm_divCreate(c.name+'bbar_0',c.barClass,'',0,1);
c.bar = cm_divCreate(c.name+'bbar',c.barBorderClass,'',1,1,0,0,c.bar1); if(bw.usedom) c.bar.appendChild(c.bar1);
}}var create=1,img,arrow; var m = c.m[name] = new Object(); m.name=name; m.subs=new Array(); m.parent=p; m.arnum=0; m.arr=0
var l = m.lev = p?c.m[p].lev+1:0; c.mc++; m.hide=0;
if(l>=c.l.length){
var p1,p2=0; if(l>=c.level.length) p1=c.l[c.level.length-1];
else p1=c.level[l]; c.l[l]=new Array(); if(!p2) p2=c.l[l-1]
if(l!=0){ if(isNaN(p1.align)) p1["align"]=cm_checkalign(p1.align)
for(var i in p1){if(i!="str"&&i!="m"){if(p1[i]==null) c.l[l][i]=p2[i]; else c.l[l][i]=p1[i] }}
}else{c.l[l]=c.level[0]; c.l[l].align=cm_checkalign(c.l[l].align)}
c.l[l]["str"]=''; c.l[l].m=new Array(); if(!c.l[l].borderClass) c.l[l].borderClass=c.l[l].regClass
c.l[l].app=0; c.l[l].max=0; c.l[l].arnum=0; c.l[l].o=new Array(); c.l[l].arr=new Array()
c.level[l]=p1=p2=null
if(l!=0) c.l[l].str=c.l[l].app=cm_divCreate(c.name+ '_' +l+'_0',c.l[l].borderClass,'')
}if(p){p = c.m[p]; p.subs[p.subs.length]=name;
if(p.subs.length==1&&c.l[l-1].arrow){ p.arr=1;
if(p.parent){c.m[p.parent].arnum++
if(c.m[p.parent].arnum>c.l[l-1].arnum){
c.l[l-1].str+=c.l[l-1].arr[c.l[l-1].arnum]=cm_divCreate(c.name+ '_a' +(l-1)+'_'+c.l[l-1].arnum,'clCMAbs','<img height="'+c.l[l-1].arrowHeight
+'" width="'+c.l[l-1].arrowWidth+'" src="'+c.root+c.l[l-1].arrow+'" alt="" />',0,1,c.l[l-1].app); c.l[l-1].arnum++
}}}if(bw.reuse) if(p.subs.length>c.l[l].max) c.l[l].max = p.subs.length; else create=0
}m.rows=rows>-1?rows:c.l[l].rows; m.w=cm_cp(w||c.l[l].width,1); m.h=cm_cp(h||c.l[l].height,0); m.txt=txt; m.lnk=lnk;
if(align) align=cm_checkalign(align); m.align=align||c.l[l].align; m.cl=cl=cl||c.l[l].regClass;
m.targ=targ; m.cl2=cl2||c.l[l].overClass; m.create=create; m.mover=onmouseover; m.mout=onmouseout;
m.onclck=onclick; m.active = cm_active; m.isactive=0; m.nolink=nolink
if(create) c.l[l].m[c.l[l].m.length]=name
if(img1){m.img1 = new Image(); m.img1.src=c.root+img1; if(!img2) img2=img1; m.img2 = new Image(); m.img2.src=c.root+img2;
m.cl="clCMAbs"; m.txt=''; if(!bw.reuse&&!nolink) m.txt = '<a href="#" οnmοuseοver="'+c.name+'.showsub(\''+name+'\')" οnmοuseοut="'+c.name+'.mout(\''+name+'\')" οnclick="'+c.name+'.onclck(\''+name+'\'); return false">';;
m.txt+='<img alt="" src="'+c.root+img1+'" width="'+m.w+'" height="'+m.h+'" id="img'+m.name+'" '
if(bw.dom&&!nolink) m.txt+='style="cursor:pointer; cursor:hand"'; if(!bw.reuse){if(!bw.dom) m.txt+='name="img'+m.name+'"'; m.txt+=' border="0"'}; m.txt+=' />'; if(!bw.reuse&&!nolink) m.txt+='</a>'
}else{m.img1=0; m.img2=0};
if(l==0||create) c.l[l].str+=cm_getLayerStr(m,c.l[l].app,c.name,c.fillImg,c.l[l].borderClass,c.l[l].arrow,c.l[l].arrowWidth,c.l[l].arrowHeight,c.root,c.event)
if(l==0){if(m.w>c.maxw) c.maxw=m.w; if(m.h>c.maxh) c.maxh=m.h; c.totw+=c.pxBetween+m.w+c.l[0].borderX;c.toth+=c.pxBetween+m.h+c.l[0].borderY}
if(lnk && !onmouseover){
var path=lnk.indexOf("mailto:")>-1||lnk.indexOf("http://")>-1?"":c.root
m.mover="self.status='"+path+m.lnk+"'"
if(!m.mout) m.mout=""; m.mout+=";self.status='';"
}
}
/**Getting x/y coords for subs **/
makeCM.prototype.getcoords=function(m,bx,by,x,y,maxw,maxh,ox,oy){
var a=m.align; x+=m.o.x; y+=m.o.y
switch(a){
case 1: x+=m.w+bx; break; case 2: x-=maxw+bx; break;
case 3: y+=m.h+by; break; case 4: y-=maxh+by; break;
case 5: x-=maxw+bx; y-=maxh-m.h; break;
case 6: x+=m.w+bx; y-=maxh-m.h; break;
case 7: y+=m.h+by; x-=maxw-m.w; break;
case 8: y-=maxh+by; x-=maxw-m.w+bx; break;
}//Added v4.05
if(m.lev==this.frameStartLevel-1 && this.frames){
switch(a){
case 1: x=0; break;
case 2: x=this.cmpage.x2-maxw; break;
case 3: y=0; break;
case 4: y-=maxh+by; break;
case 5: x-=maxw+bx; y-=maxh-m.h; break;
case 6: x+=m.w+bx; y-=maxh-m.h; break;
case 7: y+=m.h+by; x-=maxw-m.w; break;
case 8: y-=maxh+by; x-=maxw-m.w+bx; break;
}
}
m.subx=x + ox; m.suby=y + oy
}
/**Showing sub elements**/
makeCM.prototype.showsub=function(el){ //Changed v4.06
//alert('el:'+el);
var c=this,pm=c.m[el],m,o,nl
// alert('pm:'+pm);
if(!pm.b||(c.isresized&&pm.lev>0))
pm.b=c.l[pm.lev].b; c.isover=1
clearTimeout(c.tim);
var ln=pm.subs.length,l=pm.lev+1
if(c.l[pm.lev].a==el&&l!=c.l.length && !c.openOnClick){if(c.l[pm.lev+1].a) c.hidesub(l+1,el); return}
c.hidesub(l,el); if(pm.mover) eval(pm.mover); if(!pm.isactive) pm.active(1);
c.l[pm.lev].a = el; if(ln==0) return;
if(c.openOnClick && !c.clicked) return//Added v4.06
if(!c.l[l].b) return //Added v4.05
var b = c.l[l].b, bx=c.l[l].borderX, by=c.l[l].borderY, rows=pm.rows
var rb=c.l[l].roundBorder;//added 4.06
var x=bx+rb,y=by+rb,maxw=0,maxh=0,cn=0; b.hideIt()
for(var i=0;i<c.l[l].m.length;i++){
if(!bw.reuse) m=c.m[c.l[l].m[i]]
else m=c.m[c.m[el].subs[i]]
if(m && m.parent==el&&!m.hide){
if(!bw.reuse) o=m.o; else o=m.o=c.l[l].o[i]
if(x!=o.x||y!=o.y) o.moveIt(x,y); nl=m.subs.length //changed 4.06
if(bw.reuse){
if(o.w!=m.w || o.h!=m.h) o.clipTo(0,m.w,m.h,0,1)
if(o.evnt.className!=m.cl){
m.isactive=0; o.evnt.className=m.cl
if(bw.ns6){o.hideIt(); o.css.visibility='inherit'} //NS6 bugfix
}if(bw.ie6) b.showIt()//IE6 bugfix (scrollbars)
o.evnt.innerHTML=m.txt; if(bw.ie6) b.hideIt()
if(!m.nolink){
o.evnt.οnmοuseοver=new Function(c.name+".showsub('"+m.name+"')")
o.evnt.οnmοuseοut=new Function(c.name+".mout('"+m.name+"')") //Added v4.05
o.evnt.οnclick=new Function(c.name+".onclck('"+m.name+"')")
if(o.oldcursor){o.css.cursor=o.oldcursor; o.oldcursor=0;}
}else{o.evnt.οnmοuseοver=''; o.evnt.οnclick=''; if(o.css.cursor=='') o.oldcursor=bw.ns6?"pointer":"hand"; else o.oldcursor=o.css.cursor; o.css.cursor="auto"}
}if(m.arr){o.arr=c.l[l].arr[cn]; o.arr.moveIt(x + m.w-c.l[l].arrowWidth-3,y+m.h/2-(c.l[l].arrowHeight/2));
o.arr.css.visibility="inherit"; cn++;} else o.arr=0
if(!rows){y+=m.h+by; if(m.w>maxw) maxw=m.w; maxh=y}
else{x+=m.w+bx; if(m.h>maxh) maxh=m.h; maxw=x;}
o.css.visibility="inherit"; if(bw.op5||bw.op6) o.showIt()
}else{o = c.m[c.l[l].m[i]].o; o.hideIt();} }
if(!rows) maxw+=bx*2+rb; else maxh+=by*2+rb; //changed 4.06
if(rb){maxw+=rb; maxh+=rb}//added 4.06
b.clipTo(0,maxw,maxh,0,1)
//Check frame scroll
if(c.chkscroll) c.chkscroll() //Added v4.05 - not the best solution
if(c.chkscroll||!pm.subx||!pm.suby||c.scrollY>-1||c.isresized) c.getcoords(pm,c.l[l-1].borderX,c.l[l-1].borderY,pm.b.x,pm.b.y,maxw,maxh,c.l[l-1].offsetX,c.l[l-1].offsetY) //Changed 4.06
x=pm.subx; if(c.chkscroll&&l==c.frameStartLevel) pm.suby+=c.scrollY; y=pm.suby; b.moveIt(x,y); if(c.onshow) eval(c.onshow); b.showIt()
}
/**Hide sub elements **/
makeCM.prototype.hidesub=function(l,el){ //Changed v4.05
var c = this,tmp,m,i,j,hide
if(!l) {l=1; hide=1; c.clicked=0}
for(i=l-1;i<c.l.length;i++){
if(i>0&&i>l-1) if(c.l[i].b) c.l[i].b.hideIt()//Changed v4.05
if(c.l[i].a&&c.l[i].a!=el){
m=c.m[c.l[i].a]; m.active(0,1); if(m.mout) eval(m.mout); c.l[i].a=0
if(i>0&&i>l-1) if(bw.op5||bw.op6) for(j=0;j<c.l[i].m.length;j++) c.m[c.l[i].m[j]].o.hideIt()
}if(i>l){for(j=0;j<c.l[i-1].arnum;j++){c.l[i-1].arr[j].hideIt(); if(bw.op6) c.l[i-1].arr[j].moveIt(-1000,-1000)}} //opera bug
}if(hide&&c.onhide) eval(c.onhide) //onhide event
}
/***Make all menu div objects**/
makeCM.prototype.makeObjects=function(nowrite,fromframe){ //Changed v4.06
var c = this,oc,name,bx,by,w,h,l,no,ar,id,nest,st=0,en=c.l.length,bobj,o,m,i,j
//Added v4.05
if(fromframe){
st = this.frameStartLevel
this.body = fromframe.document.body
this.doc = fromframe.document
this.deftarget=fromframe
this.cmpage = new cm_page(fromframe)
}else{
this.body=document.body
this.doc=document
if(this.frames) en = this.frameStartLevel
this.deftarget=self
}
if(!nowrite){
for(i=st;i<en;i++){ //changed 4.06
if(!bw.usedom) this.doc.write(c.l[i].str)
else if(i>0) this.body.appendChild(c.l[i].app)
if(!this.frames) c.l[i].str=null
}}c.z=c.zIndex+2
for(i=st;i<en;i++){oc=0
if(i!=0){bobj=c.l[i].b = new cm_makeObj(c.name + "_"+i+"_0","",c.l[i].app,this.doc); bobj.css.zIndex=c.z;
if(bw.dom) bobj.css.overflow='hidden'}; bx=c.l[i].borderX; by=c.l[i].borderY; c.l[i].max=0;
for(j=0;j<c.l[i].m.length;j++){
m = c.m[c.l[i].m[j]]; name=m.name; w=m.w; h=m.h; l=m.lev; no=m.nolink;
if(i>0){m.b = bobj; nest=i}
else{m.b = new cm_makeObj(c.name + "_"+name+"_0","",m.d1,this.doc); m.b.css.zIndex=c.z; m.b.clipTo(0,w+bx*2,h+by*2,0,1); nest=name}
id = c.name + "_"+name; nest=c.name + "_"+nest;
if(m.create){
o=m.o=new cm_makeObj(id,nest+"_0",m.d2,this.doc); o.z=o.css.zIndex=c.z+1; if(bw.reuse){c.l[l].o[oc]=o; oc++};
if(l==0&&m.img1) o.css.visibility='inherit'; if(bw.op5) o.showIt(); o.arr=0;
}if(!bw.reuse||l==0) o.clipTo(0,w,h,0,1); o.moveIt(bx,by); o.z=o.css.zIndex=c.z+2
if(j<c.l[i].arnum){
c.l[i].arr[j]=new cm_makeObj(c.name+"_a"+i+"_"+j,nest+"_0",nowrite?0:c.l[i].arr[j],this.doc)
c.l[i].arr[j].css.zIndex=c.z+30+j;
}else if(l==0&&m.arr==1){
o.arr=new cm_makeObj(id+"_a",nest+"_0",m.d3,this.doc)
o.arr.moveIt(bx+m.w-c.l[i].arrowWidth-3,by+m.h/2-(c.l[i].arrowHeight/2));
o.arr.css.zIndex=c.z+20;
}if(!no && !bw.reuse && !m.img1){
o.over=new cm_makeObj(c.name + "_"+name+"_1",nest+"_0"+".document.layers."+id,"",this.doc)
o.over.moveIt(0,0); o.over.hideIt(); o.over.clipTo(0,w,h,0,1); o.over.css.zIndex=c.z+3
img=new cm_makeObj(c.name + "_"+name+"_3",nest+"_0"+".document.layers."+id,"",this.doc); img.moveIt(0,0)
img.css.visibility="inherit"; img.css.zIndex=c.z+4; if(bw.op5) img.showIt()
}c.z++;
}
}
if(fromframe){ ///Set scroll vars - added v4.05
c.chkscroll = function(){//changed 4.06
if (bw.ie&&!bw.ie6) this.scrollY=this.body.scrollTop;
else if (bw.ie6 || bw.op7){
if (this.doc.compatMode && document.compatMode != "BackCompat") this.scrollY=this.doc.documentElement.scrollTop
else this.scrollY=this.body.scrollTop
}else this.scrollY=this.deftarget.pageYOffset;
}
}
}
/**Onmouseout**/
makeCM.prototype.mout = function(){ //Changed v4.06
var c = this; clearTimeout(c.tim); c.isover = 0; var f="if(!"+c.name+".isover)"+c.name+".hidesub()"
if(!c.closeOnClick) c.tim = setTimeout(f,c.wait)
else{
if(bw.ns4){ document.captureEvents("Event.MOUSEDOWN"); document.οnmοusedοwn=new Function(f)}
else document.οnclick=new Function(f);
if(this.frames){
if(bw.ns4){this.doc.captureEvents("Event.MOUSEDOWN"); this.doc.οnmοusedοwn=new Function(f)}
else this.doc.οnclick=new Function(f)
}
}
}
/**Constructing and initiating top items and bar**/
makeCM.prototype.construct=function(nowrite){ //Changed v4.06
var c=this; if(!c.l[0]||c.l[0].m.length==0) return cm_message('No menus defined');
if(!nowrite){for(var i=1;i<c.l.length;i++){c.l[i].str+="</div>"}} //Added 4.06
c.makeObjects(nowrite); cmpage = new cm_page();
var mpa,o,maxw=c.maxw,maxh=c.maxh,i,totw=c.totw,toth=c.toth,m,px=c.pxBetween
var bx=c.l[0].borderX,by=c.l[0].borderY,x=c.fromLeft,y=c.fromTop,mp=c.menuPlacement,rows=c.rows
if(rows){toth=maxh+by*2; totw=totw-px+bx;}else{totw=maxw+bx*2; toth=toth-px+by;}
switch(mp){
case "center": x=cmpage.x2/2-totw/2; if(bw.ns4) x-=9; break;
case "right": x=cmpage.x2-totw; break;
case "bottom": case "bottomcenter": y=cmpage.y2-toth; if(mp=="bottomcenter") x=cmpage.x2/2-totw/2; break;
default: if(mp.toString().indexOf(",")>-1) mpa=1; break;
}for(var i=0;i<c.l[0].m.length;i++){
m = c.m[c.l[0].m[i]]; o = m.b; if(mpa) rows?x=cm_cp(mp[i]):y=cm_cp(mp[i],0,0,1);
o.moveIt(x,y); o.showIt(); if(m.arr) m.o.arr.showIt(); o.oy=y;
if(!mpa) rows?x+=m.w+px+bx:y+=m.h+px+by
}if(c.useBar==1){ //Background-Bar
var bbx=c.barBorderX,bby=c.barBorderY;
var bar1=c.bar1= new cm_makeObj(c.name+'bbar_0',c.name+'bbar',nowrite?0:c.bar1,document)
var bar=c.bar= new cm_makeObj(c.name+'bbar','',nowrite?0:c.bar,document); bar.css.zIndex=c.zIndex+1
var barx=c.barX=="menu"?c.m[c.l[0].m[0]].b.x-bbx:cm_cp(c.barX,1);
var bary=c.barY=="menu"?c.m[c.l[0].m[0]].b.y-bby:cm_cp(c.barY);
var barw=c.barWidth=="menu"?totw:cm_cp(c.barWidth,1,bbx*2);
var barh=c.barHeight=="menu"?toth:cm_cp(c.barHeight,0,bby*2);
bar1.clipTo(0,barw,barh,0,1); bar1.moveIt(bbx,bby); bar1.showIt();
bar.clipTo(0,barw+bbx*2,barh+bby*2,0,1); bar.moveIt(barx,bary); bar.showIt();
}if(c.resizeCheck){ //Window resize code - updated 4.06 - stil sucks
if(bw.ns4||bw.op5||bw.op6)setTimeout('window.οnresize=new Function("'+c.name+'.resized()")',500)
else window.οnresize=new Function(c.name+".resized()")
c.resized=cm_resized; if(bw.op5||bw.op6) document.οnmοusemοve=new Function(c.name+".resized()")
}if(c.onconstruct) eval(c.onconstruct) //onconstruct event
c.constructed = 1 //Added v4.05
return true
}
/**Capturing resize**/
var cm_inresize=0
function cm_resized(){
if(cm_inresize) return
page2=new cm_page(); var off=(bw.op6||bw.op5)?20:5
if(page2.x2<cmpage.x2-off || page2.y2<cmpage.orgy-off || page2.x2>cmpage.x2+off || page2.y2>cmpage.orgy+off){
if(bw.ie||bw.ns6||bw.op7||bw.ns4){
cmpage=page2; this.isresized=1;
if(this.onresize) eval(this.onresize); this.construct(1);
if(this.onafterresize) eval(this.onafterresize);
}else{cm_inresize=1; location.reload()}
}
}
/**Onclick of an item**/
makeCM.prototype.onclck=function(m){ //Changed v4.06
m = this.m[m]
if(m.onclck) eval(m.onclck);
if(this.openOnClick && m.subs.length>0){
this.clicked = 1; this.showsub(m.name); return
}
var lnk=m.lnk, targ=m.targ
if(lnk){
if(lnk.indexOf("mailto")!=0 && lnk.indexOf("http")!=0) lnk=this.root+lnk
if(String(targ)=="undefined" || targ=="" || targ==0 || targ=="_self"){
if(this.frames){ //Turning of all level 1 + vars
if(this.l[0].a){
this.m[this.l[0].a].active(0,1)
this.l[0].a =0
}
for(i=this.frameStartLevel;i<this.l.length;i++){
if(this.l[i].b){
this.l[i].b.hideIt()
this.l[i].b = null
for(j=0;j<this.l[i].m.length;j++){
this.m[this.l[i].m[j]].b = null;
}
}
}
this.isover=0
}
this.deftarget.location.href=lnk
}
else if(targ=="_blank") window.open(lnk)
else if(targ=="_top" || targ=="window") top.location.href=lnk
else if(top[targ]) top[targ].location.href=lnk
else if(parent[targ]) parent[targ].location.href=lnk
}else return false
}
8 menuDropdown.js
/*
* menuDropdown.js - implements an dropdown menu based on a HTML list
* Author: Dave Lindquist (http://www.gazingus.org)
*
* Modified to support 1 level of submenus 2/27/2004 by Ryan Tyer
*/
var currentMenu = null;
var currentSub = null;
if (!document.getElementById) {
document.getElementById = function() { return null; }
}
function initializeMenu(menuId, actuatorId) {
var menu = document.getElementById(menuId);
var actuator = document.getElementById(actuatorId);
if (menu == null || actuator == null) return;
if (menu.className == "submenu") {
initializeSubMenu(menuId, actuatorId);
return;
}
actuator.onmouseover = function() {
if (currentMenu) {
currentMenu.style.visibility = "hidden";
this.showMenu();
if (currentSub != null) {
currentSub.style.visibility = "hidden";
}
}
}
actuator.onclick = function() {
if (currentMenu == null) {
this.showMenu();
}
else {
currentMenu.style.visibility = "hidden";
currentMenu = null;
}
return false;
}
actuator.showMenu = function() {
menu.style.left = this.offsetLeft + "px";
menu.style.top = this.offsetTop + this.offsetHeight + "px";
currentMenu = menu;
menu.style.visibility = "visible";
}
}
function initializeSubMenu(menuId, actuatorId) {
var menu = document.getElementById(menuId);
var actuator = document.getElementById(actuatorId);
if (menu == null || actuator == null) return;
actuator.className += " subactuator";
actuator.onmouseover = function() {
if (currentSub) {
currentSub.style.visibility = "hidden";
this.showMenu();
}
}
actuator.onclick = function() {
if (currentSub == null) {
this.showMenu();
} else {
currentSub.style.visibility = "hidden";
currentSub = null;
}
return false;
}
actuator.showMenu = function() {
menu.style.left = 140 + "px";
menu.style.top = this.offsetTop - 1 + "px";
menu.style.visibility = "visible";
currentSub = menu;
}
}
function expandMenus() {
// empty method - this is here b/c the ListDisplayer
// calls this method for expanding menus and the list
// type is determined by JavaScript, rather than Java
}
// This function loops through all the <ul>'s in the document and
// initializes the menus for them if they have menu classes
function initializeMenus() {
var uls = document.getElementsByTagName("ul");
for (i = 0; i < uls.length; i++) {
if (uls[i].className == "menuList") {
decorateMenu(uls[i]);
}
}
}
function decorateMenu(menu) {
var links = menu.getElementsByTagName("a");
var lists = document.getElementsByTagName("ul");
var actuators = new Array();
var nonActuators = new Array();
// build an array of actuators
for (i=0; i < links.length; i++) {
if (links[i].className == "actuator") {
actuators[actuators.length] = links[i];
} else {
nonActuators[nonActuators.length] = links[i];
}
}
var menus = new Array();
// build an array of menus
for (i=0; i < lists.length; i++) {
if (lists[i].className == "menu" || lists[i].className == "submenu") {
menus[menus.length] = lists[i];
}
}
// initialize actuators and menus (number should be the same)
for (i=0; i < actuators.length; i++) {
initializeMenu(menus[i].id, actuators[i].id);
}
// Begin custom code to remember last item clicked (with cookies)
// add an onclick event to set a cookie on the non-actuators
for (i=0; i < nonActuators.length; i++) {
nonActuators[i].οnclick=function() {
setCookie(itemCookie,this.href);
}
}
}
/* You can call initializeMenus() manually from your JSP if this doesn't work.
* Just put the following code after the last menu tag.
* <script type="text/javascript">
* initializeMenus();
* </script>
*/
window.onload = initializeMenus;
9 menuExpandable.js
/*
* menuExpandable2.js - implements an expandable menu based on a HTML list
* Author: Dave Lindquist (dave@gazingus.org)
*/
if (!document.getElementById) {
document.getElementById = function() { return null; }
}
var menuCookie = "menusToExpand";
var itemCookie = "itemToHighlight";
function initializeMenu(menuId, actuatorId) {
var menu = document.getElementById(menuId);
var actuator = document.getElementById(actuatorId);
if (menu == null || actuator == null) return;
//if (window.opera) return; // I'm too tired
actuator.parentNode.style.backgroundImage = "url(images/plus.gif)";
actuator.onclick = function() {
var display = menu.style.display;
this.parentNode.style.backgroundImage =
(display == "block") ? "url(images/plus.gif)" : "url(images/minus.gif)";
menu.style.display = (display == "block") ? "none" : "block";
// Begin custom code for remembering expanded menus with cookies
var menusToExpand = getCookie(menuCookie);
if (menu.style.display == "block") {
// set a cookie to keep the menu expanded
if (menusToExpand == null) {
setCookie(menuCookie,menuId);
} else if (menusToExpand.indexOf(menuId) == -1) {
setCookie(menuCookie,menusToExpand+","+menuId);
}
} else {
// remove it from the expanded cookie list
if (menusToExpand.indexOf(menuId) != -1) {
// check for comma after menu
if (menusToExpand.indexOf(menuId+",") != -1) {
menusToExpand = menusToExpand.replace(menuId+",","");
} else {
menusToExpand = menusToExpand.replace(menuId,"");
}
if (menusToExpand == "") {
deleteCookie(menuCookie);
} else {
setCookie(menuCookie,menusToExpand);
}
}
}
// End custom code
return false;
}
}
// This function loops through all the <ul>'s in the document and
// initializes the menus for them if they have menu classes
function initializeMenus() {
var uls = document.getElementsByTagName("ul");
for (i = 0; i < uls.length; i++) {
if (uls[i].className == "menuList") {
decorateMenu(uls[i]);
}
}
// user must have cookies enabled for this to work
expandMenus();
}
function decorateMenu(menu) {
var links = menu.getElementsByTagName("a");
var lists = document.getElementsByTagName("ul");
var actuators = new Array();
var nonActuators = new Array();
// build an array of actuators
for (i=0; i < links.length; i++) {
if (links[i].className == "actuator") {
actuators[actuators.length] = links[i];
} else {
nonActuators[nonActuators.length] = links[i];
}
}
var menus = new Array();
// build an array of menus
for (i=0; i < lists.length; i++) {
if (lists[i].className == "menu" || lists[i].className == "submenu") {
menus[menus.length] = lists[i];
}
}
// initialize actuators and menus (number should be the same)
for (i=0; i < actuators.length; i++) {
initializeMenu(menus[i].id, actuators[i].id);
}
// Begin custom code to remember last item clicked (with cookies)
// add an onclick event to set a cookie on the non-actuators
for (i=0; i < nonActuators.length; i++) {
// retain any existing onclick handlers from menu-config.xml
if (nonActuators[i].onclick) {
nonActuators[i].οnclick=function() {
setCookie(itemCookie,this.href);
if (eval(this.getAttribute("onclick")) == false) {
return false;
}
};
} else {
nonActuators[i].οnclick=function() {
setCookie(itemCookie,this.href);
};
}
}
}
function openMenu(menuId) {
var menu = document.getElementById(menuId);
var actuatorId = menuId.substring(0, menuId.indexOf("Menu")) + "Actuator";
var actuator = document.getElementById(actuatorId);
if (menu != null) {
var display = menu.style.display;
menu.parentNode.style.backgroundImage = "url(images/minus.gif)";
menu.style.display = (display == "block") ? "none" : "block";
}
}
function expandMenus() {
var menusToExpand = getCookie(menuCookie);
if (menusToExpand != null) {
// if more than one menu has been menusToExpanded,
// create an array of menusToExpanded menus
if (menusToExpand.indexOf(",") != -1) {
menuArray = menusToExpand.split(",");
for (var i=0; i < menuArray.length; i++) {
openMenu(menuArray[i]);
}
} else {
openMenu(menusToExpand);
}
}
var itemToHighlight = getCookie(itemCookie);
var links = document.getElementsByTagName("a");
// add an onclick event to set a cookie on the non-actuators
for (i=0; i < links.length; i++) {
if (links[i].href == itemToHighlight) {
links[i].className += " highlight";
}
}
}
// =========================================================================
// Cookie functions
// =========================================================================
/* This function is used to set cookies */
function setCookie(name,value,expires,path,domain,secure) {
document.cookie = name + "=" + escape (value) +
((expires) ? "; expires=" + expires.toGMTString() : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : "");
}
/* This function is used to get cookies */
function getCookie(name) {
var prefix = name + "="
var start = document.cookie.indexOf(prefix)
if (start==-1) {
return null;
}
var end = document.cookie.indexOf(";", start+prefix.length)
if (end==-1) {
end=document.cookie.length;
}
var value=document.cookie.substring(start+prefix.length, end)
return unescape(value);
}
/* This function is used to delete cookies */
function deleteCookie(name,path,domain) {
if (getCookie(name)) {
document.cookie = name + "=" +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT";
}
}
/* You can call initializeMenus() manually from your JSP if this doesn't work.
* Just put the following code after the last menu tag.
* <script type="text/javascript">
* initializeMenus();
* </script>
*/
window.onload = initializeMenus;
10 nicetabs.js
if (!document.getElementById) {
document.getElementById = function() { return null; }
}
function initMenu() {
var uls = document.getElementsByTagName("ul");
for (i = 0; i < uls.length; i++) {
if (uls[i].className == "menuList") {
decorateMenu(uls[i]);
}
}
}
function decorateMenu(menu) {
var items = menu.getElementsByTagName("li");
for (var i=0; i < items.length; i++) {
items[i].firstChild.myIndex = i;
items[i].firstChild.οnclick=function() {
setCookie("menuSelected", this.myIndex);
};
}
activateMenu(items);
}
function activateMenu(items) {
var activeMenu;
var found = 0;
for (var i=0; i < items.length; i++) {
var url = items[i].firstChild.getAttribute("href");
var current = document.location.toString();
if (current.indexOf(url) != -1) {
found++;
}
}
// more than one found, use cookies
if (found > 1) {
var menuSelected = getCookie("menuSelected");
if (items[menuSelected].parentNode.className == "submenu") {
items[menuSelected].firstChild.className="selected";
items[menuSelected].parentNode.parentNode.className="selected";
} else {
items[menuSelected].className+="selected";
}
} else {
// only one found, match on URL
for (var i=0; i < items.length; i++) {
var url = items[i].firstChild.getAttribute("href");
var current = document.location.toString();
if (current.indexOf(url) != -1) {
if (items[i].parentNode.className == "submenu") {
items[i].firstChild.className="selected";
items[i].parentNode.parentNode.className="selected";
} else {
items[i].className+="selected";
}
}
}
}
}
// Select the menu that matches the URL when the page loads
window.οnlοad=initMenu;
// =========================================================================
// Cookie functions
// =========================================================================
/* This function is used to set cookies */
function setCookie(name,value,expires,path,domain,secure) {
document.cookie = name + "=" + escape (value) +
((expires) ? "; expires=" + expires.toGMTString() : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : "");
}
/* This function is used to get cookies */
function getCookie(name) {
var prefix = name + "="
var start = document.cookie.indexOf(prefix)
if (start==-1) {
return null;
}
var end = document.cookie.indexOf(";", start+prefix.length)
if (end==-1) {
end=document.cookie.length;
}
var value=document.cookie.substring(start+prefix.length, end)
return unescape(value);
}
/* This function is used to delete cookies */
function deleteCookie(name,path,domain) {
if (getCookie(name)) {
document.cookie = name + "=" +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT";
}
}
11 permissionsMenu-config.js
/*****************************************************************************
Default browsercheck - Leave this one
******************************************************************************/
function lib_bwcheck(){ //Browsercheck (needed)
this.ver=navigator.appVersion; this.agent=navigator.userAgent
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ie=this.ie4||this.ie5||this.ie6
this.mac=this.agent.indexOf("Mac")>-1
this.opera5=this.agent.indexOf("Opera 5")>-1
this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5 || this.dom)
return this
}
var bw=new lib_bwcheck()
var mDebugging=2
oCMenu=new makeCoolMenu("oCMenu")
oCMenu.useframes=0
oCMenu.frame=""
oCMenu.useclick=0
oCMenu.useNS4links=1
oCMenu.NS4padding=2
oCMenu.checkselect=0
oCMenu.offlineUrl="file:///C|/Inetpub/wwwroot/dhtmlcentral/"
oCMenu.onlineUrl="http://www.dhtmlcentral.com/coolmenus/examples/withoutframes/"
oCMenu.pagecheck=1
oCMenu.checkscroll=0
oCMenu.resizecheck=1
oCMenu.wait=1000
oCMenu.usebar=1
oCMenu.barcolor="lightblue"
oCMenu.barwidth="850"
oCMenu.barheight="menu"
oCMenu.barx=0
oCMenu.bary="menu"
oCMenu.barinheritborder=0
oCMenu.rows=1
oCMenu.fromleft=20
oCMenu.fromtop=50
oCMenu.pxbetween=30
oCMenu.menuplacement=0
oCMenu.level[0]=new Array()
oCMenu.level[0].width=110
oCMenu.level[0].height=20
oCMenu.level[0].style="padding:2px; font-family:tahoma,arial,helvetica; font-size:12px; font-weight:bold"
oCMenu.level[0].border=0
oCMenu.level[0].bordercolor="blue"
oCMenu.level[0].offsetX=1
oCMenu.level[0].offsetY=1
oCMenu.level[0].NS4font="tahoma,arial,helvetica"
oCMenu.level[0].NS4fontSize="2"
oCMenu.level[0].clip=0
oCMenu.level[0].clippx=0
oCMenu.level[0].cliptim=0
oCMenu.level[0].filter=0
oCMenu.level[0].align="bottom"
oCMenu.level[1]=new Array()
oCMenu.level[1].width=150
oCMenu.level[1].height=20
oCMenu.level[1].style="padding:2px; font-family:tahoma, arial,helvetica; font-size:8pt"
oCMenu.level[1].align="bottom"
oCMenu.level[1].offsetX=-4
oCMenu.level[1].offsetY=0
oCMenu.level[1].border=1
oCMenu.level[1].bordercolor="#006699"
oCMenu.level[2]=new Array()
oCMenu.level[2].width=oCMenu.level[0].width
oCMenu.level[2].height=20
oCMenu.level[2].style="padding:2px; font-family:tahoma,arial,helvetica; font-size:8pt"
oCMenu.level[2].align="bottom"
oCMenu.level[2].offsetX=0
oCMenu.level[2].offsetY=0
oCMenu.level[2].border=1
oCMenu.level[2].bordercolor="#006699"
oCMenu.level[2].NS4font="tahoma,arial,helvetica"
oCMenu.level[2].NS4fontSize="1"
// Struts Menu specific javascript variables
// menu arrows
cmTopMenuImage=' <img src="images/Darrow.gif">'
cmSubMenuImage=' <img src="images/Rarrow.gif">'
// normal menu colors
cmBGColorOn='blue'
cmBGColorOff='lightblue'
cmTxtColor='black'
cmHoverColor='white'
// disabled menu colors
cmDisBGColorOn='lightgrey'
cmDisBGColorOff='lightgrey'
cmDisTxtColor='white'
cmDisHoverColor='white'
12 tabs.js
if (!document.getElementById) {
document.getElementById = function() { return null; }
}
function initMenu() {
var uls = document.getElementsByTagName("ul");
for (i = 0; i < uls.length; i++) {
if (uls[i].className == "menuList") {
decorateMenu(uls[i]);
}
}
}
function decorateMenu(menu) {
var items = menu.getElementsByTagName("li");
for (var i=0; i < items.length; i++) {
items[i].firstChild.myIndex = i;
// retain any existing onclick handlers from menu-config.xml
if (items[i].firstChild.onclick) {
items[i].firstChild.οnclick=function() {
eval(items[this.myIndex].firstChild.getAttribute("onclick"));
setCookie("menuSelected", this.myIndex);
};
} else {
items[i].firstChild.οnclick=function() {
setCookie("menuSelected", this.myIndex);
};
}
}
activateMenu(items);
}
function activateMenu(items) {
var activeMenu;
var found = 0;
for (var i=0; i < items.length; i++) {
var url = items[i].firstChild.getAttribute("href");
var current = document.location.toString();
if (current.indexOf(url) != -1) {
found++;
}
}
// more than one found, use cookies
if (found > 1) {
var menuSelected = getCookie("menuSelected");
if (items[menuSelected].parentNode.className == "submenu") {
items[menuSelected].firstChild.className="selected";
items[menuSelected].parentNode.parentNode.className="selected";
} else {
items[menuSelected].className+="selected";
}
} else {
// only one found, match on URL
for (var i=0; i < items.length; i++) {
var url = items[i].firstChild.getAttribute("href");
var current = document.location.toString();
if (current.indexOf(url) != -1) {
if (items[i].parentNode.className == "submenu") {
items[i].firstChild.className="selected";
items[i].parentNode.parentNode.className="selected";
} else {
items[i].className+="selected";
}
}
}
}
}
// Select the menu that matches the URL when the page loads
window.οnlοad=initMenu;
// =========================================================================
// Cookie functions
// =========================================================================
/* This function is used to set cookies */
function setCookie(name,value,expires,path,domain,secure) {
document.cookie = name + "=" + escape (value) +
((expires) ? "; expires=" + expires.toGMTString() : "") +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : "");
}
/* This function is used to get cookies */
function getCookie(name) {
var prefix = name + "="
var start = document.cookie.indexOf(prefix)
if (start==-1) {
return null;
}
var end = document.cookie.indexOf(";", start+prefix.length)
if (end==-1) {
end=document.cookie.length;
}
var value=document.cookie.substring(start+prefix.length, end)
return unescape(value);
}
/* This function is used to delete cookies */
function deleteCookie(name,path,domain) {
if (getCookie(name)) {
document.cookie = name + "=" +
((path) ? "; path=" + path : "") +
((domain) ? "; domain=" + domain : "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT";
}
}
13 xtree.js
/*----------------------------------------------------------------------------\
| Cross Browser Tree Widget 1.17 |
|-----------------------------------------------------------------------------|
| Created by Emil A Eklund |
| (http://webfx.eae.net/contact.html#emil) |
| For WebFX (http://webfx.eae.net/) |
|-----------------------------------------------------------------------------|
| An object based tree widget, emulating the one found in microsoft windows, |
| with persistence using cookies. Works in IE 5+, Mozilla and konqueror 3. |
|-----------------------------------------------------------------------------|
| Copyright (c) 1999 - 2002 Emil A Eklund |
|-----------------------------------------------------------------------------|
| This software is provided "as is", without warranty of any kind, express or |
| implied, including but not limited to the warranties of merchantability, |
| fitness for a particular purpose and noninfringement. In no event shall the |
| authors or copyright holders be liable for any claim, damages or other |
| liability, whether in an action of contract, tort or otherwise, arising |
| from, out of or in connection with the software or the use or other |
| dealings in the software. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| This software is available under the three different licenses mentioned |
| below. To use this software you must chose, and qualify, for one of those. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| The WebFX Non-Commercial License http://webfx.eae.net/license.html |
| Permits anyone the right to use the software in a non-commercial context |
| free of charge. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| The WebFX Commercial license http://webfx.eae.net/commercial.html |
| Permits the license holder the right to use the software in a commercial |
| context. Such license must be specifically obtained, however it's valid for |
| any number of implementations of the licensed software. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| GPL - The GNU General Public License http://www.gnu.org/licenses/gpl.txt |
| Permits anyone the right to use and modify the software without limitations |
| as long as proper credits are given and the original and modified source |
| code are included. Requires that the final product, software derivate from |
| the original source or any software utilizing a GPL component, such as |
| this, is also licensed under the GPL license. |
|-----------------------------------------------------------------------------|
| Dependencies: xtree.css (To set up the CSS of the tree classes) |
|-----------------------------------------------------------------------------|
| 2001-01-10 | Original Version Posted. |
| 2001-03-18 | Added getSelected and get/setBehavior that can make it behave |
| | more like windows explorer, check usage for more information. |
| 2001-09-23 | Version 1.1 - New features included keyboard navigation (ie) |
| | and the ability to add and remove nodes dynamically and some |
| | other small tweaks and fixes. |
| 2002-01-27 | Version 1.11 - Bug fixes and improved mozilla support. |
| 2002-06-11 | Version 1.12 - Fixed a bug that prevented the indentation line |
| | from updating correctly under some circumstances. This bug |
| | happened when removing the last item in a subtree and items in |
| | siblings to the remove subtree where not correctly updated. |
| 2002-06-13 | Fixed a few minor bugs cased by the 1.12 bug-fix. |
| 2002-08-20 | Added usePersistence flag to allow disable of cookies. |
| 2002-10-23 | (1.14) Fixed a plus icon issue |
| 2002-10-29 | (1.15) Last changes broke more than they fixed. This version |
| | is based on 1.13 and fixes the bugs 1.14 fixed withou breaking |
| | lots of other things. |
| 2003-02-15 | The selected node can now be made visible even when the tree |
| | control loses focus. It uses a new class declaration in the |
| | css file '.webfx-tree-item a.selected-inactive', by default it |
| | puts a light-gray rectangle around the selected node. |
| 2003-03-16 | Adding target support after lots of lobbying... |
|-----------------------------------------------------------------------------|
| Created 2000-12-11 | All changes are in the log above. | Updated 2003-03-16 |
\----------------------------------------------------------------------------*/
var webFXTreeConfig = {
rootIcon : 'images/foldericon.png',
openRootIcon : 'images/openfoldericon.png',
folderIcon : 'images/foldericon.png',
openFolderIcon : 'images/openfoldericon.png',
fileIcon : 'images/file.png',
iIcon : 'images/I.png',
lIcon : 'images/L.png',
lMinusIcon : 'images/Lminus.png',
lPlusIcon : 'images/Lplus.png',
tIcon : 'images/T.png',
tMinusIcon : 'images/Tminus.png',
tPlusIcon : 'images/Tplus.png',
blankIcon : 'images/blank.png',
defaultText : 'Tree Item',
defaultAction : 'javascript:void(0);',
defaultBehavior : 'classic',
usePersistence : true
};
var webFXTreeHandler = {
idCounter : 0,
idPrefix : "webfx-tree-object-",
all : {},
behavior : null,
selected : null,
onSelect : null, /* should be part of tree, not handler */
getId : function() { return this.idPrefix + this.idCounter++; },
toggle : function (oItem) { this.all[oItem.id.replace('-plus','')].toggle(); },
select : function (oItem) { this.all[oItem.id.replace('-icon','')].select(); },
focus : function (oItem) { this.all[oItem.id.replace('-anchor','')].focus(); },
blur : function (oItem) { this.all[oItem.id.replace('-anchor','')].blur(); },
keydown : function (oItem, e) { return this.all[oItem.id].keydown(e.keyCode); },
cookies : new WebFXCookie(),
insertHTMLBeforeEnd : function (oElement, sHTML) {
if (oElement.insertAdjacentHTML != null) {
oElement.insertAdjacentHTML("BeforeEnd", sHTML)
return;
}
var df; // DocumentFragment
var r = oElement.ownerDocument.createRange();
r.selectNodeContents(oElement);
r.collapse(false);
df = r.createContextualFragment(sHTML);
oElement.appendChild(df);
}
};
/*
* WebFXCookie class
*/
function WebFXCookie() {
if (document.cookie.length) { this.cookies = ' ' + document.cookie; }
}
WebFXCookie.prototype.setCookie = function (key, value) {
document.cookie = key + "=" + escape(value);
}
WebFXCookie.prototype.getCookie = function (key) {
if (this.cookies) {
var start = this.cookies.indexOf(' ' + key + '=');
if (start == -1) { return null; }
var end = this.cookies.indexOf(";", start);
if (end == -1) { end = this.cookies.length; }
end -= start;
var cookie = this.cookies.substr(start,end);
return unescape(cookie.substr(cookie.indexOf('=') + 1, cookie.length - cookie.indexOf('=') + 1));
}
else { return null; }
}
/*
* WebFXTreeAbstractNode class
*/
function WebFXTreeAbstractNode(sText, sAction) {
this.childNodes = [];
this.id = webFXTreeHandler.getId();
this.text = sText || webFXTreeConfig.defaultText;
this.action = sAction || webFXTreeConfig.defaultAction;
this._last = false;
webFXTreeHandler.all[this.id] = this;
}
/*
* To speed thing up if you're adding multiple nodes at once (after load)
* use the bNoIdent parameter to prevent automatic re-indentation and call
* the obj.ident() method manually once all nodes has been added.
*/
WebFXTreeAbstractNode.prototype.add = function (node, bNoIdent) {
node.parentNode = this;
this.childNodes[this.childNodes.length] = node;
var root = this;
if (this.childNodes.length >= 2) {
this.childNodes[this.childNodes.length - 2]._last = false;
}
while (root.parentNode) { root = root.parentNode; }
if (root.rendered) {
if (this.childNodes.length >= 2) {
document.getElementById(this.childNodes[this.childNodes.length - 2].id + '-plus').src = ((this.childNodes[this.childNodes.length -2].folder)?((this.childNodes[this.childNodes.length -2].open)?webFXTreeConfig.tMinusIcon:webFXTreeConfig.tPlusIcon):webFXTreeConfig.tIcon);
this.childNodes[this.childNodes.length - 2].plusIcon = webFXTreeConfig.tPlusIcon;
this.childNodes[this.childNodes.length - 2].minusIcon = webFXTreeConfig.tMinusIcon;
this.childNodes[this.childNodes.length - 2]._last = false;
}
this._last = true;
var foo = this;
while (foo.parentNode) {
for (var i = 0; i < foo.parentNode.childNodes.length; i++) {
if (foo.id == foo.parentNode.childNodes[i].id) { break; }
}
if (i == foo.parentNode.childNodes.length - 1) { foo.parentNode._last = true; }
else { foo.parentNode._last = false; }
foo = foo.parentNode;
}
webFXTreeHandler.insertHTMLBeforeEnd(document.getElementById(this.id + '-cont'), node.toString());
if ((!this.folder) && (!this.openIcon)) {
this.icon = webFXTreeConfig.folderIcon;
this.openIcon = webFXTreeConfig.openFolderIcon;
}
if (!this.folder) { this.folder = true; this.collapse(true); }
if (!bNoIdent) { this.indent(); }
}
return node;
}
WebFXTreeAbstractNode.prototype.toggle = function() {
if (this.folder) {
if (this.open) { this.collapse(); }
else { this.expand(); }
} }
WebFXTreeAbstractNode.prototype.select = function() {
document.getElementById(this.id + '-anchor').focus();
}
WebFXTreeAbstractNode.prototype.deSelect = function() {
document.getElementById(this.id + '-anchor').className = '';
webFXTreeHandler.selected = null;
}
WebFXTreeAbstractNode.prototype.focus = function() {
if ((webFXTreeHandler.selected) && (webFXTreeHandler.selected != this)) { webFXTreeHandler.selected.deSelect(); }
webFXTreeHandler.selected = this;
if ((this.openIcon) && (webFXTreeHandler.behavior != 'classic')) { document.getElementById(this.id + '-icon').src = this.openIcon; }
document.getElementById(this.id + '-anchor').className = 'selected';
document.getElementById(this.id + '-anchor').focus();
if (webFXTreeHandler.onSelect) { webFXTreeHandler.onSelect(this); }
}
WebFXTreeAbstractNode.prototype.blur = function() {
if ((this.openIcon) && (webFXTreeHandler.behavior != 'classic')) { document.getElementById(this.id + '-icon').src = this.icon; }
document.getElementById(this.id + '-anchor').className = 'selected-inactive';
}
WebFXTreeAbstractNode.prototype.doExpand = function() {
if (webFXTreeHandler.behavior == 'classic') { document.getElementById(this.id + '-icon').src = this.openIcon; }
if (this.childNodes.length) { document.getElementById(this.id + '-cont').style.display = 'block'; }
this.open = true;
if (webFXTreeConfig.usePersistence) {
webFXTreeHandler.cookies.setCookie(this.id.substr(18,this.id.length - 18), '1');
} }
WebFXTreeAbstractNode.prototype.doCollapse = function() {
if (webFXTreeHandler.behavior == 'classic') { document.getElementById(this.id + '-icon').src = this.icon; }
if (this.childNodes.length) { document.getElementById(this.id + '-cont').style.display = 'none'; }
this.open = false;
if (webFXTreeConfig.usePersistence) {
webFXTreeHandler.cookies.setCookie(this.id.substr(18,this.id.length - 18), '0');
} }
WebFXTreeAbstractNode.prototype.expandAll = function() {
this.expandChildren();
if ((this.folder) && (!this.open)) { this.expand(); }
}
WebFXTreeAbstractNode.prototype.expandChildren = function() {
for (var i = 0; i < this.childNodes.length; i++) {
this.childNodes[i].expandAll();
} }
WebFXTreeAbstractNode.prototype.collapseAll = function() {
this.collapseChildren();
if ((this.folder) && (this.open)) { this.collapse(true); }
}
WebFXTreeAbstractNode.prototype.collapseChildren = function() {
for (var i = 0; i < this.childNodes.length; i++) {
this.childNodes[i].collapseAll();
} }
WebFXTreeAbstractNode.prototype.indent = function(lvl, del, last, level, nodesLeft) {
/*
* Since we only want to modify items one level below ourself,
* and since the rightmost indentation position is occupied by
* the plus icon we set this to -2
*/
if (lvl == null) { lvl = -2; }
var state = 0;
for (var i = this.childNodes.length - 1; i >= 0 ; i--) {
state = this.childNodes[i].indent(lvl + 1, del, last, level);
if (state) { return; }
}
if (del) {
if ((level >= this._level) && (document.getElementById(this.id + '-plus'))) {
if (this.folder) {
document.getElementById(this.id + '-plus').src = (this.open)?webFXTreeConfig.lMinusIcon:webFXTreeConfig.lPlusIcon;
this.plusIcon = webFXTreeConfig.lPlusIcon;
this.minusIcon = webFXTreeConfig.lMinusIcon;
}
else if (nodesLeft) { document.getElementById(this.id + '-plus').src = webFXTreeConfig.lIcon; }
return 1;
} }
var foo = document.getElementById(this.id + '-indent-' + lvl);
if (foo) {
if ((foo._last) || ((del) && (last))) { foo.src = webFXTreeConfig.blankIcon; }
else { foo.src = webFXTreeConfig.iIcon; }
}
return 0;
}
/*
* WebFXTree class
*/
function WebFXTree(sText, sAction, sBehavior, sIcon, sOpenIcon) {
this.base = WebFXTreeAbstractNode;
this.base(sText, sAction);
this.icon = sIcon || webFXTreeConfig.rootIcon;
this.openIcon = sOpenIcon || webFXTreeConfig.openRootIcon;
/* Defaults to open */
if (webFXTreeConfig.usePersistence) {
this.open = (webFXTreeHandler.cookies.getCookie(this.id.substr(18,this.id.length - 18)) == '0')?false:true;
} else { this.open = true; }
this.folder = true;
this.rendered = false;
this.onSelect = null;
if (!webFXTreeHandler.behavior) { webFXTreeHandler.behavior = sBehavior || webFXTreeConfig.defaultBehavior; }
}
WebFXTree.prototype = new WebFXTreeAbstractNode;
WebFXTree.prototype.setBehavior = function (sBehavior) {
webFXTreeHandler.behavior = sBehavior;
};
WebFXTree.prototype.getBehavior = function (sBehavior) {
return webFXTreeHandler.behavior;
};
WebFXTree.prototype.getSelected = function() {
if (webFXTreeHandler.selected) { return webFXTreeHandler.selected; }
else { return null; }
}
WebFXTree.prototype.remove = function() { }
WebFXTree.prototype.expand = function() {
this.doExpand();
}
WebFXTree.prototype.collapse = function(b) {
if (!b) { this.focus(); }
this.doCollapse();
}
WebFXTree.prototype.getFirst = function() {
return null;
}
WebFXTree.prototype.getLast = function() {
return null;
}
WebFXTree.prototype.getNextSibling = function() {
return null;
}
WebFXTree.prototype.getPreviousSibling = function() {
return null;
}
WebFXTree.prototype.keydown = function(key) {
if (key == 39) {
if (!this.open) { this.expand(); }
else if (this.childNodes.length) { this.childNodes[0].select(); }
return false;
}
if (key == 37) { this.collapse(); return false; }
if ((key == 40) && (this.open) && (this.childNodes.length)) { this.childNodes[0].select(); return false; }
return true;
}
WebFXTree.prototype.toString = function() {
var str = "<div id=\"" + this.id + "\" οndblclick=\"webFXTreeHandler.toggle(this);\" class=\"webfx-tree-item\" οnkeydοwn=\"return webFXTreeHandler.keydown(this, event)\">" +
"<img id=\"" + this.id + "-icon\" class=\"webfx-tree-icon\" src=\"" + ((webFXTreeHandler.behavior == 'classic' && this.open)?this.openIcon:this.icon) + "\" οnclick=\"webFXTreeHandler.select(this);\">" +
"<a href=\"" + this.action + "\" id=\"" + this.id + "-anchor\" οnfοcus=\"webFXTreeHandler.focus(this);\" οnblur=\"webFXTreeHandler.blur(this);\"" +
(this.target ? " target=\"" + this.target + "\"" : "") +
">" + this.text + "</a></div>" +
"<div id=\"" + this.id + "-cont\" class=\"webfx-tree-container\" style=\"display: " + ((this.open)?'block':'none') + ";\">";
var sb = [];
for (var i = 0; i < this.childNodes.length; i++) {
sb[i] = this.childNodes[i].toString(i, this.childNodes.length);
}
this.rendered = true;
return str + sb.join("") + "</div>";
};
/*
* WebFXTreeItem class
*/
function WebFXTreeItem(sText, sAction, eParent, sIcon, sOpenIcon) {
this.base = WebFXTreeAbstractNode;
this.base(sText, sAction);
/* Defaults to close */
if (webFXTreeConfig.usePersistence) {
this.open = (webFXTreeHandler.cookies.getCookie(this.id.substr(18,this.id.length - 18)) == '1')?true:false;
} else { this.open = false; }
if (sIcon) { this.icon = sIcon; }
if (sOpenIcon) { this.openIcon = sOpenIcon; }
if (eParent) { eParent.add(this); }
}
WebFXTreeItem.prototype = new WebFXTreeAbstractNode;
WebFXTreeItem.prototype.remove = function() {
var iconSrc = document.getElementById(this.id + '-plus').src;
var parentNode = this.parentNode;
var prevSibling = this.getPreviousSibling(true);
var nextSibling = this.getNextSibling(true);
var folder = this.parentNode.folder;
var last = ((nextSibling) && (nextSibling.parentNode) && (nextSibling.parentNode.id == parentNode.id))?false:true;
this.getPreviousSibling().focus();
this._remove();
if (parentNode.childNodes.length == 0) {
document.getElementById(parentNode.id + '-cont').style.display = 'none';
parentNode.doCollapse();
parentNode.folder = false;
parentNode.open = false;
}
if (!nextSibling || last) { parentNode.indent(null, true, last, this._level, parentNode.childNodes.length); }
if ((prevSibling == parentNode) && !(parentNode.childNodes.length)) {
prevSibling.folder = false;
prevSibling.open = false;
iconSrc = document.getElementById(prevSibling.id + '-plus').src;
iconSrc = iconSrc.replace('minus', '').replace('plus', '');
document.getElementById(prevSibling.id + '-plus').src = iconSrc;
document.getElementById(prevSibling.id + '-icon').src = webFXTreeConfig.fileIcon;
}
if (document.getElementById(prevSibling.id + '-plus')) {
if (parentNode == prevSibling.parentNode) {
iconSrc = iconSrc.replace('minus', '').replace('plus', '');
document.getElementById(prevSibling.id + '-plus').src = iconSrc;
} } }
WebFXTreeItem.prototype._remove = function() {
for (var i = this.childNodes.length - 1; i >= 0; i--) {
this.childNodes[i]._remove();
}
for (var i = 0; i < this.parentNode.childNodes.length; i++) {
if (this == this.parentNode.childNodes[i]) {
for (var j = i; j < this.parentNode.childNodes.length; j++) {
this.parentNode.childNodes[j] = this.parentNode.childNodes[j+1];
}
this.parentNode.childNodes.length -= 1;
if (i + 1 == this.parentNode.childNodes.length) { this.parentNode._last = true; }
break;
} }
webFXTreeHandler.all[this.id] = null;
var tmp = document.getElementById(this.id);
if (tmp) { tmp.parentNode.removeChild(tmp); }
tmp = document.getElementById(this.id + '-cont');
if (tmp) { tmp.parentNode.removeChild(tmp); }
}
WebFXTreeItem.prototype.expand = function() {
this.doExpand();
document.getElementById(this.id + '-plus').src = this.minusIcon;
}
WebFXTreeItem.prototype.collapse = function(b) {
if (!b) { this.focus(); }
this.doCollapse();
document.getElementById(this.id + '-plus').src = this.plusIcon;
}
WebFXTreeItem.prototype.getFirst = function() {
return this.childNodes[0];
}
WebFXTreeItem.prototype.getLast = function() {
if (this.childNodes[this.childNodes.length - 1].open) { return this.childNodes[this.childNodes.length - 1].getLast(); }
else { return this.childNodes[this.childNodes.length - 1]; }
}
WebFXTreeItem.prototype.getNextSibling = function() {
for (var i = 0; i < this.parentNode.childNodes.length; i++) {
if (this == this.parentNode.childNodes[i]) { break; }
}
if (++i == this.parentNode.childNodes.length) { return this.parentNode.getNextSibling(); }
else { return this.parentNode.childNodes[i]; }
}
WebFXTreeItem.prototype.getPreviousSibling = function(b) {
for (var i = 0; i < this.parentNode.childNodes.length; i++) {
if (this == this.parentNode.childNodes[i]) { break; }
}
if (i == 0) { return this.parentNode; }
else {
if ((this.parentNode.childNodes[--i].open) || (b && this.parentNode.childNodes[i].folder)) { return this.parentNode.childNodes[i].getLast(); }
else { return this.parentNode.childNodes[i]; }
} }
WebFXTreeItem.prototype.keydown = function(key) {
if ((key == 39) && (this.folder)) {
if (!this.open) { this.expand(); }
else { this.getFirst().select(); }
return false;
}
else if (key == 37) {
if (this.open) { this.collapse(); }
else { this.parentNode.select(); }
return false;
}
else if (key == 40) {
if (this.open) { this.getFirst().select(); }
else {
var sib = this.getNextSibling();
if (sib) { sib.select(); }
}
return false;
}
else if (key == 38) { this.getPreviousSibling().select(); return false; }
return true;
}
WebFXTreeItem.prototype.toString = function (nItem, nItemCount) {
var foo = this.parentNode;
var indent = '';
if (nItem + 1 == nItemCount) { this.parentNode._last = true; }
var i = 0;
while (foo.parentNode) {
foo = foo.parentNode;
indent = "<img id=\"" + this.id + "-indent-" + i + "\" src=\"" + ((foo._last)?webFXTreeConfig.blankIcon:webFXTreeConfig.iIcon) + "\">" + indent;
i++;
}
this._level = i;
if (this.childNodes.length) { this.folder = 1; }
else { this.open = false; }
if ((this.folder) || (webFXTreeHandler.behavior != 'classic')) {
if (!this.icon) { this.icon = webFXTreeConfig.folderIcon; }
if (!this.openIcon) { this.openIcon = webFXTreeConfig.openFolderIcon; }
}
else if (!this.icon) { this.icon = webFXTreeConfig.fileIcon; }
var label = this.text.replace(/</g, '<').replace(/>/g, '>');
var str = "<div id=\"" + this.id + "\" οndblclick=\"webFXTreeHandler.toggle(this);\" class=\"webfx-tree-item\" οnkeydοwn=\"return webFXTreeHandler.keydown(this, event)\">" +
indent +
"<img id=\"" + this.id + "-plus\" src=\"" + ((this.folder)?((this.open)?((this.parentNode._last)?webFXTreeConfig.lMinusIcon:webFXTreeConfig.tMinusIcon):((this.parentNode._last)?webFXTreeConfig.lPlusIcon:webFXTreeConfig.tPlusIcon)):((this.parentNode._last)?webFXTreeConfig.lIcon:webFXTreeConfig.tIcon)) + "\" οnclick=\"webFXTreeHandler.toggle(this);\">" +
"<img id=\"" + this.id + "-icon\" class=\"webfx-tree-icon\" src=\"" + ((webFXTreeHandler.behavior == 'classic' && this.open)?this.openIcon:this.icon) + "\" οnclick=\"webFXTreeHandler.select(this);\">" +
"<a href=\"" + this.action + "\" id=\"" + this.id + "-anchor\" οnfοcus=\"webFXTreeHandler.focus(this);\" οnblur=\"webFXTreeHandler.blur(this);\"" +
(this.target ? " target=\"" + this.target + "\"" : "") +
">" + label + "</a></div>" +
"<div id=\"" + this.id + "-cont\" class=\"webfx-tree-container\" style=\"display: " + ((this.open)?'block':'none') + ";\">";
var sb = [];
for (var i = 0; i < this.childNodes.length; i++) {
sb[i] = this.childNodes[i].toString(i,this.childNodes.length);
}
this.plusIcon = ((this.parentNode._last)?webFXTreeConfig.lPlusIcon:webFXTreeConfig.tPlusIcon);
this.minusIcon = ((this.parentNode._last)?webFXTreeConfig.lMinusIcon:webFXTreeConfig.tMinusIcon);
return str + sb.join("") + "</div>";
}