(function($) {
    $(document).on('change','#rdg-picks-vs-category',function(e) {
        e.preventDefault();
        $(".rdg-blocks .rdg-picks-vs .picks .message").hide();
        
        let ajax_url = rdg_picks_vs_var.ajaxurl;
        let items = $(e.target).attr('data-items');
        let block_id = $(e.target).attr('data-block-id');
        let cat_seleted = $('#'+block_id+' #rdg-picks-vs-category option:selected').val();
        let buttons = $('.buttons .link-info, .buttons .link-default');

        let data = {'data_date_type':'', 'data_since_date':'', 'data_to_date':''};
        let data_date_type = $(this).attr('data-date-type');
        let data_since_date = $(this).attr('data-since-date');
        let data_to_date = $(this).attr('data-to-date');

        let custom_link_show = $(this).attr('data-custom-link-show');
        let custom_link_url = $(this).attr('data-custom-link-url');
        let custom_link_target = $(this).attr('data-custom-link-target');

        $.each(buttons, function(key, val) {
            if ($(val).hasClass('link-info')) {
                data.data_date_type = $(val).attr('data-date-type');
                data.data_since_date = $(val).attr('data-since-date');
                data.data_to_date = $(val).attr('data-to-date');
            }
        }, data);

        $.ajax({
            url : ajax_url,
            type: 'post',
            data: {
                action : 'load_picks_vs',
                items: items,
                id_sub_category: cat_seleted,
                data_date_type: data.data_date_type,
                data_since_date: data.data_since_date,
                data_to_date: data.data_to_date,
                custom_link_show: custom_link_show,
                custom_link_url: custom_link_url,
                custom_link_target: custom_link_target,
            },
            beforeSend: function() {
                $('#wait').show();
            },
            success: function(resultado) {
                $('.rdg-blocks #'+block_id).find('.picks').html(resultado);
                $('#wait').hide();
                setTimeout(function() {
                    $(".rdg-blocks #"+block_id+" .picks .message").fadeOut(1500);
                }, 4000);
            }
        });
    });

    $(document).on('click','.rdg-picks-vs .buttons a',function(e) {
        e.preventDefault();

        if ($(e.target).hasClass('link-info')) {
            return;
        }

        let block_id = $(e.target).attr('data-block-id');
        $(".rdg-blocks #"+block_id+" .rdg-picks-vs .picks .message").hide();

        let ajax_url = rdg_picks_vs_var.ajaxurl;
        let buttons = $('#'+block_id+' .buttons .link-info, #'+block_id+' .buttons .link-default');

        let button_id = $(this).attr('id');
        let items = $(this).attr('data-items');
        let data_date_type = $(this).attr('data-date-type');
        let data_since_date = $(this).attr('data-since-date');
        let data_to_date = $(this).attr('data-to-date');
        let custom_link_show = $(this).attr('data-custom-link-show');
        let custom_link_url = $(this).attr('data-custom-link-url');
        let custom_link_target = $(this).attr('data-custom-link-target');
        let filter_category = $(this).attr('data-category');
        let cat_seleted = $('#'+block_id+' #rdg-picks-vs-category option:selected').val();

        if (cat_seleted === undefined) {
            cat_seleted = filter_category;
        }

        $.each(buttons, function(key, val) {      
            if (button_id == $(val).attr("id")) {
                $(val).removeClass('link-default');
                $(val).addClass('link-info');
            } else {
                $(val).removeClass('link-info');
                $(val).addClass('link-default');
            }
        }, button_id); 

        $.ajax({
            url : ajax_url,
            type: 'post',
            data: {
                action : 'load_picks_vs',
                items: items,
                id_sub_category: cat_seleted,
                data_date_type: data_date_type,
                data_since_date: data_since_date,
                data_to_date: data_to_date,
                custom_link_show: custom_link_show,
                custom_link_url: custom_link_url,
                custom_link_target: custom_link_target,
            },
            beforeSend: function() {
                $('#wait').show();
            },
            success: function(resultado) {
                $('.rdg-blocks #'+block_id).find('.picks').html(resultado);
                $('#wait').hide();
                setTimeout(function() {
                    $(".rdg-blocks #"+block_id+" .picks .message").fadeOut(1500);
                }, 4000);
            }
        });
    });
}) (jQuery);


// Category needs to be fixed
// (function() {
//     const rdgPicksVs = document.querySelector('#rdg-picks-vs-category');

//     if (rdgPicksVs !== null) {
//         rdgPicksVs.addEventListener('change', function(e) {
//             e.preventDefault();
//             // const rdgBlocks = document.querySelectorAll('.rdg-blocks');
//             const items = e.target.getAttribute('data-items');
//             const blockId = e.target.getAttribute('data-block-id');
//             const catSelected = document.querySelector('#' + blockId + ' #rdg-picks-vs-category option:checked').value;
//             const buttons = document.querySelectorAll('.buttons .link-info, .buttons .link-default');
//             let ajax_url = rdg_picks_vs_var.ajaxurl;

//             document.querySelector('#wait').style.display = 'block';

//             let data = {'data_date_type':'', 'data_since_date':'', 'data_to_date':''};
//             buttons.forEach(function(button) {
//                 if (button.classList.contains('link-info')) {
//                     data.data_date_type = button.getAttribute('data-date-type');
//                     data.data_since_date = button.getAttribute('data-since-date');
//                     data.data_to_date = button.getAttribute('data-to-date');
//                 }
//             }, data);

//             fetch(ajax_url, {
//                 method: 'POST',
//                 headers: {
//                     'Content-Type': 'application/x-www-form-urlencoded'
//                 },
//                 body: `action=load_picks_vs&items=${items}&id_sub_category=${catSelected}&data_date_type=${data.data_date_type}&data_since_date=${data.data_since_date}&data_to_date=${data.data_to_date}`
//             })
//             .then(response => response.text())
//             .then(resultado => {
//                 document.querySelector('.rdg-blocks .picks').innerHTML = resultado;
//                 document.querySelector('#wait').style.display = 'none';
//                 setTimeout(function() {
//                     const messageElement = document.querySelector('.rdg-blocks .picks .message');
//                     if (messageElement) {
//                         messageElement.style.display = 'none';
//                     }
//                 }, 3000);
//             })
//             .catch(error => console.error('Error:', error));
//         });
    
//     }

//     document.addEventListener('click', function(e) {
//         if (e.target.matches('.rdg-picks-vs .buttons a') && !e.target.matches('.link-info')) {
//             e.preventDefault();
//             const blockId = e.target.getAttribute('data-block-id');
//             const catSelected = document.querySelector('#' + blockId + ' #rdg-picks-vs-category option:checked').value;
//             const buttons = document.querySelectorAll('#' + blockId + ' .buttons .link-info, #' + blockId + ' .buttons .link-default');
//             const buttonId = e.target.getAttribute('id');
//             const items = e.target.getAttribute('data-items');
//             const dataDateType = e.target.getAttribute('data-date-type');
//             const dataSinceDate = e.target.getAttribute('data-since-date');
//             const dataToDate = e.target.getAttribute('data-to-date');
//             let ajax_url = rdg_picks_vs_var.ajaxurl;

//             buttons.forEach(function(button) {
//                 if (button.getAttribute('id') === buttonId) {
//                     button.classList.remove('link-default');
//                     button.classList.add('link-info');
//                 } else {
//                     button.classList.remove('link-info');
//                     button.classList.add('link-default');
//                 }
//             });

//             document.getElementById('wait').style.display = 'block';
    
//             fetch(ajax_url, {
//                 method: 'POST',
//                 headers: {
//                     'Content-Type': 'application/x-www-form-urlencoded'
//                 },
//                 body: `action=load_picks_vs&items=${items}&id_sub_category=${catSelected}&data_date_type=${dataDateType}&data_since_date=${dataSinceDate}&data_to_date=${dataToDate}`
//             })
//             .then(response => response.text())
//             .then(resultado => {
//                 document.querySelector('.rdg-blocks .picks').innerHTML = resultado;
//                 document.getElementById('wait').style.display = 'none';
//                 setTimeout(function() {
//                     let message = document.querySelector('.rdg-blocks .picks .message');
//                     if (message) {
//                     message.style.display = 'none';
//                     }
//                 }, 3000);
                
//             })
//             .catch(error => console.error('Error:', error));
//         }
//     });    
// })();