@php
    $ti      = 3;
    $usednum = count($comproducts);
    $freenum = $ti-$usednum;
    $class   = ($usednum) ? ' class="compareshowed"' : '';
    $i = 1;
@endphp



<div id="compare-wrap" {!! $class  !!}>
  	<div class="container-fluid">
        <div class="row">
            <div class="col-md-9">
                <div class="row" id="compare-list">

                @if($usednum)
                    @foreach($comproducts as $product)
                        @php
                            $imgsrc    = (is_file(public_path($product->prod_simg))) ? url($product->prod_simg) : url(config('images.no_image_paths.s'));
                            $prodtitle = strtoupper($product->brand_name).' '.ucfirst($product->prod_name);
                        @endphp

                        <div class="compare-item cub">
                           <span class="compare-item-num">{{$i}}</span>
                           	<div class="compare-item-img">
                               	<img class="img-responsive" src="{{$imgsrc}}">
                               	</div>
                           	<span class="compare-item-name">{{$prodtitle}}</span>
                           	<a href="#" class="compare-item-remove" data-id="{{$product->prod_id}}"><i class="thm-dismiss"></i> X</a>
                        </div>

                        @php ++$i; @endphp
                    @endforeach
                @endif


                @if($freenum)
                    @for($x = $i; $x <= $ti; $x++)
                    <div class="compare-item">
                        <span class="compare-item-num">{{$x}}</span>
                    </div>
                    @endfor
                @endif

                </div><!-- /#compare-list -->
            </div><!-- /.col-md-9 -->
            <div class="col-md-3" id="comapare-btns">
                <span data-href="/compare" id="do-compare-btn">{{__('frontside.compare.compare_prod')}}</span>
                <span id="remove-all-compare-items">{{__('frontside.compare.remove_prod')}}</span>
            </div><!-- /#compare-btns -->
        </div><!-- /.row -->
    </div><!-- container-fluid -->
</div><!-- / #compare-wrap -->
@push('css')

@endpush
@push('scripts')
    <script src="{{asset('assets/js/'.app()->getLocale().'/compare.js')}}"></script>
@endpush