// HOKA site dynamics
// (c) 2007 Loco (Loohuis Consulting), http://www.loohuis-consulting.nl/
// This work is licensed under a 
// Creative Commons Attribution-Share Alike 3.0 Netherlands License
// see http://www.loohuis-consulting.nl/development/cc-by-sa.php

// full article display div
var full;

// show article
function showArticle(e)
{
    // mark acive article
    document.getElementsByClassName('clickme').each(function(t)
    {
        t.removeClassName('active');
    });
    Event.element(e).addClassName('active');
    //
    var div = Event.element(e).parentNode.getElementsByClassName('order')[0];
    var form = div.getElementsByTagName('form')[0];
    // prepare full view
    var imgcount = 0;
    var imglist = full.getElementsByClassName('fullimgnav')[0].getElementsByTagName('tr')[0];
    $A(imglist.getElementsByClassName('fullimgnavlink')).each(function(c)
    {
        c.remove();
    });
    elms = $A(form.elements);
    elms.each(function(elm)
    {
        switch(elm.name) {
            case 'available':
                if (elm.value == 1 || elm.value == 3) {
                    Element.show('fullforms');
                    Element.hide('fullstatus');
                }
                else {
                    Element.hide('fullforms');
                    Element.show('fullstatus');
                }
                break;
            case 'artid':
                $A(full.getElementsByClassName(elm.name)).each(function(up)
                {
                    up.value = elm.value;
                });
                break;
            case 'name':
            case 'description':
            case 'price':
            case 'price_remark':
                $A(full.getElementsByClassName(elm.name)).each(function(up)
                {
                    up.update(elm.value);
                });
                break;
            case 'images[]':
                if (imgcount++ == 0)
                    full.getElementsByClassName('viewimg')[0].src = elm.value;
                var td = document.createElement('td');
                Element.addClassName(td, 'fullimgnavlink');
                var a = document.createElement('a');
                a.appendChild(document.createTextNode(imgcount));
                a.setAttribute('image', elm.value);
                td.appendChild(a);
                Event.observe(a, 'click', switchImage);
                imglist.appendChild(td);
                break;
        }
        $A(full.getElementsByClassName('amount')).each(function(up)
        {
            up.value = 1;
        });
    });
}

// image switcher
function switchImage(e)
{
    var img = Event.element(e).getAttribute('image');
    full.getElementsByClassName('viewimg')[0].setAttribute('src', img);
}

// show big image
function showImage(e)
{
    var img = full.getElementsByClassName('viewimg')[0].getAttribute('src');
    $('showbigimg').getElementsByTagName('img')[0].setAttribute('src', img);
    $('showbigimg').show();
}

// hide big image
function hideImage(e)
{
    $('showbigimg').hide();
}

// submit order form
function sendOrder(e)
{
    var orderform = Event.element(e).form;
    var req = new Ajax.Request('/nl/cart.php', 
    {
        method: 'get',
        parameters: orderform.serialize(),
        onComplete: function(r) 
        {
            j = eval(r.responseText);
            var spans = document.getElementsByClassName('cartnumber');
            spans.each(function(s)
            {
                Element.update(s, j.number);
                new Effect.Highlight('overview', {startcolor:'#FFFFFF', endcolor:'#CF1472'})
            });
            var spans = document.getElementsByClassName('cartprice');
            spans.each(function(s)
            {
                Element.update(s, j.price);
            });
        }
    });
    Event.stop(e);
}

// add article to favorites
function addToFavorites(e)
{
    var favform = Event.element(e).form;
    var req = new Ajax.Request('/nl/favorieten.php', 
    {
        method: 'get',
        parameters: favform.serialize(),
        onComplete: function(r) 
        {
            j = eval(r.responseText);
            new Effect.Highlight('favoriteslink', {startcolor:'#00C0AE', endcolor:'#CF1472'})
        }
    });
    Event.stop(e);
}

// submit order form
function autoSubmit(e)
{
    Event.element(e).form.submit();
}

// confirm empty
function confirmEmpty(e)
{
    if (!confirm('Wilt u daadwerkelijk uw winkelkagen leegmaken?'))
        Event.stop(e);
}

// initialise page
function init()
{
    full = document.getElementsByClassName('fullview')[0];
    if (full) {
        // are we in the cart?
        var cart = document.getElementsByClassName('carttable')[0];
        if (cart) {
            // thumbnail click events
            var thumbs = document.getElementsByClassName('clickme');
            thumbs.each(function(t)
            {
                Event.observe(t, 'click', switchImage);
            });
            thumbs[0].addClassName('active');
        }
        else {
            // thumbnail click events
            var thumbs = document.getElementsByClassName('clickme');
            thumbs.each(function(t)
            {
                Event.observe(t, 'click', showArticle);
            });
            thumbs[0].addClassName('active');
            // image navigation click events
            $A(full.getElementsByClassName('fullimgnavlink')).each(function(a)
            {
                Event.observe(a, 'click', switchImage);
            });
            // set handlers for image view events
            var big = full.getElementsByClassName('bigimg')[0].getElementsByTagName('a')[0];
            Event.observe(big, 'click', showImage);
            var close = $('showbigimg').getElementsByTagName('a')[0];
            Event.observe(close, 'click', hideImage);
        }
    }
    var orderbuttons = document.getElementsByClassName('orderbutton');
    orderbuttons.each(function(b)
    {
        Event.observe(b, 'click', sendOrder);
    });
    var orderbuttons = document.getElementsByClassName('fullorderbutton');
    orderbuttons.each(function(b)
    {
        Event.observe(b, 'click', sendOrder);
    });
    var favbuttons = document.getElementsByClassName('favoritesbutton');
    favbuttons.each(function(b)
    {
        Event.observe(b, 'click', addToFavorites);
    });
    var autobuttons = document.getElementsByClassName('autosubmit');
    autobuttons.each(function(b)
    {
        Event.observe(b, 'change', function(e) {
		var input = document.createElement('input');
		input.type = 'hidden';
		input.name = 'autosubmit';
		input.value = '1';
		var form = Event.element(e).form;
		form.appendChild(input);
		form.submit();
	});
	if (b.type == 'radio'){
	        Event.observe(b, 'click', function(e) {
			Event.element(e).blur();
		});
	}
    });
    var killorder = document.getElementsByClassName('killorder');
    killorder.each(function(b)
    {
        Event.observe(b, 'keydown', function(e) {Element.hide('submitorder');});
    });
    if ($('empty'))
        Event.observe($('empty'), 'click', confirmEmpty);

}

Event.observe(window, 'load', init);