<style>

    input[type="submit"] {
        background: #0757a4;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        padding: 7px 15px;
        color: #fff;
        font-weight: 700;
        font-size: 14px;
        border: none;
        margin-top: 10px;
        cursor: pointer;
    }

    input[type="submit"]:hover {
        background: #104374;
    }

    .isa_success {
        color: #4F8A10;
        background-color: #DFF2BF;
    }

    .isa_error {
        color: #D8000C;
        background-color: #FFBABA;
    }

    .comments label {
        display: block;
        padding-bottom: 5px;
    }

    .comments input[type="text"], .comments textarea, .loginBox input[type="text"], .loginBox textarea, .loginBox input[type="password"] {
        width: 320px;
        padding: 5px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        border: 1px solid #b6b6b6;
        margin-bottom: 8px;
    }

    input#btnFeedbackSubmit {
        display: inline-block;
    }

    img#loadingGif {
        display: inline-block;
    }

    pre.cake-error {
        display: none;
    }
</style>

<div class="bodyContent shadow">
    <h1><?php echo __("LBL_PRODUCTS"); ?></h1>
    <p><?php echo __("LBL_PRODUCT_PAGE_INFO"); ?></p>
    <?php if(!$this->Session->read('userData.id')): ?>
        <p class="text-secondary text-center py-1" style="background: #eaeaea; ">To buy Product please <a href="<?php echo HTTP_SITE_URL.'/users/login';?>"><b><?php echo __("LBL_LOGIN");?></b></a> to the system.</p>
    <?php endif; ?>

    <div class="pageDivider"></div>

    <section class="text-center">

        <!--Grid row-->
        <div class="row">

            <?php if (!empty($products)): ?>
                <?php foreach ($products as $product): ?>

                    <!--Grid column-->
                    <div class="col-lg-4 col-md-12 mb-4">
                        <div class="col-lg-12 py-3" style="border: 1px solid #ddd;">

                            <div class="row expense<?php echo $product['expense_type'] ?>">
                                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                    <h5 class="mb-3 productTitle"><?php echo $product['title'] ?></h5>
                                </div>
                                <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12">
                                    <img src="<?php echo CDN_URL; ?><?php echo $product['photo'] ?>"
                                         style="max-height: 100px;max-width: 100%;"
                                         class="img-fluid"
                                         alt="<?php echo $product['title'] ?>">
                                </div>
                                <div class="col-lg-8 col-md-6 col-sm-6 col-xs-12 text-left pl-0">
                                    <div class="pr-2 pl-2 py-2" style="background: #eee;">
                                        <b>SKU: <span class="productSku"><?php echo $product['sku'] ?></span></b><br>
                                        <h6>PRICE: <span class="priceTxt"><?php echo $product['price'] ?></span> <?php echo ($product['currency_id'] == 1) ? 'USD' : 'BDT' ?></h6>

                                        <?php if($this->Session->read('userData.id')): ?>

                                            <select name="os0" style="width: 100%; padding: 5px; margin-bottom: 3px;">
                                                <?php if (!empty($productPriceArray[$product['expense_type']])) :
                                                    foreach ($productPriceArray[$product['expense_type']] as $productPrice) :
                                                        $cycleTxt = ($productPrice['payment_cycle'] == 'M') ? 'Monthly' : 'Yearly';
                                                        ?>
                                                        <option value="<?= $productPrice['payment_cycle'] ?>"
                                                                data-recurring="<?= $productPrice['payment_number'] ?>"
                                                                data-ex-type="<?= $productPrice['expense_type'] ?>"><?= $cycleTxt ?> <?php echo ($product['currency_id'] == 1) ? '$' : 'BDT'; ?> <?= $productPrice['price'] ?></option>
                                                    <?php
                                                    endforeach;
                                                endif;
                                                ?>
                                            </select>


                                            <form action="<?= PAYPAL_URL ?>" method="post" target="_top">
                                                <input type="hidden" name="cmd" value="_xclick-subscriptions">
                                                <input type="hidden" name="business" value="<?= PAYPAL_ID ?>">
                                                <input type="hidden" name="currency_code" value="<?= PAYPAL_CURRENCY_CODE ?>">
                                                <input type="hidden" name="item_name" value="<?php echo 't'.$product['expense_type'].'-d'.$product['id'].'-s'.$product['sku'].'-u'.(($this->Session->read('userData.id')) ? $this->Session->read('userData.id') : '').'-'.$product['title']; ?>">
                                                <input type="hidden" name="item_number" value="<?php echo $product['sku'] ?>">
                                                <input type="hidden" name="notify_url" value="<?= PAYPAL_NOTIFY_URL ?>">
                                                <input type='hidden' name='cancel_return' value="<?= PAYPAL_CANCEL_RETURN_URL ?>" />
                                                <input type='hidden' name='return' value="<?= PAYPAL_SUCCESS_RETURN_URL ?>" />
                                                <input type='hidden' name='a3' class="prPrice" value="<?= $product['price'] ?>" />
                                                <input type='hidden' name='p3' class="prInterval" value="<?= $product['payment_interval'] ?>" />
                                                <input type='hidden' name='t3' class="prCycle" value="<?= $product['payment_cycle'] ?>" />
                                                <input type="hidden" name="src" value="1">
                                                <input type="hidden" name="sra" value="1">
                                                <input type="hidden" name="no_shipping" value="1">
                                                <input type='hidden' name='custom' value="<?= ($this->Session->read('userData.id')) ? $this->Session->read('userData.id') : '' ?>" />
                                                <input class="buy-btn" type="submit" value="Buy Subscription" />
                                            </form>

                                        <?php endif; ?>

                                        <script>
                                            $(document).on('change', ".expense<?php echo $product["expense_type"] ?> select[name=os0]", function() {
                                                var payment_cycle = $(this).val();
                                                var recurring = $('option:selected', this).attr('data-recurring');
                                                var expense_type = $('option:selected', this).attr('data-ex-type');
                                                fetchProduct(payment_cycle,expense_type);
                                            });
                                        </script>



                                        <?php /* ?>

                                             <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
                                                <input type="hidden" name="cmd" value="_s-xclick">
                                                <input type="hidden" name="hosted_button_id" value="HAFS3HUGY3ZD4">
                                                <table>
                                                    <tr><td><input type="hidden" name="on0" value="Price">Price</td></tr>
                                                    <tr><td><select name="os0" style="width: 100%; padding: 5px; margin-bottom: 3px;">
                                                                <option value="Monthly" data-recurring="36">Monthly $0.99 USD</option>
                                                                <option value="Yearly" data-recurring="5">Yearly $9.90 USD</option>
                                                            </select> </td></tr>
                                                    <tr><td><input type="hidden" name="on1" value="Payment Interval"></td></tr>
                                                    <tr><td><input type="hidden" name="os1" maxlength="200"></td></tr>
                                                </table>
                                                <input type="hidden" name="currency_code" value="USD">

                                                <input type="hidden" name="item_name" value="<?php echo 't'.$product['expense_type'].'-d'.$product['id'].'-s'.$product['sku'].'-u'.(($this->Session->read('userData.id')) ? $this->Session->read('userData.id') : '').'-'.$product['title']; ?>">
                                                <input type="hidden" name="notify_url" value="<?php echo HTTP_SITE_URL; ?>/pages/createGroup">
                                                <input type='hidden' name='cancel_return' value='<?php echo HTTP_SITE_URL; ?>/pages/products' />
                                                <input type='hidden' name='return' value='<?php echo HTTP_SITE_URL; ?>/pages/createGroup' />

                                                <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
                                                <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
                                            </form>

                                        <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
                                            <input type="hidden" name="cmd" value="_s-xclick">
                                            <input type="hidden" name="hosted_button_id" value="HAFS3HUGY3ZD4">
                                            <table style="width: 100%;">
                                                <tr><td><input type="hidden" name="on0" value="Price">Price</td></tr>
                                                <tr><td><select name="os0" style="width: 100%; padding: 5px; margin-bottom: 3px;">
                                                            <option value="0.99" data-recurring="36">Monthly $0.99</option>
                                                            <option value="9.90" data-recurring="5">Yearly $9.90</option>
                                                        </select> </td></tr>
                                            </table>
                                            <input type="hidden" name="charset" value="utf-8">
                                            <input type="hidden" name="payment_interval" readonly value="">
                                            <input type="hidden" name="item_name" value="<?php echo $product['title']; ?>"> <!-- Add Description e.g your room type Required-->
                                            <input type="hidden" name="item_price" value="<?php echo $product['price']; ?>"> <!-- Dynamically add Total Amount Required-->
                                            <input type="hidden" name="amount" value="<?php echo $product['price']; ?>"> <!-- Dynamically add Total Amount Required-->
                                            <input type="hidden" name="quantity" value="1">
                                            <input type="hidden" name="currency_code" value="USD">
                                            <input type="hidden" name="notify_url" value="<?php echo HTTP_SITE_URL; ?>/pages/createGroup"> <!-- Please add IPN URL You can use this service to automate back-office and administrative functions, including fulfilling orders, tracking customers, and providing status and other information related to transactions. -->
                                            <input type='hidden' name='cancel_return' value='<?php echo HTTP_SITE_URL; ?>/pages/products' /> <!-- Take customers to this URL when they cancel their checkout -->
                                            <!-- Take customers to this URL when they finish their checkout  -->
                                            <?php if($product['expense_type'] == 1): ?>
                                                <input type='hidden' name='return' value='<?php echo HTTP_SITE_URL; ?>/pages/createGroupExpense' />
                                            <?php elseif($product['expense_type'] == 2): ?>
                                                <input type='hidden' name='return' value='<?php echo HTTP_SITE_URL; ?>/pages/createMessExpense' />
                                            <?php elseif($product['expense_type'] == 3): ?>
                                                <input type='hidden' name='return' value='<?php echo HTTP_SITE_URL; ?>/pages/createFamilyExpense' />
                                            <?php endif; ?>

                                            <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
                                            <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
                                        </form>
                                        <?php */ ?>

                                        <?php /* ?>
                                        <!--<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
                                            <input type="hidden" name="cmd" value="_s-xclick">
                                            <input type="hidden" name="hosted_button_id" value="BEWF4KXQT3HNG">
                                            <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
                                            <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
                                        </form>

                                        <br />-->

                                        <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
                                            <input type="hidden" name="cmd" value="_s-xclick">
                                            <input type="hidden" name="hosted_button_id" value="QN2UXYSVLLYAC">
                                            <table>
                                                <tr><td><input type="hidden" name="on0" value="Payment Cycle">Payment Cycle</td></tr><tr><td>
                                                        <select name="os0" style="width: 100%; padding: 5px;">
                                                            <option value="Monthly">Monthly </option>
                                                            <option value="Yearly">Yearly </option>
                                                        </select> </td></tr>
                                                <tr><td><input type="hidden" name="on1" value="Payment Interval">Payment Interval</td></tr>
                                                <tr><td><input type="text" name="os1" maxlength="200"></td></tr>
                                                <tr><td><input type="hidden" name="on2" value="How many times you want to pay">How many times you want to pay</td></tr>
                                                <tr><td><input type="text" name="os2" maxlength="200"></td></tr>
                                            </table><br>

                                            <input type="hidden" name="item_name" value="<?php echo $product['title']; ?>"> <!-- Add Description e.g your room type Required-->
                                            <input type="hidden" name="item_price" value="<?php echo $product['price']; ?>"> <!-- Dynamically add Total Amount Required-->
                                            <input type="hidden" name="amount" value="<?php echo $product['price']; ?>"> <!-- Dynamically add Total Amount Required-->
                                            <input type="hidden" name="quantity" value="1">
                                            <input type="hidden" name="currency_code" value="<?php echo ($product['currency_id'] == 1) ? 'USD' : 'BDT'; ?>"> <!-- Update to your currency -->
                                            <input id="invoice" type="hidden" value="" name="invoice"> <!-- Add Unique invoice for each transaction -->
                                            <input type="hidden" name="notify_url" value="<?php echo HTTP_SITE_URL; ?>/pages/createGroupExpense"> <!-- Please add IPN URL You can use this service to automate back-office and administrative functions, including fulfilling orders, tracking customers, and providing status and other information related to transactions. -->
                                            <input type='hidden' name='cancel_return' value='<?php echo HTTP_SITE_URL; ?>/pages/products' /> <!-- Take customers to this URL when they cancel their checkout -->
                                            <input type='hidden' name='return' value='<?php echo HTTP_SITE_URL; ?>/pages/createGroup' /> <!-- Take customers to this URL when they finish their checkout  -->

                                            <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
                                            <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
                                        </form>

                                        <br><br><br>
                                        <?php */ ?>

                                        <?php /* ?>
                                        <div id="paypal-button-container-<?php echo $product['sku'] ?>"></div>
                                        <script>
                                            paypal.Buttons({
                                                createOrder: function(data, actions) {
                                                    // This function sets up the details of the transaction, including the amount and line item details.
                                                    return actions.order.create({
                                                        purchase_units: [{
                                                            amount: {
                                                                value: "<?php echo $product['price'] ?>"
                                                            }
                                                        }]
                                                    });
                                                },
                                                onApprove: function(data, actions) {
                                                    // This function captures the funds from the transaction.
                                                    return actions.order.capture().then(function(details) {
                                                        // This function shows a transaction success message to your buyer.

                                                        var $msg = 'Transaction completed by ' + details.payer.name.given_name + " and <?php echo $product['title'] ?>" + ' has been bought for USD ' + "<?php echo $product['price'] ?>";
                                                        alert($msg);

                                                        window.location.href = redirectUrlByExpenseType(<?php echo $product['expense_type'] ?>);

                                                    });
                                                }
                                            }).render("#paypal-button-container-<?php echo $product['sku'] ?>");
                                        </script>
                                        <?php */ ?>


                                    </div>
                                </div>

                            </div>

                        </div>
                    </div>
                    <!--Grid column-->

                <?php endforeach; ?>
            <?php endif; ?>

        </div>
        <!--Grid row-->

    </section>


</div>

<script>
    function redirectUrlByExpenseType(expense_type) {
        var redirect_url = '';
        switch(expense_type) {
            case 1:
                redirect_url = '<?php echo HTTP_SITE_URL ?>' + "/Home/createGroupExpense";
                break;
            case 2:
                redirect_url = '<?php echo HTTP_SITE_URL ?>' + "/Home/createMessExpense";
                break;
            case 3:
                redirect_url = '<?php echo HTTP_SITE_URL ?>' + "/Home/createFamilyExpense";
                break;
            default:
                break;
        }
        return redirect_url;
    }

    function fetchProduct(payment_cycle,expense_type) {
        $.ajax({
            type: 'POST',
            dataType: "json",
            url: "<?=HTTP_SITE_URL ?>/pages/getProduct",
            data: {
                expense_type : expense_type,
                payment_cycle : payment_cycle
            },
            success: function(result) {
                console.log(result);
                $('.expense' + result.expense_type + ' .productTitle').text(result.title);
                $('.expense' + result.expense_type + ' .productSku').text(result.sku);
                $('.expense' + result.expense_type + ' .priceTxt').text(result.price);
                $('.expense' + result.expense_type + ' .prPrice').val(result.price);
                $('.expense' + result.expense_type + ' .prInterval').val(result.payment_interval);
                $('.expense' + result.expense_type + ' .prCycle').val(result.payment_cycle);
                item_name = 't'+ result.expense_type + '-d' +result.id + '-s' + result.sku + '-u' + '<?= ($this->Session->read('userData.id')) ? $this->Session->read('userData.id') : '' ?>' + '-' + result.title;
                $('.expense' + result.expense_type + ' form input[name=item_name]').val(item_name);
            }
        });
    }
</script>

