home *** CD-ROM | disk | FTP | other *** search
/ Chip 2005 June / CHIP_CD_2005-06.iso / bonus / ds / files / dtSearchEval650.exe / dtSearchDesktop.msi / Data1.cab / dtSFAQ.chm / fh_dhtml.js < prev    next >
Encoding:
JavaScript  |  2005-01-14  |  11.2 KB  |  393 lines
  1. /* Copyright 1998 ForeFront Inc.  All rights reserved.
  2.  
  3.  
  4. This file contains all necessary JavaScript funtions to apply the following
  5. Dynamic HTML effects:
  6.  
  7.     Blend Transitions
  8.     Reveal Transitions
  9.     Application of Visual Filters
  10.     Application of Text Formatting
  11.     Cursor Changes
  12.     Toggle of Display and Visibility Attributes
  13.  
  14. This file is designed to be used with ForeHTML Pro 3.5. */
  15.  
  16.  
  17. /////////////////////////////////////////////////////////////////////////////////////////////
  18.  
  19.  
  20. /********************************************************************************************
  21.  
  22.     ChangeTextFormat (element id, new style values)
  23.  
  24.         - This function can alter the following style attributes:
  25.             fontSize, fontFamily, fontWeight, fontVariant, fontStyle, textDecoration, & verticalAlign
  26.  
  27.         - format of style string:
  28.             fontSize:#;fontFamily:$...
  29.  
  30.         - to leave a default value do not add the attribute to the list
  31.         - to clear an attribute specify a * for example: textDecoration:*
  32.  
  33. *********************************************************************************************/
  34.  
  35.  
  36. function ChangeTextFormat (eID, newStyle) {
  37.  
  38.     var        attr;
  39.     var        value;
  40.     var        index;
  41.  
  42.     if (! FullDHTML ())
  43.         return;
  44.  
  45.     index = newStyle.indexOf (';');
  46.     while (index != -1) {
  47.         attr = newStyle.substring (0, index);    // this is the actual attribute
  48.         newStyle = newStyle.substring (index + 1, newStyle.length);    // chop off the current attribute
  49.  
  50.         index = attr.indexOf (':');
  51.         if (index != -1) {     // we have a valid attribute
  52.             value = attr.substring (index + 1, attr.length);
  53.             attr = attr.substring (0, index);
  54.  
  55.             if (value == '*')
  56.                 value = "";
  57.  
  58.             eID.style[attr] = value;
  59.  
  60.             // go through sub P's, DIV's and SPANS's and set styles there too, they override
  61.             for (i = 0; i < eID.all.tags("p").length; i++) {    
  62.                 sub = eID.all.tags("p")[i];
  63.                 sub.style[attr] = value;
  64.                 }
  65.  
  66.             for (i = 0; i < eID.all.tags("div").length; i++) {    
  67.                 sub = eID.all.tags("div")[i];
  68.                 sub.style[attr] = value;
  69.                 }
  70.  
  71.             for (i = 0; i < eID.all.tags("span").length; i++) {    
  72.                 sub = eID.all.tags("span")[i];
  73.                 sub.style[attr] = value;
  74.                 }
  75.             }
  76.  
  77.         if (newStyle != "")    
  78.             index = newStyle.indexOf (';');
  79.         else
  80.             index = -1;
  81.         }
  82.  
  83.  
  84.     if (newStyle != "") {    // we still have one attr left
  85.         attr = newStyle;
  86.         index = attr.indexOf (':');
  87.         if (index != -1) {     // we have a valid attribute
  88.             value = attr.substring (index + 1, attr.length);
  89.             attr = attr.substring (0, index);
  90.  
  91.             if (value == '*')
  92.                 value = "";
  93.  
  94.             eID.style[attr] = value;
  95.  
  96.             // go through sub P's, DIV's and SPANS's and set styles there too, they override
  97.             for (i = 0; i < eID.all.tags("p").length; i++) {    
  98.                 sub = eID.all.tags("p")[i];
  99.                 sub.style[attr] = value;
  100.                 }
  101.  
  102.             for (i = 0; i < eID.all.tags("div").length; i++) {    
  103.                 sub = eID.all.tags("div")[i];
  104.                 sub.style[attr] = value;
  105.                 }
  106.  
  107.             for (i = 0; i < eID.all.tags("span").length; i++) {    
  108.                 sub = eID.all.tags("span")[i];
  109.                 sub.style[attr] = value;
  110.                 }
  111.             }
  112.         }
  113.     }
  114.  
  115.  
  116.  
  117. /********************************************************************************************
  118.  
  119.     PlayTransition (element ID)
  120.  
  121.         - this function will play an assigned reveal or blend transition
  122.         - the transition must be defined in the style of the object
  123.         - the duration and type (if reveal) must also be defined
  124.         - if the transition has already been played, it will not be played again
  125.         - you must also set in the style: vivibility:hidden; width:auto
  126.  
  127. *********************************************************************************************/
  128.  
  129. function HideObj (eID) {
  130.  
  131.     eID.style.visibility = "hidden";
  132.     }
  133.  
  134.  
  135. function PlayTransition (eID) {
  136.  
  137.     if (! FullDHTML ())
  138.         return;
  139.  
  140.     if (eID.filters.revealTrans) {
  141.         if (eID.filters.revealTrans.status == 0) {
  142.             HideObj (eID);
  143.             eID.filters.revealTrans.apply();
  144.             eID.style.visibility = ""; 
  145.             eID.filters.revealTrans.play();  
  146.             }
  147.         }
  148.     else if (eID.filters.blendTrans) {
  149.         if (eID.filters.blendTrans.status == 0) {
  150.             HideObj (eID);
  151.             eID.filters.blendTrans.apply();
  152.             eID.style.visibility = ""; 
  153.             eID.filters.blendTrans.play();  
  154.             }
  155.         }
  156.     }
  157.  
  158.  
  159. /********************************************************************************************
  160.  
  161.     PlayAllTransitions ()
  162.  
  163.         - this function will be called duing onLoad, all DIV and SPAN objects will be checked
  164.             for playTransOnLoad = 1 attribute
  165.         - the transition must be defined in the style of the object
  166.         - the duration and type (if reveal) must also be defined
  167.         - if the transition has already been played, it will not be played again
  168.         - you must also set in the style: vivibility:hidden; width:auto
  169.  
  170. *********************************************************************************************/
  171.  
  172. var    load_only = 1;
  173.  
  174. function PlayAllTransitions () {
  175.  
  176.     if (! FullDHTML ())
  177.         return;
  178.  
  179.     var        eID;
  180.  
  181.     for (i = 0; i < document.all.tags("div").length; i++) {
  182.         eID = document.all.tags("div")[i];
  183.         if (! load_only || eID.getAttribute ("playTransOnLoad") == 1)
  184.             PlayTransition (eID);
  185.         }
  186.  
  187.     for (i = 0; i < document.all.tags("span").length; i++) {
  188.         eID = document.all.tags("span")[i];
  189.         if (! load_only || eID.getAttribute ("playTransOnLoad") == 1)
  190.             PlayTransition (eID);
  191.         }
  192.  
  193.     for (i = 0; i < document.all.tags("img").length; i++) {
  194.         eID = document.all.tags("img")[i];
  195.         if (! load_only || eID.getAttribute ("playTransOnLoad") == 1)
  196.             PlayTransition (eID);
  197.         }
  198.     }
  199.  
  200. function ReplayAllTransitions () {
  201.     load_only = 0;
  202.     PlayAllTransitions ();
  203.     }
  204.  
  205.  
  206. /********************************************************************************************
  207.  
  208.     ToggleDisplay (element ID)
  209.  
  210.         - this function will toggle the display attribute of an object
  211.         - when hidden, no space in the document will be reserved for this object
  212.  
  213. *********************************************************************************************/
  214.  
  215. function ToggleDisplay (eID) {
  216.  
  217.     if (! FullDHTML ())
  218.         return;
  219.  
  220.     if (eID.style.display == "none")
  221.         eID.style.display = "";
  222.     else
  223.         eID.style.display = "none";
  224.     }
  225.  
  226.  
  227. /********************************************************************************************
  228.  
  229.     ToggleVisibility (element ID)
  230.  
  231.         - this function will toggle the visibility attribute of an object
  232.         - when hidden, space in the document will be reserved for this object
  233.  
  234. *********************************************************************************************/
  235.  
  236. function ToggleVisibility (eID) {
  237.  
  238.     if (! FullDHTML ())
  239.         return;
  240.  
  241.     if (eID.style.visibility == "hidden")
  242.         eID.style.visibility = "visible";
  243.     else
  244.         eID.style.visibility = "hidden";
  245.     }
  246.  
  247.  
  248. /********************************************************************************************
  249.  
  250.     ChangeCursor (element ID, cursor type)
  251.  
  252.         - this function will change the cursor when over the current object
  253.         - to reset value, use cursor type 'auto'
  254.  
  255. *********************************************************************************************/
  256.  
  257. function ChangeCursor (eID, cursorType) {
  258.  
  259.     if (! FullDHTML ())
  260.         return;
  261.     if (eID == '')
  262.         document.body.style.cursor = cursorType;
  263.     else
  264.         eID.style.cursor = cursorType;
  265.     }
  266.  
  267.  
  268. /********************************************************************************************
  269.  
  270.     ApplyFilter (element ID, filter string)
  271.  
  272.         - this function will apply a visible filter to the current object
  273.         - you may only apply one filter at a time
  274.         - to remove the filter set filter string to ""
  275.         - you must set style="width:auto"
  276.         - the syntax of the filter string is for example: ApplyFilter (eID, 'Glow(color=#FF0000,strength=2)')
  277.  
  278. *********************************************************************************************/
  279.  
  280. function ApplyFilter (eID, filterStr) {
  281.  
  282.     if (! FullDHTML ())
  283.         return;
  284.  
  285.     eID.style.filter = filterStr;
  286.     }
  287.  
  288.  
  289. /********************************************************************************************
  290.  
  291.     ChangeImage (element ID, image)
  292.  
  293.         - this function will toggle between two images
  294.         - the original image will be stored in a origImage attribute
  295.         - the secondary image will be stored in secImage attribute
  296.         - if image parameter is non-empty, the image will be set to that image
  297.  
  298. *********************************************************************************************/
  299.  
  300. function ChangeImage (eID, image) {
  301.  
  302.     if (!FullDHTML && ! PartialDHTML ())
  303.         return;
  304.  
  305.     var            orig;
  306.  
  307.     if (eID.imgArray == null) {
  308.         eID.imgArray = new Array (5);
  309.         eID.imgCt = 0;
  310.         }
  311.     
  312.     if (image == "" && eID.imgCt != 0) {
  313.         image = eID.imgArray[eID.imgCt];
  314.         eID.imgCt--;
  315.         eID.src = image;
  316.         }
  317.     else if (image != "") {
  318.         eID.imgCt++;
  319.         eID.imgArray[eID.imgCt] = eID.src;
  320.         eID.src = image;
  321.         }
  322.     }
  323.  
  324. /*****************************************************************************************
  325.  
  326. ChangeImageState (id, image id, visible image, hidden image)
  327.  
  328.     parameter list: 
  329.         id is the ID of the object that, based on display state, will determine image to display
  330.         id_img is the id of the image to change
  331.         img_visible is the file name of the visible image
  332.         img_hidden is the file name of the hidden image
  333.     
  334.     Usage: When using the ToggleDisplay function, this function can be used to change an image based on the state
  335.     of the object being shown or hidden
  336.  
  337. *******************************************************************************************/
  338.  
  339. function ChangeImageState (id, img_id, img_visible, img_hidden) {
  340.  
  341.     if (id.style.display == "none")    // set image to img_hidden
  342.         ChangeImage (img_id, img_hidden);        // ChangeImage defined in FH_DHTML.js
  343.     else
  344.         ChangeImage (img_id, img_visible);
  345.     }
  346.  
  347.  
  348. /******************************************************************************************
  349.  
  350. ToggleGroupDisplay (show object id, hide object id 1, hide object id 2...)
  351.  
  352.     Use this function to toggle the display attribute of a group of objects
  353.  
  354. *******************************************************************************************/
  355.  
  356. function ToggleGroupDisplay () {
  357.  
  358.     // show main object
  359.     if (ToggleGroupDisplay.arguments[0].name != "") {
  360.         if (ToggleGroupDisplay.arguments[0].style.display == "none") {
  361.             ToggleGroupDisplay.arguments[0].style.display = "";
  362.             }
  363.         }
  364.  
  365.     // go through variable array and hide the rest
  366.     for (var i = 1; i < ToggleGroupDisplay.arguments.length; i++) {
  367.         if (ToggleGroupDisplay.arguments[i].style.display == "")
  368.             ToggleGroupDisplay.arguments[i].style.display = "none";
  369.         }
  370.     }
  371.  
  372.  
  373. /******************************************************************************************
  374.  
  375. ToggleGroupVisibility (show object id, hide object id 1, hide object id 2...)
  376.  
  377.     Use this function to toggle the visibility attribute of a group of objects
  378.  
  379. *******************************************************************************************/
  380.  
  381. function ToggleGroupVisibility () {
  382.  
  383.     // show main object
  384.     if (ToggleGroupVisibility.arguments[0].style.visibility == "hidden")
  385.         ToggleGroupVisibility.arguments[0].style.visibility = "visible";
  386.  
  387.     // go through variable array and hide the rest
  388.     for (var i = 1; i < ToggleGroupVisibility.arguments.length; i++) {
  389.         if (ToggleGroupVisibility.arguments[i].style.visibility == "visible")
  390.             ToggleGroupVisibility.arguments[i].style.visibility = "hidden";
  391.         }
  392.     }
  393.