﻿function initButton(id, selected) {
    var div = $('div#' + id);
    div.toggle(
        function(){clickButton(id, !selected);},
        function(){clickButton(id, selected);}
    );
    div.bind('mouseover', function(){$(document.body).css('cursor', 'pointer');});
    div.bind('mouseout', function(){$(document.body).css('cursor', 'auto');});
    if (selected) clickButton(id, true);
}

function clickButton(id, selected) {
    var btn = $('div#' + id);
    var middle = btn.find('div.fCalButtonMiddle');
    var checkbox = middle.find('img');
    var right = btn.find('div.fCalButtonRight');
    
    if (selected) {
        var a = '_off';
        var b = '_on';
    }
    else {
        var a = '_on';
        var b = '_off';
    }
    
    // store value
    $('div#' + id).attr('selected', (selected ? '1' : '0'));
    $('input#' + id + '_selected').attr('value', (selected ? '1' : '0'));

    // show button image
    btn.css('background-image', btn.css('background-image').replace(a, b));
    middle.css('background-image', middle.css('background-image').replace(a, b));
    middle.css('color', (selected ? 'White' : '#ff6600'));
    checkbox.attr('src', checkbox.attr('src').replace(a, b));
    right.css('background-image', right.css('background-image').replace(a, b));
    
    // hide all events first
    $('div.fCalEventInfo').css('visibility', 'hidden');
    
    // now show events if corresponding button is selected
    $('div.fCalButtonLeft').each(function(i) {
            if ($(this).attr('selected') == '1') {
                var eventTypeId = $(this).attr('eventTypeId');
                $('div.fCalEventInfo[eventTypeId=' + eventTypeId + ']').css('visibility', 'visible');
                // make inner and outer divs visible as well (for events with multiple eventTypeIDs)
                $('div.fCalEventInfo[eventTypeId=' + eventTypeId + '] div').css('visibility', 'visible');
                $('div.fCalEventInfo[eventTypeId=' + eventTypeId + ']').parent('div.fCalEventInfo').css('visibility', 'visible');
            }
        }
    );
}

