/**
 *************************************
 * Page load actions
 *************************************
 */
document.observe("dom:loaded", function(){
    // Setting the h1 product names to all be the same height
    var $tallest = 0;
    var $header = $$('h1');
    var len = $header.length;
    // Loop to get the tallest list_headers h1
    for(var $i = 0; $i < len; $i++)
        if($header[$i].hasClassName('list_headers') && $header[$i].offsetHeight > $tallest)
            $tallest = $header[$i].offsetHeight;
    // Setting all the list_headers the same height
    for(var $i = 0; $i < len; $i++) 
        if($header[$i].hasClassName('list_headers')) 
            $header[$i].style.height = $tallest+'px';
});

var $count_down_stored_seconds = new Array();
/**
 * This function will update the time remaining for a count down
 * @param The HTML element that will have the display text set into it
 * @params The display text for "Days"
 * @params The display text for "Hours"
 * @params The display text for "Minutes"
 * @params The display text for "Seconds"
 */
function count_down_time($element, $days_dis, $hours_dis, $minutes_dis, $seconds_dis, $seconds_var){
    if(!$days_dis    && $days_dis    !== false) $days_dis=" Days ";
    if(!$hours_dis   && $hours_dis   !== false) $hours_dis=" Hours ";
    if(!$minutes_dis && $minutes_dis !== false) $minutes_dis=" Minutes ";
    if(!$seconds_dis && $seconds_dis !== false) $seconds_dis=" Seconds Left";

    // Setting the new time
    $count_down_stored_seconds[$seconds_var] -= 1;
    if($count_down_stored_seconds[$seconds_var] < 0) $count_down_stored_seconds[$seconds_var] = 0;

    // Creating the string that will display how long the sale can last for
    var $newTime = '';

    // Populating the Day number (should always be 0
    if($days_dis){
        var $days = getUnits($count_down_stored_seconds[$seconds_var],86400,100000);
        if($days < 10 && $days > 0) $days = '0'+$days;
        if($days) $newTime += $days+$days_dis;
    }

    // Getting the display of hours
    if($hours_dis){
        var $hours = getUnits($count_down_stored_seconds[$seconds_var],3600,24);
        if($hours < 10 && $hours > 0) $hours = '0'+$hours;
        if($hours || $days) $newTime += $hours+$hours_dis;
    }

    // Getting the display of minutes
    if($minutes_dis){
        var $minutes = getUnits($count_down_stored_seconds[$seconds_var],60,60);
        if($minutes < 10 && $minutes > 0) $minutes = '0'+$minutes;
        if($minutes || $hours || $days) $newTime += $minutes+$minutes_dis;   
    }

    // Getting the display of seconds
    if($seconds_dis){
        var $seconds = getUnits($count_down_stored_seconds[$seconds_var],1,60);
        if($seconds < 10 && $seconds > 0) $seconds = '0'+$seconds;
        if($seconds || $minutes || $hours || $days) $newTime += $seconds+$seconds_dis;
    }

    // Filling the HTML element with the details
    $element.innerHTML = $newTime;

    // Setting this function to happen again
    if($count_down_stored_seconds[$seconds_var] > 0) setTimeout( function(){ count_down_time($element, $days_dis, $hours_dis, $minutes_dis, $seconds_dis, $seconds_var); }, 1000);
}

/** 
 * This function is very simple, it return how many units are left based on the number of items per unit and the max units
 * @params The number of items total
 * @params The number of items per unit
 * @params The most number of units possible
 */
function getUnits($items, $items_per, $max_per_unit){
  return (Math.floor($items/$items_per))%$max_per_unit;
}

/**
 * This array will be populated for each product as $product_list_thumb[$product_id] = array('nterval' => setInterval,  'number' => '2');
 */
var $product_list_thumb = new Array();

/**
 * This function will start the roll over function that displays the multiple images for a product
 * @param The Number of the current image (1 for the first, 2 for the second)
 */
function product_list_thumb_start($product_id, $element_id){
    // If there isn't an array set for this product in the list yet, set one with the element_id
    if(!$product_list_thumb[$product_id]){ $product_list_thumb[$product_id] = new Array(); $product_list_thumb[$product_id]['element_id'] = $element_id; }

    // Calling this function for the first time
    product_list_thumb_request($product_id);

    // Creating the Interval for this product
    $product_list_thumb[$product_id]['interval'] = setInterval( function(){ product_list_thumb_request($product_id); }, 1000);
}

/**
 * This function will request the next image for the {@link product_list_thumb_start} function
 * @param The ID of the product we need to count
 */
function product_list_thumb_request($product_id){
    // If there is no number set for this product, make it one
    if(!$product_list_thumb[$product_id]['number']) $product_list_thumb[$product_id]['number'] = 1;

    // Making the Ajax Call
    var params = new Array();
    params[0] = $product_id;
    params[1] = $product_list_thumb[$product_id]['number'];
    var json = new JSON;
    json.request('product_list_thumb', params, product_list_thumb_callback);
}

/**
 * This function will replace the products thumbnail image and set the current image variable for this product for the {@link product_list_thumb_request} function
 */
function product_list_thumb_callback($responce){
    // Writing the src to the product image
    $($product_list_thumb[$responce['product_id']]['element_id']).src = $responce['src'];

    // Determining if this should keep going (should only not if there is only one image)
    $product_list_thumb[$responce['product_id']]['number'] = $responce['number'];

    // if($product_list_thumb[$responce['product_id']]['number'] == $responce['number'])
}

/**
 * This function will stop the Interval for a specific products rotating thumbnails
 * @param The HTML element that will have the display text set into it
 */
function product_list_thumb_stop($product_id){
    // This removes the Interval completely
    clearInterval($product_list_thumb[$product_id]['interval']);
    $product_list_thumb[$product_id]['interval'] = null;
}

/**
 * This array is here to hold all the active animation_slide_y targets.
 * The target is the pixle value as a integer. 
 */ 
var animation_slide_y_targets = new Array();
/**
 * This array holds all the setInterval IDs so that they can be cleared based on the elements ID
 */ 
var animation_slide_y_intervals = new Array();
/**
 * This function actuly starts the div slide animation.
 * It clears any existing Intervals for this elements ID. 
 * Then it invokes the {@link animation_slide_y_step()} function as a Interval.
 */ 
function animation_slide_y($element, $target){
    animation_slide_y_targets[$element.id] = $target;
    window.clearInterval(animation_slide_y_intervals[$element.id]);
    animation_slide_y_intervals[$element.id] == false;
    animation_slide_y_intervals[$element.id] = setInterval(function(){ animation_slide_y_step($element); }, 50);
}
/**
 * This function preforms each step as a Interval set by {@link animation_slide_y()}.
 * It only stops once its reached its goal (Stored in animation_slide_y_targets[$element.id]) .
 * Once its complete will either become display none, or height 100%.
 * In order to deal with the height 100% in IE some elements will need to be places in table cells.
 */ 
function animation_slide_y_step($element){
    var curY = ($element.style.top.slice(0,-2))*1;
    var diff = animation_slide_y_targets[$element.id]-curY;
    var step = Math.round((diff)/5);
    if(step != 0 ){
        $element.style.top = (curY+step)+'px';
    }else{
        $element.style.top = animation_slide_y_targets[$element.id]+'px';
        window.clearInterval(animation_slide_y_intervals[$element.id]);
        animation_slide_y_intervals[$element.id] = false;
    }
}

/**
 * This function opens a popup window for a image enlarge (specific for design diva)
 */ 
function FA_enlarge_popUp(URL) {
    window.open(URL, 'productEnlarge', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=770,height=600');
}

/**
 * This function opens a popup window for a image enlarge (specific for design diva)
 */ 
function FA_estimates_popUp(URL) {
    window.open(URL, 'estimateEnlarge', 'toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=0,width=710,height=600');
}