@extends('front.v2.partials.master')
@section('content')

    <section id="dashboard-section">

        <div class="container">
            {!! Form::open(array('route' => 'front.v2.add-to-cart-half', 'method' => 'POST' ,'id' => 'add_cart','autocomplete' => "off")) !!}
            <div class="row">
                <input type="hidden" name="left_select" class="left_select" value="0" />
                <input type="hidden" name="right_select" class="right_select" value="0" />
                <div class="col-lg-7 col-sm-12">
                    <div class="all-product">
                        @php
                         $activatedMeny = isSpecialPrices(storeId(),true);
                        @endphp
                        @if(count($items)>0)
                            <ul>
                                @foreach ($items as $item)
                                    <li class="spl-pizza-items">
                                        <div class="item-inner">
                                            <div class="product-boxx-inner">
                                                <div class="list-view">

                                                    <div class="list-product spl-img">
                                                        <img src="{!! getImagePath($item->featured_image,'product') !!}" class="img-fluid" alt="Yummy Time Food">
                                                        <div class="spl-overlay"></div>
                                                    </div>
                                                    @if (isset($item->item_discount) && $item->item_discount > 0)
                                                        <div class="itm-discount" style="top: auto;left: auto">
                                                            <span style="font-size: 12px;top: 6px;font-weight: 600;">{{ (int) $item->item_discount . '% OFF' }}</span>
                                                            <img class="discount-tag" width="70" src="{{ $item->discount_image }}">
                                                        </div>
                                                    @endif
                                                    <p class="item-name">{!! $item->name !!}</p>
                                                    @php
                                                    $itemPrice = $item->v_offer_price;
                                                    if(count($activatedMeny) > 0){
                                                        $specialPrice = getSpecialPrice(0,$item->v_type_json,1,0,$activatedMeny);
                                                        if($specialPrice != null){
                                                            $itemPrice = $specialPrice;
                                                        }
                                                    }
                                                    $itemPrice=($itemPrice)/2;
                                                    if(strpos($itemPrice,".")!==false)
                                                    {
                                                    $prices = numberFormat($itemPrice);
                                                    }
                                                    else
                                                    {
                                                    $prices = numberFormat($itemPrice, false, true, 0);
                                                    }

                                                    @endphp
                                                    <ul class="price_pizaaa">
                                                        <li><span>{!! $prices !!}</span></li>
                                                    </ul>
                                                    <span class="itemId hidden">{{ $item->id }}</span>
                                                    <span class="itemPrice hidden">{{$itemPrice}}</span>
                                                    <span class="variationId hidden"></span>

                                                </div>
                                            </div>
                                        </div>
                                      <span class="removed_ingredients hidden">
                                                                                                              </span>
                                    </li>
                                @endforeach
                            </ul>
                        @endif
                    </div>

                </div>
                <div class="col-lg-5 col-sm-12">
                    <div class="product-box-view">
                        <div class="spr-pizza-mockup d-flex" >
                            {{--<img src="{{ asset('site/img/pizza-mockup.svg')}}" class="img-fluid"/>--}}
                            <div class="pizza-base left-base" style="position: static">
                                {{--<img src="">--}}
                            </div>
                            <div class="pizza-base right-base" style="position: static">
                                {{--<img src="">--}}
                            </div>
                            <input type="hidden" name="left_item_id" value="0" id="left_item_id" />
                            <input type="hidden" name="left_price" value="0" id="left_item_price" />
                            <input type="hidden" name="right_item_id" value="0" id="right_item_id" />
                            <input type="hidden" name="right_price" value="0" id="right_item_price" />
                            <input type="hidden" name="item_price" value="0" class="item_price" />
                            <input type="hidden" name="right_variation_id" value="0" id="right_variation_id" />
                            <input type="hidden" name="left_variation_id" value="0" id="left_variation_id" />
                            <input type="hidden" name="removed_ingredients_left" id="removed_ingredients_left" value="" />
                            <input type="hidden" name="removed_ingredients_right" id="removed_ingredients_right" value="" />
                        </div>
                        <div class="product-title">
                            <ul>
                                <li><h1>{{ __('v2/front_site.half_pizza') }}</h1></li>
                                <li>
                                    <div class="number-input md-number-input">
                                        <button class="minus add-quantity">
                                            <i class="fa fa-minus" aria-hidden="true"></i>

                                        </button>

                                        <input class="item_quantity" name="quantity" value="1" type="number">
                                        <button id="add" class="plus add-quantity"></button>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>

                    <div class="spr-detail-wrap">
                        <div class="spr-detail-items spr-left-item" style="display: block;">
                            <div class="spr-left">
                                <div class="spr-detail-pizza-mockup">
                                    {{--<img src="{{ asset('site/img/pizza-mockup.svg')}}" class="pizza-mockup">--}}
                                    <div class="spl-overlay"></div>
                                </div>
                                <h4 class="spr-pizza-name" style="width: max-content;">Meat Me</h4>
                            </div>
                            <div class="spr-right">
                                <span class="empty-text">{!! __('v2/front_site.left_half') !!}</span>
                                <div class="spr-pizza-detail">
                                    <div class="tradiTags remove_div">
                                        <div class="ing-list ing-left custom-choose mb-3 remove" data-check="half_pizza">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="spr-detail-items spr-right-item" style="display: block;">
                            <div class="spr-left">
                                <div class="spr-detail-pizza-mockup">
                                    {{--<img src="{{ asset('site/img/pizza-mockup.svg')}}" class="pizza-mockup">--}}
                                    <div class="spl-overlay"></div>
                                </div>
                                <h4 class="spr-pizza-name" style="width: max-content;">Meat Me</h4>
                            </div>
                            <div class="spr-right">
                                <span class="empty-text">{!! __('v2/front_site.right_half') !!}</span>
                                <div class="spr-pizza-detail">
                                    <div class="tradiTags remove_div">
                                        <div class="ing-list ing-right custom-choose mb-3 remove" data-check="half_pizza">
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-12">
                        <div class="form-btns scroll-top-cart-btn">
                            <button type="submit" class="btn btn-primary btn-lag-inner cart-btn fancy-button left-cart"><i class="fa fa-shopping-cart me-3"></i>{!! __('v2/front_site.add_to_cart') !!} <span id="total_price" class="item_total_price"></span></button>

                        </div>
                    </div>
                </div>

            </div>
            {!! Form::close() !!}
        </div>
    </section>
    <script>
        $(document).ready(function() {


            function highLightLeft($this, img, name, ingredients, itemId, itemPrice, variationId) {
                var arr;
                //highlight selected
                $($this).parents('.spl-pizza-items').addClass('selected selected-left');

                //highlight large right image
                $('.spr-pizza-mockup .left-base img').attr('src', img);

                // active small right img
                $('.spr-left-item .spr-left img').attr('src', img);
                $('.spr-left-item .spr-left .spr-pizza-name').html(name);
                $('.spr-left-item .spr-left .spr-pizza-name').addClass('active');
                $('.spr-left-item .spr-right .tradiTags .ing-list').html(ingredients);
                $('.spr-left-item').addClass('active');
                $('.left_select').val(1);
                $('#left_item_id').val(itemId);
                $('#left_item_price').val(itemPrice);
                arr = [];
                $(".spr-left-item .spr-right .tradiTags .ing-list").find('input[type=checkbox]:checked').each(function() {
                    arr.push($(this).val());
                });
                //$($this).addClass('selected selected-left');
                $('#removed_ingredients_left').val(arr);
                $('#left_variation_id').val(variationId);
                //console.log($('.right_select').val());
                rightSelected = $('.right_select').val();
                if (rightSelected == 1) {
                    var quantity=$('.item_quantity').val();
                    var total = (parseFloat($('#left_item_price').val()) + parseFloat($('#right_item_price').val()))*quantity;
                    if(total== Math.floor(total))
                    {
                        var tp = total;
                    }
                    else
                    {
                        total = total.toFixed(2); //convert upto 2 decimal places
                        var tp = total.replace(".", ",");
                    }
                    $('#total_price').html(currency + " " + tp);
                    $('.item_price').val(tp);
                }
            }

            function highLightRight($this, img, name, ingredients, itemId, itemPrice, variationId) {

                var arr;
                //highlight selected
                $($this).parents('.spl-pizza-items').addClass('selected selected-right');
                //highlight large right image
                $('.spr-pizza-mockup .right-base img').attr('src', img);

                // active small right img
                $('.spr-right-item .spr-left img').attr('src', img);
                $('.spr-right-item .spr-left .spr-pizza-name').html(name);
                $('.spr-right-item .spr-right .tradiTags .ing-list').html(ingredients);
                $('.spr-right-item').addClass('active');
                $('.right_select').val(1);
                $('#right_item_id').val(itemId);
                $('#right_item_price').val(itemPrice);

                arr = [];
               /* $(".spr-left-item .spr-right .tradiTags .ing-list .number-input md-number-input #add").each(function() {
                    arr.push($(this).text());

                });*/
                $(".spr-right-item .spr-right .tradiTags .ing-list").find('input[type=checkbox]:checked').each(function() {
                    arr.push($(this).val());
                });
                $('#removed_ingredients_right').val(arr);
                $('#right_variation_id').val(variationId);
                leftSelected = $('.left_select').val();
                // rightSelected = $('.right_select').val();
                if (leftSelected == 1) {
                    var quantity=$('.item_quantity').val();
                    var total =( parseFloat($('#left_item_price').val()) + parseFloat($('#right_item_price').val()))*quantity;
                    if(total== Math.floor(total))
                    {
                        var tp = total;
                    }
                    else
                    {
                        total = total.toFixed(2); //convert upto 2 decimal places
                        var tp = total.replace(".", ",");
                    }

                    $('#total_price').html(currency + " " + tp);
                    $('.item_price').val(tp);
                }
            }

            function resetAll($this, type) {
                // 0 = both, left/right reset.
                // 1 = left reset
                // 2 = right reset

                if (type == 0) {
                    $('.spl-pizza-items').removeClass('selected selected-left selected-right');
                    $('.spr-pizza-mockup .left-base img').attr('src', '');
                    $('.spr-pizza-mockup .right-base img').attr('src', '');


                    $('.spr-left-item .spr-left img').attr('src', '{{asset("site/img/pizza-mockup.svg")}}');
                    $('.spr-right-item .spr-left img').attr('src', '{{asset("site/img/pizza-mockup.svg")}}');

                    $('.spr-left-item').removeClass('active');
                    $('.spr-right-item').removeClass('active');

                    $('.left_select').val(0);
                    $('.right_select').val(0);
                    $('#right_item_id').val(0);
                    $('#right_item_price').val(0);
                    $('#left_item_id').val(0);
                    $('#left_item_price').val(0);
                    $('#removed_ingredients_left').val('');
                    $('#removed_ingredients_right').val('');
                    $('#right_variation_id').val(0);
                    $('#left_variation_id').val(0);
                    $('#total_price').html("");
                    $('.item_price').val(0);

                } else if (type == 1) {
                    $($this).parents('.spl-pizza-items').removeClass('selected selected-left');
                    $('.spr-pizza-mockup .left-base img').attr('src', '');

                    $('.spr-left-item .spr-left img').attr('src', '{{asset("site/img/pizza-mockup.svg")}}');
                    $('.spr-left-item').removeClass('active');
                    $('.left_select').val(0);
                    $('#left_item_id').val(0);
                    $('#left_item_price').val(0);
                    $('#removed_ingredients_left').val('');
                    $('#left_variation_id').val(0);
                    $('#total_price').html("");
                    $('.item_price').val(0);

                } else if (type == 2) {
                    $($this).parents('.spl-pizza-items').removeClass('selected selected-right');
                    $('.spr-pizza-mockup .right-base img').attr('src', '');

                    $('.spr-right-item .spr-left img').attr('src', '{{asset("site/img/pizza-mockup.svg")}}');
                    $('.spr-right-item').removeClass('active');
                    $('.right_select').val(0);
                    $('#right_item_id').val(0);
                    $('#right_item_price').val(0);
                    $('#removed_ingredients_right').val('');
                    $('#right_variation_id').val(0);
                    $('#total_price').html("");
                    $('.item_price').val(0);
                }

            }

            $('.item-inner').click(function() {

                var img, name, price, leftSelected, rightSelected = "";
                var $this = $(this);
                leftSelected = $('.left_select').val();
                rightSelected = $('.right_select').val();

                img = $(this).find('.spl-img img').attr('src');
                name = $(this).find('.item-name').html();
                price = $(this).find('.itemPrice').html();
                ingredients = $(this).siblings('.removed_ingredients').html();
                itemId = $(this).find('.itemId').html();
                itemPrice = $(this).find('.itemPrice').html();
                variationId = $(this).find('.variationId').html();


                if (!$(this).parents('.spl-pizza-items').hasClass('selected')) {
                    if (leftSelected == 0) {
                        highLightLeft($this, img, name, ingredients, itemId, itemPrice, variationId);
                    } else if (rightSelected == 0) {
                        highLightRight($this, img, name, ingredients, itemId, itemPrice, variationId);
                    }

                    if (leftSelected == 1 && rightSelected == 1) {
                        resetAll($this, 0);
                        highLightLeft($this, img, name, ingredients, itemId, itemPrice, variationId);

                    }
                } else {
                    if ($(this).parents('.spl-pizza-items').hasClass('selected') && $(this).parents('.spl-pizza-items').hasClass('selected-left')) {
                        resetAll($this, 1);

                    } else if ($(this).parents('.spl-pizza-items').hasClass('selected') && $(this).parents('.spl-pizza-items').hasClass('selected-right')) {
                        resetAll($this, 2);
                    }
                }
            });


        });
    </script>

@endsection