https://keranjangbelanja.co.id/js/main.js

1/*  ---------------------------------------------------
2    Template Name: Ogani
3    Description:  Ogani eCommerce  HTML Template
4    Author: Colorlib
5    Author URI: https://colorlib.com
6    Version: 1.0
7    Created: Colorlib
8---------------------------------------------------------  */
9
10'use strict';
11
12(function ($) {
13
14    /*------------------
15        Preloader
16    --------------------*/
17    $(window).on('load', function () {
18        $(".loader").fadeOut();
19        $("#preloder").delay(200).fadeOut("slow");
20
21        /*------------------
22            Gallery filter
23        --------------------*/
24        $('.featured__controls li').on('click', function () {
25            $('.featured__controls li').removeClass('active');
26            $(this).addClass('active');
27        });
28        if ($('.featured__filter').length > 0) {
29            var containerEl = document.querySelector('.featured__filter');
30            var mixer = mixitup(containerEl);
31        }
32    });
33
34    /*------------------
35        Background Set
36    --------------------*/
37    $('.set-bg').each(function () {
38        var bg = $(this).data('setbg');
39        $(this).css('background-image', 'url(' + bg + ')');
40    });
41
42    //Humberger Menu
43    $(".humberger__open").on('click', function () {
44        $(".humberger__menu__wrapper").addClass("show__humberger__menu__wrapper");
45        $(".humberger__menu__overlay").addClass("active");
46        $("body").addClass("over_hid");
47    });
48
49    $(".humberger__menu__overlay").on('click', function () {
50        $(".humberger__menu__wrapper").removeClass("show__humberger__menu__wrapper");
51        $(".humberger__menu__overlay").removeClass("active");
52        $("body").removeClass("over_hid");
53    });
54
55    /*------------------
56		Navigation
57	--------------------*/
58    // $(".mobile-menu").slicknav({
59    //     prependTo: '#mobile-menu-wrap',
60    //     allowParentLinks: true
61    // });
62
63    /*-----------------------
64        Categories Slider
65    ------------------------*/
66    $(".categories__slider").owlCarousel({
67        loop: true,
68        margin: 0,
69        items: 4,
70        dots: false,
71        nav: true,
72        navText: ["<span class='fa fa-angle-left'><span/>", "<span class='fa fa-angle-right'><span/>"],
73        animateOut: 'fadeOut',
74        animateIn: 'fadeIn',
75        smartSpeed: 1200,
76        autoHeight: false,
77        autoplay: true,
78        responsive: {
79
80            0: {
81                items: 1,
82            },
83
84            480: {
85                items: 2,
86            },
87
88            768: {
89                items: 3,
90            },
91
92            992: {
93                items: 4,
94            }
95        }
96    });
97
98
99    $('.hero__categories__all').on('click', function(){
100        $('.hero__categories ul').slideToggle(400);
101    });
102
103    /*--------------------------
104        Latest Product Slider
105    ----------------------------*/
106    $(".latest-product__slider").owlCarousel({
107        loop: true,
108        margin: 0,
109        items: 1,
110        dots: false,
111        nav: true,
112        navText: ["<span class='fa fa-angle-left'><span/>", "<span class='fa fa-angle-right'><span/>"],
113        smartSpeed: 1200,
114        autoHeight: false,
115        autoplay: true
116    });
117
118    /*-----------------------------
119        Product Discount Slider
120    -------------------------------*/
121    $(".product__discount__slider").owlCarousel({
122        loop: true,
123        margin: 0,
124        items: 3,
125        dots: true,
126        smartSpeed: 1200,
127        autoHeight: false,
128        autoplay: true,
129        responsive: {
130
131            320: {
132                items: 1,
133            },
134
135            480: {
136                items: 2,
137            },
138
139            768: {
140                items: 2,
141            },
142
143            992: {
144                items: 3,
145            }
146        }
147    });
148
149    /*---------------------------------
150        Product Details Pic Slider
151    ----------------------------------*/
152    $(".product__details__pic__slider").owlCarousel({
153        loop: true,
154        margin: 20,
155        items: 4,
156        dots: true,
157        smartSpeed: 1200,
158        autoHeight: false,
159        autoplay: true
160    });
161
162    /*-----------------------
163		Price Range Slider
164	------------------------ */
165    var rangeSlider = $(".price-range"),
166        minamount = $("#minamount"),
167        maxamount = $("#maxamount"),
168        minPrice = rangeSlider.data('min'),
169        maxPrice = rangeSlider.data('max');
170    rangeSlider.slider({
171        range: true,
172        min: minPrice,
173        max: maxPrice,
174        values: [minPrice, maxPrice],
175        slide: function (event, ui) {
176            minamount.val('$' + ui.values[0]);
177            maxamount.val('$' + ui.values[1]);
178        }
179    });
180    minamount.val('$' + rangeSlider.slider("values", 0));
181    maxamount.val('$' + rangeSlider.slider("values", 1));
182
183    /*--------------------------
184        Select
185    ----------------------------*/
186    $("select").niceSelect();
187
188    /*------------------
189		Single Product
190	--------------------*/
191    $('.product__details__pic__slider img').on('click', function () {
192
193        var imgurl = $(this).data('imgbigurl');
194        var bigImg = $('.product__details__pic__item--large').attr('src');
195        if (imgurl != bigImg) {
196            $('.product__details__pic__item--large').attr({
197                src: imgurl
198            });
199        }
200    });
201
202    /*-------------------
203		Quantity change
204	--------------------- */
205    var proQty = $('.pro-qty');
206    proQty.prepend('<span class="dec qtybtn">-</span>');
207    proQty.append('<span class="inc qtybtn">+</span>');
208    proQty.on('click', '.qtybtn', function () {
209        var $button = $(this);
210        var oldValue = $button.parent().find('input').val();
211        if ($button.hasClass('inc')) {
212            var newVal = parseFloat(oldValue) + 1;
213        } else {
214            // Don't allow decrementing below zero
215            if (oldValue > 0) {
216                var newVal = parseFloat(oldValue) - 1;
217            } else {
218                newVal = 0;
219            }
220        }
221        $button.parent().find('input').val(newVal);
222    });
223
224})(jQuery);