var silo_width=0, holder_width=0, silo_list, silo_holder, tick_move=0.0, max_left;
var silo_position = 0.0;
var silo_speed=8/20;
var silo_timer;
var silo_moving = false;
var silo_tick_frequency = 10;
var silo_last_time = 0;

function silo_move(e) 
{
    var curposx=(window.event? event.clientX : e.clientX) - silo_holder.offsetLeft; 
    var rest = 100;
//    alert(curposx);
    var active_width = (holder_width - rest)/2;
    var speed_left = (active_width - curposx) * silo_speed / active_width; 
    var speed_right = (curposx - (holder_width - active_width)) * silo_speed / active_width;
    tick_move = speed_right > 0 ? speed_right : (speed_left > 0 ? -speed_left : 0);
    //alert(speed);
    if (!silo_moving)
    {
        timer=setTimeout("silo_tick()",silo_tick_frequency);
        silo_last_time = new Date().getTime();
        silo_moving = true;
    }
}

function set_opacity(obj, opacity) {
  opacity *= 100;
  opacity = (opacity == 100)?99.999:opacity;

  // IE/Win
  obj.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="
+ opacity + ");";

  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;

  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;

  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
}


function check_arrows()
{
    var opacity_factor = 1/200;
    var max_opacity = .60;
    var left_arrow = document.getElementById("scroll_left");       
    if (silo_position < 0)
        left_arrow.style.display = "inline";
    else
        left_arrow.style.display = "none";

    var opacity = -silo_position * opacity_factor;
    if (opacity > max_opacity)
        opacity = max_opacity;
    set_opacity(left_arrow, opacity);

    var right_arrow = document.getElementById("scroll_right");       
    if (silo_position > -max_left)
        right_arrow.style.display = "inline";
    else
        right_arrow.style.display = "none";

    var opacity = (silo_position+max_left) * opacity_factor;
    if (opacity > max_opacity)
        opacity = max_opacity;
    set_opacity(right_arrow, opacity);
}

function silo_tick()
{
    var current_time = new Date().getTime();
    var time_passed = current_time - silo_last_time;

    // prevent jumping due to giant lags
    if (time_passed > silo_tick_frequency * 10)
        time_passed = silo_tick_frequency;

    silo_position -= (tick_move * time_passed);
    if (silo_position > 0) 
        silo_position = 0.0;

    if (silo_position < -max_left)
        silo_position = -max_left;

    check_arrows();

    silo_list.style.left = Math.round(silo_position)+"px";

    silo_last_time = new Date().getTime();
    timer=setTimeout("silo_tick()",silo_tick_frequency);
}

function contains(a, b) 
{
    if (a == b) 
        return true;
    if (b.parentNode)
        return contains(a, b.parentNode);
    return false;
}


function silo_out(e) 
{
    if ((window.event&&!silo_holder.contains(event.toElement)) || (e && e.relatedTarget && !contains(silo_holder, e.relatedTarget)))
    {
        clearTimeout(timer);
        silo_moving = false;
    }
}

var pre_silo_load = window.onload;
window.onload=function() 
{
    if (pre_silo_load)
        pre_silo_load();
    var silo_id = "cat_silo";
    var silo_holder_id = "silo_holder";
    silo_list = document.getElementById(silo_id);
    silo_holder = document.getElementById(silo_holder_id);

    // get the actual width of the scrolling content
    var silo_elements = silo_list.getElementsByTagName("li")
    for (i=0;i<silo_elements.length;i++)
        silo_width += silo_elements[i].offsetWidth;

    holder_width = silo_holder.offsetWidth;
    max_left = (silo_width > holder_width) ? 
        (silo_width - holder_width) : 0.0;

    silo_list.style.left = "0px";
    silo_holder.onmousemove=silo_move;
    silo_holder.onmouseout=silo_out;
    check_arrows();
}