@foreach($venues as $venue)
@php($selected_screens = 0)
@php($screen_count = count($venue->venuScreens))
<div id="paginationdemo_{{ $venue->id }}" class="cldMap_viewBox map_view0{{ count($venue->venuScreens) }} demo regular slider venue_{{ $venue->id }} Clearfix" data-venue-id="{{ $venue->id }}">
    @if(!empty($venue->venuScreens) && !$venue->venuScreens->isEmpty())
        @php($i=1)
        @foreach($venue->venuScreens as $screen)
        @if(!empty($screen->screenTranslation))

        @if($i==1)
        <div id="p_{{ $venue->id }}_{{ $i }}" class="pagedemo _current" style="display: block">
        @else
        <div id="p_{{ $venue->id }}_{{ $i }}" class="pagedemo" style="display: none">
        @endif
        @if(!empty(session()->get('screen_id') && session()->get('screen_id')[0]) && in_array($screen->id,array_unique(session()->get('screen_id'))))
        @php($selected_screens+=1)
        @endif
            <div id="map_view_screen">
                <div class="map_screenBox screen_venue_{{ $screen->venue_id }} selected_value_{{ $screen->id }} {{ !empty($screen_ids) ? in_array($screen->id,$screen_ids) ? 'selected_value' : '' : '' }}" data-id="{{ $screen->id }}">
                    <div class="upl_wrapBox">
                    <a href="" class="map_screenImg" data-id="{{ $screen->id }}">
                        @if(!empty($screen->discount) && $screen->discount > 0)
                        <div class="off_screen_wrap">
                            <div class="off_screenBg">
                                <span>{{ discountFormat($screen->discount) }}% {{ trans('landing.off') }}</span>
                            </div>
                        </div>
                        @endif
                        <div class="map_select_box">
                            <div class="map_select screen_venue_id_{{ $screen->venue_id }} screen_select_{{ $screen->id }} {{ !empty($screen_ids) ? in_array($screen->id,$screen_ids) ? 'screen_selected' : '' : '' }}">
                                <i class="icon select_tick"></i>
                            </div>
                        </div>
                        @if(!empty($screen->image) && file_exists('uploads/screen/'.$screen->image))
                        <img src="{{ asset('uploads/screen/'.$screen->image) }}" alt="screens" />
                        @else
                        <img src="{{ asset('advertiser_user/images/screen_image.jpg') }}" alt="screens" />
                        @endif
                    </a>
                    </div>
                    <div class="scr_contentBox">
                        
                        <div class="scr_contTop">
                            <div class="contTop_left scr_cont_slots">
                                <div class="scr_loc_images">
                                    
                                    <img src="{{ !empty($screen->venue) && !empty($screen->venue->image) && file_exists('uploads/venue/' . $screen->venue->image) ?  asset('uploads/venue/'.$screen->venue->image) : asset('advertiser_user/images/logo.svg') }}" alt="location-image01"/>
                                </div>
                            </div>
                            <div class="contTop_right scr_cont_ratio">
                                <div class="scr_loc_location">
                                    <p class="scr_location_txt">{{ !empty($screen->venue) && !empty($screen->venue->location) ? (strlen($screen->venue->location) > 19) ? substr($screen->venue->location, 0, 19). '...' : $screen->venue->location : '' }}</p>
                                    
                                </div>
                            </div>
                        </div>
                        @if(!empty($screen->discount) && $screen->discount >= 0)
                        @php($slot_price = (!empty($screen->price) && $screen->price > 0) ? ($screen->price) : ((!empty($screen->slotPrice) && !empty($screen->slotPrice->slots)) ? ($screen->slotPrice->slots->price) : (0)))
                        @php($slot_price = $slot_price-(($screen->discount/100)*100))
                        @else
                        @php($slot_price = (!empty($screen->price) && $screen->price > 0) ? ($screen->price) : (!empty($screen->slotPrice) && !empty($screen->slotPrice->slots) ? ($screen->slotPrice->slots->price) : (0)))

                        @endif
                        <div class="scr_contBtm">
                            <div class="contBtm_left">
                                <span class="leftday_sar"><p><b>{{ !empty($screen->slotPrice) && !empty($screen->slotPrice->slots) && !empty($screen->slotPrice->slots->slotCurrency) ? $screen->slotPrice->slots->slotCurrency->code : "N/A" }} {{ priceFormat($slot_price) }}</b></p></span>
                            </div>
                            <div class="contBtm_right">
                                <span class="rightday_view"><i class="icon view_ico"></i><p><b> {{ thousandsCurrencyFormat($screen->viewer) }}</b></p></span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="contBtm_center">
                    @if(!empty($cart_screen))
                    <div class="video_btmBox">
                        <div class="upl_dlt">
                            <input type="button" class="delete delete_cart" data-id="{{ $screen->id }}" value="cancel">
                        </div>
                        <div class="info_hoverDts">
                            <p>Double click to delete</p>
                        </div>
                    </div>
                    @else
                    <button class="info_dtsBtn">{{ trans('home.screen_info') }}</button>
                    <div class="info_hoverDts">
                        <p>{{!empty($venue->venueTranslation->short_description) ? $venue->venueTranslation->short_description : "N/A"  }}</p>
                    </div>
                    @endif
                </div> 
            </div>
        </div>
        @php($i++)
        @endif
        @endforeach
    @endif            
    <div id="demo{{ $venue->id }}" class="demo5">     
    </div> 
    <span class="prev_button"></span>                                                                       
    <span class="next_button"></span>   
    @if($screen_count>1)
    <div class="map_select_all ">
        <div class="select_all_tile">
            <label class="{{ $selected_screens == $screen_count ? 'selected_value' : ''}} checkbox_lable"><input id="venue_{{ $venue->id }}" type="checkbox" {{ $selected_screens == $screen_count ? 'checked' : ''}} class="check-custom venue_{{ $venue->id }}"><span class="check-toggle"></span>All &nbsp;<span class="scr_all_count">{{ $screen_count }}<span></label>
        </div>
    </div>
    @endif
</div>
@endforeach

<script>
    $(function() {
        @foreach($venues as $venue)
        var slider_count = 0
        slider_count = $('#paginationdemo_{{ $venue->id }}').find('.pagedemo').length
        $("#demo{{ $venue->id }}").paginate({
            count 		: slider_count,
            start 		: 1,
            display     : slider_count,
            border		: true,
            images		: false,
            mouse		: 'press',
            onChange    : function(page){
                $('._current','#paginationdemo_{{ $venue->id }}').removeClass('_current').hide();
                $('#p_{{ $venue->id }}_'+page).addClass('_current').show();

                $('span.jPag-current').click(function(e) {
                    e.stopPropagation();
                    var regex = /paginationdemo_/g;
                    var parent_li_index = $(this).parent().index();
                    var parent_wrapper = $(this).parent();                        
                    var parent_li_index_plus_one = parent_li_index+1;
                    var outer_wrapper = $(this).parent().parent().parent().parent().parent();
                    var outer_venue_id = outer_wrapper.attr('id')
                    var demo_page_length = outer_wrapper.find('.pagedemo').length;
                    outer_venue_id = outer_venue_id.replace(regex,'')
                    var wrapper_parent = $(this).parent().parent().parent().parent().parent().children('#p_'+outer_venue_id+'_'+parent_li_index_plus_one).find('.map_screenBox');

                    if(parent_wrapper.hasClass('selected_bullet')) {
                        parent_wrapper.removeClass('selected_bullet')
                    } else {
                        parent_wrapper.addClass('selected_bullet');
                    }

                    if(wrapper_parent.hasClass('selected_value')) {    
                        wrapper_parent.trigger( "click" );                            
                    } else {
                        wrapper_parent.trigger( "click" );
                    }

                    var outer_wrapper_length = outer_wrapper.find('.map_screenBox.selected_value').length
                    var checkbox_label = $(this).parent().parent().parent().parent().parent().find('.checkbox_lable');
                    
                    if(demo_page_length != outer_wrapper_length) {                        
                        $(checkbox_label).removeClass('selected_value');
                        $(checkbox_label).find('.check-custom').prop('checked', false);
                    } else {
                        $(checkbox_label).addClass('selected_value');
                        $(checkbox_label).find('.check-custom').prop('checked', true);
                    }                        
                })
            }
        });
        slider_count = 0

        var selected_screens = $('#paginationdemo_{{ $venue->id }}').children().children().children('.selected_value').parent().parent();
        $(selected_screens).each(function( index, element ) {
            $(element).each(function( i, v ) {
                if($(this).hasClass('pagedemo')) {
                    var res = $(this).attr('id').replace('p_{{ $venue->id }}_', "");
                    $('#demo{{  $venue->id}} ul.jPag-pages li:nth-child('+res+')').addClass('selected_bullet')
                }
            })
            
        });
        @endforeach
        /*
        $('span.jPag-current').click(function(e) {
            e.stopPropagation();
            var regex = /paginationdemo_/g;
            var parent_li_index = $(this).parent().index();
            var parent_wrapper = $(this).parent();                
            var parent_li_index_plus_one = parent_li_index+1;
            var outer_wrapper = $(this).parent().parent().parent().parent().parent();
            var outer_venue_id = outer_wrapper.attr('id')
            var demo_page_length = outer_wrapper.find('.pagedemo').length;
            outer_venue_id = outer_venue_id.replace(regex,'')
            var wrapper_parent = $(this).parent().parent().parent().parent().parent().children('#p_'+outer_venue_id+'_'+parent_li_index_plus_one).find('.map_screenBox');

            if(parent_wrapper.hasClass('selected_bullet')) {
                parent_wrapper.removeClass('selected_bullet')
            } else {
                parent_wrapper.addClass('selected_bullet');                    
            }

            if(wrapper_parent.hasClass('selected_value')) {                    
                wrapper_parent.trigger( "click" );                    
            } else {
                wrapper_parent.trigger( "click" );
            }

            var outer_wrapper_length = outer_wrapper.find('.map_screenBox.selected_value').length
            var checkbox_label = $(this).parent().parent().parent().parent().parent().find('.checkbox_lable');

            if(demo_page_length != outer_wrapper_length) {                        
                $(checkbox_label).removeClass('selected_value');
                $(checkbox_label).find('.check-custom').prop('checked', false);
            } else {
                $(checkbox_label).addClass('selected_value');
                $(checkbox_label).find('.check-custom').prop('checked', true);
            }                
        })      */

    });
</script>