home *** CD-ROM | disk | FTP | other *** search
/ Incas / Incas.iso / Kimera / karisma / kimera / republicadominicana / treeMenuCode.js < prev   
Text File  |  2005-02-09  |  15KB  |  471 lines
  1. /******************************************************************************
  2. * treeMenuCode.js                                                             *
  3. *                                                                             *
  4. * Copyright 1999 by Mike Hall.                                                *
  5. * Web address: http://www.brainjar.com                                        *
  6. * Last update: February 23, 2000                                              *
  7. *                                                                             *
  8. * Creates an expanding and collapsing menu with files and folders in a child  *
  9. * frame.                                                                      *
  10. ******************************************************************************/
  11.  
  12. //----------------------------------------------------------------------------
  13. // Define the TreeMenuItem object.
  14. //----------------------------------------------------------------------------
  15.  
  16. // Global index variable.
  17.  
  18. var treeMenuIndex = 0;
  19.  
  20. // Constructor.
  21.  
  22. function TreeMenuItem(text, url, target, icon) {
  23.  
  24.   this.text = text;
  25.  
  26.   if (url)
  27.     this.url = url;
  28.   else
  29.     this.url = "";
  30.   if (target)
  31.     this.target = target;
  32.   else
  33.     this.target = "";
  34.   if (icon)
  35.     this.icon = icon;
  36.   else
  37.     this.icon = "";
  38.  
  39.   this.submenu = null;
  40.   this.index = treeMenuIndex++;
  41.   this.makeSubmenu = TreeMenuMakeSubmenu;
  42. }
  43.  
  44. // Methods.
  45.  
  46. function TreeMenuMakeSubmenu(menu) {
  47.  
  48.   this.submenu = menu;
  49. }
  50.  
  51. //----------------------------------------------------------------------------
  52. // Define the TreeMenu object.
  53. //----------------------------------------------------------------------------
  54.  
  55. // Constructor.
  56.  
  57. function TreeMenu() {
  58.  
  59.   this.items = new Array();
  60.   this.addItem = treeMenuAddItem;
  61. }
  62.  
  63. // Methods.
  64.  
  65. function treeMenuAddItem(item) {
  66.  
  67.   this.items[this.items.length] = item;
  68. }
  69.  
  70. //----------------------------------------------------------------------------
  71. // Global variables used in drawing the menu.
  72. //----------------------------------------------------------------------------
  73.  
  74. var treeMenuDocument;       // Handle to the menu frame document.
  75. var treeMenuWidth;          // Menu width in pixels.
  76. var treeMenuExpand;         // Array created from first cookie.
  77. var treeMenuSelected;       // Index of selected menu item from other cookie.
  78. var treeMenuSelectedFound;  // Indicates if we've displayed the selected item.
  79. var treeMenuScrollX;        // Amount to scroll the window right, if needed.
  80. var treeMenuScrollY;        // Amount to scroll the window down, if needed.
  81. var treeMenuLastItem;       // Flag indicating if we are on a menu's last item.
  82. var treeMenuDepth;          // Keeps track the current menu level.
  83. var treeMenuBars;           // Keeps track of image placement from row to row.
  84.  
  85. //----------------------------------------------------------------------------
  86. // This function rewrites the menu document to display the menu.
  87. //----------------------------------------------------------------------------
  88.  
  89. function treeMenuDisplay() {
  90.  
  91.   var i, cookie;
  92.  
  93.   // Check for cookies with the menu state data. If not found, or if the menu
  94.   // state has not been set, initialize it.
  95.  
  96.   cookie = getCookie(treeMenuName);
  97.   if (!cookie) {
  98.     if (!treeMenuExpand) {
  99.       treeMenuExpand = new Array();
  100.       for (i = 0; i < treeMenuIndex; i++)
  101.         treeMenuExpand[i] = 0;
  102.       treeMenuSelected = -1;
  103.     }
  104.   }
  105.   else {
  106.     treeMenuExpand = cookie.split(",");
  107.     cookie = getCookie(treeMenuName + "-selected");
  108.     if (!cookie)
  109.       treeMenuSelected = -1;
  110.     else
  111.       treeMenuSelected = cookie;
  112.   }
  113.  
  114.   // Set up reference to the menu document.
  115.  
  116.   treeMenuDocument = window.frames[treeMenuFrame].document;
  117.  
  118.   // Set global variables used to draw the menu.
  119.  
  120.   treeMenuDepth = 0;
  121.   treeMenuBars = new Array();
  122.  
  123.   // Intialize scrolling data.
  124.  
  125.   treeMenuSelectedFound = false;
  126.   treeMenuScrollX = 36;
  127.   treeMenuScrollY = 18;
  128.  
  129.   // Draw the menu.
  130.  
  131.   if (document.images)
  132.     treeMenuDocument.open("text/html", "replace");
  133.   else
  134.     treeMenuDocument.open("text/html");
  135.   treeMenuDocument.writeln('<head>');
  136.   treeMenuDocument.writeln('<title>' + treeMenuRoot + '</title>');
  137.   treeMenuDocument.writeln('<style type="text/css">a {text-decoration:none;}</style>');
  138.   treeMenuDocument.writeln('</head>');
  139.   treeMenuDocument.writeln('<body background="' + treeMenuBackground + '" bgcolor="' + treeMenuBgColor + '" text="' + treeMenuFgColor + '" link="' + treeMenuFgColor + '" alink="' + treeMenuFgColor + '" vlink="' + treeMenuFgColor + '" onLoad="parent.treeMenuScroll();">');
  140.   treeMenuDocument.writeln('<table border=0 cellpadding=0 cellspacing=0>');
  141.   treeMenuDocument.write('<tr valign=top><td>');
  142.   treeMenuDocument.write('<a href="#" onClick="return parent.treeMenuClickRoot();">');
  143.   treeMenuDocument.write('<img src="' + treeMenuImgDir + 'menu_root.gif" align=left border=0 vspace=0 hspace=0>');
  144.   treeMenuDocument.write('<font face="' + treeMenuFont + '" size=' + treeMenuFontSize + '> ' + treeMenuRoot + ' </font>');
  145.   treeMenuDocument.writeln('</td></tr>');
  146.   treeMenuListItems(treeMenu);
  147.   treeMenuDocument.writeln('</table>');
  148.   treeMenuDocument.writeln('</body>');
  149.   treeMenuDocument.close();
  150. }
  151.  
  152. //----------------------------------------------------------------------------
  153. // This function displays each item in the given menu or submenu.
  154. //----------------------------------------------------------------------------
  155.  
  156. function treeMenuListItems(menu) {
  157.  
  158.   var i;
  159.  
  160.   for (i = 0; i < menu.items.length; i++) {
  161.     if (i == menu.items.length - 1)
  162.       treeMenuLastItem = true;
  163.     else
  164.       treeMenuLastItem = false;
  165.     treeMenuDisplayItem(menu.items[i]);
  166.   }
  167. }
  168.  
  169. //----------------------------------------------------------------------------
  170. // This displays a single menu or submenu item.
  171. //----------------------------------------------------------------------------
  172.  
  173. function treeMenuDisplayItem(item) {
  174.  
  175.   var bars, cmd, expanded, i, img, alt, link, more, submenu;
  176.  
  177.   // Update vertical scrolling amount until we find the selected item.
  178.  
  179.   if (item.index == treeMenuSelected)
  180.     treeMenuSelectedFound = true;
  181.   if (!treeMenuSelectedFound)
  182.     treeMenuScrollY += 18;
  183.  
  184.   // If this item is a submenu, determine if should be expanded. For older
  185.   // browsers, always expand.
  186.  
  187.   if (treeMenuExpand[item.index] == 1)
  188.     expanded = true;
  189.   else
  190.     expanded = false;
  191.  
  192.   // Define the command used when an item is clicked. For older browsers, just
  193.   // return true or false so links will be followed.
  194.  
  195.   if (item.submenu)
  196.     submenu = true;
  197.   else
  198.     submenu = false;
  199.   if (item.url != "")
  200.     link = true;
  201.   else
  202.     link = false;
  203.   cmd = "return parent.treeMenuClick(" + item.index + ", " + link + ", " + submenu + ");";
  204.  
  205.   // Start the table row.
  206.  
  207.   treeMenuDocument.write('<tr valign=top><td nowrap>');
  208.  
  209.   // Draw descending bars from upper levels, also set horizontal scrolling
  210.   // amount if this is the selected item.
  211.  
  212.   bars = new Array();
  213.   for (i = 0; i < treeMenuDepth; i++) {
  214.     if (treeMenuBars[i]) {
  215.       treeMenuDocument.write('<img src="' + treeMenuImgDir + 'menu_bar.gif" align=left border=0 vspace=0 hspace=0>');
  216.       bars[i] = true;
  217.     }
  218.     else {
  219.       treeMenuDocument.write('<img src="' + treeMenuImgDir + 'menu_spacer.gif" align=left border=0 vspace=0 hspace=0>');
  220.       bars[i] = false;
  221.     }
  222.     if (item.index == treeMenuSelected)
  223.       treeMenuScrollX += 18;
  224.   }
  225.  
  226.   // Determine if this is a submenu item that contains other submenus.
  227.  
  228.   more = false;
  229.   if (item.submenu && treeMenuFolders >= 0)
  230.     for (i = 0; i < item.submenu.items.length; i++)
  231.       if (item.submenu.items[i].submenu != null || treeMenuFolders == 1)
  232.         more = true;
  233.  
  234.   // Draw tee bar or corner if this item is not a submenu or if it is a
  235.   // submenu but doesn't contain other submenus.
  236.  
  237.   if (!more) {
  238.     if (treeMenuLastItem) {
  239.       img = "menu_corner.gif";
  240.       bars[bars.length] = false;
  241.     }
  242.     else {
  243.       img = "menu_tee.gif";
  244.       bars[bars.length] = true;
  245.     }
  246.     treeMenuDocument.write('<img src="' + treeMenuImgDir + img + '" align=left border=0 vspace=0 hspace=0>');
  247.   }
  248.  
  249.   // Write the start of the link tag so all of the following images and text
  250.   // will be clickable.
  251.  
  252.   if (item.url != "")
  253.     treeMenuDocument.write('<a href="' + item.url + '" target="' + item.target + '" onClick="' + cmd + '">');
  254.   else
  255.     treeMenuDocument.write('<a href="#" onClick="' + cmd + '">');
  256.  
  257.   // For a submenu item that contains other submenus, draw a tee bar or corner
  258.   // with a plus or minus sign.
  259.  
  260.   if (more) {
  261.     if (expanded) {
  262.       if (treeMenuLastItem) {
  263.         img = "menu_corner_minus.gif";
  264.         bars[bars.length] = false;
  265.       }
  266.       else {
  267.         img = "menu_tee_minus.gif";
  268.         bars[bars.length] = true;
  269.       }
  270.     }
  271.     else {
  272.       if (treeMenuLastItem) {
  273.         img = "menu_corner_plus.gif";
  274.         bars[bars.length] = false;
  275.       }
  276.       else {
  277.         img = "menu_tee_plus.gif";
  278.         bars[bars.length] = true;
  279.       }
  280.     }
  281.     treeMenuDocument.write('<img src="' + treeMenuImgDir + img + '" align=left border=0 vspace=0 hspace=0>');
  282.   }
  283.  
  284.   // If the item is a submenu, draw an open or closed folder icon. Otherwise
  285.   // draw a link icon.
  286.  
  287.   if (item.submenu) {
  288.     if (expanded)
  289.       img = "menu_folder_open.gif";
  290.     else
  291.       img = "menu_folder_closed.gif";
  292.   }
  293.   else {
  294.     if (item.icon != "")
  295.       img = item.icon;
  296.     else if (item.url.indexOf("http://") == 0)
  297.       img = "menu_link_external.gif";
  298.     else
  299.       img = "menu_link_local.gif";
  300.   }
  301.   if (treeMenuAltText)
  302.     alt = ' alt="' + item.text + '"';
  303.   else
  304.     alt = '';
  305.   treeMenuDocument.write('<img src="' + treeMenuImgDir + img + '"' + alt + ' align=left border=0 vspace=0 hspace=0>');
  306.  
  307.   // Write the link text and finish the link and table row.
  308.  
  309.   if (item.index == treeMenuSelected)
  310.     treeMenuDocument.write('<font face="' + treeMenuFont + '" size=' + treeMenuFontSize + '> <span style="background-color:' + treeMenuHiBg + ';color:' + treeMenuHiFg + ';">' + item.text + '</span></font>');
  311.   else
  312.     treeMenuDocument.write('<font face="' + treeMenuFont + '" size=' + treeMenuFontSize + '> ' + item.text + '</font>');
  313.   treeMenuDocument.write('</a>');
  314.   treeMenuDocument.writeln('</td></tr>');
  315.  
  316.   // Set the placement of vertical bars needed for the next row.
  317.  
  318.   treeMenuBars = bars;
  319.  
  320.   // If the item is a submenu and it is expanded, make a recursive call to
  321.   // draw its item list.
  322.  
  323.   if (item.submenu && expanded) {
  324.     treeMenuDepth++;
  325.     treeMenuListItems(item.submenu);
  326.     treeMenuDepth--;
  327.   }
  328. }
  329.  
  330. //----------------------------------------------------------------------------
  331. // This function handles a click on a menu item.
  332. //----------------------------------------------------------------------------
  333.  
  334. function treeMenuClick(n, link, submenu) {
  335.  
  336.   var date, cookie;
  337.  
  338.   // Fix bug that occurs when the top-level page is reloaded.
  339.  
  340.   if (!treeMenuExpand)
  341.     treeMenuDisplay();
  342.  
  343.   // If this is a submenu, toggle the expansion flag.
  344.  
  345.   if (submenu)
  346.     treeMenuExpand[n] = 1 - treeMenuExpand[n];
  347.  
  348.   // Save the selected item index and update the cookies.
  349.  
  350.   treeMenuSelected = n;
  351.   var date = new Date ();
  352.   date.setTime (date.getTime() + (86400 * 1000 * treeMenuDays));
  353.   cookie = treeMenuExpand.toString();
  354.   setCookie(treeMenuName, cookie, date);
  355.   setCookie(treeMenuName + "-selected", treeMenuSelected, date);
  356.  
  357.   // Set up redraw the menu frame.
  358.  
  359.   setTimeout("treeMenuDisplay()", 10);
  360.  
  361.   // Return the link flag.
  362.  
  363.   return link;
  364. }
  365.  
  366. //----------------------------------------------------------------------------
  367. // This function handles a click on the menu root.
  368. //----------------------------------------------------------------------------
  369.  
  370. function treeMenuClickRoot() {
  371.  
  372.   // Clear the menu state.
  373.  
  374.   treeMenuExpand = null;
  375.   treeMenuSelected = null;
  376.  
  377.   // Delete cookies.
  378.  
  379.   deleteCookie(treeMenuName);
  380.   deleteCookie(treeMenuName + "-selected");
  381.  
  382.   // Set up redraw the menu frame.
  383.  
  384.   setTimeout("treeMenuDisplay()", 10);
  385.  
  386.   return false;
  387. }
  388.  
  389. //----------------------------------------------------------------------------
  390. // This function scrolls the window to ensure the selected item is in view.
  391. // It should only be called after the page has loaded.
  392. //
  393. // Note: This code is browser-dependent. Scrolling may be ignored for older
  394. // browsers.
  395. //----------------------------------------------------------------------------
  396.  
  397. function treeMenuScroll() {
  398.  
  399.   var win, height, width;
  400.  
  401.   // Get a handle to the menu frame.
  402.  
  403.   win = window.frames[treeMenuFrame];
  404.  
  405.   // Find the dimensions of the frame.
  406.  
  407.   if (document.layers) {
  408.     height = win.innerHeight;
  409.     width = win.innerWidth;
  410.   }
  411.   else if (document.all) {
  412.     height = win.document.body.clientHeight;
  413.     width = win.document.body.clientWidth;
  414.   }
  415.   else if (document.images) {
  416.     win.scroll(0, treeMenuScrollY);
  417.     return;
  418.   }
  419.   else
  420.     return;
  421.  
  422.   // Scroll the frame if necessary.
  423.  
  424.   if (treeMenuScrollY > height)
  425.     win.scrollBy(0, treeMenuScrollY);
  426.   if (treeMenuScrollX > width)
  427.     win.scrollBy(treeMenuScrollX, 0);
  428. }
  429.  
  430. //----------------------------------------------------------------------------
  431. // Set a cookie given a name, value and expiration date.
  432. //----------------------------------------------------------------------------
  433.  
  434.  
  435. function setCookie (name, value, expires) {
  436.  
  437.   document.cookie = name + "=" + escape(value) + "; expires=" + expires.toGMTString() +  "; path=/";
  438. }
  439.  
  440. //----------------------------------------------------------------------------
  441. // Returns the value of the named cookie.
  442. //----------------------------------------------------------------------------
  443.  
  444. function getCookie(name) {
  445.  
  446.   var search;
  447.  
  448.   search = name + "=";
  449.   offset = document.cookie.indexOf(search) ;
  450.   if (offset != -1) {
  451.     offset += search.length;
  452.     end = document.cookie.indexOf(";", offset);
  453.     if (end == -1)
  454.       end = document.cookie.length;
  455.     return unescape(document.cookie.substring(offset, end));
  456.   }
  457.   else
  458.     return "";
  459. }
  460.  
  461. //----------------------------------------------------------------------------
  462. // Delete the named cookie.
  463. //----------------------------------------------------------------------------
  464.  
  465. function deleteCookie(name) {
  466.  
  467.   var expdate = new Date();
  468.   expdate.setTime(expdate.getTime() - (86400 * 1000 * 1));
  469.   setCookie(name, "", expdate);
  470. }
  471.