home *** CD-ROM | disk | FTP | other *** search
/ Joystick Magazine 2003 November / CD1_JOY_153.iso / demos / NHL2004Demo.exe / fe / nhl / htc / tab / TabStrip.htc < prev    next >
Text File  |  2003-08-20  |  7KB  |  224 lines
  1. <!-- Copyright (c) 2002 Electronic Arts Inc. All rights reserved. -->
  2.  
  3. <public:component tagname="TabStrip" lightweight=true >
  4.  
  5. <public:property    name='imgSrc'            />
  6. <public:property    name='imgHeight'        />
  7. <public:property    name='imgWidth'            />
  8.  
  9. <public:attach    event='onselectstart'     handler='cancelcursorselect' />
  10. <public:attach event="ondocumentready" onevent="DoInit()" />
  11.  
  12. </public:component>
  13.  
  14. <script language="javascript">
  15.     element.style.visibility ='hidden';
  16.     var aImgs            = new Array();
  17.     var pngHeight;
  18.     var pngWidth;   
  19. function DoInit(){
  20.     var oTable              = element.document.createElement("TABLE");
  21.     var oTBody              = element.document.createElement("TBODY");
  22.     var oRow                = element.document.createElement("TR");
  23.     var oBody               = element.document.createElement("BODY");
  24.     var oHtml               = element.document.createElement("HTML");
  25.     var oCell ;
  26.     var oFirstTab;
  27.     imgSrc ? aImgs["normal"] = System.getInstallFolder()  + imgSrc : aImgs["normal"] = GetInstallFolder() + "/fe/NHL/htc/tab/tab_nml.png";    
  28.     aImgs["down"] = aImgs["normal"].toString().replace(/nml/ , "dwn");
  29.     pngHeight = imgHeight ? imgHeight : "20px";
  30.     pngWidth  = imgWidth ? imgWidth : "115px";
  31.     setDefaults();
  32.     with( oTable.style )
  33.     {
  34.         fontSize    = currentStyle.fontSize;
  35.         fontWeight  = currentStyle.fontWeight;
  36.         visible     = 'visible';
  37.         position    = 'absolute';
  38.         left        = "0px";
  39.         top         = "0px";
  40.     }
  41.         
  42.     with( oTable )
  43.     {
  44.         cellSpacing     = 0;
  45.         cellPadding     = 0;
  46.         border          = 0;
  47.     }
  48.     
  49.     with( oBody.style )
  50.     {
  51.         background  = 'transparent';
  52.         left        = "0px";
  53.         top         = "0px";
  54.     }    
  55.      
  56.     for (var tabIndex =0 ; tabIndex < element.children.length ; tabIndex++)
  57.         {
  58.             if(element.children[tabIndex].tagName.indexOf('Tab') != -1)
  59.             {
  60.                 oCell           = window.document.createElement( "TD" );
  61.                 var sPageAttr   = element.children[tabIndex].getAttribute( "page" );
  62.                 oDiv            = createButtonElement( element.children[tabIndex].innerText )
  63.                 
  64.                 oDiv.setAttribute( "page" , sPageAttr )
  65.                 oCell.appendChild( oDiv );
  66.                 oRow.appendChild( oCell );
  67.                 if(!tabIndex)oFirstTab = oDiv;
  68.              }
  69.         }
  70.         
  71.     oTBody.appendChild( oRow );
  72.     oTable.appendChild( oTBody );
  73.     oBody.appendChild(  oTable );
  74.     oHtml.appendChild(  oBody );
  75.    
  76.     defaults.viewLink = oHtml.document;
  77.     
  78.     selectFirstTab( oFirstTab );
  79.     
  80.     element.style.visibility ='visible';
  81. }  
  82.   
  83. function setDefaults() 
  84. {
  85.     NormalDefault("fontFamily",        "Times New Roman",    "Arial");
  86.     NormalDefault("fontSize",         "12pt",                "10pt");
  87.     NormalDefault("fontWeight",     "400",                "100");
  88.     
  89.     CustomDefault("nml-text-color",    "nmlTextColor",     "blue");       
  90.     CustomDefault("hov-text-color",    "hovTextColor",   "blue");
  91.     CustomDefault("dwn-text-color",    "dwnTextColor",     "black");
  92. }
  93.  
  94. function NormalDefault(sCSSName, sIEDefault, sDefault)
  95. {
  96.    if (currentStyle[sCSSName] == sIEDefault 
  97.        && (style[sCSSName] == "" || style[sCSSName] == null))
  98.    {
  99.        style[sCSSName] = sDefault;
  100.    }
  101.    else style[sCSSName] = currentStyle[sCSSName];
  102. }
  103.  
  104. function CustomDefault(sCSSName, sScriptName, sDefault)
  105. {
  106.    if (currentStyle[sCSSName] == null)
  107.    {
  108.        style[sCSSName] = sDefault;
  109.    }
  110.    else style[sCSSName] = currentStyle[sCSSName];
  111.    
  112.    style[sScriptName] = style[sCSSName];
  113. }
  114.             
  115. function selectFirstTab( oSelEl )
  116. {
  117.     oSelEl.style.color          = element.currentStyle.dwnTextColor;
  118.     oSelEl.style.filter         = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + aImgs["down"].toString() + ",sizingMethod=crop)";        
  119.     
  120.     oSelEl.document.body.setAttribute( "selected" , oSelEl.id );
  121.     
  122.     showPage( oSelEl )
  123. }
  124.  
  125. function createButtonElement( sText )
  126. {
  127.     oDiv            = window.document.createElement( "DIV" );
  128.     oDiv.innerText  = sText;
  129.     
  130.     with(oDiv)
  131.     {
  132.         id                      = sText;
  133.         name                    = sText;
  134.         onmousedown                = OnButtonDwn;
  135.         onmouseup                = MoveUp;
  136.         onmouseenter            = OnButtonHover;
  137.         onmouseleave            = OnButtonLeave;    
  138.     }
  139.     with(oDiv.style)
  140.     {
  141.         top                 = "0px";
  142.         left                = "0px";
  143.         width               = pngWidth;
  144.         height              = pngHeight;
  145.         color               = element.currentStyle.nmlTextColor;
  146.         fontFamily          = element.currentStyle.fontFamily;
  147.         cursor              = 'hand';
  148.         zIndex              = 100;
  149.         textAlign           = 'center';
  150.         filter              = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + aImgs["normal"].toString() + ",sizingMethod=crop)";
  151.         
  152.     }
  153.     return oDiv;
  154. }
  155.  
  156. function OnButtonDwn()
  157. {
  158.     var oSelectedEl         = event.srcElement;
  159.     var selectedId          = oSelectedEl.document.body.getAttribute("selected")
  160.     var oPreviousEl         = oSelectedEl.document.getElementById(selectedId);
  161.  
  162.     if(oPreviousEl != null && oSelectedEl.id != selectedId) unselect( oPreviousEl );
  163.  
  164.     if(oSelectedEl.id != selectedId) select( oSelectedEl );
  165. }
  166.  
  167. function MoveUp()
  168. {
  169.     event.cancelBubble = true;
  170.     return false;
  171. }
  172.  
  173. function OnButtonHover()
  174. {
  175.     var oSelectedEl     = event.srcElement;
  176.     var selectedId      = oSelectedEl.document.body.getAttribute( "selected" );
  177.     
  178.     if(oSelectedEl.id != selectedId) oSelectedEl.style.color = element.currentStyle.hovTextColor;
  179. }
  180.  
  181. function OnButtonLeave()
  182. {
  183.     var oSelectedEl     = event.srcElement;
  184.     var selectedId      = oSelectedEl.document.body.getAttribute( "selected" );
  185.     
  186.     if(oSelectedEl.id != selectedId) oSelectedEl.style.color = element.currentStyle.nmlTextColor;
  187. }
  188.  
  189. function select(oSelEl)
  190. {
  191.     oSelEl.style.color      = element.currentStyle.dwnTextColor;
  192.     oSelEl.style.filter     = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + aImgs["down"].toString() + ",sizingMethod=crop)";    
  193.     oSelEl.document.body.setAttribute( "selected" , oSelEl.id );
  194.     showPage(oSelEl);
  195. }
  196.  
  197. function showPage(oSelPage)
  198. {
  199.     var sPageAttr   = oSelPage.getAttribute( "page" );
  200.     var oDivPage    = window.document.getElementById( sPageAttr );
  201.     oDivPage.style.visibility ='visible';
  202. }
  203.  
  204. function hidePage(oPreEl)
  205. {
  206.     var sPageAttr   = oPreEl.getAttribute( "page" );
  207.     var oDivPage    = window.document.getElementById( sPageAttr );
  208.     oDivPage.style.visibility = 'hidden';
  209. }
  210.  
  211. function unselect(oPreEl)
  212. { 
  213.     oPreEl.style.color      = element.currentStyle.nmlTextColor;
  214.     oPreEl.style.filter     = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + aImgs["normal"].toString() + ",sizingMethod=crop)";        
  215.     hidePage(oPreEl);
  216. }
  217.  
  218. function CancelCursorSelect() 
  219. { 
  220.     event.cancelBubble  = true;
  221.     event.returnValue   = false;
  222. }
  223. </script>
  224.