"SET default_with_oids = true;" muß nicht mehr in der postgresql.conf geändert werden.
[kivitendo-erp.git] / js / dhtmlsuite / menu-for-applications.js
1 /************************************************************************************************************\r
2         @fileoverview\r
3         DHTML Suite for Applications.\r
4         Copyright (C) 2006  Alf Magne Kalleland(post@dhtmlgoodies.com)<br>\r
5         <br>\r
6         This library is free software; you can redistribute it and/or<br>\r
7         modify it under the terms of the GNU Lesser General Public<br>\r
8         License as published by the Free Software Foundation; either<br>\r
9         version 2.1 of the License, or (at your option) any later version.<br>\r
10         <br>\r
11         This library is distributed in the hope that it will be useful,<br>\r
12         but WITHOUT ANY WARRANTY; without even the implied warranty of<br>\r
13         MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU<br>\r
14         Lesser General Public License for more details.<br>\r
15         <br>\r
16         You should have received a copy of the GNU Lesser General Public<br>\r
17         License along with this library; if not, write to the Free Software<br>\r
18         Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA<br>\r
19         <br>\r
20         <br>\r
21         www.dhtmlgoodies.com<br>\r
22         Alf Magne Kalleland<br>\r
23 \r
24 ************************************************************************************************************/\r
25 \r
26 \r
27 /**\r
28  * \r
29  * @package DHTMLSuite for applications\r
30  * @copyright Copyright &copy; 2006, www.dhtmlgoodies.com\r
31  * @author Alf Magne Kalleland <post@dhtmlgoodies.com>\r
32  */\r
33 \r
34 \r
35 /************************************************************************************************************\r
36 *\r
37 * Global variables\r
38 *\r
39 ************************************************************************************************************/\r
40 \r
41 \r
42 // {{{ DHTMLSuite.createStandardObjects()\r
43 /**\r
44  * Create objects used by all scripts\r
45  *\r
46  * @public\r
47  */\r
48 \r
49 \r
50 var DHTMLSuite = new Object();\r
51 \r
52 var standardObjectsCreated = false;     // The classes below will check this variable, if it is false, default help objects will be created\r
53 DHTMLSuite.eventElements = new Array(); // Array of elements that has been assigned to an event handler.\r
54 \r
55 DHTMLSuite.createStandardObjects = function()\r
56 {\r
57         DHTMLSuite.clientInfoObj = new DHTMLSuite.clientInfo(); // Create browser info object\r
58         DHTMLSuite.clientInfoObj.init();        \r
59         if(!DHTMLSuite.configObj){      // If this object isn't allready created, create it.\r
60                 DHTMLSuite.configObj = new DHTMLSuite.config(); // Create configuration object.\r
61                 DHTMLSuite.configObj.init();\r
62         }\r
63         DHTMLSuite.commonObj = new DHTMLSuite.common(); // Create configuration object.\r
64         DHTMLSuite.variableStorage = new DHTMLSuite.globalVariableStorage();;   // Create configuration object.\r
65         DHTMLSuite.commonObj.init();\r
66         window.onunload = function() { DHTMLSuite.commonObj.__clearGarbage(); }\r
67         \r
68         standardObjectsCreated = true;\r
69 \r
70         \r
71 }\r
72 \r
73     \r
74 \r
75 \r
76 /************************************************************************************************************\r
77 *       Configuration class used by most of the scripts\r
78 *\r
79 *       Created:                        August, 19th, 2006\r
80 *       Update log:\r
81 *\r
82 ************************************************************************************************************/\r
83 \r
84 \r
85 /**\r
86 * @constructor\r
87 * @class Store global variables/configurations used by the classes below. Example: If you want to  \r
88 *                change the path to the images used by the scripts, change it here. An object of this   \r
89 *                class will always be available to the other classes. The name of this object is \r
90 *               "DHTMLSuite.configObj". <br><br>\r
91 *                       \r
92 *               If you want to create an object of this class manually, remember to name it "DHTMLSuite.configObj"\r
93 *               This object should then be created before any other objects. This is nescessary if you want\r
94 *               the other objects to use the values you have put into the object. <br>\r
95 * @version                              1.0\r
96 * @version 1.0\r
97 * @author       Alf Magne Kalleland(www.dhtmlgoodies.com)\r
98 **/\r
99 DHTMLSuite.config = function()\r
100 {\r
101         var imagePath;  // Path to images used by the classes. \r
102         var cssPath;    // Path to CSS files used by the DHTML suite.           \r
103 }\r
104 \r
105 \r
106 DHTMLSuite.config.prototype = {\r
107         // {{{ init()\r
108         /**\r
109          *\r
110          * @public\r
111          */\r
112         init : function()\r
113         {\r
114                 this.imagePath = '../images_dhtmlsuite/';       // Path to images               \r
115                 this.cssPath = '../css_dhtmlsuite/';    // Path to images               \r
116         }       \r
117         // }}}\r
118         ,\r
119         // {{{ setCssPath()\r
120     /**\r
121      * This method will save a new CSS path, i.e. where the css files of the dhtml suite are located.\r
122      *\r
123      * @param string newCssPath = New path to css files\r
124      * @public\r
125      */\r
126         \r
127         setCssPath : function(newCssPath)\r
128         {\r
129                 this.cssPath = newCssPath;\r
130         }\r
131         // }}}\r
132         ,\r
133         // {{{ setImagePath()\r
134     /**\r
135      * This method will save a new image file path, i.e. where the image files used by the dhtml suite ar located\r
136      *\r
137      * @param string newImagePath = New path to image files\r
138      * @public\r
139      */\r
140         setImagePath : function(newImagePath)\r
141         {\r
142                 this.imagePath = newImagePath;\r
143         }\r
144         // }}}\r
145 }\r
146 \r
147 \r
148 \r
149 DHTMLSuite.globalVariableStorage = function()\r
150 {\r
151         var menuBar_highlightedItems;   // Array of highlighted menu bar items\r
152         this.menuBar_highlightedItems = new Array();\r
153         \r
154         var arrayOfDhtmlSuiteObjects;   // Array of objects of class menuItem.\r
155         this.arrayOfDhtmlSuiteObjects = new Array();\r
156 }\r
157 \r
158 DHTMLSuite.globalVariableStorage.prototype = {\r
159         \r
160 }\r
161 \r
162 \r
163 /************************************************************************************************************\r
164 *       A class with general methods used by most of the scripts\r
165 *\r
166 *       Created:                        August, 19th, 2006\r
167 *       Purpose of class:       A class containing common method used by one or more of the gui classes below, \r
168 *                                               example: loadCSS. \r
169 *                                               An object("DHTMLSuite.commonObj") of this  class will always be available to the other classes. \r
170 *       Update log:\r
171 *\r
172 ************************************************************************************************************/\r
173 \r
174 \r
175 /**\r
176 * @constructor\r
177 * @class A class containing common method used by one or more of the gui classes below, example: loadCSS. An object("DHTMLSuite.commonObj") of this  class will always be available to the other classes. \r
178 * @version 1.0\r
179 * @author       Alf Magne Kalleland(www.dhtmlgoodies.com)\r
180 **/\r
181 \r
182 DHTMLSuite.common = function()\r
183 {\r
184         var loadedCSSFiles;     // Array of loaded CSS files. Prevent same CSS file from being loaded twice.\r
185         var cssCacheStatus;     // Css cache status\r
186         var eventElements;\r
187         \r
188         this.cssCacheStatus = true;     // Caching of css files = on(Default)\r
189         this.eventElements = new Array();       \r
190 }\r
191 \r
192 DHTMLSuite.common.prototype = {\r
193         \r
194         // {{{ init()\r
195     /**\r
196      * This method initializes the DHTMLSuite_common object.\r
197      *\r
198      * @public\r
199      */\r
200         \r
201         init : function()\r
202         {\r
203                 this.loadedCSSFiles = new Array();\r
204         }       \r
205         // }}}\r
206         ,\r
207         // {{{ loadCSS()\r
208     /**\r
209      * This method loads a CSS file(Cascading Style Sheet) dynamically - i.e. an alternative to <link> tag in the document.\r
210      *\r
211      * @param string cssFileName = New path to image files\r
212      * @public\r
213      */\r
214         \r
215         loadCSS : function(cssFileName)\r
216         {\r
217                 \r
218                 if(!this.loadedCSSFiles[cssFileName]){\r
219                         this.loadedCSSFiles[cssFileName] = true;\r
220                         var linkTag = document.createElement('LINK');\r
221                         if(!this.cssCacheStatus){\r
222                                 if(cssFileName.indexOf('?')>=0)cssFileName = cssFileName + '&'; else cssFileName = cssFileName + '?';\r
223                                 cssFileName = cssFileName + 'rand='+ Math.random();     // To prevent caching\r
224                         }\r
225                         linkTag.href = DHTMLSuite.configObj.cssPath + cssFileName;\r
226                         linkTag.rel = 'stylesheet';\r
227                         linkTag.media = 'screen';\r
228                         linkTag.type = 'text/css';\r
229                         document.getElementsByTagName('HEAD')[0].appendChild(linkTag);  \r
230                         \r
231                 }\r
232         }       \r
233         // }}}\r
234         ,\r
235         // {{{ getTopPos()\r
236     /**\r
237      * This method will return the top coordinate(pixel) of an object\r
238      *\r
239      * @param Object inputObj = Reference to HTML element\r
240      * @public\r
241      */ \r
242         getTopPos : function(inputObj)\r
243         {               \r
244           var returnValue = inputObj.offsetTop;\r
245           while((inputObj = inputObj.offsetParent) != null){\r
246                 if(inputObj.tagName!='HTML'){\r
247                         returnValue += (inputObj.offsetTop - inputObj.scrollTop);\r
248                         if(document.all)returnValue+=inputObj.clientTop;\r
249                 }\r
250           } \r
251           return returnValue;\r
252         }\r
253         // }}}  \r
254         ,       \r
255         // {{{ setCssCacheStatus()\r
256     /**\r
257      * Specify if css files should be cached or not. \r
258      *\r
259      *  @param Boolean cssCacheStatus = true = cache on, false = cache off\r
260      *\r
261      * @public\r
262      */ \r
263         setCssCacheStatus : function(cssCacheStatus)\r
264         {               \r
265           this.cssCacheStatus = cssCacheStatus;\r
266         }\r
267         // }}}  \r
268         ,\r
269         // {{{ getLeftPos()\r
270     /**\r
271      * This method will return the left coordinate(pixel) of an object\r
272      *\r
273      * @param Object inputObj = Reference to HTML element\r
274      * @public\r
275      */ \r
276         getLeftPos : function(inputObj)\r
277         {         \r
278           var returnValue = inputObj.offsetLeft;\r
279           while((inputObj = inputObj.offsetParent) != null){\r
280                 if(inputObj.tagName!='HTML'){\r
281                         returnValue += inputObj.offsetLeft;\r
282                         if(document.all)returnValue+=inputObj.clientLeft;\r
283                 }\r
284           }\r
285           return returnValue;\r
286         }\r
287         // }}}\r
288         ,\r
289         // {{{ cancelEvent()\r
290     /**\r
291      *\r
292      *  This function only returns false. It is used to cancel selections and drag\r
293      *\r
294      * \r
295      * @public\r
296      */ \r
297         \r
298         cancelEvent : function()\r
299         {\r
300                 return false;\r
301         }\r
302         // }}}  \r
303         ,\r
304         // {{{ addEvent()\r
305     /**\r
306      *\r
307      *  This function adds an event listener to an element on the page.\r
308      *\r
309      *  @param Object whichObject = Reference to HTML element(Which object to assigne the event)\r
310      *  @param String eventType = Which type of event, example "mousemove" or "mouseup"\r
311      *  @param functionName = Name of function to execute. \r
312      * \r
313      * @public\r
314      */ \r
315         addEvent : function(whichObject,eventType,functionName)\r
316         { \r
317           if(whichObject.attachEvent){ \r
318             whichObject['e'+eventType+functionName] = functionName; \r
319             whichObject[eventType+functionName] = function(){whichObject['e'+eventType+functionName]( window.event );} \r
320             whichObject.attachEvent( 'on'+eventType, whichObject[eventType+functionName] ); \r
321           } else \r
322             whichObject.addEventListener(eventType,functionName,false);             \r
323           this.__addEventElement(whichObject);\r
324           delete(whichObject);\r
325           // whichObject = null;\r
326         } \r
327         // }}}  \r
328         ,       \r
329         // {{{ removeEvent()\r
330     /**\r
331      *\r
332      *  This function removes an event listener from an element on the page.\r
333      *\r
334      *  @param Object whichObject = Reference to HTML element(Which object to assigne the event)\r
335      *  @param String eventType = Which type of event, example "mousemove" or "mouseup"\r
336      *  @param functionName = Name of function to execute. \r
337      * \r
338      * @public\r
339      */         \r
340         removeEvent : function(whichObject,eventType,functionName)\r
341         { \r
342           if(whichObject.detachEvent){ \r
343             whichObject.detachEvent('on'+eventType, whichObject[eventType+functionName]); \r
344             whichObject[eventType+functionName] = null; \r
345           } else \r
346             whichObject.removeEventListener(eventType,functionName,false); \r
347         } \r
348         ,\r
349         // {{{ __clearGarbage()\r
350     /**\r
351      *\r
352      *  This function is used for Internet Explorer in order to clear memory when the page unloads.\r
353      *\r
354      * \r
355      * @private\r
356      */ \r
357     __clearGarbage : function()\r
358     {\r
359                 /* Example of event which causes memory leakage in IE \r
360                 \r
361                 DHTMLSuite.commonObj.addEvent(expandRef,"click",function(){ window.refToMyMenuBar[index].__changeMenuBarState(this); })\r
362                 \r
363                 We got a circular reference.\r
364                 \r
365                 */\r
366                 \r
367         if(!DHTMLSuite.clientInfoObj.isMSIE)return;\r
368         \r
369         for(var no in DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects){\r
370                 DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[no] = false;                        \r
371         }\r
372         \r
373         for(var no=0;no<DHTMLSuite.eventElements.length;no++){\r
374                 DHTMLSuite.eventElements[no].onclick = null;\r
375                 DHTMLSuite.eventElements[no].onmousedown = null;\r
376                 DHTMLSuite.eventElements[no].onmousemove = null;\r
377                 DHTMLSuite.eventElements[no].onmouseout = null;\r
378                 DHTMLSuite.eventElements[no].onmouseover = null;\r
379                 DHTMLSuite.eventElements[no].onmouseup = null;\r
380                 DHTMLSuite.eventElements[no].onfocus = null;\r
381                 DHTMLSuite.eventElements[no].onblur = null;\r
382                 DHTMLSuite.eventElements[no].onkeydown = null;\r
383                 DHTMLSuite.eventElements[no].onkeypress = null;\r
384                 DHTMLSuite.eventElements[no].onkeyup = null;\r
385                 DHTMLSuite.eventElements[no].onselectstart = null;\r
386                 DHTMLSuite.eventElements[no].ondragstart = null;\r
387                 DHTMLSuite.eventElements[no].oncontextmenu = null;\r
388                 DHTMLSuite.eventElements[no].onscroll = null;\r
389                 \r
390         }\r
391         window.onunload = null;\r
392         DHTMLSuite = null;\r
393 \r
394     }           \r
395     \r
396     ,\r
397         // {{{ __addEventElement()\r
398     /**\r
399      *\r
400      *  Add element to garbage collection array. The script will loop through this array and remove event handlers onload in ie.\r
401      *\r
402      * \r
403      * @private\r
404      */     \r
405     __addEventElement : function(el)\r
406     {\r
407         DHTMLSuite.eventElements[DHTMLSuite.eventElements.length] = el;    \r
408     }\r
409     \r
410     ,\r
411         // {{{ getSrcElement()\r
412     /**\r
413      *\r
414      *  Returns a reference to the element which triggered an event.\r
415      *  @param Event e = Event object\r
416      *\r
417      * \r
418      * @private\r
419      */        \r
420     getSrcElement : function(e)\r
421     {\r
422         var el;\r
423                 // Dropped on which element\r
424                 if (e.target) el = e.target;\r
425                         else if (e.srcElement) el = e.srcElement;\r
426                         if (el.nodeType == 3) // defeat Safari bug\r
427                                 el = el.parentNode;\r
428                 return el;      \r
429     }               \r
430         \r
431 }\r
432 \r
433 \r
434 /************************************************************************************************************\r
435 *       Client info class\r
436 *\r
437 *       Created:                        August, 18th, 2006\r
438 *       Update log:\r
439 *\r
440 ************************************************************************************************************/\r
441 \r
442 /**\r
443 * @constructor\r
444 * @class Purpose of class: Provide browser information to the classes below. Instead of checking for\r
445 *                browser versions and browser types in the classes below, they should check this\r
446 *                easily by referncing properties in the class below. An object("DHTMLSuite.clientInfoObj") of this \r
447 *                class will always be accessible to the other classes. * @version 1.0\r
448 * @author       Alf Magne Kalleland(www.dhtmlgoodies.com)\r
449 **/\r
450 \r
451 \r
452 DHTMLSuite.clientInfo = function()\r
453 {\r
454         var browser;                    // Complete user agent information\r
455         \r
456         var isOpera;                    // Is the browser "Opera"\r
457         var isMSIE;                             // Is the browser "Internet Explorer"   \r
458         var isFirefox;                  // Is the browser "Firefox"\r
459         var navigatorVersion;   // Browser version\r
460 }\r
461         \r
462 DHTMLSuite.clientInfo.prototype = {\r
463         \r
464         /**\r
465         *       Constructor\r
466         *       Params:                 none:\r
467         *       return value:   none;\r
468         **/\r
469         // {{{ init()\r
470     /**\r
471      *\r
472          *\r
473      *  This method initializes the script\r
474      *\r
475      * \r
476      * @public\r
477      */ \r
478         \r
479         init : function()\r
480         {\r
481                 this.browser = navigator.userAgent;     \r
482                 this.isOpera = (this.browser.toLowerCase().indexOf('opera')>=0)?true:false;\r
483                 this.isFirefox = (this.browser.toLowerCase().indexOf('firefox')>=0)?true:false;\r
484                 this.isMSIE = (this.browser.toLowerCase().indexOf('msie')>=0)?true:false;\r
485                 this.isSafari = (this.browser.toLowerCase().indexOf('safari')>=0)?true:false;\r
486                 this.navigatorVersion = navigator.appVersion.replace(/.*?MSIE (\d\.\d).*/g,'$1')/1;\r
487         }       \r
488         // }}}          \r
489 }\r
490 \r
491 /************************************************************************************************************\r
492 *       DHTML menu model item class\r
493 *\r
494 *       Created:                                                October, 30th, 2006\r
495 *       @class Purpose of class:                Save data about a menu item.\r
496 *                       \r
497 *\r
498 *\r
499 *       Update log:\r
500 *\r
501 ************************************************************************************************************/\r
502 \r
503 DHTMLSuite.menuModelItem = function()\r
504 {\r
505         var id;                                 // id of this menu item.\r
506         var itemText;                   // Text for this menu item\r
507         var itemIcon;                   // Icon for this menu item.\r
508         var url;                                // url when click on this menu item\r
509         var parentId;                   // id of parent element\r
510         var separator;                  // is this menu item a separator\r
511         var jsFunction;                 // Js function to call onclick\r
512         var depth;                              // Depth of this menu item.\r
513         var hasSubs;                    // Does this menu item have sub items.\r
514         var type;                               // Menu item type - possible values: "top" or "sub". \r
515         var helpText;                   // Help text for this item - appear when you move your mouse over the item.\r
516         var state;\r
517         var submenuWidth;               // Width of sub menu items.\r
518         var visible;                    // Visibility of menu item.\r
519         var frameTarget;\r
520         \r
521         this.state = 'regular';\r
522 }\r
523 \r
524 DHTMLSuite.menuModelItem.prototype = {\r
525 \r
526         setMenuVars : function(id,itemText,itemIcon,url,parentId,helpText,jsFunction,type,submenuWidth,frameTarget)     \r
527         {\r
528                 this.id = id;\r
529                 this.itemText = itemText;\r
530                 this.itemIcon = itemIcon;\r
531                 this.url = url;\r
532                 this.parentId = parentId;\r
533                 this.jsFunction = jsFunction;\r
534                 this.separator = false;\r
535                 this.depth = false;\r
536                 this.hasSubs = false;\r
537                 this.helpText = helpText;\r
538                 this.submenuWidth = submenuWidth;\r
539                 this.visible = true;\r
540                 this.frameTarget = frameTarget;\r
541                 if(!type){\r
542                         if(this.parentId)this.type = 'top'; else this.type='sub';\r
543                 }else this.type = type;\r
544                 \r
545 \r
546         }\r
547         // }}}  \r
548         ,\r
549         // {{{ setState()\r
550     /**\r
551      *  Update the state attribute of a menu item.\r
552      *\r
553      *  @param String newState New state of this item\r
554      * @public  \r
555      */         \r
556         setAsSeparator : function(id,parentId)\r
557         {\r
558                 this.id = id;\r
559                 this.parentId = parentId;\r
560                 this.separator = true;  \r
561                 this.visible = true;\r
562                 if(this.parentId)this.type = 'top'; else this.type='sub';               \r
563         }\r
564         // }}}  \r
565         ,\r
566         // {{{ setState()\r
567     /**\r
568      *  Update the visible attribute of a menu item.\r
569      *\r
570      *  @param Boolean visible true = visible, false = hidden.\r
571      * @public  \r
572      */         \r
573         setVisibility : function(visible)\r
574         {\r
575                 this.visible = visible;\r
576         }\r
577         // }}}  \r
578         ,\r
579         // {{{ getState()\r
580     /**\r
581      *  Return the state attribute of a menu item.\r
582      *\r
583      * @public  \r
584      */         \r
585         getState : function()\r
586         {\r
587                 return this.state;\r
588         }\r
589         // }}}  \r
590         ,\r
591         // {{{ setState()\r
592     /**\r
593      *  Update the state attribute of a menu item.\r
594      *\r
595      *  @param String newState New state of this item\r
596      * @public  \r
597      */         \r
598         setState : function(newState)\r
599         {\r
600                 this.state = newState;\r
601         }\r
602         // }}}  \r
603         ,\r
604         // {{{ setSubMenuWidth()\r
605     /**\r
606      *  Specify width of direct subs of this item.\r
607      *\r
608      *  @param int newWidth Width of sub menu group(direct sub of this item)\r
609      * @public  \r
610      */         \r
611         setSubMenuWidth : function(newWidth)\r
612         {\r
613                 this.submenuWidth = newWidth;\r
614         }\r
615         // }}}  \r
616         ,\r
617         // {{{ setIcon()\r
618     /**\r
619      *  Specify new menu icon\r
620      *\r
621      *  @param String iconPath Path to new menu icon\r
622      * @public  \r
623      */         \r
624         setIcon : function(iconPath)\r
625         {\r
626                 this.itemIcon = iconPath;\r
627         }\r
628         // }}}  \r
629         ,\r
630         // {{{ setText()\r
631     /**\r
632      *  Specify new text for the menu item.\r
633      *\r
634      *  @param String newText New text for the menu item.\r
635      * @public  \r
636      */         \r
637         setText : function(newText)\r
638         {\r
639                 this.itemText = newText;\r
640         }\r
641 }\r
642 \r
643 /************************************************************************************************************\r
644 *       DHTML menu model class\r
645 *\r
646 *       Created:                                                October, 30th, 2006\r
647 *       @class Purpose of class:                Saves menu item data\r
648 *                       \r
649 *\r
650 *       Demos of this class:                    demo-menu-strip.html\r
651 *\r
652 *       Update log:\r
653 *\r
654 ************************************************************************************************************/\r
655 \r
656 \r
657 /**\r
658 * @constructor\r
659 * @class Purpose of class:      Organize menu items for different menu widgets. demos of menus: (<a href="../../demos/demo-menu-strip.html" target="_blank">Demo</a>)\r
660 * @version 1.0\r
661 * @author       Alf Magne Kalleland(www.dhtmlgoodies.com)\r
662 */\r
663 \r
664 \r
665 DHTMLSuite.menuModel = function()\r
666 {\r
667         var menuItems;                                  // Array of menuModelItem objects\r
668         var menuItemsOrder;                     // This array is needed in order to preserve the correct order of the array above. the array above is associative\r
669                                                                         // And some browsers will loop through that array in different orders than Firefox and IE.\r
670         var submenuType;                                // Direction of menu items(one item for each depth)\r
671         var mainMenuGroupWidth;                 // Width of menu group - useful if the first group of items are listed below each other\r
672         this.menuItems = new Array();\r
673         this.menuItemsOrder = new Array();\r
674         this.submenuType = new Array();\r
675         this.submenuType[1] = 'top';\r
676         for(var no=2;no<20;no++){\r
677                 this.submenuType[no] = 'sub';\r
678         }               \r
679         if(!standardObjectsCreated)DHTMLSuite.createStandardObjects();  \r
680 }\r
681 \r
682 DHTMLSuite.menuModel.prototype = {\r
683         // {{{ addItem()\r
684     /**\r
685      *  Add separator (special type of menu item)\r
686      *\r
687          *\r
688      *\r
689      *  @param int id of menu item\r
690      *  @param string itemText = text of menu item\r
691      *  @param string itemIcon = file name of menu icon(in front of menu text. Path will be imagePath for the DHTMLSuite + file name)\r
692      *  @param string url = Url of menu item\r
693      *  @param int parent id of menu item     \r
694      *  @param String jsFunction Name of javascript function to execute. It will replace the url param. The function with this name will be called and the element triggering the action will be \r
695      *                                  sent as argument. Name of the element which triggered the menu action may also be sent as a second argument. That depends on the widget. The context menu is an example where\r
696      *                                  the element triggering the context menu is sent as second argument to this function.    \r
697      *\r
698      * @public  \r
699      */                 \r
700         addItem : function(id,itemText,itemIcon,url,parentId,helpText,jsFunction,type,submenuWidth)\r
701         {\r
702                 if(!id)id = this.__getUniqueId();       // id not present - create it dynamically.\r
703                 this.menuItems[id] = new DHTMLSuite.menuModelItem();\r
704                 this.menuItems[id].setMenuVars(id,itemText,itemIcon,url,parentId,helpText,jsFunction,type,submenuWidth);\r
705                 this.menuItemsOrder[this.menuItemsOrder.length] = id;\r
706                 return this.menuItems[id];\r
707         }\r
708         ,\r
709         // {{{ addItemsFromMarkup()\r
710     /**\r
711      *  This method creates all the menuModelItem objects by reading it from existing markup on your page.\r
712      *  Example of HTML markup:\r
713      *<br>\r
714                 &nbsp;&nbsp;&nbsp;&nbsp;&lt;ul id="menuModel">\r
715                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="50000" itemIcon="../images/disk.gif">&lt;a href="#" title="Open the file menu">File&lt;/a>\r
716                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ul width="150">\r
717                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="500001" jsFunction="saveWork()" itemIcon="../images/disk.gif">&lt;a href="#" title="Save your work">Save&lt;/a>&lt;/li>\r
718                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="500002">&lt;a href="#">Save As&lt;/a>&lt;/li>\r
719                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="500004" itemType="separator">&lt;/li>\r
720                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="500003">&lt;a href="#">Open&lt;/a>&lt;/li>\r
721                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/ul>\r
722                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/li>\r
723                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="50001">&lt;a href="#">View&lt;/a>\r
724                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ul width="130">\r
725                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="500011">&lt;a href="#">Source&lt;/a>&lt;/li>\r
726                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="500012">&lt;a href="#">Debug info&lt;/a>&lt;/li>\r
727                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="500013">&lt;a href="#">Layout&lt;/a>\r
728                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ul width="150">\r
729                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="5000131">&lt;a href="#">CSS&lt;/a>&nbsp;&nbsp;\r
730                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="5000132">&lt;a href="#">HTML&lt;/a>&nbsp;&nbsp;\r
731                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="5000133">&lt;a href="#">Javascript&lt;/a>&nbsp;&nbsp;\r
732                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/ul>\r
733                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/li>\r
734                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\r
735                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/ul>\r
736                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/li>\r
737                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="50003" itemType="separator">&lt;/li>\r
738                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;li id="50002">&lt;a href="#">Tools&lt;/a>&lt;/li>\r
739                 <br>&nbsp;&nbsp;&nbsp;&nbsp;&lt;/ul>&nbsp;&nbsp;     \r
740      *\r
741      *  @param String ulId = ID of <UL> tag on your page.\r
742      *\r
743      * @public  \r
744      */         \r
745         addItemsFromMarkup : function(ulId)\r
746         {\r
747                 if(!document.getElementById(ulId)){\r
748                         alert('<UL> tag with id ' + ulId + ' does not exist');\r
749                         return;\r
750                 }\r
751                 var ulObj = document.getElementById(ulId);\r
752                 var liTags = ulObj.getElementsByTagName('LI');          \r
753                 for(var no=0;no<liTags.length;no++){    // Walking through all <li> tags in the <ul> tree\r
754                         \r
755                         var id = liTags[no].id.replace(/[^0-9]/gi,'');  // Get id of item.\r
756                         if(!id)id = this.__getUniqueId();\r
757                         this.menuItems[id] = new DHTMLSuite.menuModelItem();    // Creating new menuModelItem object\r
758                         this.menuItemsOrder[this.menuItemsOrder.length] = id;\r
759                         // Get the attributes for this new menu item.   \r
760                         \r
761                         var parentId = 0;       // Default parent id\r
762                         if(liTags[no].parentNode!=ulObj)parentId = liTags[no].parentNode.parentNode.id; // parent node exists, set parentId equal to id of parent <li>.\r
763                                                 \r
764                         /* Checking type */\r
765                         var type = liTags[no].getAttribute('itemType');                 \r
766                         if(!type)type = liTags[no].itemType;\r
767                         if(type=='separator'){  // Menu item of type "separator"\r
768                                 this.menuItems[id].setAsSeparator(id,parentId);\r
769                                 continue;       \r
770                         }\r
771                         if(parentId)type='sub'; else type = 'top';                                              \r
772         \r
773                         var aTag = liTags[no].getElementsByTagName('A')[0];     // Get a reference to sub <a> tag\r
774                         if(!aTag){\r
775                                 continue;\r
776                         }                       \r
777                         if(aTag)var itemText = aTag.innerHTML;  // Item text is set to the innerHTML of the <a> tag.\r
778                         var itemIcon = liTags[no].getAttribute('itemIcon');     // Item icon is set from the itemIcon attribute of the <li> tag.\r
779                         var url = aTag.href;    // url is set to the href attribute of the <a> tag\r
780                         if(url=='#' || url.substr(url.length-1,1)=='#')url='';  // # = empty url.\r
781       var frameTarget = aTag.target;\r
782                         \r
783                         var jsFunction = liTags[no].getAttribute('jsFunction'); // jsFunction is set from the jsFunction attribute of the <li> tag.\r
784 \r
785                         var submenuWidth = false;       // Not set from the <li> tag. \r
786                         var helpText = aTag.getAttribute('title');      \r
787                         if(!helpText)helpText = aTag.title;\r
788                         \r
789                         this.menuItems[id].setMenuVars(id,itemText,itemIcon,url,parentId,helpText,jsFunction,type,submenuWidth,frameTarget);                    \r
790                 }               \r
791                 var subUls = ulObj.getElementsByTagName('UL');\r
792                 for(var no=0;no<subUls.length;no++){\r
793                         var width = subUls[no].getAttribute('width');\r
794                         if(!width)width = subUls[no].width;     \r
795                         if(width){\r
796                                 var id = subUls[no].parentNode.id.replace(/[^0-9]/gi,'');\r
797                                 this.setSubMenuWidth(id,width);\r
798                         }\r
799                 }               \r
800                 ulObj.style.display='none';\r
801                 \r
802         }       \r
803         // }}}  \r
804         ,\r
805         // {{{ setSubMenuWidth()\r
806     /**\r
807      *  This method specifies the width of a sub menu group. This is a useful method in order to get a correct width in IE6 and prior.\r
808      *\r
809      *  @param int id = ID of parent menu item\r
810      *  @param String newWidth = Width of sub menu items.\r
811      * @public  \r
812      */         \r
813         setSubMenuWidth : function(id,newWidth)\r
814         {\r
815                 this.menuItems[id].setSubMenuWidth(newWidth);\r
816         }       \r
817         ,\r
818         // {{{ setMainMenuGroupWidth()\r
819     /**\r
820      *  Add separator (special type of menu item)\r
821      *\r
822      *  @param String newWidth = Size of a menu group\r
823      *  @param int parent id of menu item\r
824      * @public  \r
825      */                 \r
826         setMainMenuGroupWidth : function(newWidth)\r
827         {\r
828                 this.mainMenuGroupWidth = newWidth;\r
829         }\r
830         ,\r
831         // {{{ addSeparator()\r
832     /**\r
833      *  Add separator (special type of menu item)\r
834      *\r
835      *  @param int parent id of menu item\r
836      * @public  \r
837      */         \r
838         addSeparator : function(parentId)\r
839         {\r
840                 id = this.__getUniqueId();      // Get unique id\r
841                 if(!parentId)parentId = 0;\r
842                 this.menuItems[id] = new DHTMLSuite.menuModelItem();\r
843                 this.menuItems[id].setAsSeparator(id,parentId);\r
844                 this.menuItemsOrder[this.menuItemsOrder.length] = id;\r
845                 return this.menuItems[id];\r
846         }       \r
847         ,\r
848         // {{{ init()\r
849     /**\r
850      *  Initilizes the menu model. This method should be called when all items has been added to the model.\r
851      *\r
852      *\r
853      * @public  \r
854      */         \r
855         init : function()\r
856         {\r
857                 this.__getDepths();     \r
858                 this.__setHasSubs();    \r
859                 \r
860         }\r
861         // }}}  \r
862         ,\r
863         // {{{ setMenuItemVisibility()\r
864     /**\r
865      *  Save visibility of a menu item.\r
866      *  \r
867      *  @param int id = Id of menu item..\r
868      *  @param Boolean visible = Visibility of menu item.\r
869      *\r
870      * @public  \r
871      */         \r
872         setMenuItemVisibility : function(id,visible)\r
873         {\r
874                 this.menuItems[id].setVisibility(visible);              \r
875         }\r
876         // }}}\r
877         ,\r
878         // {{{ setSubMenuType()\r
879     /**\r
880      *  Set menu type for a specific menu depth.\r
881      *  \r
882      *  @param int depth = 1 = Top menu, 2 = Sub level 1...\r
883      *  @param String newType = New menu type(possible values: "top" or "sub")\r
884      *\r
885      * @private \r
886      */         \r
887         setSubMenuType : function(depth,newType)\r
888         {\r
889                 this.submenuType[depth] = newType;      \r
890                 \r
891         }\r
892         // }}}          \r
893         ,\r
894         // {{{ __getDepths()\r
895     /**\r
896      *  Create variable for the depth of each menu item.\r
897      *  \r
898      *\r
899      * @private \r
900      */         \r
901         getItems : function(parentId,returnArray)\r
902         {\r
903                 if(!parentId)return this.menuItems;\r
904                 if(!returnArray)returnArray = new Array();\r
905                 for(var no=0;no<this.menuItemsOrder.length;no++){\r
906                         var id = this.menuItemsOrder[no];\r
907                         if(!id)continue;\r
908                         if(this.menuItems[id].parentId==parentId){\r
909                                 returnArray[returnArray.length] = this.menuItems[id];\r
910                                 if(this.menuItems[id].hasSubs)return this.getItems(this.menuItems[id].id,returnArray);\r
911                         }\r
912                 }\r
913                 return returnArray;\r
914                 \r
915         }\r
916         // }}}\r
917         ,\r
918         // {{{ __getUniqueId()\r
919     /**\r
920      *  Returns a unique id for a menu item. This method is used by the addSeparator function in case an id isn't sent to the method.\r
921      *  \r
922      *\r
923      * @private \r
924      */         \r
925         __getUniqueId : function()\r
926         {\r
927                 var num = Math.random() + '';\r
928                 num = num.replace('.','');      \r
929                 num = '99' + num;               \r
930                 num = num /1;           \r
931                 while(this.menuItems[num]){\r
932                         num = Math.random() + '';\r
933                         num = num.replace('.','');      \r
934                         num = num /1;                           \r
935                 }\r
936                 return num;\r
937         }\r
938         // }}}  \r
939         ,\r
940         // {{{ __getDepths()\r
941     /**\r
942      *  Create variable for the depth of each menu item.\r
943      *  \r
944      *\r
945      * @private \r
946      */ \r
947     __getDepths : function()\r
948     {           \r
949         for(var no=0;no<this.menuItemsOrder.length;no++){\r
950                 var id = this.menuItemsOrder[no];\r
951                 if(!id)continue;\r
952                 this.menuItems[id].depth = 1;\r
953                 if(this.menuItems[id].parentId){\r
954                         this.menuItems[id].depth = this.menuItems[this.menuItems[id].parentId].depth+1;    \r
955         \r
956                 }  \r
957                 this.menuItems[id].type = this.submenuType[this.menuItems[id].depth];   // Save menu direction for this menu item.              \r
958         }       \r
959     }   \r
960     // }}}\r
961     ,       \r
962     // {{{ __setHasSubs()\r
963     /**\r
964      *  Create variable for the depth of each menu item.\r
965      *  \r
966      *\r
967      * @private \r
968      */ \r
969     __setHasSubs : function()\r
970     {           \r
971         for(var no=0;no<this.menuItemsOrder.length;no++){\r
972                 var id = this.menuItemsOrder[no];\r
973                 if(!id)continue;                \r
974                 if(this.menuItems[id].parentId){\r
975                         this.menuItems[this.menuItems[id].parentId].hasSubs = 1;\r
976                         \r
977                 }               \r
978         }       \r
979     }   \r
980     // }}}\r
981     ,\r
982         // {{{ __hasSubs()\r
983     /**\r
984      *  Does a menu item have sub elements ?\r
985      *  \r
986      *\r
987      * @private \r
988      */ \r
989         // }}}  \r
990         __hasSubs : function(id)\r
991         {\r
992                 for(var no=0;no<this.menuItemsOrder.length;no++){\r
993                         var id = this.menuItemsOrder[no];\r
994                         if(!id)continue;\r
995                         if(this.menuItems[id].parentId==id)return true;         \r
996                 }\r
997                 return false;   \r
998         }\r
999         // }}}\r
1000         ,\r
1001         // {{{ __deleteChildNodes()\r
1002     /**\r
1003      *  Deleting child nodes of a specific parent id\r
1004      *  \r
1005      *  @param int parentId\r
1006      *\r
1007      * @private \r
1008      */ \r
1009         // }}}          \r
1010         __deleteChildNodes : function(parentId,recursive)\r
1011         {\r
1012                 var itemsToDeleteFromOrderArray = new Array();\r
1013                 for(var prop=0;prop<this.menuItemsOrder.length;prop++){\r
1014                 var id = this.menuItemsOrder[prop];\r
1015                 if(!id)continue;    \r
1016                                         \r
1017                         if(this.menuItems[id].parentId==parentId && parentId){\r
1018                                 this.menuItems[id] = false;\r
1019                                 itemsToDeleteFromOrderArray[itemsToDeleteFromOrderArray.length] = id;                           \r
1020                                 this.__deleteChildNodes(id,true);       // Recursive call.\r
1021                         }       \r
1022                 }       \r
1023                 \r
1024                 if(!recursive){\r
1025                         for(var prop=0;prop<itemsToDeleteFromOrderArray;prop++){\r
1026                                 if(!itemsToDeleteFromOrderArray[prop])continue;\r
1027                                 this.__deleteItemFromItemOrderArray(itemsToDeleteFromOrderArray[prop]);\r
1028                         }\r
1029                 }\r
1030                 this.__setHasSubs();\r
1031         }\r
1032         // }}}\r
1033         ,\r
1034         // {{{ __deleteANode()\r
1035     /**\r
1036      *  Deleting a specific node from the menu model\r
1037      *  \r
1038      *  @param int id = Id of node to delete.\r
1039      *\r
1040      * @private \r
1041      */ \r
1042         // }}}          \r
1043         __deleteANode : function(id)\r
1044         {\r
1045                 this.menuItems[id] = false;     \r
1046                 this.__deleteItemFromItemOrderArray(id);        \r
1047         }\r
1048         ,\r
1049         // {{{ __deleteItemFromItemOrderArray()\r
1050     /**\r
1051      *  Deleting a specific node from the menuItemsOrder array(The array controlling the order of the menu items).\r
1052      *  \r
1053      *  @param int id = Id of node to delete.\r
1054      *\r
1055      * @private \r
1056      */ \r
1057         // }}}          \r
1058         __deleteItemFromItemOrderArray : function(id)\r
1059         {\r
1060                 for(var no=0;no<this.menuItemsOrder.length;no++){\r
1061                         var tmpId = this.menuItemsOrder[no];\r
1062                         if(!tmpId)continue;\r
1063                         if(this.menuItemsOrder[no]==id){\r
1064                                 this.menuItemsOrder.splice(no,1);\r
1065                                 return;\r
1066                         }\r
1067                 }\r
1068                 \r
1069         }\r
1070         // }}}\r
1071         ,       \r
1072         // {{{ __appendMenuModel()\r
1073     /**\r
1074      *  Replace the sub items of a menu item with items from a new menuModel.\r
1075      *  \r
1076      *  @param menuModel newModel = An object of class menuModel - the items of this menu model will be appended to the existing menu items.\r
1077      *  @param Int parentId = Id of parent element of the appended items.\r
1078      *\r
1079      * @private \r
1080      */ \r
1081         // }}}          \r
1082         __appendMenuModel : function(newModel,parentId)\r
1083         {\r
1084                 if(!newModel)return;\r
1085                 var items = newModel.getItems();\r
1086                 for(var no=0;no<newModel.menuItemsOrder.length;no++){\r
1087                         var id = newModel.menuItemsOrder[no];\r
1088                         if(!id)continue;\r
1089                         if(!items[id].parentId)items[id].parentId = parentId;\r
1090                         this.menuItems[id] = items[id]; \r
1091                         for(var no2=0;no2<this.menuItemsOrder.length;no2++){    // Check to see if this item allready exists in the menuItemsOrder array, if it does, remove it. \r
1092                                 if(!this.menuItemsOrder[no2])continue;\r
1093                                 if(this.menuItemsOrder[no2]==items[id].id){\r
1094                                         this.menuItemsOrder.splice(no2,1);\r
1095                                 }\r
1096                         }\r
1097                         this.menuItemsOrder[this.menuItemsOrder.length] = items[id].id;         \r
1098                 }\r
1099                 this.__getDepths();             \r
1100                 this.__setHasSubs();            \r
1101         }\r
1102         // }}}\r
1103 }\r
1104 \r
1105 /* Class for menu items - a view */\r
1106 \r
1107 /************************************************************************************************************\r
1108 *       DHTML menu item class\r
1109 *\r
1110 *       Created:                                                October, 21st, 2006\r
1111 *       @class Purpose of class:                Creates the HTML for a single menu item.\r
1112 *                       \r
1113 *       Css files used by this script:  menu-item.css\r
1114 *\r
1115 *       Demos of this class:                    demo-menu-strip.html\r
1116 *\r
1117 *       Update log:\r
1118 *\r
1119 ************************************************************************************************************/\r
1120 \r
1121 /**\r
1122 * @constructor\r
1123 * @class Purpose of class:      Creates the div(s) for a menu item. This class is used by the menuBar class. You can \r
1124 *       also create a menu item and add it where you want on your page. the createItem() method will return the div\r
1125 *       for the item. You can use the appendChild() method to add it to your page. \r
1126 *\r
1127 * @version 1.0\r
1128 * @author       Alf Magne Kalleland(www.dhtmlgoodies.com)\r
1129 */\r
1130 \r
1131 \r
1132 DHTMLSuite.menuItem = function()\r
1133 {\r
1134         var layoutCSS;  \r
1135         var divElement;                                                 // the <div> element created for this menu item\r
1136         var expandElement;                                              // Reference to the arrow div (expand sub items)\r
1137         var cssPrefix;                                                  // Css prefix for the menu items.\r
1138         var modelItemRef;                                               // Reference to menuModelItem\r
1139 \r
1140         this.layoutCSS = 'menu-item.css';\r
1141         this.cssPrefix = 'DHTMLSuite_';\r
1142         \r
1143         if(!standardObjectsCreated)DHTMLSuite.createStandardObjects();  \r
1144                 \r
1145         \r
1146         var objectIndex;\r
1147         this.objectIndex = DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects.length;\r
1148 \r
1149         \r
1150 }\r
1151 \r
1152 DHTMLSuite.menuItem.prototype = \r
1153 {\r
1154         \r
1155         /*\r
1156         *       Create a menu item.\r
1157         *\r
1158         *       @param menuModelItem menuModelItemObj = An object of class menuModelItem\r
1159         */\r
1160         createItem : function(menuModelItemObj)\r
1161         {\r
1162                 DHTMLSuite.commonObj.loadCSS(this.layoutCSS);   // Load css\r
1163                 \r
1164                 DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[this.objectIndex] = this;\r
1165                         \r
1166                 this.modelItemRef = menuModelItemObj;\r
1167                 this.divElement = document.createElement('DIV');        // Create main div\r
1168                 this.divElement.id = 'DHTMLSuite_menuItem' + menuModelItemObj.id;       // Giving this menu item it's unque id\r
1169                 this.divElement.className = this.cssPrefix + 'menuItem_' + menuModelItemObj.type + '_regular'; \r
1170                 this.divElement.onselectstart = function() { return DHTMLSuite.commonObj.cancelEvent(false,this) };\r
1171                 if(menuModelItemObj.helpText){  // Add "title" attribute to the div tag if helpText is defined\r
1172                         this.divElement.title = menuModelItemObj.helpText;\r
1173                 }\r
1174                 \r
1175                 // Menu item of type "top"\r
1176                 if(menuModelItemObj.type=='top'){                       \r
1177                         this.__createMenuElementsOfTypeTop(this.divElement);\r
1178                 }\r
1179 \r
1180                 if(menuModelItemObj.type=='sub'){\r
1181                         this.__createMenuElementsOfTypeSub(this.divElement);\r
1182                 }\r
1183                 \r
1184                 if(menuModelItemObj.separator){\r
1185                         this.divElement.className = this.cssPrefix + 'menuItem_separator_' + menuModelItemObj.type;\r
1186                         this.divElement.innerHTML = '<span></span>';\r
1187                 }else{          \r
1188                         /* Add events */\r
1189                         var tmpVar = this.objectIndex/1;\r
1190                         this.divElement.onclick = function(e) { DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[tmpVar].__navigate(e); }\r
1191                         this.divElement.onmousedown = this.__clickMenuItem;                     // on mouse down effect\r
1192                         this.divElement.onmouseup = this.__rolloverMenuItem;            // on mouse up effect\r
1193                         this.divElement.onmouseover = this.__rolloverMenuItem;          // mouse over effect\r
1194                         this.divElement.onmouseout = this.__rolloutMenuItem;            // mouse out effect.\r
1195                         DHTMLSuite.commonObj.__addEventElement(this.divElement);\r
1196                 }\r
1197                 return this.divElement;\r
1198         }\r
1199         // }}}\r
1200         ,\r
1201         // {{{ setLayoutCss()\r
1202     /**\r
1203      *  Creates the different parts of a menu item of type "top".\r
1204      *\r
1205      *  @param String newLayoutCss = Name of css file used for the menu items.\r
1206      *\r
1207      * @public  \r
1208      */         \r
1209         setLayoutCss : function(newLayoutCss)\r
1210         {\r
1211                 this.layoutCSS = newLayoutCss;\r
1212                 \r
1213         }\r
1214         // }}}\r
1215         ,\r
1216         // {{{ __createMenuElementsOfTypeTop()\r
1217     /**\r
1218      *  Creates the different parts of a menu item of type "top".\r
1219      *\r
1220      *  @param menuModelItem menuModelItemObj = Object of type menuModelItemObj\r
1221      *  @param Object parentEl = Reference to parent element\r
1222      *\r
1223      * @private \r
1224      */         \r
1225         __createMenuElementsOfTypeTop : function(parentEl){\r
1226                 if(this.modelItemRef.itemIcon){\r
1227                         var iconDiv = document.createElement('DIV');\r
1228                         iconDiv.innerHTML = '<img src="' + this.modelItemRef.itemIcon + '">';\r
1229                         iconDiv.id = 'menuItemIcon' + this.modelItemRef.id\r
1230                         parentEl.appendChild(iconDiv);          \r
1231                 }\r
1232                 if(this.modelItemRef.itemText){\r
1233                         var div = document.createElement('DIV');\r
1234                         div.innerHTML = this.modelItemRef.itemText;     \r
1235                         div.className = this.cssPrefix + 'menuItem_textContent';\r
1236                         div.id = 'menuItemText' + this.modelItemRef.id; \r
1237                         parentEl.appendChild(div);\r
1238                 }\r
1239                 /* Create div for the arrow -> Show sub items */\r
1240                 var div = document.createElement('DIV');\r
1241                 div.className = this.cssPrefix + 'menuItem_top_arrowShowSub';\r
1242                 div.id = 'DHTMLSuite_menuBar_arrow' + this.modelItemRef.id;\r
1243                 parentEl.appendChild(div);\r
1244                 this.expandElement = div;\r
1245                 if(!this.modelItemRef.hasSubs)div.style.display='none';\r
1246                                 \r
1247         }\r
1248         // }}}\r
1249         ,       \r
1250         \r
1251         // {{{ __createMenuElementsOfTypeSub()\r
1252     /**\r
1253      *  Creates the different parts of a menu item of type "sub".\r
1254      *\r
1255      *  @param menuModelItem menuModelItemObj = Object of type menuModelItemObj\r
1256      *  @param Object parentEl = Reference to parent element\r
1257      *\r
1258      * @private \r
1259      */         \r
1260         __createMenuElementsOfTypeSub : function(parentEl){             \r
1261                 if(this.modelItemRef.itemIcon){\r
1262                         parentEl.style.backgroundImage = 'url(\'' + this.modelItemRef.itemIcon + '\')'; \r
1263                         parentEl.style.backgroundRepeat = 'no-repeat';\r
1264                         parentEl.style.backgroundPosition = 'left center';      \r
1265                 }\r
1266                 if(this.modelItemRef.itemText){\r
1267                         var div = document.createElement('DIV');\r
1268                         div.className = 'DHTMLSuite_textContent';\r
1269                         div.innerHTML = this.modelItemRef.itemText;     \r
1270                         div.className = this.cssPrefix + 'menuItem_textContent';\r
1271                         div.id = 'menuItemText' + this.modelItemRef.id;\r
1272                         parentEl.appendChild(div);\r
1273                 }\r
1274                 \r
1275                 /* Create div for the arrow -> Show sub items */\r
1276                 var div = document.createElement('DIV');\r
1277                 div.className = this.cssPrefix + 'menuItem_sub_arrowShowSub';\r
1278                 parentEl.appendChild(div);              \r
1279                 div.id = 'DHTMLSuite_menuBar_arrow' + this.modelItemRef.id;\r
1280                 this.expandElement = div;\r
1281                 \r
1282                 if(!this.modelItemRef.hasSubs){\r
1283                         div.style.display='none';       \r
1284                 }else{\r
1285                         div.previousSibling.style.paddingRight = '15px';\r
1286                 }       \r
1287         }\r
1288         // }}}\r
1289         ,\r
1290         // {{{ setCssPrefix()\r
1291     /**\r
1292      *  Set css prefix for the menu item. default is 'DHTMLSuite_'. This is useful in case you want to have different menus on a page with different layout.\r
1293      *\r
1294      *  @param String cssPrefix = New css prefix. \r
1295      *\r
1296      * @public  \r
1297      */         \r
1298         setCssPrefix : function(cssPrefix)\r
1299         {\r
1300                 this.cssPrefix = cssPrefix;\r
1301         }\r
1302         // }}}\r
1303         ,\r
1304         // {{{ setMenuIcon()\r
1305     /**\r
1306      *  Replace menu icon.\r
1307      *\r
1308      *  @param String newPath - Path to new icon (false if no icon);\r
1309      *\r
1310      * @public  \r
1311      */         \r
1312         setIcon : function(newPath)\r
1313         {\r
1314                 this.modelItemRef.setIcon(newPath);\r
1315                 if(this.modelItemRef.type=='top'){      // Menu item is of type "top"\r
1316                         var div = document.getElementById('menuItemIcon' + this.modelItemRef.id);       // Get a reference to the div where the icon is located.\r
1317                         var img = div.getElementsByTagName('IMG')[0];   // Find the image\r
1318                         if(!img){       // Image doesn't exists ?\r
1319                                 img = document.createElement('IMG');    // Create new image\r
1320                                 div.appendChild(img);\r
1321                         }\r
1322                         img.src = newPath;      // Set image path\r
1323                         if(!newPath)img.parentNode.removeChild(img);    // No newPath defined, remove the image.                        \r
1324                 }\r
1325                 if(this.modelItemRef.type=='sub'){      // Menu item is of type "sub"\r
1326                         this.divElement.style.backgroundImage = 'url(\'' + newPath + '\')';             // Set backgroundImage for the main div(i.e. menu item div)     \r
1327                 }               \r
1328         }\r
1329         // }}}\r
1330         ,\r
1331         // {{{ setText()\r
1332     /**\r
1333      *  Replace the text of a menu item\r
1334      *\r
1335      *  @param String newText - New text for the menu item.\r
1336      *\r
1337      * @public  \r
1338      */         \r
1339         setText : function(newText)\r
1340         {\r
1341                 this.modelItemRef.setText(newText);\r
1342                 document.getElementById('menuItemText' + this.modelItemRef.id).innerHTML = newText;\r
1343                 \r
1344                 \r
1345         }\r
1346         \r
1347         // }}}\r
1348         ,\r
1349         // {{{ __clickMenuItem()\r
1350     /**\r
1351      *  Effect - click on menu item\r
1352      *\r
1353      *\r
1354      * @private \r
1355      */         \r
1356         __clickMenuItem : function()\r
1357         {\r
1358                 this.className = this.className.replace('_regular','_click');\r
1359                 this.className = this.className.replace('_over','_click');\r
1360         }\r
1361         // }}}  \r
1362         ,       \r
1363         // {{{ __rolloverMenuItem()\r
1364     /**\r
1365      *  Roll over effect\r
1366      *\r
1367      *\r
1368      * @private \r
1369      */         \r
1370         __rolloverMenuItem : function()\r
1371         {\r
1372                 this.className = this.className.replace('_regular','_over');\r
1373                 this.className = this.className.replace('_click','_over');\r
1374         }       \r
1375         // }}}\r
1376         ,       \r
1377         // {{{ __rolloutMenuItem()\r
1378     /**\r
1379      *  Roll out effect\r
1380      *\r
1381      *\r
1382      * @private \r
1383      */         \r
1384         __rolloutMenuItem : function()\r
1385         {\r
1386                 this.className = this.className.replace('_over','_regular');\r
1387                 \r
1388         }\r
1389         // }}}\r
1390         ,       \r
1391         // {{{ setState()\r
1392     /**\r
1393      *  Set state of a menu item.\r
1394      *\r
1395      *  @param String newState = New state for the menu item\r
1396      *\r
1397      * @public  \r
1398      */         \r
1399         setState : function(newState)\r
1400         {\r
1401                 this.divElement.className = this.cssPrefix + 'menuItem_' + this.modelItemRef.type + '_' + newState;             \r
1402                 this.modelItemRef.setState(newState);\r
1403         }\r
1404         // }}}\r
1405         ,\r
1406         // {{{ getState()\r
1407     /**\r
1408      *  Return state of a menu item. \r
1409      *\r
1410      *\r
1411      * @public  \r
1412      */         \r
1413         getState : function()\r
1414         {\r
1415                 var state = this.modelItemRef.getState();\r
1416                 if(!state){\r
1417                         if(this.divElement.className.indexOf('_over')>=0)state = 'over';        \r
1418                         if(this.divElement.className.indexOf('_click')>=0)state = 'click';      \r
1419                         this.modelItemRef.setState(state);              \r
1420                 }\r
1421                 return state;\r
1422         }       \r
1423         // }}}\r
1424         ,\r
1425         // {{{ __setHasSub()\r
1426     /**\r
1427      *  Update the item, i.e. show/hide the arrow if the element has subs or not. \r
1428      *\r
1429      *\r
1430      * @private \r
1431      */ \r
1432     __setHasSub : function(hasSubs)\r
1433     {\r
1434         this.modelItemRef.hasSubs = hasSubs;\r
1435         if(!hasSubs){\r
1436                 document.getElementById(this.cssPrefix +'menuBar_arrow' + this.modelItemRef.id).style.display='none';                   \r
1437         }else{\r
1438                 document.getElementById(this.cssPrefix +'menuBar_arrow' + this.modelItemRef.id).style.display='block';\r
1439         }       \r
1440     }\r
1441     // }}}      \r
1442     ,\r
1443         // {{{ hide()\r
1444     /**\r
1445      *  Hide the menu item.\r
1446      *\r
1447      *\r
1448      * @public  \r
1449      */     \r
1450     hide : function()\r
1451     {\r
1452         this.modelItemRef.setVisibility(false);\r
1453         this.divElement.style.display='none';           \r
1454     }    \r
1455     ,\r
1456         // {{{ show()\r
1457     /**\r
1458      *  Show the menu item.\r
1459      *\r
1460      *\r
1461      * @public  \r
1462      */      \r
1463     show : function()\r
1464     {\r
1465         this.modelItemRef.setVisibility(true);\r
1466         this.divElement.style.display='block';          \r
1467     }    \r
1468         // }}}\r
1469         ,\r
1470         // {{{ __hideGroup()\r
1471     /**\r
1472      *  Hide the group the menu item is a part of. Example: if we're dealing with menu item 2.1, hide the group for all sub items of 2\r
1473      *\r
1474      *\r
1475      * @private \r
1476      */                 \r
1477         __hideGroup : function()\r
1478         {               \r
1479                 if(this.modelItemRef.parentId){\r
1480                         this.divElement.parentNode.style.visibility='hidden';   \r
1481                         if(DHTMLSuite.clientInfoObj.isMSIE){\r
1482                                 try{\r
1483                                         var tmpId = this.divElement.parentNode.id.replace(/[^0-9]/gi,'');\r
1484                                         document.getElementById('DHTMLSuite_menuBarIframe_' + tmpId).style.visibility = 'hidden';\r
1485                                 }catch(e){\r
1486                                         // IFRAME hasn't been created.\r
1487                                 }       \r
1488                         }\r
1489                 }       \r
1490 \r
1491         }\r
1492         // }}}  \r
1493         ,\r
1494         // {{{ __navigate()\r
1495     /**\r
1496      *  Navigate after click on a menu item.\r
1497      *\r
1498      *\r
1499      * @private \r
1500      */         \r
1501         __navigate : function(e)\r
1502         {\r
1503                 /* Check to see if the expand sub arrow is clicked. if it is, we shouldn't navigate from this click */\r
1504                 if(document.all)e = event;\r
1505                 if(e){\r
1506                         var srcEl = DHTMLSuite.commonObj.getSrcElement(e);\r
1507                         if(srcEl.id.indexOf('arrow')>=0)return;\r
1508                 }\r
1509                 if(this.modelItemRef.state=='disabled')return;\r
1510                 if(this.modelItemRef.url){\r
1511       if (this.modelItemRef.frameTarget == 'main_window')\r
1512         window.main_window.location = this.modelItemRef.url;\r
1513       else if (this.modelItemRef.frameTarget == '_top')\r
1514         window.location = this.modelItemRef.url;\r
1515       else if (this.modelItemRef.frameTarget)\r
1516         window.open(this.modelItemRef.url);\r
1517       else\r
1518         location.href = this.modelItemRef.url;\r
1519                 }\r
1520                 if(this.modelItemRef.jsFunction){\r
1521                         try{\r
1522                                 eval(this.modelItemRef.jsFunction);\r
1523                         }catch(e){\r
1524                                 alert('Defined Javascript code for the menu item( ' + this.modelItemRef.jsFunction + ' ) cannot be executed');\r
1525                         }\r
1526                 }\r
1527         }\r
1528 }\r
1529 \r
1530 \r
1531 /************************************************************************************************************\r
1532 *       DHTML menu bar class\r
1533 *\r
1534 *       Created:                                                October, 21st, 2006\r
1535 *       @class Purpose of class:                Creates a top bar menu\r
1536 *                       \r
1537 *       Css files used by this script:  menu-bar.css\r
1538 *\r
1539 *       Demos of this class:                    demo-menu-bar.html\r
1540 *\r
1541 *       Update log:\r
1542 *\r
1543 ************************************************************************************************************/\r
1544 \r
1545 \r
1546 /**\r
1547 * @constructor\r
1548 * @class Purpose of class:      Creates a top bar menu strip. Demos: <br>\r
1549 *       <ul>\r
1550 *       <li>(<a href="../../demos/demo-menu-bar-2.html" target="_blank">A menu with a detailed description on how it is created</a>)</li>\r
1551 *       <li>(<a href="../../demos/demo-menu-bar.html" target="_blank">Demo with lots of menus on the same page</a>)</li>\r
1552 *       <li>(<a href="../../demos/demo-menu-bar-custom-css.html" target="_blank">Two menus with different layout</a>)</li>\r
1553 *       <li>(<a href="../../demos/demo-menu-bar-custom-css-file.html" target="_blank">One menu with custom layout/css.</a>)</li>\r
1554 *       </ul>\r
1555 *\r
1556 *       <a href="../images/menu-bar-1.gif" target="_blank">Image describing the classes</a> <br><br>\r
1557 *\r
1558 * @version 1.0\r
1559 * @author       Alf Magne Kalleland(www.dhtmlgoodies.com)\r
1560 */\r
1561 \r
1562 DHTMLSuite.menuBar = function()\r
1563 {\r
1564         var menuItemObj;\r
1565         var layoutCSS;                                  // Name of css file\r
1566         var menuBarBackgroundImage;             // Name of background image\r
1567         var menuItem_objects;                   // Array of menu items - html elements.\r
1568         var menuBarObj;                                 // Reference to the main dib\r
1569         var menuBarHeight;\r
1570         var menuItems;                                  // Reference to objects of class menuModelItem\r
1571         var highlightedItems;                   // Array of currently highlighted menu items.\r
1572         var menuBarState;                               // Menu bar state - true or false - 1 = expand items on mouse over\r
1573         var activeSubItemsOnMouseOver;  // Activate sub items on mouse over     (instead of onclick)\r
1574         \r
1575 \r
1576         var submenuGroups;                              // Array of div elements for the sub menus\r
1577         var submenuIframes;                             // Array of sub menu iframes used to cover select boxes in old IE browsers.\r
1578         var createIframesForOldIeBrowsers;      // true if we want the script to create iframes in order to cover select boxes in older ie browsers.\r
1579         var targetId;                                   // Id of element where the menu will be inserted.\r
1580         var menuItemCssPrefix;                  // Css prefix of menu items.\r
1581         var cssPrefix;                                  // Css prefix for the menu bar\r
1582         var menuItemLayoutCss;                  // Css path for the menu items of this menu bar\r
1583         var globalObjectIndex;                  // Global index of this object - used to refer to the object of this class outside\r
1584         this.cssPrefix = 'DHTMLSuite_';\r
1585         this.menuItemLayoutCss = false; // false = use default for the menuItem class.\r
1586         this.layoutCSS = 'menu-bar.css';\r
1587         this.menuBarBackgroundImage = 'menu_strip_bg.jpg';\r
1588         this.menuItem_objects = new Array();\r
1589         DHTMLSuite.variableStorage.menuBar_highlightedItems = new Array();\r
1590         \r
1591         this.menuBarState = false;\r
1592         \r
1593         this.menuBarObj = false;\r
1594         this.menuBarHeight = 26;\r
1595         this.submenuGroups = new Array();\r
1596         this.submenuIframes = new Array();\r
1597         this.targetId = false;\r
1598         this.activeSubItemsOnMouseOver = false;\r
1599         this.menuItemCssPrefix = false;\r
1600         this.createIframesForOldIeBrowsers = true;\r
1601         if(!standardObjectsCreated)DHTMLSuite.createStandardObjects();  \r
1602         \r
1603         \r
1604 }\r
1605 \r
1606 \r
1607 \r
1608 \r
1609 \r
1610 DHTMLSuite.menuBar.prototype = {        \r
1611         \r
1612         // {{{ init()\r
1613     /**\r
1614      *  Initilizes the script\r
1615      *\r
1616      *\r
1617      * @public  \r
1618      */                                 \r
1619         init : function()\r
1620         {\r
1621                 \r
1622                 DHTMLSuite.commonObj.loadCSS(this.layoutCSS);   \r
1623                 this.__createDivs();    // Create general divs\r
1624                 this.__createMenuItems();       // Create menu items\r
1625                 this.__setBasicEvents();        // Set basic events.\r
1626                 window.refToThismenuBar = this;\r
1627         }\r
1628         // }}}\r
1629         ,\r
1630         // {{{ setTarget()\r
1631     /**\r
1632      *  Specify where this menu bar will be inserted. the element with this id will be parent of the menu bar.\r
1633      *\r
1634      *  @param String targetId = Id of element where the menu will be inserted. \r
1635      *\r
1636      * @public  \r
1637      */         \r
1638         setTarget : function(targetId)\r
1639         {\r
1640                 this.targetId = targetId;               \r
1641                 \r
1642         }       \r
1643         // }}}  \r
1644         ,\r
1645         // {{{ setLayoutCss()\r
1646     /**\r
1647      *  Specify the css file for this menu bar\r
1648      *\r
1649      *  @param String layoutCSS = Name of new css file. \r
1650      *\r
1651      * @public  \r
1652      */         \r
1653         setLayoutCss : function(layoutCSS)\r
1654         {\r
1655                 this.layoutCSS = layoutCSS;             \r
1656                 \r
1657         }       \r
1658         // }}}\r
1659         ,       \r
1660         // {{{ setMenuItemLayoutCss()\r
1661     /**\r
1662      *  Specify the css file for the menu items\r
1663      *\r
1664      *  @param String layoutCSS = Name of new css file. \r
1665      *\r
1666      * @public  \r
1667      */         \r
1668         setMenuItemLayoutCss : function(layoutCSS)\r
1669         {\r
1670                 this.menuItemLayoutCss = layoutCSS;             \r
1671                 \r
1672         }       \r
1673         // }}}\r
1674         ,       \r
1675         // {{{ setCreateIframesForOldIeBrowsers()\r
1676     /**\r
1677      *  This method specifies if you want to the script to create iframes behind sub menu groups in order to cover eventual select boxes. This\r
1678      *  can be needed if you have users with older IE browsers(prior to version 7) and when there's a chance that a sub menu could appear on top\r
1679      *  of a select box.\r
1680      *\r
1681      *  @param Boolean createIframesForOldIeBrowsers = true if you want the script to create iframes to cover select boxes in older ie browsers.\r
1682      *\r
1683      * @public  \r
1684      */         \r
1685         setCreateIframesForOldIeBrowsers : function(createIframesForOldIeBrowsers)\r
1686         {\r
1687                 this.createIframesForOldIeBrowsers = createIframesForOldIeBrowsers;             \r
1688                 \r
1689         }       \r
1690         // }}}\r
1691         ,\r
1692         // {{{ addMenuItems()\r
1693     /**\r
1694      *  Add menu items\r
1695      *\r
1696      *  @param DHTMLSuite.menuModel menuModel Object of class DHTMLSuite.menuModel which holds menu data        \r
1697      *\r
1698      * @public  \r
1699      */                 \r
1700         addMenuItems : function(menuItemObj)\r
1701         {\r
1702                 this.menuItemObj = menuItemObj; \r
1703                 this.menuItems = menuItemObj.getItems();\r
1704         }\r
1705         // }}}\r
1706         ,\r
1707         // {{{ setActiveSubItemsOnMouseOver()\r
1708     /**\r
1709      *   Specify if sub menus should be activated on mouse over(i.e. no matter what the menuState property is).         \r
1710      *\r
1711      *  @param Boolean activateSubOnMouseOver - Specify if sub menus should be activated on mouse over(i.e. no matter what the menuState property is).\r
1712      *\r
1713      * @public  \r
1714      */         \r
1715         setActiveSubItemsOnMouseOver : function(activateSubOnMouseOver)\r
1716         {\r
1717                 this.activeSubItemsOnMouseOver = activateSubOnMouseOver;        \r
1718         }\r
1719         // }}}\r
1720         ,\r
1721         // {{{ setMenuItemState()\r
1722     /**\r
1723      *  This method changes the state of the menu bar(expanded or collapsed). This method is called when someone clicks on the arrow at the right of menu items.\r
1724      *  \r
1725      *  @param Number menuItemId - ID of the menu item we want to switch state for\r
1726      *  @param String state - New state(example: "disabled")\r
1727      *\r
1728      * @public  \r
1729      */                 \r
1730         setMenuItemState : function(menuItemId,state)\r
1731         {\r
1732                 this.menuItem_objects[menuItemId].setState(state);\r
1733         }\r
1734         // }}}  \r
1735         ,\r
1736         // {{{ setMenuItemCssPrefix()\r
1737     /**\r
1738      *  Specify prefix of css classes used for the menu items. Default css prefix is "DHTMLSuite_". If you wish have some custom styling for some of your menus, \r
1739      *  create a separate css file and replace DHTMLSuite_ for the class names with your new prefix.  This is useful if you want to have two menus on the same page\r
1740      *  with different stylings.\r
1741      *  \r
1742      *  @param String newCssPrefix - New css prefix for menu items.\r
1743      *\r
1744      * @public  \r
1745      */         \r
1746         setMenuItemCssPrefix : function(newCssPrefix)\r
1747         {\r
1748                 this.menuItemCssPrefix = newCssPrefix;\r
1749         }\r
1750         // }}}\r
1751         ,       \r
1752         // {{{ setCssPrefix()\r
1753     /**\r
1754      *  Specify prefix of css classes used for the menu bar. Default css prefix is "DHTMLSuite_" and that's the prefix of all css classes inside menu-bar.css(the default css file). \r
1755      *  If you want some custom menu bars, create and include your own css files, replace DHTMLSuite_ in the class names with your own prefix and set the new prefix by calling\r
1756      *  this method. This is useful if you want to have two menus on the same page with different stylings.\r
1757      *  \r
1758      *  @param String newCssPrefix - New css prefix for the menu bar classes.\r
1759      *\r
1760      * @public  \r
1761      */         \r
1762         setCssPrefix : function(newCssPrefix)\r
1763         {\r
1764                 this.cssPrefix = newCssPrefix;\r
1765         }\r
1766         // }}}\r
1767         ,\r
1768         // {{{ replaceSubMenus()\r
1769     /**\r
1770      *  This method replaces existing sub menu items with a new subset (To replace all menu items, pass 0 as parentId)\r
1771      *\r
1772      *  \r
1773      *  @param Number parentId - ID of parent element ( 0 if top node) - if set, all sub elements will be deleted and replaced with the new menu model.\r
1774      *  @param menuModel newMenuModel - Reference to object of class menuModel\r
1775      *\r
1776      * @private \r
1777      */         \r
1778         replaceMenuItems : function(parentId,newMenuModel)\r
1779         {               \r
1780                 this.hideSubMenus();    // Hide all sub menus\r
1781                 this.__deleteMenuItems(parentId);       // Delete old menu items.\r
1782                 this.menuItemObj.__appendMenuModel(newMenuModel,parentId);      // Appending new menu items to the menu model.\r
1783                 this.__clearAllMenuItems();\r
1784                 this.__createMenuItems();\r
1785         }       \r
1786 \r
1787         // }}}  \r
1788         ,\r
1789         // {{{ deleteMenuItems()\r
1790     /**\r
1791      *  This method deletes menu items from the menu dynamically\r
1792      *  \r
1793      *  @param Number parentId - Parent id - where to append the new items.\r
1794      *  @param Boolean includeParent - Should parent element also be deleted, or only sub elements?\r
1795      *\r
1796      * @public  \r
1797      */         \r
1798         deleteMenuItems : function(parentId,includeParent)\r
1799         {\r
1800                 this.hideSubMenus();    // Hide all sub menus\r
1801                 this.__deleteMenuItems(parentId,includeParent);\r
1802                 this.__clearAllMenuItems();\r
1803                 this.__createMenuItems();               \r
1804         }\r
1805         // }}}  \r
1806         ,\r
1807         // {{{ appendMenuItems()\r
1808     /**\r
1809      *  This method appends menu items to the menu dynamically\r
1810      *  \r
1811      *  @param Number parentId - Parent id - where to append the new items.\r
1812      *  @param menuModel newMenuModel - Object of type menuModel. This menuModel will be appended as sub elements of defined parentId\r
1813      *\r
1814      * @public  \r
1815      */         \r
1816         appendMenuItems : function(parentId,newMenuModel)\r
1817         {\r
1818                 this.hideSubMenus();    // Hide all sub menus\r
1819                 this.menuItemObj.__appendMenuModel(newMenuModel,parentId);      // Appending new menu items to the menu model.\r
1820                 this.__clearAllMenuItems();\r
1821                 this.__createMenuItems();               \r
1822         }       \r
1823         // }}}  \r
1824         ,\r
1825         // {{{ hideMenuItem()\r
1826     /**\r
1827      *  This method doesn't delete menu items. it hides them only.\r
1828      *  \r
1829      *  @param Number id - Id of the item you want to hide.\r
1830      *\r
1831      * @public  \r
1832      */         \r
1833         hideMenuItem : function(id)\r
1834         {\r
1835                 this.menuItem_objects[id].hide();\r
1836 \r
1837         }       \r
1838         // }}}  \r
1839         ,\r
1840         // {{{ showMenuItem()\r
1841     /**\r
1842      *  This method shows a menu item. If the item isn't hidden, nothing is done.\r
1843      *  \r
1844      *  @param Number id - Id of the item you want to show\r
1845      *\r
1846      * @public  \r
1847      */         \r
1848         showMenuItem : function(id)\r
1849         {\r
1850                 this.menuItem_objects[id].show();\r
1851         }       \r
1852         // }}}\r
1853         ,\r
1854         // {{{ setText()\r
1855     /**\r
1856      *  Replace the text for a menu item\r
1857      *  \r
1858      *  @param Integer id - Id of menu item.\r
1859      *  @param String newText - New text for the menu item.\r
1860      *\r
1861      * @public  \r
1862      */         \r
1863         setText : function(id,newText)\r
1864         {\r
1865                 this.menuItem_objects[id].setText(newText);\r
1866         }               \r
1867         // }}}\r
1868         ,\r
1869         // {{{ setIcon()\r
1870     /**\r
1871      *  Replace menu icon for a menu item. \r
1872      *  \r
1873      *  @param Integer id - Id of menu item.\r
1874      *  @param String newPath - Path to new menu icon. Pass blank or false if you want to clear the menu item.\r
1875      *\r
1876      * @public  \r
1877      */         \r
1878         setIcon : function(id,newPath)\r
1879         {\r
1880                 this.menuItem_objects[id].setIcon(newPath);\r
1881         }       \r
1882         // }}}\r
1883         ,\r
1884         // {{{ __clearAllMenuItems()\r
1885     /**\r
1886      *  Delete HTML elements for all menu items.\r
1887      *\r
1888      * @private \r
1889      */                 \r
1890         __clearAllMenuItems : function()\r
1891         {\r
1892                 for(var prop=0;prop<this.menuItemObj.menuItemsOrder.length;prop++){\r
1893                         var id = this.menuItemObj.menuItemsOrder[prop];\r
1894                         if(this.submenuGroups[id]){\r
1895                                 this.submenuGroups[id].parentNode.removeChild(this.submenuGroups[id]);\r
1896                                 this.submenuGroups[id] = false; \r
1897                         }\r
1898                         if(this.submenuIframes[id]){\r
1899                                 this.submenuIframes[id].parentNode.removeChild(this.submenuIframes[id]);\r
1900                                 this.submenuIframes[id] = false;\r
1901                         }       \r
1902                 }\r
1903                 this.menuBarObj.innerHTML = '';         \r
1904         }\r
1905         // }}}\r
1906         ,\r
1907         // {{{ __deleteMenuItems()\r
1908     /**\r
1909      *  This method deletes menu items from the menu, i.e. menu model and the div elements for these items.\r
1910      *  \r
1911      *  @param Number parentId - Parent id - where to start the delete process.\r
1912      *\r
1913      * @private \r
1914      */         \r
1915         __deleteMenuItems : function(parentId,includeParent)\r
1916         {\r
1917                 if(includeParent)this.menuItemObj.__deleteANode(parentId);\r
1918                 if(!this.submenuGroups[parentId])return;        // No sub items exists.         \r
1919                 this.menuItem_objects[parentId].__setHasSub(false);     // Delete existing sub menu divs.\r
1920                 this.menuItemObj.__deleteChildNodes(parentId);  // Delete existing child nodes from menu model\r
1921                 var groupBox = this.submenuGroups[parentId];\r
1922                 groupBox.parentNode.removeChild(groupBox);      // Delete sub menu group box. \r
1923                 if(this.submenuIframes[parentId]){\r
1924                         this.submenuIframes[parentId].parentNode.removeChild(this.submenuIframes[parentId]);\r
1925                 }\r
1926                 this.submenuGroups.splice(parentId,1);\r
1927                 this.submenuIframes.splice(parentId,1);\r
1928         }\r
1929         // }}}  \r
1930         ,\r
1931         // {{{ __changeMenuBarState()\r
1932     /**\r
1933      *  This method changes the state of the menu bar(expanded or collapsed). This method is called when someone clicks on the arrow at the right of menu items.\r
1934      *  \r
1935      *  @param Object obj - Reference to element triggering the action\r
1936      *\r
1937      * @private \r
1938      */         \r
1939         __changeMenuBarState : function(){\r
1940                 var objectIndex = this.getAttribute('objectRef');\r
1941                 var obj = DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[objectIndex];\r
1942                 var parentId = this.id.replace(/[^0-9]/gi,'');          \r
1943                 var state = obj.menuItem_objects[parentId].getState();\r
1944                 if(state=='disabled')return;\r
1945                 obj.menuBarState = !obj.menuBarState;\r
1946                 if(!obj.menuBarState)obj.hideSubMenus();else{\r
1947                         obj.hideSubMenus();\r
1948                         obj.__expandGroup(parentId);\r
1949                 }\r
1950                 \r
1951         }\r
1952         // }}}          \r
1953         ,\r
1954         // {{{ __createDivs()\r
1955     /**\r
1956      *  Create the main HTML elements for this menu dynamically\r
1957      *  \r
1958      *\r
1959      * @private \r
1960      */         \r
1961         __createDivs : function()\r
1962         {\r
1963                 window.refTomenuBar = this;     // Reference to menu strip object\r
1964                 \r
1965                 this.menuBarObj = document.createElement('DIV');        \r
1966                 this.menuBarObj.className = this.cssPrefix + 'menuBar_' + this.menuItemObj.submenuType[1];\r
1967                 \r
1968                 if(!document.getElementById(this.targetId)){\r
1969                         alert('No target defined for the menu object');\r
1970                         return;\r
1971                 }\r
1972                 // Appending menu bar object as a sub of defined target element.\r
1973                 var target = document.getElementById(this.targetId);\r
1974                 target.appendChild(this.menuBarObj);                            \r
1975         }\r
1976         ,\r
1977         // {{{ hideSubMenus()\r
1978     /**\r
1979      *  Deactivate all sub menus ( collapse and set state back to regular )\r
1980      *  In case you have a menu inside a scrollable container, call this method in an onscroll event for that element\r
1981      *  example document.getElementById('textContent').onscroll = menuBar.__hideSubMenus;\r
1982      *  \r
1983      *  @param Event e - this variable is present if this method is called from an event. \r
1984      *\r
1985      * @public  \r
1986      */         \r
1987         hideSubMenus : function(e)\r
1988         {\r
1989                 if(this && this.tagName){       /* Method called from event */\r
1990                         if(document.all)e = event;\r
1991                         var srcEl = DHTMLSuite.commonObj.getSrcElement(e);\r
1992                         if(srcEl.tagName.toLowerCase()=='img')srcEl = srcEl.parentNode;\r
1993                         if(srcEl.className && srcEl.className.indexOf('arrow')>=0){\r
1994                                 return;\r
1995                         }\r
1996                 }\r
1997                 for(var no=0;no<DHTMLSuite.variableStorage.menuBar_highlightedItems.length;no++){\r
1998                         DHTMLSuite.variableStorage.menuBar_highlightedItems[no].setState('regular');    // Set state back to regular\r
1999                         DHTMLSuite.variableStorage.menuBar_highlightedItems[no].__hideGroup();  // Hide eventual sub menus\r
2000                 }       \r
2001                 DHTMLSuite.variableStorage.menuBar_highlightedItems = new Array();                      \r
2002         }\r
2003         \r
2004         ,\r
2005         // {{{ __expandGroup()\r
2006     /**\r
2007      *  Expand a group of sub items.\r
2008      *  @param parentId - Id of parent element\r
2009      *\r
2010      * @private \r
2011      */                 \r
2012         __expandGroup : function(parentId)\r
2013         {\r
2014         \r
2015                 var groupRef = this.submenuGroups[parentId];\r
2016                 var subDiv = groupRef.getElementsByTagName('DIV')[0];\r
2017                 \r
2018                 var numericId = subDiv.id.replace(/[^0-9]/g,'');\r
2019                 \r
2020                 groupRef.style.visibility='visible';    // Show menu group.\r
2021                 if(this.submenuIframes[parentId])this.submenuIframes[parentId].style.visibility = 'visible';    // Show iframe if it exists.\r
2022                 DHTMLSuite.variableStorage.menuBar_highlightedItems[DHTMLSuite.variableStorage.menuBar_highlightedItems.length] = this.menuItem_objects[numericId];\r
2023                 this.__positionSubMenu(parentId);\r
2024                 \r
2025                 if(DHTMLSuite.clientInfoObj.isOpera){   /* Opera fix in order to get correct height of sub menu group */\r
2026                         var subDiv = groupRef.getElementsByTagName('DIV')[0];   /* Find first menu item */\r
2027                         subDiv.className = subDiv.className.replace('_over','_over');   /* By "touching" the class of the menu item, we are able to fix a layout problem in Opera */\r
2028                 }\r
2029         }\r
2030         \r
2031         ,\r
2032         // {{{ __activateMenuElements()\r
2033     /**\r
2034      *  Traverse up the menu items and highlight them.\r
2035      *  \r
2036      *\r
2037      * @private \r
2038      */                 \r
2039         __activateMenuElements : function(inputObj,objectRef,firstIteration)\r
2040         {\r
2041                 if(!this.menuBarState && !this.activeSubItemsOnMouseOver)return;        // Menu is not activated and it shouldn't be activated on mouse over.\r
2042                 var numericId = inputObj.id.replace(/[^0-9]/g,'');      // Get a numeric reference to current menu item.\r
2043                 \r
2044                 var state = this.menuItem_objects[numericId].getState();        // Get state of this menu item.\r
2045                 if(state=='disabled')return;    // This menu item is disabled - return from function without doing anything.            \r
2046                 \r
2047                 if(firstIteration && DHTMLSuite.variableStorage.menuBar_highlightedItems.length>0){\r
2048                         this.hideSubMenus();    // First iteration of this function=> Hide other sub menus. \r
2049                 }       \r
2050                 // What should be the state of this menu item -> If it's the one the mouse is over, state should be "over". If it's a parent element, state should be "active".\r
2051                 var newState = 'over';\r
2052                 if(!firstIteration)newState = 'active'; // State should be set to 'over' for the menu item the mouse is currently over.\r
2053                         \r
2054                 this.menuItem_objects[numericId].setState(newState);    // Switch state of menu item.\r
2055                 if(this.submenuGroups[numericId]){      // Sub menu group exists. call the __expandGroup method. \r
2056                         this.__expandGroup(numericId);  // Expand sub menu group\r
2057                 }\r
2058                 DHTMLSuite.variableStorage.menuBar_highlightedItems[DHTMLSuite.variableStorage.menuBar_highlightedItems.length] = this.menuItem_objects[numericId];     // Save this menu item in the array of highlighted elements.\r
2059                 if(objectRef.menuItems[numericId].parentId){    // A parent element exists. Call this method over again with parent element as input argument.\r
2060                         this.__activateMenuElements(objectRef.menuItem_objects[objectRef.menuItems[numericId].parentId].divElement,objectRef,false);\r
2061                 }\r
2062         }\r
2063         // }}}  \r
2064         ,\r
2065         // {{{ __createMenuItems()\r
2066     /**\r
2067      *  Creates the HTML elements for the menu items.\r
2068      *  \r
2069      *\r
2070      * @private \r
2071      */         \r
2072         __createMenuItems : function()\r
2073         {\r
2074                 if(!this.globalObjectIndex)this.globalObjectIndex = DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects.length;;\r
2075                 var index = this.globalObjectIndex;\r
2076                 DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[index] = this;\r
2077         \r
2078                 // Find first child of the body element. trying to insert the element before first child instead of appending it to the <body> tag, ref: problems in ie\r
2079                 var firstChild = false;\r
2080                 var firstChilds = document.getElementsByTagName('DIV');\r
2081                 if(firstChilds.length>0)firstChild = firstChilds[0]\r
2082                 \r
2083                 for(var no=0;no<this.menuItemObj.menuItemsOrder.length;no++){   // Looping through menu items           \r
2084                         var indexThis = this.menuItemObj.menuItemsOrder[no];                            \r
2085                         if(!this.menuItems[indexThis].id)continue;              \r
2086                         this.menuItem_objects[this.menuItems[indexThis].id] = new DHTMLSuite.menuItem(); \r
2087                         if(this.menuItemCssPrefix)this.menuItem_objects[this.menuItems[indexThis].id].setCssPrefix(this.menuItemCssPrefix);     // Custom css prefix set\r
2088                         if(this.menuItemLayoutCss)this.menuItem_objects[this.menuItems[indexThis].id].setLayoutCss(this.menuItemLayoutCss);     // Custom css file name\r
2089                         \r
2090                         var ref = this.menuItem_objects[this.menuItems[indexThis].id].createItem(this.menuItems[indexThis]); // Create div for this menu item.\r
2091                 \r
2092                         // Actiave sub elements when someone moves the mouse over the menu item - exception: not on separators.\r
2093                         if(!this.menuItems[indexThis].separator)DHTMLSuite.commonObj.addEvent(ref,"mouseover",function(){ DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[index].__activateMenuElements(this,DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[index],true); });  \r
2094                         \r
2095                         if(this.menuItem_objects[this.menuItems[indexThis].id].expandElement){  /* Small arrow at the right of the menu item exists - expand subs */\r
2096                                 var expandRef = this.menuItem_objects[this.menuItems[indexThis].id].expandElement;      /* Creating reference to expand div/arrow div */\r
2097                                 var parentId = DHTMLSuite.variableStorage.arrayOfDhtmlSuiteObjects[index].menuItems[indexThis].parentId + '';   // Get parent id.\r
2098                                 var tmpId = expandRef.id.replace(/[^0-9]/gi,'');\r
2099                                 expandRef.setAttribute('objectRef',index);      /* saving the index of this object in the DHTMLSuite.variableStorage array as a property of the tag - We need to do this in order to avoid circular references and thus memory leakage in IE */\r
2100                                 expandRef.objectRef = index;\r
2101                                 expandRef.onclick = this.__changeMenuBarState;\r
2102                         }\r
2103                         var target = this.menuBarObj;   // Temporary variable - target of newly created menu item. target can be the main menu object or a sub menu group(see below where target is updated).\r
2104 \r
2105                         if(this.menuItems[indexThis].depth==1 && this.menuItemObj.submenuType[this.menuItems[indexThis].depth]!='top' && this.menuItemObj.mainMenuGroupWidth){  /* Main menu item group width set */\r
2106                                 var tmpWidth = this.menuItemObj.mainMenuGroupWidth + '';\r
2107                                 if(tmpWidth.indexOf('%')==-1)tmpWidth = tmpWidth + 'px';\r
2108                                 target.style.width = tmpWidth;  \r
2109                         }\r
2110                 \r
2111                         if(this.menuItems[indexThis].depth=='1'){       /* Top level item */\r
2112                                 if(this.menuItemObj.submenuType[this.menuItems[indexThis].depth]=='top'){       /* Type = "top" - menu items side by side */\r
2113                                         ref.style.styleFloat = 'left';                          \r
2114                                         ref.style.cssText = 'float:left';                                               \r
2115                                 }                       \r
2116                         }else{\r
2117                                 if(!this.menuItems[indexThis].depth){\r
2118                                         alert('Error in menu model(depth not defined for a menu item). Remember to call the init() method for the menuModel object.');\r
2119                                         return;\r
2120                                 }\r
2121                                 if(!this.submenuGroups[this.menuItems[indexThis].parentId]){    // Sub menu div doesn't exist - > Create it.\r
2122                                         this.submenuGroups[this.menuItems[indexThis].parentId] = document.createElement('DIV'); \r
2123                                         this.submenuGroups[this.menuItems[indexThis].parentId].style.zIndex = 10000;\r
2124                                         this.submenuGroups[this.menuItems[indexThis].parentId].id = 'DHTMLSuite_menuBarSubGroup' + this.menuItems[indexThis].parentId;\r
2125                                         this.submenuGroups[this.menuItems[indexThis].parentId].style.visibility = 'hidden';     // Initially hidden.\r
2126                                         if(this.menuItemObj.submenuType[this.menuItems[indexThis].depth]=='sub')this.submenuGroups[this.menuItems[indexThis].parentId].className = this.cssPrefix + 'menuBar_sub';\r
2127                                         if(firstChild){\r
2128                                                 firstChild.parentNode.insertBefore(this.submenuGroups[this.menuItems[indexThis].parentId],firstChild);\r
2129                                         }else{\r
2130                                                 document.body.appendChild(this.submenuGroups[this.menuItems[indexThis].parentId]);\r
2131                                         }\r
2132                                         \r
2133                                         if(DHTMLSuite.clientInfoObj.isMSIE && this.createIframesForOldIeBrowsers){      // Create iframe object in order to conver select boxes in older IE browsers(windows).\r
2134                                                 this.submenuIframes[this.menuItems[indexThis].parentId] = document.createElement('<IFRAME src="about:blank" frameborder=0>');\r
2135                                                 this.submenuIframes[this.menuItems[indexThis].parentId].id = 'DHTMLSuite_menuBarIframe_' + this.menuItems[indexThis].parentId;\r
2136                                                 this.submenuIframes[this.menuItems[indexThis].parentId].style.position = 'absolute';\r
2137                                                 this.submenuIframes[this.menuItems[indexThis].parentId].style.zIndex = 9000;\r
2138                                                 this.submenuIframes[this.menuItems[indexThis].parentId].style.visibility = 'hidden';\r
2139                                                 if(firstChild){\r
2140                                                         firstChild.parentNode.insertBefore(this.submenuIframes[this.menuItems[indexThis].parentId],firstChild);\r
2141                                                 }else{\r
2142                                                         document.body.appendChild(this.submenuIframes[this.menuItems[indexThis].parentId]);\r
2143                                                 }                                               \r
2144                                         }\r
2145                                 }       \r
2146                                 target = this.submenuGroups[this.menuItems[indexThis].parentId];        // Change target of newly created menu item. It should be appended to the sub menu div("A group box").                          \r
2147                         }                       \r
2148                         target.appendChild(ref); // Append menu item to the document.           \r
2149                         \r
2150                         if(this.menuItems[indexThis].visible == false)this.hideMenuItem(this.menuItems[indexThis].id);  // Menu item hidden, call the hideMenuItem method.\r
2151                         if(this.menuItems[indexThis].state != 'regular')this.menuItem_objects[this.menuItems[indexThis].id].setState(this.menuItems[indexThis].state);  // Menu item hidden, call the hideMenuItem method.\r
2152 \r
2153                 }       \r
2154                 \r
2155 \r
2156                 this.__setSizeOfAllSubMenus();  // Set size of all sub menu groups\r
2157                 this.__positionAllSubMenus();   // Position all sub menu groups.\r
2158                 if(DHTMLSuite.clientInfoObj.isOpera)this.__fixLayoutOpera();    // Call a function which fixes some layout issues in Opera.             \r
2159         }\r
2160         // }}}\r
2161         ,\r
2162         // {{{ __fixLayoutOpera()\r
2163     /**\r
2164      *  A method used to fix the menu layout in Opera. \r
2165      *\r
2166      *\r
2167      * @private \r
2168      */         \r
2169         __fixLayoutOpera : function()\r
2170         {\r
2171                 for(var no=0;no<this.menuItemObj.menuItemsOrder.length;no++){\r
2172                         var id = this.menuItemObj.menuItemsOrder[no];\r
2173                         if(!id)continue;\r
2174                         this.menuItem_objects[id].divElement.className = this.menuItem_objects[id].divElement.className.replace('_regular','_regular'); // Nothing is done but by "touching" the class of the menu items in Opera, we make them appear correctly\r
2175                 }               \r
2176         }\r
2177         \r
2178         // }}}  \r
2179         ,\r
2180         // {{{ __setSizeOfAllSubMenus()\r
2181     /**\r
2182      *  *       Walk through all sub menu groups and call the positioning method for each one of them.\r
2183      *\r
2184      *\r
2185      * @private \r
2186      */         \r
2187         __setSizeOfAllSubMenus : function()\r
2188         {               \r
2189                 for(var prop in this.submenuGroups){\r
2190                         this.__setSizeOfSubMenus(prop);\r
2191                 }                       \r
2192         }       \r
2193         // }}}  \r
2194         ,       \r
2195         // {{{ __positionAllSubMenus()\r
2196     /**\r
2197      *  Walk through all sub menu groups and call the positioning method for each one of them.\r
2198      *\r
2199      *\r
2200      * @private \r
2201      */         \r
2202         __positionAllSubMenus : function()\r
2203         {\r
2204                 for(var prop in this.submenuGroups){\r
2205                         this.__positionSubMenu(prop);\r
2206                 }       \r
2207                 \r
2208         }\r
2209         // }}}  \r
2210         ,\r
2211         // {{{ __positionSubMenu(parentId)\r
2212     /**\r
2213      *  Position a sub menu group\r
2214      *\r
2215      *  @param parentId         \r
2216      *\r
2217      * @private \r
2218      */         \r
2219         __positionSubMenu : function(parentId)\r
2220         {\r
2221                 try{\r
2222                         var shortRef = this.submenuGroups[parentId];    \r
2223                         \r
2224                         var depth = this.menuItems[parentId].depth;\r
2225                         var dir = this.menuItemObj.submenuType[depth];\r
2226                         if(dir=='top'){                 \r
2227                                 shortRef.style.left = DHTMLSuite.commonObj.getLeftPos(this.menuItem_objects[parentId].divElement) + 'px';\r
2228                                 shortRef.style.top = (DHTMLSuite.commonObj.getTopPos(this.menuItem_objects[parentId].divElement) + this.menuItem_objects[parentId].divElement.offsetHeight) + 'px';\r
2229                         }else{\r
2230                                 shortRef.style.left = (DHTMLSuite.commonObj.getLeftPos(this.menuItem_objects[parentId].divElement) + this.menuItem_objects[parentId].divElement.offsetWidth) + 'px';\r
2231                                 shortRef.style.top = (DHTMLSuite.commonObj.getTopPos(this.menuItem_objects[parentId].divElement)) + 'px';               \r
2232                         }       \r
2233                         \r
2234                         if(DHTMLSuite.clientInfoObj.isMSIE){\r
2235                                 var iframeRef = this.submenuIframes[parentId]\r
2236                                 iframeRef.style.left = shortRef.style.left;\r
2237                                 iframeRef.style.top = shortRef.style.top;\r
2238                                 iframeRef.style.width = shortRef.clientWidth + 'px';\r
2239                                 iframeRef.style.height = shortRef.clientHeight + 'px';\r
2240                         }\r
2241                                                                         \r
2242                 }catch(e){\r
2243                         \r
2244                 }               \r
2245         }\r
2246         // }}}  \r
2247         ,\r
2248         // {{{ __setSizeOfSubMenus(parentId)\r
2249     /**\r
2250      *  Set size of a sub menu group\r
2251      *\r
2252      *  @param parentId         \r
2253      *\r
2254      * @private \r
2255      */         \r
2256         __setSizeOfSubMenus : function(parentId)\r
2257         {\r
2258                 try{\r
2259                         var shortRef = this.submenuGroups[parentId];                    \r
2260                         var subWidth = Math.max(shortRef.offsetWidth,this.menuItem_objects[parentId].divElement.offsetWidth);\r
2261                         if(this.menuItems[parentId].submenuWidth)subWidth = this.menuItems[parentId].submenuWidth;\r
2262                         subWidth = subWidth + '';\r
2263                         if(subWidth.indexOf('%')==-1)subWidth = subWidth + 'px';\r
2264                         shortRef.style.width = subWidth;        \r
2265                         \r
2266                         if(DHTMLSuite.clientInfoObj.isMSIE){\r
2267                                 this.submenuIframes[parentId].style.width = shortRef.style.width;\r
2268                                 this.submenuIFrames[parentId].style.height = shortRef.style.height;\r
2269                         }\r
2270                 }catch(e){\r
2271                         \r
2272                 }\r
2273                 \r
2274         }\r
2275         // }}}  \r
2276         ,\r
2277         // {{{ __repositionMenu()\r
2278     /**\r
2279      *  Position menu items.\r
2280      *  \r
2281      *\r
2282      * @private \r
2283      */         \r
2284         __repositionMenu : function(inputObj)\r
2285         {\r
2286                 // self.status = this;\r
2287                 inputObj.menuBarObj.style.top = document.documentElement.scrollTop + 'px';\r
2288                 \r
2289         }\r
2290         \r
2291         // }}}  \r
2292         ,\r
2293         // {{{ __menuItemRollOver()\r
2294     /**\r
2295      *  Position menu items.\r
2296      *  \r
2297      *\r
2298      * @private \r
2299      */ \r
2300         __menuItemRollOver : function(inputObj)\r
2301         {\r
2302                 var numericId = inputObj.id.replace(/[^0-9]/g,'');\r
2303                 inputObj.className = 'DHTMLSuite_menuBar_menuItem_over_' + this.menuItems[numericId]['depth'];          \r
2304         }\r
2305         // }}}  \r
2306         ,       \r
2307         // {{{ __menuItemRollOut()\r
2308     /**\r
2309      *  Position menu items.\r
2310      *  \r
2311      *\r
2312      * @private \r
2313      */ \r
2314         __menuItemRollOut : function(inputObj)\r
2315         {               \r
2316                 var numericId = inputObj.id.replace(/[^0-9]/g,'');\r
2317                 inputObj.className = 'DHTMLSuite_menuBar_menuItem_' + this.menuItems[numericId]['depth'];               \r
2318         }\r
2319         // }}}  \r
2320         ,\r
2321         // {{{ __menuNavigate()\r
2322     /**\r
2323      *  Navigate by click on a menu item\r
2324      *  \r
2325      *\r
2326      * @private \r
2327      */ \r
2328         __menuNavigate : function(inputObj)\r
2329         {\r
2330                 var numericIndex = inputObj.id.replace(/[^0-9]/g,'');\r
2331                 var url = this.menuItems[numericIndex]['url'];\r
2332                 if(!url)return;\r
2333                 alert(this.menuItems[numericIndex]['url']);\r
2334                 \r
2335         }\r
2336         // }}}  \r
2337         ,\r
2338         // {{{ __setBasicEvents()\r
2339     /**\r
2340      *  Set basic events for the menu widget.\r
2341      *  \r
2342      *\r
2343      * @private \r
2344      */ \r
2345         __setBasicEvents : function()\r
2346         {\r
2347                 DHTMLSuite.commonObj.addEvent(document.documentElement,"click",this.hideSubMenus);              \r
2348         }\r
2349 }\r
2350 \r
2351 \r