home *** CD-ROM | disk | FTP | other *** search
/ PC World 2002 December / PCWorld_2002-12_cd.bin / Software / Topware / wmp99xrc / mpsetup.exe / wmploc.DLL / HTML / TOC.HTC < prev    next >
Encoding:
HTML Component  |  2002-10-28  |  6.0 KB  |  189 lines
  1. <PUBLIC:COMPONENT lightWeight=true>
  2. <PUBLIC:EVENT name="onitemselect" ID="doselect">
  3. <PUBLIC:ATTACH EVENT="oncontentready" ONEVENT="load()" />
  4. <PUBLIC:ATTACH EVENT="onmouseout"  ONEVENT="mouseout()" />
  5. <PUBLIC:ATTACH EVENT="onmouseover"  ONEVENT="mousemove()" />
  6. <PUBLIC:ATTACH EVENT="onclick" ONEVENT="mouseup()" />
  7. <PUBLIC:PROPERTY NAME="width" />
  8. <PUBLIC:PROPERTY NAME="text" />
  9. <PUBLIC:PROPERTY NAME="dropdowntop" />
  10. <PUBLIC:PROPERTY NAME="dropdownleft" />
  11. <PUBLIC:PROPERTY NAME="menutext" />
  12. <PUBLIC:METHOD NAME="clickItem" />
  13. <PUBLIC:METHOD NAME="itemFocus" />
  14. <PUBLIC:METHOD NAME="itemBlur" />
  15.  
  16. <SCRIPT LANGUAGE="JScript">
  17.  
  18. var fDown = false;
  19. function load() 
  20. { 
  21.     var sLeft, sRight;
  22.     
  23.     if (IsRTLPage())
  24.     {
  25.         sLeft = 'right';
  26.         sRight = 'left';
  27.     }
  28.     else
  29.     {
  30.         sLeft = 'left';
  31.         sRight = 'right';
  32.     }
  33.     
  34.     var s = '<table style="position:relative; z-index: 5;" width=' + width + ' id="' + element.uniqueID + 'small" border=0 cellpadding=0 cellspacing=0><tr>';
  35.     s += '<td height=18 width=9 style="cursor:default"><img id="' + element.uniqueID + 'left" style="display:none" border=0 src="images\\hover-' + sLeft + '.gif"></td>';
  36.     s += '<td height=18 id="' + element.uniqueID + 'mid" style="cursor:default; background: transparent x repeat-x top left" class=textTitle><A class=textTitle href="X" onclick="return false;">' + text + '</a></td>';
  37.     s += '<td id="' + element.uniqueID + 'arrow" style="cursor:default; padding-left:10; background: transparent x repeat-x top left" align=right><img border=0 src="images\\arrow-down.gif"></td>';
  38.     s += '<td height=18 width=9 style="cursor:default"><img id="' + element.uniqueID + 'right" style="display:none" border=0 src="images\\hover-' + sRight + '.gif"></td></tr></table>';
  39.  
  40.     s += '<table width=' + width + ' style="display:none; position:absolute; z-index: 5;" id="' + element.uniqueID + 'menu" border=0 cellpadding=0 cellspacing=0>';
  41.     s += '<td height=18 width=9  valign=top style="cursor:default"><img border=0 src="images\\toc-top-' + sLeft + '.gif"></td>';
  42.     s += '<td height=18 style="cursor:default; background: white url(images\\toc-top.gif) repeat-x top left" class=textTitle><A href="x" onclick="return false;" class=textTitle>' + text + '</a></td>';
  43.     s += '<td style="cursor:default; padding-left:10; background: white url(images\\toc-top.gif) repeat-x top left" align=right><img border=0 src="images\\arrow-up.gif"></td>';
  44.     s += '<td height=18 width=9 valign=top style="cursor:default"><img border=0 src="images\\toc-top-' + sRight + '.gif"></td></tr>';
  45.     
  46.     s += '<tr><td width=9 style="cursor:default; background: white url(images\\toc-' + sLeft + '.gif) repeat-y top left"></td>';
  47.     s += '<td colspan=2 style="background: white url(images\\toc-center.gif) repeat top left">' + BuildMenu() + '</td>';
  48.     s += '<td width=9 style="cursor:default; background: white url(images\\toc-' + sRight + '.gif) repeat-y top left"></td></tr>';
  49.  
  50.     s += '<tr><td width=9 valign=bottom style="cursor:default"><img border=0 src="images\\toc-bottom-' + sLeft + '.gif"></td>';
  51.     s += '<td colspan=2 style="background: white url(images\\toc-bottom.gif) repeat-x bottom left"></td>';
  52.     s += '<td width=9 valign=bottom><img border=0 src="images\\toc-bottom-' + sRight + '.gif"></td></tr>';
  53.  
  54.     s += '</table>';
  55.     
  56.     element.style.height = 18;
  57.     element.innerHTML = s; 
  58. }
  59.  
  60. function BuildMenu()
  61. {
  62.     var s = '<table border=0 cellpadding=2 cellspacing=0>', aList, i;
  63.     
  64.     aList = menutext.split(';');
  65.     for (i = 0; i < aList.length; i++)
  66.     {
  67.         s += '<tr><td width=100%><A href="X" id="' + uniqueID + i + '" onblur="' + uniqueID + '.itemBlur(' + i + ');" onfocus="' + uniqueID + '.itemFocus(' + i + ');" clicknum="' + i + '" class=tocText> ' + aList[i] + ' </a></td></tr>';
  68.     }
  69.     
  70.     return s + '</table>';
  71. }
  72.  
  73. function setImage(iMode) 
  74. {  
  75.     var sKey, sDisplay, id, a, sLeft, sRight;
  76.     
  77.     if (IsRTLPage())
  78.     {
  79.         sLeft = 'right';
  80.         sRight = 'left';
  81.     }
  82.     else
  83.     {
  84.         sLeft = 'left';
  85.         sRight = 'right';
  86.     }
  87.     
  88.     sDisplay = 'inline';
  89.     if (iMode == 1)
  90.         sKey = 'hover';
  91.     else
  92.     {
  93.         sKey = 'normal';
  94.         sDisplay = 'none';
  95.     }
  96.         
  97.     a = element.document.all;
  98.     id = element.uniqueID;
  99.     
  100.     a(id + 'left').src = 'images\\' + sKey + '-' + sLeft + '.gif';
  101.     if (sKey == 'normal')
  102.     {
  103.         a(id + 'mid').style.backgroundImage = '';
  104.         a(id + 'arrow').style.backgroundImage = '';
  105.     }
  106.     else
  107.     {
  108.         a(id + 'mid').style.backgroundImage = 'url(images\\' + sKey + '-center.gif)';
  109.         a(id + 'arrow').style.backgroundImage = 'url(images\\' + sKey + '-center.gif)';
  110.     }
  111.     a(id + 'right').src = 'images\\' + sKey + '-' + sRight + '.gif';
  112.     a(id + 'left').style.display = sDisplay
  113.     a(id + 'right').style.display = sDisplay
  114. }
  115.  
  116. function mouseout() 
  117. { 
  118.     if (!fDown) 
  119.         setImage(0); 
  120.     else
  121.     {
  122.         if (event.srcElement.className == 'tocText')
  123.             event.srcElement.style.backgroundColor = '';
  124.     }
  125. }
  126. function mousemove() 
  127. {    
  128.     if (!fDown) 
  129.         setImage(1); 
  130.     else
  131.     {
  132.         if (event.srcElement.className == 'tocText')
  133.             event.srcElement.style.backgroundColor = 'lightblue';
  134.     }
  135. }
  136.  
  137. var iCurrentFocusItem = -1;
  138. function itemFocus(i)
  139. {
  140.     iCurrentFocusItem = i;
  141. }
  142.  
  143. function itemBlur(i)
  144. {
  145.     iCurrentFocusItem = -1;
  146. }
  147.  
  148. function mouseup() 
  149. {
  150.     var oMenu = element.document.all(element.uniqueID + 'menu')
  151.     fDown = !fDown;
  152.     if (fDown)
  153.         element.setCapture();
  154.     else
  155.     {
  156.         var fClicked = false, oElement;
  157.         element.releaseCapture();
  158.         if (event.srcElement.className == 'tocText')
  159.         {
  160.             fClicked = true;
  161.             oElement = event.srcElement;
  162.         } else if (iCurrentFocusItem != -1)
  163.         {
  164.             fClicked = true;
  165.             oElement = element.document.all(uniqueID + iCurrentFocusItem);
  166.         }
  167.         
  168.         if (fClicked)
  169.         {
  170.             oElement.style.backgroundColor = '';
  171.             window.setTimeout(element.uniqueID + '.clickItem(' + oElement.clicknum + ')', 0);            
  172.         }
  173.     }
  174.         
  175.     element.document.all(element.uniqueID + 'small').style.display = fDown ? 'none' : 'inline';
  176.     oMenu.style.display = fDown ? 'inline' : 'none';
  177. }
  178.  
  179. function clickItem(i)
  180. {
  181.     var e = createEventObject();
  182.     e.item = i;
  183.     doselect.fire(e); 
  184.     return false;
  185. }
  186.  
  187. </SCRIPT>
  188. </PUBLIC:COMPONENT>
  189.