jQuery(document).ready(function ($) {
    'use strict';

    var owlContainer = $('.hf-slider');

    /* OWL Seiten Default Settings */
    var OWLDefaultSettings;
    OWLDefaultSettings = {
        autoplay: true,
        autoplayHoverPause: true,
        autoWidth: true, /* ACHTUNG: Für autoWith sollte eine Height gesetzt sein! */
        loop: true,
        items: 1,
        nav: false,
        navText: [
            "<div class='icon icon-ArrowLeft'><span></span></div>",
            "<div class='icon icon-ArrowRight'><span></span></div>"
        ],
        animateOut: "fadeOut"
    };

    var countOfOwlSliderPerPage = 1;
    owlContainer.each(function () {
        var $carousel = $(this);
        if ($(this).children('div, img, picture').length > 1) {
            if (!$(this).attr('id')) {
                $(this).attr('id', "owlSlider" + countOfOwlSliderPerPage);
                countOfOwlSliderPerPage++;
            }

            /* Lade Default Settings */
            var owlSettings = OWLDefaultSettings;

            /* TODO: In Funktion auslagern ... */
            owlSettings.autoplay = ($(this).attr("data-autoplay") == 1);

            if (parseInt($(this).attr("data-items"))) {
                owlSettings.items = parseInt($(this).attr("data-items"));
            }

            owlSettings.autoWidth = ($(this).attr("data-autowidth") == 1);

            if ($(this).attr("data-loop")) {
                owlSettings.loop = ($(this).attr("data-loop") == 1);
            }

            if ($(this).attr("data-center")) {
                owlSettings.center = ($(this).attr("data-center") == 1);
            }

            if ($(this).attr("data-animate")) {
                if($(this).attr("data-animate") == "false") {
                    owlSettings.animateOut = '';
                }
                else {
                    owlSettings.animateOut = $(this).attr("data-animate");
                }
            }

            owlSettings.dots = ($(this).attr("data-dots") == 1);

            if ($(this).attr("data-responsive")) {
                owlSettings.responsive = JSON.parse($(this).attr("data-responsive"));
            }

            owlSettings.nav = ($(this).attr("data-nav") == 1);

            if ($(this).attr("data-autoplayHoverPause")) {
                owlSettings.autoplayHoverPause = ($(this).attr("data-autoplayHoverPause") == 1);
            }

            if (parseInt($(this).attr("data-autoplayTimeout"))) {
                owlSettings.autoplayTimeout = parseInt($(this).attr("data-autoplayTimeout")) * 1000;
            }

            if (parseInt($(this).attr("data-random")) == 1) {
                random($(this));
            }

            var $sliderJumps = $carousel.parent().find('.hf-slider-jump');

            if ($sliderJumps.length) {
                $carousel.on('changed.owl.carousel', function (event) {
                    var instance = $carousel.data('owlCarousel');
                    var index = instance == null ? event.item.index : instance.relative(event.item.index);

                    $sliderJumps.removeClass('active');
                    $sliderJumps.eq(index).addClass('active');
                });

                $sliderJumps.each(function (index) {
                    var $this = $(this);
                    $this.hover(function () {
                        $carousel.trigger('to.owl.carousel', [ index , 0, true ]);
                    });
                });
            }

            /* Initialisiere OWL */
            $(this).owlCarousel(owlSettings);

        }

    });

    function random (owlSelector) {
        owlSelector.children().sort(function () {
            return Math.round(Math.random()) - 0.5;
        }).each(function () {
            $(this).appendTo(owlSelector);
        });
    }

});