if(!window.console)
window.console = { log: function() {} }

//window.console.log = function(msg) {}

/******************************
 * Funktionen für Effekte etc *
 ******************************/

var useEffects   = true;
var currentImage = 'image_big_1';

/**
 * id: ID of element to toggle
 * clicked: Element which triggered this function
 * collapseOthers: collapse other elements w/ same class?
 */
function toggleVisible(elementId, clicked, collapseOthers) {
    var element = $(elementId);

    var updateId  = arguments[3]  || null;
    var updateUrl = arguments[4] || null;

    if(updateId && updateUrl && $(updateId)) {
        $(updateId).block();
        new Ajax.Request(updateUrl, {
            onSuccess: function(t) {
                $(updateId).update(t.responseText);
                $(updateId).unblock();
            }
        });
    }

    // toggle visibility
    var isVisibleNow = element.visible();
    if(useEffects) {
        new Effect.ToggleBlind(element, { duration: 0.5 });
    } else {
        element.toggle();
    }
    isVisibleNow = !isVisibleNow; // Do not get new state from element, effect may still be running

    // if clicked exists, toggle it's state
    if($(clicked)) {
        // clicked is link -> change it's class
        if($(clicked).tagName.toLowerCase() == 'a') {
            clicked.toggleClassName('closed');
            clicked.toggleClassName('open');
        }
        // clicked is image -> change it
        else if($(clicked).tagName.toLowerCase() == 'img') {
            clicked.src = (isVisibleNow) ? 'images/arrow_top.gif' : 'images/arrow_down.gif';
        }
     }

    // If element was openend, collapse all others w/same class (uses only first class, if element has many)
    if(isVisibleNow && collapseOthers) {
        // Get (first) class name
        var className        = element.className.split(' ')[0];

        $$('.' + className).each(function(hideElement) {
            if(hideElement != element && hideElement.visible()) {
                new Effect.BlindUp(hideElement, {duration: 0.5});
            }
        });

        if($(clicked)) {
            var clickedClassName = clicked.className.split(' ')[0];
            $$('.' + clickedClassName).each(function(hideClicked) {
                if(hideClicked != clicked) {
                    if($(hideClicked) && $(hideClicked).tagName.toLowerCase() == 'a') {

                        hideClicked.removeClassName('open');
                        hideClicked.addClassName('closed');

                    } else if($(clicked).tagName.toLowerCase() == 'img') {
                        hideClicked.src = 'images/arrow_down.gif'
                    }
                }
            });
        }
    }
}

/**
 * Bilder umblenden (Detailseite)
 *
 */
function switchImage(number, imgHeight) {
    var imageToHide = $(currentImage);
    var imageToShow = $('image_big_'+number)
    var rabattImage = $('rabatt_image');

    if(imageToHide == imageToShow) { return; }

    $('spacer_image').src = imageToShow.src;
    $('spacer_image').morph(
        'height: ' +  imageToShow.getHeight() + 'px; width: ' + imageToShow.getWidth() + 'px',
        { duration:0.5 }
    );

    new Effect.Parallel([
        new Effect.Fade(imageToHide),
        new Effect.Appear(imageToShow)
    ], {
            afterFinish: function() { currentImage = imageToShow.id; }
        }
    );

    if(rabattImage) {
        var moveX = imageToShow.width  - imageToHide.width;
        var moveY = imageToShow.height - imageToHide.height;
        new Effect.MoveBy(rabattImage, moveY, moveX);
    }

}

function wuuSwitchSection(sectionName, clicked) {

    var sectionToShow = $('wuu_' + sectionName);

    // Show section
    if(sectionToShow) {
        // Hide other sections
        $$('.wuu_body').each(function(element) {
            if(element.visible() && element != sectionToShow) { element.hide(); }
        });
        sectionToShow.show();
    }

    // Adapt links
    $$('#wuu_navi a').each(function(link) { link.removeClassName('actv'); });

    clicked.addClassName('actv');
}

/**
 * Replaces contents of middle secion by with url
 * (unused - asg-server-scripts currently doesn't support this sanely)
 */
function switchMiddleSection(url) {
    document.body.style.cursor='wait';
    $('middle').setOpacity(0.5);

    new Ajax.Request(url, {
        onSuccess: function(t) { $('middle').update(t.responseText); },

        onFailure: function() {},

        onComplete: function() {
            document.body.style.cursor='auto';
            $('middle').setOpacity(1);
        }
    });
}

/**
 * Calls the given url and updates the (small) basket with the response body
 */
function addToBasket(buyUrl) {

    var detailUrl = arguments[1] || null;

    // Show spinner
    if(!detailUrl) {
        $('wk_wait').show();
        !($('warenkorb').visible()) && new Effect.BlindDown('warenkorb', { duration: 0.5 });
    }
    
    // show hourglass cursor
    document.body.style.cursor='wait';

    new Ajax.Request(buyUrl, {
        // update basket's contents
        onSuccess: function(t) {
            if(detailUrl) {
                window.location.href = detailUrl;
            } else {
                $('warenkorb').replace(t.responseText);
            }
        },

        // If something goes wrong, reload page
        onFailure: function() {
            window.location.reload();
        },

        onComplete: function() {
            // Hide spinner
            $('wk_wait').hide();

            // show normal cursor
            document.body.style.cursor='auto';
        }
    });
}

/**
 * Updates big basket
 */
function updateBasket(formId, stueckzahl, discount) {

    console.log(new Template('updateBasket(#{formId}, #{stueckzahl}, #{discount})').evaluate({
        formId: formId,
        stueckzahl: stueckzahl,
        discount: discount
    }));

   // show hourglass cursor
    document.body.style.cursor = 'wait';

    // dim & block middle section
    $('middle').setOpacity(0.5);
    //blockElement('middle', 0.5);

    // get form to submit
    var form          = $(formId);

    console.log('Form:' + form.inspect());

    // check entered value
    if(stueckzahl != null
        && discount != null
        && !(WK_TestAnzahl(form.name, stueckzahl, true, true, discount))) {

        // if value'S not valid -> undim/unblock, reset cursor, do not update anything
        document.body.style.cursor = 'auto';
        $('middle').setOpacity(1);
        //unblockElement('middle');
        return false;
    }

    // get form data
    var requestData = form.serialize();

    console.log('requestData: ' + requestData);

    // get request url
    var url         = form.action;

    console.log('URL:' + url);

    // fire request
    new Ajax.Request(url, {
        postBody: requestData,
        encoding: 'ISO-8859-1', // we do not want utf-8 here

        // reload page in case of failure
        onFailure: function() { window.location.reload(); },

        // update contents w/ responseBody
        onSuccess: function(t) { $('middle').innerHTML = t.responseText; },

        // undim, reset cursor
        onComplete: function(t) {
            $('middle').setOpacity(1);
            //unblockElement('middle');
            document.body.style.cursor = 'auto';
        }
    });

    // always return false; we never want the form to get submitted by itself
    return false;
}

/**
 * same as above, but w/o any form to submit
 */
function deleteBasket(url) {

    // hourglass cursor
    document.body.style.cursor = 'wait';

    // dim content
    $('middle').setOpacity(0.5);
    //blockElement('middle', 0.5);

    // fire request (see above)
    new Ajax.Request(url, {
        encoding: 'ISO-8859-1',

        onFailure: function()   { window.location.reload(); },
        onSuccess: function(t)  { $('middle').innerHTML = t.responseText; },
        onComplete: function(t) {
            $('middle').setOpacity(1);
            //unblockElement('middle');
            document.body.style.cursor='auto';
        }
    });
}

/**
 * Blocks an element by layering an translucent div over it
 */
function blockElement(element, fadeAmount) {

    element = $(element);

    var hider;
    if(element.hider) {
        hider = element.hider;
    } else {
        hider = document.createElement('div');

        hider.setStyle({
            backgroundColor: '#ffffff',
            zIndex: 5000,
            position: 'absolute',
            display: 'none',
            opacity: 0
        })
    }
    document.body.insertBefore(hider, document.body.firstChild);

    new Position.clone(element, hider);
    element.hider = hider;
    hider.show();

    if(useEffects) {
        hider.morph('opacity: ' + fadeAmount, { duration: 0.5 });
    } else {
        hider.setOpacity(fadeAmount);
    }

    return true;
}

/**
 * Unblocks an element
 */
function unblockElement(element) {

    element = $(element);
    if(!element.hider) { return false; }

    var removeHiderFromElement = function(element) {
        var hider = element.hider;

        document.body.removeChild(hider);
        element.hider = null;
    }

    if(useEffects) {
        element.hider.morph('opacity: 0', {
            duration: 0.5,
            afterFinish: function() { removeHiderFromElement(element); }
        });
    } else { removeHiderFromElement(element); }

    return true;
}

function paymentChosen(clicked) {
    $('konto_data').hide();
    $('cc_data').hide();

    switch(clicked.value) {
        case '5':
            $('konto_data').show();
            break;

        case '9':
            $('cc_data').show();
            break;
    }
}