// PHC- Start Month Function
(function($) {

    "use strict";
    $(document).ready(function() {

        if ($(".vps-slider-monthly").length > 0) {
        
            let $this = $(".vps-slider-monthly");
            let sliderplans = [];
            
            // Title
            sliderplans[0] = [monthproducts[0].name, monthproducts[1].name, monthproducts[2].name, monthproducts[3].name, monthproducts[4].name];
            // Price
            sliderplans[1] = [monthproducts[0].price, monthproducts[1].price, monthproducts[2].price, monthproducts[3].price, monthproducts[4].price];
            // Description
            sliderplans[2] = [monthproducts[0].desc, monthproducts[1].desc, monthproducts[2].desc, monthproducts[3].desc, monthproducts[4].desc];
            
            // Ram
            sliderplans[3] = [monthproducts[0].ram, monthproducts[1].ram, monthproducts[2].ram, monthproducts[3].ram, monthproducts[4].ram];
            // Processor
            sliderplans[4] = [monthproducts[0].processor, monthproducts[1].processor, monthproducts[2].processor, monthproducts[3].processor, monthproducts[4].processor];
            // Storage
            sliderplans[5] = [monthproducts[0].storage, monthproducts[1].storage, monthproducts[2].storage, monthproducts[3].storage, monthproducts[4].storage];
            
            // Bandwidth
            sliderplans[6] = [monthproducts[0].bandwidth, monthproducts[1].bandwidth, monthproducts[2].bandwidth, monthproducts[3].bandwidth, monthproducts[4].bandwidth];
            // sites
            sliderplans[7] = [monthproducts[0].sites, monthproducts[1].sites, monthproducts[2].sites, monthproducts[3].sites, monthproducts[4].sites];
            // Databases
            sliderplans[8] = [monthproducts[0].databases, monthproducts[1].databases, monthproducts[2].databases, monthproducts[3].databases, monthproducts[4].databases];
            
            // Setup
            sliderplans[9] = [monthproducts[0].setup, monthproducts[1].setup, monthproducts[2].setup, monthproducts[3].setup, monthproducts[4].setup];
            
            // ip one
            sliderplans[10] = [monthproducts[0].migration, monthproducts[1].migration, monthproducts[2].migration, monthproducts[3].migration, monthproducts[4].migration];
            
            // ip two
            sliderplans[11] = [monthproducts[0].ssl, monthproducts[1].ssl, monthproducts[2].ssl, monthproducts[3].ssl, monthproducts[4].ssl];
            
            let urlClass = [monthproducts[0].urlclass, monthproducts[1].urlclass, monthproducts[2].urlclass, monthproducts[3].urlclass, monthproducts[4].urlclass];
            let currentplan = 1;

            $this.xsslide('single', sliderplans, currentplan, 'xs', 'horizontal');
            $this.slider({

                animate: true,
                slide: function( event, ui ) {

                    // Title
                    $('.slider-container .title').html(sliderplans[0][ui.value-1]);
                    // Price
                    $('.slider-container .price').html(sliderplans[1][ui.value-1]);
                    // Description
                    $('.slider-container .desc').html(sliderplans[2][ui.value-1]);

                    // Ram
                    $('.vps-pricing-list .ram').html(sliderplans[3][ui.value-1]);
                    // Processor
                    $('.vps-pricing-list .processor').html(sliderplans[4][ui.value-1]);
                    // Storage
                    $('.vps-pricing-list .storage').html(sliderplans[5][ui.value-1]);

                    // Bandwidth
                    $('.vps-pricing-list .bandwidth').html(sliderplans[6][ui.value-1]);
                    // sites
                    $('.vps-pricing-list .sites').html(sliderplans[7][ui.value-1]);
                    // Databases
                    $('.vps-pricing-list .databases').html(sliderplans[8][ui.value-1]);

                    // sites
                    $('.vps-pricing-list .sites').html(sliderplans[9][ui.value-1]);
                    // Migration
                    $('.vps-pricing-list .migration').html(sliderplans[10][ui.value-1]);
                    // SSL
                    $('.vps-pricing-list .ssl').html(sliderplans[11][ui.value-1]);

                    // Buttons
                    $('.slider-btns').attr('href', urilink[ui.value-1]);

                },
                change: function( event, ui ) {

                    // Title
                    $('.slider-container .title').html(sliderplans[0][ui.value-1]);
                    // Price
                    $('.slider-container .price').html(sliderplans[1][ui.value-1]);
                    // Description
                    $('.slider-container .desc').html(sliderplans[2][ui.value-1]);

                    // Ram
                    $('.vps-pricing-list .ram').html(sliderplans[3][ui.value-1]);
                    // Processor
                    $('.vps-pricing-list .processor').html(sliderplans[4][ui.value-1]);
                    // Storage
                    $('.vps-pricing-list .storage').html(sliderplans[5][ui.value-1]);

                    // Bandwidth
                    $('.vps-pricing-list .bandwidth').html(sliderplans[6][ui.value-1]);
                    // sites
                    $('.vps-pricing-list .sites').html(sliderplans[7][ui.value-1]);
                    // Databases
                    $('.vps-pricing-list .databases').html(sliderplans[8][ui.value-1]);

                    // Steup
                    $('.vps-pricing-list .setup').html(sliderplans[9][ui.value-1]);
                    // Migration
                    $('.vps-pricing-list .migration').html(sliderplans[10][ui.value-1]);
                    // SSL
                    $('.vps-pricing-list .ssl').html(sliderplans[11][ui.value-1]);

                    // Buttons
                    $('.slider-btns').attr('href', urlClass[ui.value-1]);

                }
            });
        }
        
        $('.slider-tigger-monthly').click(function() {
            var value= parseInt(this.id.slice(5)) + 1;
            $('.vps-slider-monthly').slider('value', value);
            if (!$(this).hasClass('current')) {
                $(this).addClass('current');
                $(this).nextAll().removeClass('current');
                $(this).prevAll().removeClass('current');
            } else {
                $(this).removeClass('current');
            }
        });
    
    });

})(jQuery);