<!doctype html>
<html lang="{{str_replace('_', '-', app()->getLocale())}}">
<head>
    <meta name="checkout" content="{{url('/checkout')}}">
    <meta name="get-contents" content="{{url('/contents/all')}}">
    @insert("content.includes.meta")
    @insert("content.includes.css")
    @yield('head')
</head>
<body>
    <nav style="background-color:  #546c8a" class="pt-1 pb-1">
        <div class="container">
            <div class="row">
                <div class="col text-end text-light">
                    <span>
                        <a href="tel:+4996545529550" class="text-decoration-none">
                        <svg style="fill: currentColor; width:20px; margin-bottom: 2px; margin-right: 4px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M368 336h-32c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16h32c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16zm-48-80v32c0 8.84 7.16 16 16 16h32c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16h-32c-8.84 0-16 7.16-16 16zm112 144h32c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16h-32c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16zm0-96h32c8.84 0 16-7.16 16-16v-32c0-8.84-7.16-16-16-16h-32c-8.84 0-16 7.16-16 16v32c0 8.84 7.16 16 16 16zm80-272H269.06C262.45 13.4 244.87 0 224 0h-80c-20.87 0-38.45 13.4-45.06 32H64C28.65 32 0 60.65 0 96v352c0 35.35 28.65 64 64 64h448c35.35 0 64-28.65 64-64V96c0-35.35-28.65-64-64-64zM144 48h80v320h-80V48zm384 400c0 8.82-7.18 16-16 16H64c-8.82 0-16-7.18-16-16V96c0-8.82 7.18-16 16-16h32v288c0 26.51 21.49 48 48 48h80c26.51 0 48-21.49 48-48V80h48v72c0 22.06 17.94 40 40 40h168v256zm0-304H368V80h144c8.82 0 16 7.18 16 16v48z"/></svg>
                        09654 5529550
                        </a>
                    </span>
                    <span class="ms-5 me-5">
                        <a href="mailto:support@areya.energy" class="text-decoration-none">support@areya.energy</a>
                    </span>
                    <span>Mo-Do: 9-17 Uhr, Fr: 9-15 Uhr</span>
                </div>
            </div>
        </div>
    </nav>
    <nav style="background-color: #79b27f" class="pt-5 pb-5">
        <div class="container">

            <nav class="navbar navbar-expand-lg">
                <div class="container-fluid">
                    <svg  style="fill: beige; width: 50px; margin-top:-60px;margin-right: -10px;"xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><defs><style>.fa-secondary{opacity:.4}</style></defs><path d="M502.42 240.5l-94.7-47.3 33.5-100.4c4.5-13.6-8.4-26.5-21.9-21.9l-100.4 33.5-47.41-94.8a17.31 17.31 0 0 0-31 0l-47.3 94.7L92.7 70.8c-13.6-4.5-26.5 8.4-21.9 21.9l33.5 100.4-94.7 47.4a17.31 17.31 0 0 0 0 31l94.7 47.3-33.5 100.5c-4.5 13.6 8.4 26.5 21.9 21.9l100.41-33.5 47.3 94.7a17.31 17.31 0 0 0 31 0l47.31-94.7 100.4 33.5c13.6 4.5 26.5-8.4 21.9-21.9l-33.5-100.4 94.7-47.3a17.33 17.33 0 0 0 .2-31.1zm-155.9 106c-49.91 49.9-131.11 49.9-181 0a128.13 128.13 0 0 1 0-181c49.9-49.9 131.1-49.9 181 0a128.13 128.13 0 0 1 0 181z" class="fa-secondary"/><path d="M352 256a96 96 0 1 1-96-96 96.15 96.15 0 0 1 96 96z" class="fa-primary"/></svg>
                    <a href="{{url('/')}}" class="fs-2 fw-bold text-decoration-none">Areya Energy</a>
                    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                        <span class="navbar-toggler-icon"></span>
                    </button>
                    <div class="collapse navbar-collapse" id="navbarSupportedContent">
                        <ul class="navbar-nav ms-auto mb-2 mb-lg-0">

                            <style>
                                .nav-item a{
                                    font-weight: bold;
                                    color: white;
                                    font-size: 20px;
                                }

                                .nav-item a:hover, .nav-item a:active{
                                    color: #546c8a;
                                }

                                .dropdown-item a{
                                    color: red;
                                }
                            </style>

                            <li class="nav-item mt-4 mt-md-0">
                                <a class="nav-link mx-md-4" href="{{url('/balkonkraftwerke')}}">Balkonkraftwerke</a>
                            </li>

                            <li class="nav-item">
                                <a class="nav-link mx-md-4" href="{{url('/produkte')}}">Produkte</a>
                            </li>

                            <li class="nav-item dropdown mx-md-4">
                                <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                    Service
                                </a>
                            </li>


                            <li class="nav-item mx-md-4">
                                <a class="nav-link" href="{{url('/kontakt')}}">Kontakt</a>
                            </li>

                            <li class="nav-item ms-md-5">
                                <a href="" data-bs-toggle="modal" data-bs-target="#ShoppingCart" class="position-relative">
                                    <svg style="fill: white; width: 30px; margin-top: 6px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg>
                                    <span class="position-absolute top-10 start-90 badge rounded-pill bg-danger" style="display: none; right: -10px;" id="count-products-in-bag">0</span>
                                </a>
                            </li>



                        </ul>

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

        </div>
    </nav>

    <div class="modal fade" id="ShoppingCart" tabindex="-1" aria-labelledby="ShoppingCart" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header" style="background-color: #546c8a; color: white;">
                    <h5 class="modal-title" id="exampleModalLabel">
                        <svg style="fill: currentColor; width: 19px; margin-right: 8px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg>
                        Warenkorb
                    </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div style="display: none;" class="col-12 text-center" id="no-products">

                            <br>
                            <br>
                            <br>
                            <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
                            <lottie-player src="https://assets2.lottiefiles.com/packages/lf20_3VDN1k.json"  background="transparent"  speed="1"  style="width: 150px; height: 150px; margin-left: 40%"  loop  autoplay></lottie-player>
                            <br>
                            <br>
                            <br>
                            <i>Es befinden sich keine Produkte im Warenkorb</i>
                            <br>
                            <br>
                            <a class="btn btn-success mb-3" href="{{url('/produkte')}}">Jetzt Produkte entdecken</a>
                            <br>


                        </div>
                        <div class="col-12">
                            <table class="table table-striped">
                                <tbody id="list-products-in-bag"></tbody>
                                <tfoot>
                                <tr>
                                    <th class="text-start" scope="col">Gesammt:</th>
                                    <th colspan="3" class="text-end">
                                        <span id="total-price">0 €</span>
                                        <br>
                                        <small class="text-end fw-light">Preise inkl. 19% Umsatzsteuer</small>
                                    </th>
                                </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">


                    <!-- Button trigger modal -->
                    <a href="" class="text-muted text-decoration-none" data-bs-toggle="modal" data-bs-target="#shareCart">
                        Warenkorb teilen
                        <svg style="fill: currentColor; width: 19px; margin-left: 4px; margin-bottom: 4px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M564.907 196.35L388.91 12.366C364.216-13.45 320 3.746 320 40.016v88.154C154.548 130.155 0 160.103 0 331.19c0 94.98 55.84 150.231 89.13 174.571 24.233 17.722 58.021-4.992 49.68-34.51C100.937 336.887 165.575 321.972 320 320.16V408c0 36.239 44.19 53.494 68.91 27.65l175.998-184c14.79-15.47 14.79-39.83-.001-55.3zm-23.127 33.18l-176 184c-4.933 5.16-13.78 1.73-13.78-5.53V288c-171.396 0-295.313 9.707-243.98 191.7C72 453.36 32 405.59 32 331.19 32 171.18 194.886 160 352 160V40c0-7.262 8.851-10.69 13.78-5.53l176 184a7.978 7.978 0 0 1 0 11.06z"/></svg>
                    </a>


                    <a href="{{url('/checkout')}}" type="button" class="btn btn-primary">Angebot unverbindlich anfragen</a>
                </div>
            </div>
        </div>
    </div>


    <div class="container">
        <div class="alert alert-warning mt-5 mb-2 alert-dismissible" style="display: none;" role="alert">
            <strong>Achtung:</strong>
            <br>
            Aufgrund der erhöhten Nachfrage sind derzeit einige Produkte ausverkauft, bzw. nur schwer Lieferbar.
            <br>
            Bitte Telefonisch Lieferzeiten und Verfügbarkeiten klären.
            <button type="button" class="btn-close" id="btn-close-message" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    </div>
    <div class="modal fade bd-example-modal-sm" id="modal-confirm-addition-of-products" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header" style="background-color: #546c8a; color: white;">
                    <h5>Vorgefertigten Warenkorb ansehen?</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-12">
                            <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
                            <br>
                            <lottie-player src="https://assets6.lottiefiles.com/packages/lf20_Ch6lCf.json"  background="transparent"  speed="0.6"  style="width: 180px; height: 180px; margin-left:30%;"  loop  autoplay></lottie-player>
                            <br>
                            Der angeklickte Link erhält einen vorgefertigten Warenkorb.<br> Sie können diesen importieren und dann die Produkte ansehen.
                            <br>
                            <br>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-link" data-bs-dismiss="modal">Abbrechen</button>
                    <button type="button" class="btn btn-primary btn-confirm-product-link" data-bs-dismiss="modal">Warenkorb ansehen</button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade bd-example-modal-sm" id="modal-confirm-product-replacement" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header" style="background-color: #546c8a; color: white;">
                    <h5>Bestehenden Warenkorb verwerfen?</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-12">
                            <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>

                            <br>
                            <lottie-player src="https://lottie.host/72251293-3f2d-45fe-859c-b967787a424b/XWNIgGYQEy.json" background="transparent" speed="0.2" style="width: 180px; height: 180px; margin-left: 28%;" loop autoplay></lottie-player>

                            <br>
                            Es befinden sich bereits Waren in Ihrem Warenkorb. Durch den Import der neuen Einkaufsliste wird die bestehnde Liste ersetzt.
                            <br>
                            <br>
                        </div>
                    </div>


                </div>
                <div class="modal-footer">
                    <div class="row">

                        <div class="col-4 text-start">
                            <button type="button" class="btn btn-link" data-bs-dismiss="modal">Abbrechen</button>

                        </div>

                        <div class="col-8">
                            <button type="button" class="btn btn-primary btn-confirm-product-link" data-bs-dismiss="modal">Warenkorb ersetzen</button>

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

    <div class="modal fade" id="shareCart" tabindex="-1" aria-labelledby="shareCart" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header" style="background-color: #546c8a; color: white;">
                    <h5 class="modal-title" id="exampleModalLabel">Warenkorb teilen</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-12">
                            <p>Teilen Sie Ihre Einkaufsliste mit Freunden und Bekannten, damit diese Sie dann bei Ihrere Auswahl helfen können.</p>
                        </div>
                    </div>



                    <div class="input-group input-group-lg">

                        <input type="text" class="form-control cart-link" aria-label="Sizing example input" aria-describedby="inputGroup-sizing-lg" style="box-shadow: none;" readonly>
                        <span class="input-group-text" id="btn-copy-cart-link">
                            <svg style="fill: currentColor; width: 18px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M433.941 65.941l-51.882-51.882A48 48 0 0 0 348.118 0H176c-26.51 0-48 21.49-48 48v48H48c-26.51 0-48 21.49-48 48v320c0 26.51 21.49 48 48 48h224c26.51 0 48-21.49 48-48v-48h80c26.51 0 48-21.49 48-48V99.882a48 48 0 0 0-14.059-33.941zM352 32.491a15.88 15.88 0 0 1 7.431 4.195l51.882 51.883A15.885 15.885 0 0 1 415.508 96H352V32.491zM288 464c0 8.822-7.178 16-16 16H48c-8.822 0-16-7.178-16-16V144c0-8.822 7.178-16 16-16h80v240c0 26.51 21.49 48 48 48h112v48zm128-96c0 8.822-7.178 16-16 16H176c-8.822 0-16-7.178-16-16V48c0-8.822 7.178-16 16-16h144v72c0 13.2 10.8 24 24 24h72v240z"/></svg>
                        </span>
                    </div>

                    <br>


                    <button class="btn btn-share btn-primary mx-auto d-block">Warenkorb teilen
                        <svg style="fill: currentColor; width: 19px; margin-left: 4px; margin-bottom: 4px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M564.907 196.35L388.91 12.366C364.216-13.45 320 3.746 320 40.016v88.154C154.548 130.155 0 160.103 0 331.19c0 94.98 55.84 150.231 89.13 174.571 24.233 17.722 58.021-4.992 49.68-34.51C100.937 336.887 165.575 321.972 320 320.16V408c0 36.239 44.19 53.494 68.91 27.65l175.998-184c14.79-15.47 14.79-39.83-.001-55.3zm-23.127 33.18l-176 184c-4.933 5.16-13.78 1.73-13.78-5.53V288c-171.396 0-295.313 9.707-243.98 191.7C72 453.36 32 405.59 32 331.19 32 171.18 194.886 160 352 160V40c0-7.262 8.851-10.69 13.78-5.53l176 184a7.978 7.978 0 0 1 0 11.06z"/></svg>
                    </button>
                </div>

            </div>
        </div>
    </div>
    @yield('content')
    @insert("content.includes.footer")
    @insert("content.includes.scripts")
    <script>
        let objProducts = [];
        let formatter = new Intl.NumberFormat('de', {style: 'currency', currency: 'EUR'});
        let totalPrice = 0;
        function updateProductsInLocalStorage(){
            localStorage.setItem("products", JSON.stringify(objProducts));
            let quantitys = objProducts.map(obj => obj.quantity);
            let quantityOfProducts = 0;
            for(let i = 0; i < quantitys.length; i++) { if(Number.isInteger(Number(quantitys[i]))) quantityOfProducts += Number(quantitys[i]); }
            $('#count-products-in-bag').text(quantityOfProducts);
            $('#list-products-in-bag').html('');
            if(typeof updateProducts === "function") $('#list-products').html('');
            totalPrice = 0;
            if(objProducts.length > 0) {
                $('.cart-link').show();
                $(".btn-share").show();
                let ids = objProducts.map(obj => obj.id);
                $.get($('meta[name="get-contents"]').attr('content')+"/"+ids.join(","), function(response, status){
                    response.contents.forEach(function(item){
                        let objProductInfo = objProducts.find(obj => obj.id == item.id);
                        let elementProduct = `
                        <tr>
                            <td class="text-start">
                                <img class="rounded img-fluid" src="https://picsum.photos/120/120">
                            </td>
                            <td class="text-start">
                                <span class="fs-5">${item.title}</span>
                                <br>
                                <small class="text-success">sofort verfügbar</small>
                                <br>
                                <select class="form-select form-select-sm select-quantity" data-id="${item.id}" style="width:125px;" aria-label="Default select example">`;
                                for(let i = 1; i <= 15; i++){
                                    if(objProductInfo.quantity == i) elementProduct += `<option selected value="${i}">Anzahl: ${i}</option>`;
                                    else elementProduct += `<option value="${i}">Anzahl: ${i}</option>`;
                                }
                                totalPrice += item.data_fields.preis*objProductInfo.quantity;
                                elementProduct += `
                                    </select>
                               <button data-id="${item.id}" class="btn-remove-product text-muted small text-decoration-none" style="padding: 0; border: none; background: transparen;">Löschen</button>
                            </td>
                            <td class="align-middle text-end">${formatter.format(item.data_fields.preis)}</td>
                        </tr>`;
                        $('#list-products-in-bag').append(elementProduct);
                        if(typeof updateProducts === "function") {
                            elementProduct = `
                            <tr>
                                <td class="text-start">
                                    <img class="rounded img-fluid" src="https://picsum.photos/120/120">
                                </td>
                                <td class="text-start">
                                    <span class="fs-5">${item.title}</span>
                                    <br>
                                    <small class="text-success">sofort verfügbar</small>
                                    <br>
                                    <select class="form-select form-select-sm select-quantity" data-id="${item.id}" style="width:125px;" aria-label="Default select example">`;
                                    for(let i = 1; i <= 15; i++){
                                        if(objProductInfo.quantity == i) elementProduct += `<option selected value="${i}">Anzahl: ${i}</option>`;
                                        else elementProduct += `<option value="${i}">Anzahl: ${i}</option>`;
                                    }
                                    elementProduct += `
                                        </select>
                                <button data-id="${item.id}" class="btn-remove-product text-muted small text-decoration-none" style="padding: 0; border: none; background: transparen;">Löschen</button>
                                </td>
                                <td class="align-middle text-end">${formatter.format(item.data_fields.preis)}</td>
                            </tr>`;
                            $('#list-products').append(elementProduct);
                        }
                    });
                    $('#total-price').text(formatter.format(totalPrice));
                    if(typeof updateProducts === "function") $('#total-checkout-price').text(formatter.format(totalPrice));
                });
                $('#count-products-in-bag').show();
                $('#list-products-in-bag').parent().parent().parent().parent().parent().find('.modal-footer').show();
                $('#total-price').parent().parent().parent().show();
                $('#no-products').hide();
                if(typeof updateProducts === "function"){
                    $('#form-section').show();
                    $('#list-products').parent().parent().parent().parent().parent().find('.modal-footer').show();
                    $('#total-checkout-price').parent().parent().parent().show();
                    $('#no-products-in-checkout').hide();
                }
            }else {
                $('#count-products-in-bag').hide();
                $('#list-products-in-bag').parent().parent().parent().parent().parent().find('.modal-footer').hide();
                $('#total-price').parent().parent().parent().hide();
                $('#no-products').show();
                if(typeof updateProducts === "function"){
                    $('#form-section').hide();
                    $('#list-products').parent().parent().parent().parent().parent().find('.modal-footer').hide();
                    $('#total-checkout-price').parent().parent().parent().hide();
                    @if(!session()->has('success'))
                    $('#no-products-in-checkout').show();
                    @endif
                }
                $('.cart-link').hide();
                $(".btn-share").hide();
            }
            $('#total-price').text(formatter.format(totalPrice));
            let productId = $('meta[name="product-id"]').attr('content');
            if(productId != undefined){
                let objProductInfo = objProducts.find(obj => obj.id == productId);
                if(objProductInfo == undefined) {
                    $('#btn-add-to-bag').show();
                    $('#btn-show-bag').hide();
                    if(objProducts.length > 0) $('#btn-check-out').parent().hide();
                    else $('#btn-check-out').parent().show();
                }
                else {
                    $('#btn-add-to-bag').hide();
                    $('#btn-show-bag').show();
                    $('#btn-check-out').parent().hide();
                    $('#count-items-in-bag').html(objProductInfo.quantity+`<svg style="fill: white; width: 12px; margin-left: 3px; margin-bottom: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg>`);
                }
            }
            if(objProducts.length > 0) {
                let url = null;
                if(window.location.origin == 'http://localhost') url = window.location.origin+'/areya-energy/public/'+btoa(JSON.stringify(objProducts));
                else url = window.location.origin+'/'+btoa(JSON.stringify(objProducts));
                $('.cart-link').val(url);
                const shareData = {
                    title: "Share cart list",
                    text: 'share cart list',
                    url: url,
                };
                $(".btn-share").click(async function() {
                    if(navigator.share) { try { await navigator.share(shareData); } catch(err) { console.warn(err); } }
                    else { console.warn('Native Web Sharing not supported'); }
                });
            }else{
                $('.cart-link').hide();
                $(".btn-share").hide();
            }
        }
        function addToBag(productId){
            let objProductInfo = objProducts.find(obj => obj.id == productId);
            let index = objProducts.indexOf(objProductInfo);
            if(index == -1) objProducts.push({id: productId, quantity: 1});
            updateProductsInLocalStorage();
        }
        function isJson(str) {
            try { JSON.parse(str); }
            catch(e) { return false; }
            return true;
        }
        function isEncoded(str){
            try { atob(str); }
            catch(e) { return false; }
            return true;
        }
        $(window).on('load', function(){
            if(localStorage.getItem("dismiss-message") == 1) $('.alert-dismissible').remove();
            else $('.alert-dismissible').show();
            $('#btn-close-message').click(function(){ localStorage.setItem("dismiss-message", 1); });
            if(localStorage.getItem("products") != null) objProducts = JSON.parse(localStorage.getItem("products"));
            let urlPath = window.location.pathname;
            let code = urlPath.split("/");
            code = code[code.length-1];
            if(isEncoded(code)){
                let productLink = atob(code);
                if(isJson(productLink)){
                    if(objProducts.length > 0) $('#modal-confirm-product-replacement').modal('show');
                    else $('#modal-confirm-addition-of-products').modal('show');
                }
                $('.btn-confirm-product-link').click(function(){
                    objProducts = JSON.parse(productLink);
                    updateProductsInLocalStorage();
                    window.location.replace($('meta[name="checkout"]').attr('content'));
                });
            }
            updateProductsInLocalStorage();
            $(document).on('click', '.btn-remove-product', function(){
                let productId = $(this).attr('data-id');
                let objProductInfo = objProducts.find(obj => obj.id == productId);
                let index = objProducts.indexOf(objProductInfo);
                if(index != -1) objProducts.splice(index, 1);
                updateProductsInLocalStorage();
            });
            $(document).on('change', '.select-quantity', function(){
                let quantity = $(this).val();
                let productId = $(this).attr('data-id');
                let objProductInfo = objProducts.find(obj => obj.id == productId);
                let index = objProducts.indexOf(objProductInfo);
                objProducts[index].quantity = quantity;
                updateProductsInLocalStorage();
            });
            $('#btn-copy-cart-link').click(function(){
                $('.cart-link').select();
                document.execCommand("copy");
                $(this).html(`<svg style="fill: green; width: 18px;"xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M400 32H48C21.49 32 0 53.49 0 80v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V80c0-26.51-21.49-48-48-48zm0 32c8.823 0 16 7.178 16 16v352c0 8.822-7.177 16-16 16H48c-8.822 0-16-7.178-16-16V80c0-8.822 7.178-16 16-16h352m-34.301 98.293l-8.451-8.52c-4.667-4.705-12.265-4.736-16.97-.068l-163.441 162.13-68.976-69.533c-4.667-4.705-12.265-4.736-16.97-.068l-8.52 8.451c-4.705 4.667-4.736 12.265-.068 16.97l85.878 86.572c4.667 4.705 12.265 4.736 16.97.068l180.48-179.032c4.704-4.667 4.735-12.265.068-16.97z"/></svg>`);
            });
        });
    </script>
    @yield('scripts')
</body>
</html>