function getPosition(thisDiv){
    var origin_y = 0, origin_x = 0;
    while(thisDiv){
        origin_x += thisDiv.offsetLeft;
        origin_y += thisDiv.offsetTop;
        thisDiv= thisDiv.offsetParent;
    }
    return [origin_x, origin_y];    
}

function clearWipe_x()
  {
	//alert('x ' + listener);
	if (window.wiping_x) clearInterval(wiping_x);
	if (listener == 'x') 
	  {
        // Event Test
		//alert('firing x wipe!');
        onWipeEnd.fire();  
		listener = '';
	  }
  }

function clearUnwipe_x()
  {
	if (window.unwiping_x) clearInterval(unwiping_x);
	if (unlistener == 'x') 
	  {
        // Event Test
		//alert('firing x unwipe!');		
        onUnwipeEnd.fire();  
		unlistener = '';
	  }
  }

function clearWipe_y()
  {
	//alert('y ' + listener);
    if (window.wiping_y) clearInterval(wiping_y);
	if (listener == 'y') 
	  {
        // Event Test
		//alert('firing y wipe!');		
        onWipeEnd.fire();  
		listener = '';
	  }	
  }

function clearUnwipe_y()
  {
	if (window.unwiping_y) clearInterval(unwiping_y);
	if (unlistener == 'y') 
	  {
        // Event Test
		//alert('firing y unwipe!');		
        onUnwipeEnd.fire();  
		unlistener = '';
	  }		
  }



function unWipeThis_x(curtain, x_total_width, x_direction, pos_adjust_x, interval)
  {
	dark = document.getElementById(curtain);  
	//alert("total width= " + x_total_width);
	//alert("direction= " + x_direction);
	// Calculate the current width and height
	    //alert("curtain scroll= " + dark.style.width);

        if ( dark && ( dark.scrollWidth ) ) 
		  {
            var divWidth = dark.scrollWidth;
          }
		else if ( dark.offsetWidth ) 
		       {
                 var divWidth = dark.offsetWidth;
			   }
			 else
			   {
                 var divWidth= parseInt(dark.style.width);
               }   	  

        var x_curr_width = divWidth;
	
    if ((x_curr_width + x_direction < x_total_width && x_direction > 0) || (x_curr_width + x_direction > x_total_width && x_direction < 0))
	  {
		  //Still wiping
		  //var quit = confirm("unwiping! " + x_curr_width + "  " + x_total_width + "  " + x_direction);
		  //if (!quit) clearUnwipe();
		  x_curr_width += x_direction;
	  }
	else
	  {
  		  //alert("Done! " + x_curr_width + "  " + x_total_width + "  " + x_direction);
		  // Done wiping
		  clearUnwipe_x();
		  x_curr_width = x_total_width;
	  }
          //alert(x_curr_width.toString() + 'px');	
	      dark.style.width = (x_curr_width.toString() + 'px');
          var new_pos_x = parseInt(dark.style.left) + pos_adjust_x;
          dark.style.left = new_pos_x.toString() + 'px';
	      //alert("after")
	return;
  }

function unWipeThis_y(curtain, y_total_height, y_direction, pos_adjust_y, interval)
  {
	dark = document.getElementById(curtain);  
	//alert("total width= " + x_total_width);
	//alert("direction= " + x_direction);
	// Calculate the current width and height
	    //alert("curtain scroll= " + dark.style.width);

        if ( dark && ( dark.scrollHeight ) ) 
		  {
            var divHeight = parseInt(dark.scrollHeight);
          }
		else if ( dark.offsetHeight ) 
		       {
                 var divHeight = parseInt(dark.offsetHeight);
			   }
			 else
			   {
                 var divHeight= parseInt(dark.style.height);
               }   	  

        var y_curr_height = divHeight;
	
    if ((y_curr_height + y_direction < y_total_height && y_direction > 0) || (y_curr_height + y_direction > y_total_height && y_direction < 0))
	  {
		  //Still wiping
		  //var quit = confirm("unwiping! " + y_curr_height + "  " + y_total_height + "  " + y_direction + "  " + dark.style.top);
		 // if (!quit) clearUnwipe_y();
		  y_curr_height += y_direction;
		  
		  
	  }
	else
	  {
  		  //alert("Done! " + x_curr_width + "  " + x_total_width + "  " + x_direction);
		  // Done wiping
		  clearUnwipe_y();
		  y_curr_height = y_total_height;
		  
          
	  }


          //alert(x_curr_width.toString() + 'px');	
  	      dark.style.height= (y_curr_height.toString() + 'px');
          var new_pos_y = parseInt(dark.style.top) + pos_adjust_y;
          dark.style.top = new_pos_y.toString() + 'px';
          //alert("after")
	return;
  }



function wipeThis_x(curtain, x_total_width, x_direction, pos_adjust_x, fullwipe, interval)
  {
	dark = document.getElementById(curtain);  
	//alert("total width= " + x_total_width);
	//alert("direction= " + x_direction);
	// Calculate the current width and height
	    //alert("curtain scroll= " + dark.style.width);

        if ( dark && ( dark.scrollWidth ) ) 
		  {
            var divWidth = dark.scrollWidth;
          }
		else if ( dark.offsetWidth) 
		       {
                 var divWidth = dark.offsetWidth;
			   }
			 else
			   {
                 var divWidth= parseInt(dark.style.width);
               }   	  

        var x_curr_width = divWidth;
	
    if ((x_curr_width + x_direction < x_total_width && x_direction > 0) || (x_curr_width + x_direction > x_total_width && x_direction < 1))
	  {
		  // Still wiping
		  //var quit = confirm("wiping! " + x_curr_width + "  " + x_total_width + "  " + x_direction + "  " + dark.style.width);
		  //if (!quit) clearWipe();
		  x_curr_width += x_direction;
	  }
	else
	  {
  		  //alert("Done! " + x_curr_width + "  " + x_direction);
		  // Done wiping
		  clearWipe_x();
		  x_curr_width = x_total_width;

		  //alert("xdirection= " + x_direction);
		  if (fullwipe)
			{
      		  x_direction = x_direction * (-1);
			  pos_adjust_x = pos_adjust_x * (-1);
              unwiping_x = setInterval("unWipeThis_x('" + curtain + "', " + 0 + ", " + x_direction + ", " + pos_adjust_x + ")", interval);


			}
	  }
	      //alert(x_curr_width.toString() + 'px');	
	      dark.style.width = (x_curr_width.toString() + 'px');
          var new_pos_x = parseInt(dark.style.left) + pos_adjust_x;
          dark.style.left = new_pos_x.toString() + 'px';
	      //alert("after")
  }


function wipeThis_y(curtain, y_total_height, y_direction, pos_adjust_y, fullwipe, interval)
  {
	dark = document.getElementById(curtain);  
	//alert("total width= " + x_total_width);
	//alert("direction= " + x_direction);
	// Calculate the current width and height
	    //alert("curtain scroll= " + dark.style.width);
    var final_loop = false;
        if ( dark && ( dark.scrollHeight ) ) 
		  {
            var divHeight = dark.scrollHeight;
          }
		else if ( dark.offsetHeight) 
		       {
                 var divHeight = dark.offsetHeight;
			   }
			 else
			   {
                 var divHeight= parseInt(dark.style.height);
               }   	  

        var y_curr_height = divHeight;
	
	
    if ((y_curr_height + y_direction < y_total_height && y_direction > 0) || (y_curr_height + y_direction > y_total_height && y_direction < 1))
	  {
		  // Still wiping
		  //var quit = confirm("wiping! " + y_curr_height + "  " + y_total_height + "  " + y_direction + "  " + dark.style.height);
		  //if (!quit) clearWipe_y();
		  y_curr_height += y_direction;
	  }
	else
	  {
  		  //alert("Done! " + x_curr_width + "  " + x_direction);
		  // Done wiping
		  clearWipe_y();
		  var y_diff = y_total_height - y_curr_height;
		  y_curr_height = y_total_height;
		  y_direction = y_direction * (-1);
		  
		  //alert("xdirection= " + x_direction);
		  if (fullwipe)
		    {
   			  pos_adjust_y = pos_adjust_y * (-1);
     		  unwiping_y = setInterval("unWipeThis_y('" + curtain + "', " + 0 + ", " + y_direction + ", " + pos_adjust_y + ")", interval);
			  var temp_pos_y = parseInt(dark.style.top) - y_diff;
			  //alert('diff y= ' + y_diff);
			 // alert('pos adjust y= ' + pos_adjust_y);
			 // alert('adjusted pos y= ' + temp_pos_y);
			  final_loop = true;
			  dark.style.top = temp_pos_y.toString() + 'px';
			}

	    }
	      //alert(x_curr_width.toString() + 'px');	
		  //if (final_loop) alert('final height y= ' + dark.style.height);
	      dark.style.height = (y_curr_height.toString() + 'px');
		  //if (final_loop) alert('holding....' + y_total_height);
          var new_pos_y = parseInt(dark.style.top) + pos_adjust_y;
          if (!final_loop) dark.style.top = new_pos_y.toString() + 'px';
		  //if (final_loop) alert('final pos y= ' + dark.style.top);
		  
	      //alert("after")
  }



function wipeDiv(wipe, element, options)
  {
	//listener = '';
	//unlistener = '';
	clearWipe_x();
	clearUnwipe_x();
	clearWipe_y();
	clearUnwipe_y();
	
  // Pass true to gray out screen, false to ungray
  // options are optional.  This is a JSON object with the following (optional) properties
  // opacity:0-100         // Lower number = less grayout higher = more of a blackout 
  // zindex: #             // HTML elements with a higher zindex appear on top of the gray out
  // bgcolor: (#xxxxxx)    // Standard RGB Hex color code
  // cornertop: {integer} // Starting top point of wipe
  // cornerleft: {integer} // Starting left point of wipe
  // grayOut(true, {'zindex':'50', 'bgcolor':'#0000FF', 'opacity':'70'});
  // Because options is JSON opacity/zindex/bgcolor are all optional and can appear
  // in any order.  Pass only the properties you need to set.

    var options = options || {}; 
    var zindex = options.zindex || 150;
    var opacity = options.opacity || 70;
    var opaque = (opacity / 100);
    var bgcolor = options.bgcolor || '#000000';
	var element = element || 'body';
	var start_dir_x = options.start_dir_x || 'left';
	var start_dir_y = options.start_dir_y || 'top';
	var interval = options.interval || 30;
	var unwipe = options.unwipe || false;
	var fullwipe = options.fullwipe || true;
	var x_direction = options.x_direction || 8;
	var y_direction = options.y_direction || 0;
	var curtain_name = options.curtain_name || 'wipeObject';
// Widths and positions for starting wipe
    
    //alert("In Greywipe!");

    //alert(element);
	if (element != 'body') target = document.getElementById(element);
	else target = document.body;
    
	var position = getPosition(target);
	// Add code to offset for IE and FF.....

	var y_offset = 0;
	var x_offset = -8;


    // get target div width and height
    if ( target && ( target.scrollWidth || target.scrollHeight ) ) 
      {
        var divWidth = target.scrollWidth;
        var divHeight = target.scrollHeight;
      }
	else if ( target.offsetWidth || target.offsetHeight)
	       {
             var divWidth = target.offsetWidth;
             var divHeight = target.offsetHeight;
		   }
		 else
		   {
             var divWidth= parseInt(target.style.width);
             var divHeight= parseInt(target.style.height);
           }   	  

	if (unwipe)
	  {
		var x_curr_width = divWidth;
        var y_curr_height = divHeight;
	  }
	else
	  {
        var x_curr_width = 1;
	    var y_curr_height = 1;
	  }

    // Code to reverse the wipe direction
    if (start_dir_x == 'left')
	  { 
        var start_x_offset = 0;
    	var position_x_adjust = 0;
	  }
	else
	  {
		var start_x_offset = divWidth;  
		var position_x_adjust = x_direction * (-1);  
	  }
	  
    if (start_dir_y == 'top')	  
      {
		var start_y_offset = 0;
    	var position_y_adjust = 0;
	  }
	else
	  {
		var start_y_offset = divHeight - 1;
    	var position_y_adjust = y_direction * (-1);
      }


	//Then, correct offsets to account for starting wipe position...
	var cornerleft = position[0] + x_offset + start_x_offset;
	var cornertop = position[1] + y_offset + start_y_offset;
    

    //alert(cornerleft);
	//set the starting point for the div rectangle
	
	var origin_x = cornerleft.toString() + "px";
	var origin_y = cornertop.toString() + "px";
	
    var dark=document.getElementById(curtain_name);
    if (!dark) 
	  {
		// The dark layer doesn't exist, it's never been created.  So we'll
        // create it here and apply some basic styles.
        // If you are getting errors in IE see: http://support.microsoft.com/default.aspx/kb/927917
        var tbody = document.getElementsByTagName("body")[0];
        var tnode = document.createElement('div');           // Create the layer.
            tnode.style.position='absolute';                 // Position absolutely
            tnode.style.top= origin_y;                           // In the top
            tnode.style.left= origin_x;                          // Left corner of the page
            tnode.style.overflow='hidden';                   // Try to avoid making scroll bars
            tnode.style.display='none';                      // Start out Hidden
            tnode.id=curtain_name;                   // Name it so we can find it later
        tbody.appendChild(tnode);                            // Add it to the web page
        dark=document.getElementById(curtain_name);  // Get the object.
	  }
	else
	  {
		//alert('wipeObject exists!'); 
		dark.style.left = origin_x;
		dark.style.top = origin_y;
	  }
	if (wipe)
	  {
		  // Calculate the div width and height
		  // Check if BODY!!!
		  // If body, use scrollWidth or offsetWidth for size!!
		  // FIX LATER
        
        //alert('divWidth= ' + divWidth);
        var x_total_width = divWidth;
		var y_total_height = divHeight;
		//alert("total width= " + x_total_width + " total height= " + y_total_height);
		//alert("curr width= " + x_curr_width + " curr height= " + y_curr_height);
        //set the shader to cover the entire page and make it visible.
        dark.style.opacity=opaque;                      
        dark.style.MozOpacity=opaque;                   
        dark.style.filter='alpha(opacity='+opacity+')'; 
        dark.style.zIndex=zindex;        
        dark.style.backgroundColor=bgcolor;
		if (x_direction != 0) dark.style.width = x_curr_width.toString() + 'px';
		else dark.style.width = x_total_width.toString() + 'px';
        if (y_direction != 0) dark.style.height= y_curr_height.toString() + 'px';
		else dark.style.height = y_total_height.toString() + 'px';
		
		dark.style.display='block'; 
		//alert(x_total_width + '  ' + x_direction + '  ' + fullwipe + '  ' + interval);

        listener = 'x';
		unlistener = 'x';
		

        if (unwipe)
		  {
			x_direction = x_direction * (-1);
		    y_direction = y_direction * (-1);
			position_x_adjust = position_x_adjust * (-1);
			position_y_adjust = position_y_adjust * (-1);			
            if (x_direction != 0)
  		      {
                unwiping_x = setInterval("unwipeThis_x('" + curtain_name + "', 0, " + x_direction + ", " + position_x_adjust + ", " + interval + ")", interval);
				
				if (Math.abs(x_total_width) > Math.abs(y_total_height))
					  {
         				unlistener = 'x';						  
					  }
				
		      }
            if (y_direction != 0)
	    	  {
                unwiping_y = setInterval("unwipeThis_y('" + curtain_name + "', 0, " + y_direction + ", " + position_y_adjust + ", " + interval + ")", interval);
				if (Math.abs(y_total_height) > Math.abs(x_total_width))
					  {
         				unlistener = 'y';
					  }
		      }
			else unlistener = 'x';
		  }
        else
		  {
            if (x_direction != 0)
	    	  {
                wiping_x = setInterval("wipeThis_x('" + curtain_name + "', " + x_total_width + ", " + x_direction + ", " + position_x_adjust + ", " + fullwipe + ", " + interval + ")", interval);
				if (y_direction != 0)
				  {
					if (Math.abs(x_total_width) > Math.abs(y_total_height))
					  {
         				listener = 'x';
						unlistener = 'x';
					  }
					else 
					  {
						listener = 'y';
						unlistener = 'y';
					  }
					
				  }
		        else
				  {
					listener = 'x';
				    unlistener = 'x';
				  }
			    //alert('listener= ' + listener);				
				
}
            if (y_direction != 0)
		      {
                wiping_y = setInterval("wipeThis_y('" + curtain_name + "', " + y_total_height + ", " + y_direction + ", " + position_y_adjust + ", " + fullwipe + ", " + interval + ")", interval);
				if (x_direction != 0)
				  {
					if (Math.abs(y_total_height) > Math.abs(x_total_width))
					  {
         				listener = 'y';	
						unlistener = 'y';
					  }
					else
					  {
						listener = 'x';
						unlistener = 'x';
						  
					  }
				  }
		        else
				  {
					listener = 'y';
					unlistener = 'y';
				  }

				//alert('listener= ' + listener);
		      }
		  }
      }
	else
	  {
        dark.style.display='none';
      }
 

  }