// JavaScript for WebsiteCategoryOverviewLayout.class.php

//////////////////////////////////////////////////////
// Overview-Functions
var overviewFunctions = overviewFunctions || {};

jQuery(function ($) {
    overviewFunctions.bindDeliveryInfo = function (class_name, scope) {
        var left = 205;
        if (0 < $('input[name=landingpage]').length) {
            left = 165;
        }
        // Tooltip-PlugIn Aufruf
        $(class_name).Tooltip({
            timespan:  300,
            classOver: 'deliveryInfoOver', // deliveryInfoMatching
            scope:     scope || 'overview', // tabber
            'left': left
        });
    };

    if (document.URL.search(/.htm$/) != -1) {
        $.ajax({
            'url': '../php/ajax_requests/setBackLink.php',
            'type': 'POST', 'data': {'url': escape(document.URL)}
        });
    }

    overviewFunctions.setFilterInputEvents = function () {
        $('.articlePriceFilter input[name=price_from]')
            .focus(function () {
                if ($(this).val() === 'von') {
                    $(this).val('');
                }
             });
        $('.articlePriceFilter input[name=price_to]')
            .focus(function () {
                if ($(this).val() === 'bis') {
                    $(this).val('');
                }
            });

        $('.articlePriceFilter input[name=price_from]')
            .keypress(overviewFunctions.onlyNumbersGate);

        $('.articlePriceFilter input[name=price_to]')
            .keypress(overviewFunctions.onlyNumbersGate);

    };

    overviewFunctions.onlyNumbersGate = function (e) {
        if ( (e.which >= 47 && e.which <= 57) || // 0-9
              e.which == 8  ||                   // backspace
              e.which == 0                       // delete, insert, cursor etc.
        ) {
            return true;
        }
        return false;
    };


    overviewFunctions.resetFilter = function () {
        $('.articlePriceFilter input[name=price_from]').val('von');
        $('.articlePriceFilter input[name=price_to]').val('bis');
        $('.articlePriceFilter select[name=sortierung]').val('preis,ASC');
    };

    overviewFunctions.initScrollable = function () {
        $('#ArticleProducts div.scrollable').each(function () {
            var $imgs = $(this).find('img');
            if ($imgs.length <= 12) {
                return true; // continue loop (return false for break)
            }

            // Images in divs wrappen
            var i = 0,
                $wrapper = $('<div class="wrapper"></div>'),
                $newDiv  = $('<p></p>').appendTo($wrapper);

            $imgs.each(function () {
                if (i % 10 == 1 && i != 1 && i != $imgs.length - 1) {
                    $newDiv.append(
                        $('<div class="more"><a href="javascript:void(0)">mehr</a></div>')
                    );
                    // todo: less && more Link einfügen
                    $newDiv = $('<p></p>').appendTo($wrapper);
                    $newDiv.append(
                        $('<div class="less"><a href="javascript:void(0)">zur&uuml;ck</a></div>')
                    );
                }

                $(this).appendTo($newDiv);
                i++;
            });

            $wrapper.appendTo($(this));
            // click-Events zum navigieren im scrollabel
            $wrapper.find('.more a').click(function () {
                var $tis = $(this),
                    height = parseInt($tis.parent().parent().parent().first().css('height')),
                    factor = $tis.parent().parent().prevAll().length + 1;
                $tis.parent().parent().parent().scrollTop(height * factor);
            });
            $wrapper.find('.less a').click(function () {
                var $tis = $(this),
                    height = parseInt($tis.parent().parent().parent().first().css('height')),
                    factor = $tis.parent().parent().prevAll().length - 1;
                $tis.parent().parent().parent().scrollTop(height * factor);
            });
        });
    };

    overviewFunctions.showList = function (parameter) {
        var $ListContent = $('#ArtikelListeInhalt'),
            $List        = $('#ArtikelListe'),
            $Loading     = $('#ArtikelListe .loading'),
            $LandingPage = $('input[name=landingpage]');

        $ListContent.html('');
        $List.show().css({'height': (217)+'px'}); // Höhe Loading-div
        $Loading.show();

        if (0 < $LandingPage.length) {
            parameter['id_kategorie'] = $LandingPage.val();
            parameter['landingpage'] = '1';
        }
        $.ajax({
            'async': true,
            'url'  : '../php/ajax_requests/article_list_of_category.php',
            'data' : parameter,
            'success': function (data) {
                $.ajax({
                    'url': '../php/ajax_requests/setBackLink.php',
                    'type': 'POST', 'data': {
                        'url': escape('../shop_set/set.php?'+$.param(parameter))
                    }
                });
                $Loading.fadeOut('slow');

                $List.replaceWith(data);
                overviewFunctions.setFilterInputEvents();
                overviewFunctions.initScrollable();

                // Karteireiter zur Massensteuerung der Vergleichsansichten umhängen
                var oServiceElem = $('.Vergleichsansichten ul.tabs li:last-child').remove();
                $ListContent.find('#compareTabs li').each(function () {
                    $(this).appendTo('.Vergleichsansichten ul.tabs');
                });
                oServiceElem.appendTo('.Vergleichsansichten ul.tabs');
                $('#compareTabs').remove();

                window.setTimeout(
                    function () {
                        _initOverview();
                        $ListContent.hide()
                                    .css('visibility', 'visible')
                                    .fadeIn('fast');
                    },
                    300
                );
                overviewFunctions.bindDeliveryInfo('.deliveryAmount');
                prospectCartDialog.bindClickEvent(
                    '#ArticleProducts .prospektKorb'
                );
            }
        });
    };
    overviewFunctions.initScrollable();

    var _setEventListener = function () {
        function _imgIsReady(oImg, $img) {
            if (oImg.complete) {
                $img.attr('src', oImg.src);
                $img.removeAttr('data-src');
                return;
            }

            window.setTimeout(_imgIsReady, 100, oImg, $img);
        }
        
        function _imageChangeALaJail($img) {
            var oImg = new Image();
            
            if (!$img.attr('data-src')) {
                return;
            }
            
            oImg.src = $img.attr('data-src');
            
            window.setTimeout(_imgIsReady, 100, oImg, $img);
        }
        
        var $priceSelect = $('.articlePriceFilter select[name=sortierung]'),
            aData = [];

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach aufsteigendem
         * Preis.
         */
        var _compare_preisASC = function (a, b) {
            return a.preis - b.preis;
        };

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach absteigendem
         * Preis.
         */
        var _compare_preisDESC = function (a, b) {
            return b.preis - a.preis;
        };

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach kürzester
         * Lieferzeit
         */
        var _compare_lieferzeitASC = function (a, b) {
            return a.lieferzeit - b.lieferzeit;
        };

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach einfachster
         * Montage
         */
        var _compare_montageASC = function (a, b) {
            return a.montage - b.montage;
        };

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach meistgekauften
         * Artikeln
         */
        var _compare_meistgekauftDESC = function (a, b) {
            return b.relevanz - a.relevanz;
        };

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach Artikeln mit
         * dem günstigsten Versand
         */
        var _compare_versandGuenstigDESC = function (a, b) {
            return a.versandkosten - b.versandkosten;
        };

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach neuesten
         * Artikeln
         */
        var _compare_id_artikelDESC = function (a, b) {
            return b.id_artikel - a.id_artikel;
        };

        /**
         * Vergleichsfunktion zum Sortieren der Artikelliste nach der größten
         * einsparung gegenüber der UVP
         */
        var _compare_einsparungDESC = function (a, b) {
            return b.einsparung - a.einsparung;
        };

        var _loadSortData = function () {
            $.ajax({
                'async': false,
                'url'  : '../php/ajax_requests/json/article_sorting_data.json.php',
                'data' : {'id_kategorie': $('select[name="id_kategorie"]').val()},
                'dataType': 'json', 'success': function (data) {aData = data;}
            });
        };

        /**
         * Sortieren der Artikelliste
         */
        var _sortList = function (order) {
            var $ListContent = $('#ArtikelListeInhalt'),
                $List        = $('#ArtikelListe'),
                $Loading     = $('#ArtikelListe .loading'),
                $Table       = $ListContent.find('#ArticleProducts'),
                $helper;

            $ListContent.hide();
            $List.show().css({'height': (217)+'px'}); // Höhe Loading-div
            $Loading.show();

            if (aData.length == 0) {
                _loadSortData();
            }

            aData.sort(eval('_compare_'+order.replace(',','')));
            // Artikel-Zeilen der Tabelle in der richtigen Reihenfolge anordnen
            for (i in aData) {
                $elem = $Table.find('div[article_id="'+aData[i].id_artikel+'"].ArticleData')
                    .parent().parent();
                if (0 < $elem.length) {
                    $helper = $elem.next();
                    $elem.appendTo($elem.parent());
                    $helper.appendTo($elem.parent());
                }
            }
            $Loading.hide();
            $List.show().css({'height': 'auto'});
            $ListContent.show();
            // Bilder Nachladen, wenn sortiert wurde
            $(window).scroll();
        };

        /**
         * Click-Event um Filter auf die passende Artikelliste anzuwenden
         */
        var _loadList = function (evt) {
            var von = $('.articlePriceFilter input[name="price_from"]').val(),
                bis = $('.articlePriceFilter input[name="price_to"]').val(),
                order = $priceSelect.val(),
                oOptions = {},
                keineFilterGesetzt = true;

            if (!_isNum(von) && !_isNum(bis) || (
                    von == 'von' && bis == 'bis' &&
                    $(evt.target).is('.articlePriceFilter .arrow_right')
            )) {
                alert('Ungültige Eingabe!');
                return;
            }

            $('select[name^=option_]').each(function (e) {
                oOptions[$(this).attr('name')] = $(this).val();
                keineFilterGesetzt = keineFilterGesetzt && $(this).val() == '';
            });

            // Sortierung mithilfe einer Artikel-Datenstruktur vornehmen
            if ($(evt.target).is('select[name="sortierung"]')) {
                _sortList($(evt.target).val());
                return;
            }

            overviewFunctions.showList($.extend(oOptions, {
                'id_kategorie': $('select[name="id_kategorie"]').val(),
                'preisVon': von,
                'preisBis': bis,
                'order':    order,
                'id_artikel_csv': $('input[name="id_artikel_csv"]').val()
            }));
        };

        var _isNum = function (n) {
            // Initialwerte durchgehen lassen!
            if (n == 'von' || n == 'bis') {
                return true;
            }
            // ToDo: _checkNum() implementieren
            return true;
        };
        $('div.arrow_right').unbind('click.sort').bind('click.sort', _loadList);
        $priceSelect.unbind('change.sort').bind('change.sort', _loadList);
        $('select[name^=option_]').bind('change.filter', _loadList);


        $('div.Vergleichsansichten ul.tabs')
            .unbind('click.matching')
            .bind({'click.matching': function (e) {
                var clickedClass;

                clickedClass = $(e.target).context.className.split(' ')[0];
                _setTabButtonStates(clickedClass);
            }
        });

        var _setTabButtonStates = function (class_name) {
            var tabClassName;
            // Vergleichsansichten Buttons
            $('div.Vergleichsansichten ul.tabs')
                .find('li').each(function () {
                    $(this).removeClass('selected');
                });

            $('div.Vergleichsansichten ul.tabs')
                .find('div.'+class_name)
                .parent('li')
                .addClass('selected');

            // Listenansicht "Buttons"
            $('div#ArtikelListeInhalt div.tabberButtons ul.tabs')
                .find('li').each(function () {
                    $(this).removeClass('selected')
                           .children()
                           .css('border-top-color', '#BABABA');
                });


            $('div#ArtikelListeInhalt div.tabberButtons ul.tabs')
                .find('div.'+class_name)
                .css('border-top-color',
                     function () { // Button-Übersicht behält border-top
                        return ( $(this).hasClass('uebersichtButton') ? '' : '#EEE' );
                 })
                .parent('li')
                .addClass('selected');

            tabClassName = class_name.replace(/Button/, '');

//            alert( 'class_name: ' + class_name + ' - ' + 'tabClassName: ' + tabClassName );

            $('div#ArtikelListeInhalt div.tabpanels')
                .find('div.tabpanel').each(function () {
                    if ( $(this).hasClass(tabClassName) ) {
                        // Tabpanel anzeigen und enthaltene Bilder Nachladen
                        $(this).show().find('img').each(function () {
                            _imageChangeALaJail($(this));
                        });
                    } else {
                        $(this).hide();
                    }
                });

        };

        $('#ArtikelListeInhalt table#ArticleProducts')
            .unbind('click.matching')
            .bind({'click.matching': function (e) {
                var $target,
                    $ArticleData,
                    $clickedLi,
                    clickedClass,
                    tabClassName,
                    debug = false;

                e.preventDefault();
                e.stopPropagation();

                $target = $(e.target);
                clickedClass = $target.context.className.split(' ')[0];

                // debug:
                if (debug) {
                    alert('target:\n' +
                          'tag: '            + $target.context.tagName + '\n' +
                          'clicked-class: '  + $target.context.className + '\n' +
                          'pclass: '         + ($target.parents('ul')[0] ? $target.parents('ul')[0].className.split(' ')[0] : 'undef')
                    );
                }

                // Tabber-Button geklickt
                // => Status ändern und Tab tauschen
                if ($target.context.tagName === 'DIV' &&
                    ($target.parents('ul')[0] && $target.parents('ul')[0].className.split(' ')[0] === 'tabs')
                ) {
                    tabClassName = clickedClass.replace(/Button/, '');

                    $clickedLi = $target.closest('tr.MatchingRow')
                                        .find('div.tabberButtons ul.tabs li');

                    // Tab-Button-Status innerhalb der Zeile setzen
                    $clickedLi.each(function () {
                        $(this).removeClass('selected')
                               .children()
                               .css('border-top-color', '#BABABA');
                    });
                    $clickedLi
                        .find('div.'+clickedClass)
                        .css('border-top-color',
                             function () { // Button-Übersicht behält border-top
                                return ( $(this).hasClass('uebersichtButton') ? '' : '#EEE' );
                         })
                        .parent('li')
                        .addClass('selected');

                    $target
                        .closest('tr.MatchingRow')
                        .find('div.tabpanels div.tabpanel')
                        .each(function () {
                            if ( $(this).hasClass(tabClassName) ) {
                                // Tabpanel anzeigen und enthaltene Bilder Nachladen
                                $(this).show().find('img').each(function () {
                                    _imageChangeALaJail($(this));
                                });
                            } else {
                                $(this).hide();
                            }
                    });
                    return;
                }

                $ArticleData = $target.closest('tr.MatchingRow')
                                      .find('div.ArticleData');

                switch (clickedClass) {
                    case 'articleDescription':
                    case 'ansehenButton':
                    case 'articleImg':
                    case 'brutto':
                    case 'netto':
                        inwerkTools.toArticle(
                            $ArticleData.attr('article_id'),
                            $ArticleData.attr('category_id'),
                            $ArticleData.attr('statisch'),
                            $ArticleData.attr('shopkuerzel'),
                            $ArticleData.attr('tmp_param')
                        );
                        return;
                        break;

                    default:
                        break;
                }

                // Klick auf Gesamte Fläche des Artikels führt zum Artikel
                if (
                     $target.context.tagName === 'DIV' ||
                     $target.context.tagName === 'TD' ||
                     $target.context.tagName === 'TABLE' ||
                     $target.context.tagName === 'TR'
                ) {
                    if (debug) {
                        alert(
                            'Würde jetzt zu Artikel ' +
                            $ArticleData.attr('shopkuerzel').toUpperCase() +
                            $ArticleData.attr('article_id') +
                            ' gehen...'
                        );
                    }
                    inwerkTools.toArticle(
                            $ArticleData.attr('article_id'),
                            $ArticleData.attr('category_id'),
                            $ArticleData.attr('statisch'),
                            $ArticleData.attr('shopkuerzel'),
                            $ArticleData.attr('tmp_param')
                        );
                }

            }
        });
    };

    var _initOverview = function () {
        _setEventListener();
        $('.articleImg').jail({
            'placeholder': '../img/stuff/bild_wird_geladen.gif',
            'event': 'load+scroll'
        });
        $('select[name^=option_]')
        .selectmenu({
            style:     'dropdown',
            width:     100,
            menuWidth: 150,
            iconsFromAttribute: {
                attrib: 'title', icon: 'ui-icon-inwerk'
            }
        });

        $('select[name=sortierung]')
        .selectmenu({
            style:     'dropdown',
            width:     120,
            menuWidth: 120
        });

        $('a.reset').bind({
            click: function () {
                overviewFunctions.showList({
                    'id_kategorie': $('select[name=id_kategorie]').val()
                });
            }
        });

        // no boxes on focus
        $('a.reset,a.OverInfo').bind({
            focus: function () {
                if (this.blur) {this.blur();}
            }
        });

        overviewFunctions.bindDeliveryInfo('td.articlePrice .deliveryAmount');
    };
    
    $(document).keydown(function (e) {
        var sParam = '';
        if (e.ctrlKey && e.shiftKey) {
            if (e.keyCode == 123) { // shortcut: strg + f12
                $('select[name^=option_]').each(function (e) {
                    sParam += '&'+$(this).attr('name')+'='+$(this).val();
                });
                $.fancybox({
                    'content': '<input style="width:500px" value="http://'+location.host+
                        '/shop_set/set.php'+
                        '?id_kategorie='+$('select[name="id_kategorie"]').val()+
                        sParam+
                        '&preisVon='+$('.articlePriceFilter input[name="price_from"]').val()+
                        '&preisBis='+$('.articlePriceFilter input[name="price_to"]').val()+
                        '&order='+$('.articlePriceFilter select[name=sortierung]').val()+
                        '&id_artikel_csv='+$('input[name="id_artikel_csv"]').val()+
                        '" /><br /><br /><center>Strg+c, um Wert in die Zwischenablage zu kopieren</center>',
                    onComplete: function () {
                        $('#fancybox-content input').focus().select();
                    }
                });
            }
        }
    });

    _initOverview();
});
// Overview-Functions
//////////////////////////////////////////////////////

