Search code examples
ajaxlaraveleventslistenerbroadcasting

How to broadcast a laravel event that can be specifically customized for each user


I have a grid of random products for sale on each users screen. When another user buys a product, if that product is visible on other user screens I need it to fade out and load in a new product. Given that the grid of products is randomly sorted, how can I broadcast a new product to every user that is unique to them (i.e. won't duplicate a product that is already for sale on their screen only ). Also I am still using Laravel 5.2. Previous developers didn't upgrade their version and I can't change it now.

Here is the ajax function when a user buys a product and loads in a new product on their screen.

 $(document).ready(function(){
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $('form.buy-product-form').on('submit', (function (e) {
                e.preventDefault();
                var product_id = $(this).closest('.product').attr("id"); //new
                var element = $(this).closest('.product');
                $.ajax({
                    url: $(this).attr('action'),
                    type: 'POST',
                    data: {'id': product_id, 'all_ids': getProductsShown()},
                    dataType: 'json',
                    success: function (data) {
                        if(data.valid_funds) {
                            $(element).css('background-color', 'red');
                            $(element).fadeOut("1000", function () {
                                $(element).fadeIn("1000", function () {
                                    $(element).animate({backgroundColor: 'green', color: 'white'}, 1000);
                                    $(element).attr("id", data.id);
                                    $(element).find("#price").html(data.price);
                                    $(element).find("#quantity").html(data.quantity);
                                    $(element).find("#seller").html(data.seller);
                                    $(element).find("#total-price").html(data.price * data.quantity);
                                    $(element).find('form').attr("action", "/UoE/buy-product/" + data.id);
                                    $(element).css('background-color', 'white');
                                });
                            });

                            updatePlayerCapital(data.player_capital, data.total_price);
                            updatePlayerUtility(data.player_utility, data.marginal_utility);
                            updatePlayerPurchases(data.purchases);

                        }else if(data.void) {
                            $(element).css('background-color', 'red');
                            $(element).fadeOut("1000", function(){
                                $(element.remove());
                            });

                            updatePlayerCapital(data.player_capital, data.total_price);
                            updatePlayerUtility(data.player_utility, data.marginal_utility);
                            updatePlayerPurchases(data.purchases);

                        }else {
                            window.alert("You do not have enough funds!");
                        }
                    },
                    error: function () {
                            window.alert("Error, product may no longer exist");
                    }
                });
            }));
        });

Solution

  • Hm, I can't quite tell from your code, but if you have something like a user ID or user name, could you create a channel for each UUID, and then whenever you need a 'custom' event sent; just send it on that private channel?