@extends('socialite::layouts.default')

@section('content')
    <div class="container section-container @if($timeline->hide_cover) no-cover @endif">
        <div class="row">
            <div class="col-md-12">
                @include('promoters.show.partials.header')
            </div>
        </div>
        <div class="row">
            <div class="col-md-3">
                @include('promoters.show.partials.left')
            </div>

            @yield('promoter_content')
        </div>
    </div>

    <!-- Modal starts here-->
    <div class="modal fade" id="usersModal" tabindex="-1" role="dialog" aria-labelledby="usersModalLabel">
        <div class="modal-dialog modal-likes" role="document">
            <div class="modal-content">
                <i class="fa fa-spinner fa-spin"></i>
            </div>
        </div>
    </div>
@endsection

@section('bottom_js')
    @parent

    <script>
        $('.like-promoter-button').on('click', function (e) {
            e.preventDefault();

            var promoterButtonsSection = $(this).closest('.beer-buttons');
            $.post(
                $(this).attr('href'),
                {
                    timeline_id: $(this).data('timeline-id'),
                    _token: $('[name="csrf_token"]').attr('content')
                },
                function (data) {
                    if (data.status === 200) {
                        promoterButtonsSection.find('.like').addClass('hidden');
                        promoterButtonsSection.find('.liked').removeClass('hidden');
                        var previousLikesCountVal = $(".promoter-likes-count").html();
                        var newLikesCountVal = parseInt(previousLikesCountVal) + 1;
                        $(".promoter-likes-count").html(newLikesCountVal);
                    }
                });
        });

        $('.unlike-promoter-button').on('click', function (e) {
            e.preventDefault();

            var promoterButtonsSection = $(this).closest('.beer-buttons');
            $.post(
                $(this).attr('href'),
                {
                    timeline_id: $(this).data('timeline-id'),
                    _token: $('[name="csrf_token"]').attr('content')
                },
                function (data) {
                    if (data.status === 200) {
                        promoterButtonsSection.find('.like').removeClass('hidden');
                        promoterButtonsSection.find('.liked').addClass('hidden');
                        var previousLikesCountVal = $(".promoter-likes-count").html();
                        var newLikesCountVal = parseInt(previousLikesCountVal) - 1;
                        $(".promoter-likes-count").html(newLikesCountVal);
                    }
                });
        });
    </script>

    <script type="text/javascript" src="{{ asset('js/promoters.js') }}"></script>
@endsection