$(document).ready(function() {

    var wind = $(window);

    wow = new WOW({
        boxClass: 'wow',
        animateClass: 'animated',
        offset: 200,
        mobile: true,
        live: true
    });
    wow.init();

    // ----------- fixed navbar -----------

    wind.on("scroll", function() {

        var bodyScroll = wind.scrollTop(),
            navbar = $(".navbar .custom-navbar")

        if (bodyScroll > 200) {

            navbar.addClass("fixed");

        } else {

            navbar.removeClass("fixed");
        }
    });



    // ---------- to top -----------
    $('.to-top').click(function() {
        $('html, body').animate({
            scrollTop: 0
        }, 1000);
        return false;
    });



    // ---------- to bottom -----------
    $('header .scroll-down').click(function() {
        var services = $(".services").offset().top;
        $('html, body').animate({
            scrollTop: services
        }, 1000);
        return false;
    });

    // ---------- search -----------
    $(".search_link").on("click", function() {
        $(".fixed_search").fadeIn();
    })

    $(".fixed_search .cls").on("click", function() {
            $(".fixed_search").fadeOut();
        })
        // ---------- close parent -----------
    $(".cls").on("click", function() {
        $(this).parent().fadeOut();
    })

    // ------------ tooltip ------------
    $(function() {
        $('[data-toggle="tooltip"]').tooltip()
    })

    // ------------ grid & list --------------
    $(".grid_list_btn .list_btn").on("click", function() {
        $(".prod_cont").addClass("list")
    })
    $(".grid_list_btn .grid_btn").on("click", function() {
        $(".prod_cont").removeClass("list")
    })

    $(".grid_list_btn span").on("click", function() {
        $(this).addClass("active").siblings().removeClass("active")
    })

    // ----------- sidemenu button ---------
    $('#nav-icon2').click(function() {
        $(this).toggleClass('open');
    });

    // ------------ Multiple images preview in browser ----------
    var imagesPreview = function(input, placeToInsertImagePreview) {

        if (input.files) {
            var filesAmount = input.files.length;

            for (i = 0; i < filesAmount; i++) {
                var reader = new FileReader();

                reader.onload = function(event) {
                    $($.parseHTML('<img>')).attr('src', event.target.result).appendTo(placeToInsertImagePreview);
                }

                reader.readAsDataURL(input.files[i]);
            }
        }

    };

    $('#upload-recipe').on('change', function() {
        imagesPreview(this, 'div.gallery');
        // $(this).next().fadeOut(0)
    });

    // ------------ upload video -----------
    function handleFileSelect(evt) {
        var files = evt.target.files;

        // Loop through the FileList and render image files as thumbnails.
        for (var i = 0, f; f = files[i]; i++) {

            console.log(f);

            // Only process image files.
            if (!f.type.match('video.*')) {
                continue;
            }


            var reader = new FileReader();

            // Closure to capture the file information.
            reader.onload = (function(theFile) {
                return function(e) {
                    // Render thumbnail.
                    var span = document.createElement('span');
                    span.innerHTML = [
                        '<video src="',
                        e.target.result,
                        '" title="', escape(theFile.name),
                        'style="max-width:100px"',
                        '">',
                        '</video>'
                    ].join('');

                    document.getElementById('list').insertBefore(span, null);
                };
            })(f);

            // Read in the image file as a data URL.
            reader.readAsDataURL(f);
        }
    }

    document.getElementById('video').addEventListener('change', handleFileSelect, false);

});

// ---------- swiper slider ---------- 
$(document).ready(function() {
    //  <!-- Initialize Swiper -->
    var galleryThumbs = new Swiper('.gallery-thumbs', {
        spaceBetween: 10,
        slidesPerView: 4,
        loop: true,
        freeMode: true,
        loopedSlides: 5, //looped slides should be the same
        watchSlidesVisibility: true,
        watchSlidesProgress: true,
    });
    var galleryTop = new Swiper('.gallery-top', {
        spaceBetween: 10,
        loop: true,
        loopedSlides: 5, //looped slides should be the same
        navigation: false,
        thumbs: {
            swiper: galleryThumbs,
        },
        autoplay: {
            delay: 3000,
        },
        pagination: {
            el: '.swiper-pagination',
        },
    });
});

// --------------- range slider -------------
$(document).ready(function() {
    var parent = document.querySelector("#rangeSlider");
    if (!parent) return;

    var
        rangeS = parent.querySelectorAll("input[type=range]"),
        numberS = parent.querySelectorAll("input[type=number]");

    rangeS.forEach(function(el) {
        el.oninput = function() {
            var slide1 = parseFloat(rangeS[0].value),
                slide2 = parseFloat(rangeS[1].value);

            if (slide1 > slide2) {
                [slide1, slide2] = [slide2, slide1];
                // var tmp = slide2;
                // slide2 = slide1;
                // slide1 = tmp;
            }

            numberS[0].value = slide1;
            numberS[1].value = slide2;
        }
    });

    numberS.forEach(function(el) {
        el.oninput = function() {
            var number1 = parseFloat(numberS[0].value),
                number2 = parseFloat(numberS[1].value);

            if (number1 > number2) {
                var tmp = number1;
                numberS[0].value = number2;
                numberS[1].value = tmp;
            }

            rangeS[0].value = number1;
            rangeS[1].value = number2;

        }
    });
})