// Constants
var LX_MENU_ITEMS             = new Array();
var LX_NAV_TIMEOUT            = 10; //ms for each loop - normal 10
var LX_SUBITEM_HEIGHT         = 13;
var LX_SUBITEM_WIDTH          = 175;
var LX_ANIMATION_INDENT       = 1;  // 2 the value that shows show much we increase/decrease the Animation offset on each loop (in px)
var LX_SUBMENU_CONTAINER      = "lx_subitem_block_";  // id-prefix of layer containing the submenu
var LX_BEFORE_SUBMENU_DIV     = "lx_pre_subitems_";   // id-prefix of layer positioned before the submenu
var LX_AFTER_SUBMENU_DIV      = "lx_suf_subitems_";   // id-prefix of layer positioned after the submenu
var LX_SPACE_PREFIX           = "space_image_";             // id-prefix of space image, used for expanding the main navigation

var lx_opened_menu_id         = null; // node_id of the submenu that is already opened
var lx_open_menu_image        = 0;    // image_name of the submenu that is open
var lx_menu_id_opening        = null; // node_id of the submenu that is in process of opening
var lx_all_steps              = 0;    // all the steps for the animation
var lx_animation_handle       = null;

var jdebug                    = false;
var jdebug2                   = false;

/**
* LxOpenSubmenu - opens submenu, it is called onclick of menuitem
* @param image_name - menuitem image name
* @param node_id    - menuitem node_id
* @return none
*/
function LxOpenSubmenu ( image_name, node_id ) {
   if (jdebug) alert("LxOpenSubmenu image_name = " + image_name + " node_id = " + node_id);
    
   if (lx_opened_menu_id > 0 ) {
      if (jdebug) alert(2);
        
      if ( lx_opened_menu_id == node_id ) {
         if (jdebug) alert(3);

         // the same submenu is already opened... close it
         MouseOver( image_name ); // changes the Imagen generated image
         lx_menu_id_opening = node_id;
         LxCloseAnimation ( lx_opened_menu_id, null, image_name);

      } else {
         if (jdebug) alert(4);
        
         //another submenu is already open, close it and open the new one
         MouseOver( image_name );
         lx_menu_id_opening = node_id;
         LxCloseAnimation ( lx_opened_menu_id, node_id, image_name);
      }
   } else {
      /* JohA: */
      if (jdebug) alert("5 mouseover image_name = " + image_name + " lx_open_menu_image = " + lx_open_menu_image);  
      MouseOut ( lx_open_menu_image );

      lx_menu_id_opening = node_id;
     /* /JohA */
            
      //open the submenu
      LxOpenAnimation ( image_name, node_id );
      if (jdebug) alert("6 efter LxOpenAnimation");  

   }
}

/**
* LxOpenAnimation - starts open animation
* @param image_name - menuitem image name
* @param node_id    - menuitem node_id
* @return none
*/
function LxOpenAnimation ( image_name, node_id ) {

   lx_open_menu_image = image_name;
   MouseOver( image_name );
   if (jdebug) alert("LxOpenAnimation MouseOver image_name = " + image_name + " node_id = " + node_id);

   if ( LX_MENU_ITEMS[node_id].length == 0 ) {
       if (jdebug) alert("LxOpenAnimation return node_id = " + node_id);
       return;
   }

   lx_opened_menu_id = node_id;
   lx_menu_id_opening = null;

   var layer_height   = LxSubMenuHeight ( node_id );
   
   LxShowLayer ( LX_BEFORE_SUBMENU_DIV + node_id );
   LxShowLayer ( LX_AFTER_SUBMENU_DIV + node_id );

   lx_all_steps = Math.round( ( 1 + Math.sqrt( 1 + ( 8 * layer_height ) / LX_ANIMATION_INDENT ) ) / 2 );

   document.getElementById ( LX_SUBMENU_CONTAINER + node_id ).style.position = 'absolute';

   LxClipLayer ( node_id, 0, 0, 0, 0 );

   LxShowLayer ( LX_SUBMENU_CONTAINER + node_id );
   LxShowLayer ( LX_SPACE_PREFIX + node_id );

   window.clearTimeout( lx_animation_handle );
   lx_animation_handle = window.setTimeout( 'LxRunAnimation(' + node_id + ',0 )', LX_NAV_TIMEOUT );
}

/**
* LxCloseAnimation - starts close animation
* @param node_id      - menuitem node_id
* @param node_id_open - node_id of the next menuitem to open
* @param image_name   - menuitem image name
* @return none
*/
function LxCloseAnimation ( node_id, node_id_open, image_name) {
   if ( LX_MENU_ITEMS[node_id].length == 0 ) {
       return;
   }

   var layer_height   = LxSubMenuHeight ( node_id );
   
   lx_all_steps = Math.round( ( 1 + Math.sqrt( 1 + ( 8 * layer_height ) / LX_ANIMATION_INDENT ) ) / 2 );

   window.clearTimeout( lx_animation_handle );
   LxRunAnimation( node_id, 1, "LxOnCloseAnimation(" + node_id + "," + node_id_open + ",'" + image_name + "')");
}

/**
* LxOpenAnimation - run animation loops
* @param node_id     - menuitem node_id
* @param direction   - direction of the animation 0 - forward, 1 - backward
* @param callback    - function called after the animation ends
* @param top         - top clipping param
* @param right       - right clipping param
* @param bottom      - bottom clipping param
* @param left        - left clipping param
* @param step        - current loop number
* @return none
*/
function LxRunAnimation(node_id, direction, callback, top, right, bottom, left, step) {
   if ( typeof( top ) == 'undefined' )       top      = 0;
   if ( typeof( right ) == 'undefined' )     right    = LX_SUBITEM_WIDTH;
   if ( typeof( bottom ) == 'undefined' )    bottom   = direction == 0 ? 0 : LxSubMenuHeight ( node_id );
   if ( typeof( left ) == 'undefined' )      left     = 0;
   if ( typeof( step ) == 'undefined' )      step     = 0;
   if ( typeof( callback ) == 'undefined' )  callback = 'void(null);';

   LxClipLayer ( node_id, top, right, bottom, left );

   if ( ( direction == 0 && bottom == LxSubMenuHeight ( node_id ) ) ||
        ( direction == 1 && bottom == 0 ) ) {
      eval( callback );
      return;
   }

   var direction_step = direction == 0 ? lx_all_steps - step : step;
   var dir_sign       = direction == 0 ? 1 : -1;
   var new_bottom     = bottom + LX_ANIMATION_INDENT * direction_step * dir_sign;
   step++;
   
   if ( direction == 1 && new_bottom < 0 ) {
      new_bottom = 0;
   }

   if ( direction == 0 && bottom > LxSubMenuHeight ( node_id ) ) {
      new_bottom = LxSubMenuHeight ( node_id );
   }

   lx_animation_handle = window.setTimeout( 'LxRunAnimation(' + node_id + ',' + direction + ',"' + callback + '",' + top + ',' + right + ',' + new_bottom + ',' + left + ',' + step + ')', LX_NAV_TIMEOUT );
}

/**
* LxOnCloseAnimation - function evaluated at the end of close animation
* @param node_id      - menuitem node_id
* @param node_id_open - node_id of the next menuitem to open
* @param image_name   - menuitem image name
* @return none
*/

function LxOnCloseAnimation ( node_id, node_id_open, image_name ) {
      if (jdebug) alert("LxOnCloseAnimation node_id = " + node_id + " node_id_open = " + node_id_open + " image_name = " + image_name);
      
      LxHideLayer ( LX_BEFORE_SUBMENU_DIV + node_id );
      LxHideLayer ( LX_AFTER_SUBMENU_DIV + node_id );
      MouseOut ( lx_open_menu_image );
      lx_open_menu_image = null;
      lx_opened_menu_id = 0;
      if ( node_id_open ) {
         LxOpenAnimation ( image_name, node_id_open );
      }
}

/**
* LxUpdateCurrent - update the current menuitem, i.e display its submenu if any
* @param current      - currency flag, 0 - not current, 1 - current
* @param image_name   - menuitem image name
* @param node_id      - menuitem node_id
* @return none
*/
function LxUpdateCurrent ( current, image_name, node_id ) {
   if (jdebug2) alert("LxUpdateCurrent current = " + current + " image_name = " + image_name + " node_id = " + node_id);
   if ( current ) {
      if ((LX_MENU_ITEMS[node_id] == null) || (LX_MENU_ITEMS[node_id].length == 0)) {
       return;
      }
      LxSubmenuDisplay ( node_id, image_name );
   } else {
      eval ("si_current_" + node_id + " = false;");
      LxMouseOut (image_name, node_id);
   }
}

/**
* LxUpdateCurrent - update the current subitem, i.e display its containing layer
* @param current      - currency flag, 0 - not current, 1 - current
* @param image_name   - menuitem image name
* @param parent_id    - parent menuitem node_id
* @param parent_image   - parent menuitem image name
* @return none
*/
function LxCurrentSubItem ( image_name, current, parent_id, parent_image ) {
   if ( current ) {
      MouseOver( image_name );
/*
      MouseOver( parent_image );
*/
      MouseOver( "image_" + parent_id );
      LxSubmenuDisplay ( parent_id, parent_image );
   } else {
   }
}

/**
* LxSubmenuDisplay - displays the submenu without animation
* @param node_id      - menuitem node_id
* @param image_name   - menuitem image name
* @return none
*/
function LxSubmenuDisplay ( node_id, image_name ) {
   if ((LX_MENU_ITEMS[node_id] == null) || ( LX_MENU_ITEMS[node_id].length == 0 )) {
       return;
   }
   lx_opened_menu_id = node_id;
   lx_open_menu_image = image_name;

   LxShowLayer ( LX_BEFORE_SUBMENU_DIV + node_id );
   LxShowLayer ( LX_AFTER_SUBMENU_DIV + node_id );

   document.getElementById ( LX_SUBMENU_CONTAINER + node_id ).style.position = 'absolute';

   LxShowLayer ( LX_SUBMENU_CONTAINER + node_id );
   LxShowLayer ( LX_SPACE_PREFIX + node_id );

   document.getElementById ( LX_SPACE_PREFIX + node_id).height = LxSubMenuHeight ( node_id );
}

/**
* LxMouseOut - mouseout of menuitem
* @param node_id      - menuitem node_id
* @param image_name   - menuitem image name
* @return none
*/
function LxMouseOut ( image_name, node_id) {
   // if submenu opened or in process of opening do nothing

   if ( lx_opened_menu_id == node_id || lx_menu_id_opening == node_id 
        || SK__IsCurrentPage(node_id)) {
        return;
   }

   MouseOut ( image_name ); // changes the Imagen generated image
   eval ("si_current_" + node_id + " = false;");
}

/**
* LxClipLayer - clips submenu layer, changes the space image height to expand the main navigation
* @param node_id      - menuitem node_id
* @param top         - top clipping param
* @param right       - right clipping param
* @param bottom      - bottom clipping param
* @param left        - left clipping param
* @return none
*/
function LxClipLayer ( node_id, top, right, bottom, left ) {
   document.getElementById ( LX_SPACE_PREFIX + node_id).height = bottom;
   
   var subitems_container = document.getElementById ( LX_SUBMENU_CONTAINER + node_id );
//   subitems_container.style.clip = "rect(" + top + "," + right + "," + bottom + "," + left + ")";
   subitems_container.style.clip = "rect(" + top + "px," + right + "px," + bottom + "px," + left + "px)";

/*
 alert("3 LxClipLayer " + LX_SUBMENU_CONTAINER + node_id + 
    " rect(" + top + "," + right + "," + bottom + 
    "," + left + ")" + " clip after set: " + subitems_container.style.clip);
*/
}

/**
* LxSubMenuHeight - gets the submenu layer height
* @param node_id     - menuitem node_id
* @return submenu layer height
* @type Integer
*/
function LxSubMenuHeight ( node_id ) {
   return LX_MENU_ITEMS[node_id].length * LX_SUBITEM_HEIGHT;
}

/**
* LxShowLayer - shows layer
* @param id    - layer id
* @return none
*/
function LxShowLayer ( id ) {
   if ( document.getElementById( id ) && typeof document.getElementById( id ) != 'undefined' ) {
      document.getElementById( id ).style.display = "block";
   }
}

/**
* LxHideLayer - hides layer
* @param id    - layer id
* @return none
*/
function LxHideLayer ( id ) {
   if ( document.getElementById( id ) && typeof document.getElementById( id ) != 'undefined' ) {
      document.getElementById( id ).style.display = "none";
   }
}