var a_open, a_close;
var b_open;
var sb_toggle = 0;
var sb_to;

var HANDLE_NAVIGATOR_IMG = "handle_navigator.png";
var HANDLE_SELECTOR_IMG = "handle_selector.png";
var HANDLE_CLOSE_IMG = "handle_close.png";

function sb_activate () {
    clearTimeout (sb_to);
}

function sb_deactivate () {
    clearTimeout (sb_to);
    // sb_to = setTimeout (sb_close, 2000);
}

/*
function sb_close () {
    OAT.Dom.detach ("handle", "click", sb_close);
    a_close.start ();
}
*/

function show_navigator () {
    var displayed = document.getElementById('nav_content');
    var hidden    = document.getElementById('nav_class_selector');
    displayed.style.display = 'block';
    hidden.style.display = 'none';
    OAT.Dom.detach ("handle_selector", "click", sb_close);
    OAT.Dom.detach ("handle_navigator", "click", show_navigator);
    OAT.Dom.attach ("handle_navigator", "click", sb_close);
    OAT.Dom.attach ("handle_selector", "click", show_selector);
    handle_close_navigator();
}

function sb_open_navigator () {
    OAT.Dom.detach ("handle_navigator", "click", sb_open_navigator);
    OAT.Dom.detach ("handle_selector", "click", sb_open_selector);
    OAT.Dom.attach ("handle_selector", "click", show_selector);
    a_open.start ();
}

function show_selector () {
    var displayed = document.getElementById('nav_class_selector');
    var hidden    = document.getElementById('nav_content');
    displayed.style.display = 'block';
    hidden.style.display = 'none';
    OAT.Dom.detach ("handle_navigator", "click", sb_close);
    OAT.Dom.detach ("handle_selector", "click", show_selector);
    OAT.Dom.attach ("handle_navigator", "click", show_navigator);
    OAT.Dom.attach ("handle_selector", "click", sb_close);
    handle_close_selector();
}

function sb_open_selector () {
    OAT.Dom.detach ("handle_navigator", "click", sb_open_navigator);
    OAT.Dom.detach ("handle_selector", "click", sb_open_selector);
    OAT.Dom.attach ("handle_navigator", "click", show_navigator);
    b_open.start ();
}

function sb_close () {
    OAT.Dom.detach ("handle_navigator", "click", sb_close);
    OAT.Dom.detach ("handle_selector", "click", sb_close);
    OAT.Style.apply ("nav_content", {overflow : "hidden"});
    OAT.Style.apply ("nav_class_selector", {overflow : "hidden"});
    a_close.start ();
}


function sb_opened_navigator (source, message, event) {
    OAT.Dom.attach ("nav_content", "mouseover", sb_activate);
    OAT.Dom.attach ("navigator", "mouseout", sb_deactivate);
    // OAT.Dom.attach ("handle_navigator", "click", sb_close);
    OAT.Style.apply ("nav_content", {overflow : "auto"});
    // handle_close_navigator();
    show_navigator();
}

function sb_opened_selector (source, message, event) {
    OAT.Dom.attach ("nav_class_selector", "mouseover", sb_activate);
    OAT.Dom.attach ("navigator", "mouseout", sb_deactivate);
    // OAT.Dom.attach ("handle_selector", "click", sb_close);
    OAT.Style.apply ("nav_class_selector", {overflow : "auto"});
    // handle_close_selector();
    show_selector();
}

/*
function sb_opened (source, message, event) {
// console.log ("sb_opened handler called.");
    OAT.Dom.attach ("nav_content", "mouseover", sb_activate);
    OAT.Dom.attach ("navigator", "mouseout", sb_deactivate);
    OAT.Dom.attach ("handle", "click", sb_close);
    handle_close();
}
*/

function sb_closed (source, message, event) {
    OAT.Dom.detach ("nav_content", "mouseover", sb_activate);
    OAT.Dom.detach ("nav_class_selector", "mouseover", sb_activate);
    OAT.Dom.detach ("navigator", "mouseout", sb_deactivate);
    OAT.Dom.attach ("handle_navigator", "click", sb_open_navigator);
    OAT.Dom.attach ("handle_selector", "click", sb_open_selector);
    handle_open();
}

function pb_center_handle_img () {
    OAT.Dom.center ("handle_img_navigator", false, true);
    OAT.Dom.center ("handle_img_selector", false, true);
}

function handle_open () {
    $('handle_img_navigator').src = skinpath + HANDLE_NAVIGATOR_IMG;
    $('handle_img_selector').src = skinpath + HANDLE_SELECTOR_IMG;
}

function handle_close_navigator () {
    $('handle_img_navigator').src = skinpath + HANDLE_CLOSE_IMG;
    $('handle_img_selector').src = skinpath + HANDLE_SELECTOR_IMG;
}

function handle_close_selector () {
    $('handle_img_navigator').src = skinpath + HANDLE_NAVIGATOR_IMG;
    $('handle_img_selector').src = skinpath + HANDLE_CLOSE_IMG;
}