if (window.tc === undefined) {
    var tc = {};
}

tc.slider = function(bigImageId) {

    this.bigImageId = bigImageId;

    this.activeImageId = null;

    this.imageSets = [];

}

tc.slider.prototype.getBigImageId = function() {
    return this.bigImageId;
};

tc.slider.prototype.setActiveImageId = function(activeImageId) {
    this.activeImageId = activeImageId;
};

tc.slider.prototype.getActiveImageId = function() {
    return this.activeImageId;
};

tc.slider.prototype.getImageSets = function() {
    return this.imageSets;
};

tc.slider.prototype.registerImageSet = function(hoveringElementId, bigImageUrl, greyscaledImageURL) {
    if (hoveringElementId === undefined || hoveringElementId === null) {
        return;
    }
    this.imageSets[hoveringElementId] = {
        'bigImageURL': bigImageUrl,
        'greyscaledImageURL': greyscaledImageURL
    };
};

tc.slider.prototype.switchImage = function(elementId) {
    var imageSets       = this.getImageSets();
    var activeImageId   = this.getActiveImageId();
    var hoveredImage    = null;
    var bigImage        = null;
    // ist dieses Element registriert?
    if (imageSets[elementId] === undefined) {
        return false;
    }

    if (activeImageId !== null) {
        // noch aktuelles bild zu schwarz-weiss wechseln lassen:
        jQuery('#' + activeImageId).attr('src', imageSets[activeImageId].greyscaledImageURL).addClass('tc_slider_greyscaled').removeClass('tc_slider_colored');
    }

    // neues bild zu farbig wechseln lassen:
    hoveredImage = jQuery('#' + elementId);
    hoveredImage.attr('src', imageSets[elementId].bigImageURL).addClass('tc_slider_colored').removeClass('tc_slider_greyscaled');

    // großes bild austauschen:
    bigImage = jQuery('#' + this.getBigImageId());
    bigImage.attr('src', imageSets[elementId].bigImageURL);
    this.setActiveImageId(elementId);

    // setze link des hauptbildes auf den des kleinen:
    bigImage.parent().attr('href', hoveredImage.parent().attr('href'));
    return true;
};

