<a class='payAndClose' href="#payAndClose" style="display:none"></a>
<div style="display:none">
    <style>
        .discount-lebel {
            font-size: 12px;
            font-weight: bold;
        }
        #cboxContent {
            background: #00AEEF;
        }

    </style>
    <div id="payAndClose" class="popupouter">
        <div class="popup-header row">
            <div id="discountPopupHeader" class="warningPopupHeader col-lg-10 col-md-10 col-sm-10 col-xs-10 pull-left text-uppercase"><?php echo $this->lang->line('gkpos_pay_and_close') ?></div>
            <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 pull-left closeServiceChargePopup text-center times pay-close-times">&times;</div>
        </div>
        <div class="popup-body row">
            <div id="discountPopupContent" class="warningPopupContent col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div id="MiddleContent">
                    <div class="row payment-row">
                        <div class="payment-option">
                            <?php if (!empty($payments_option)): ?>
                                <?php foreach ($payments_option as $key => $option): ?>
                                    <?php
                                    $payment_option_bg = '';
                                    if ($key == 'Cash') {
                                        $payment_option_bg = ' delivery-bg-color ';
                                    }
                                    if ($key == 'Cheque') {
                                        $payment_option_bg = ' waiting-bg-color ';
                                    }
                                    if ($key == 'EFT') {
                                        $payment_option_bg = ' collection-bg-color ';
                                    }
                                    if ($key == 'Voucher') {
                                        $payment_option_bg = ' table-bg-color ';
                                    }
                                    ?>
                                    <div style="cursor: pointer;" class="col-lg-3 col-md-3 col-sm-3 col-xs-3 payment-button <?php echo $payment_option_bg ?> text-center text-uppercase" id="<?php echo $key ?>" onclick="setPaymentOption(this.id)"><?php echo $option ?></div>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    <div class="row payment-row">
                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 payment-due-block">
                            <div class="due-figure">
                                <?php
                                $dueAmount = to_currency_no_money($order[0]->grand_total);
                                $payments = $this->Orders_Model->get_payments($this->Orders_Model->get_current_orderid())
                                ?>
                                <span id="dueLabel"><?php isset($dueAmount) && $dueAmount >= 0 ? print"DUE" : print "PAY BACK" ?></span>
                                <input type="hidden" id="exactDueAmountTotal" value="<?php isset($dueAmount) ? print $dueAmount : '' ?>">
                                <span><?php echo $this->config->item('currency_symbol') ?></span><span id="dueAmount"><?php echo abs($dueAmount) ?></span>
                            </div>
                            <div style="background: #ff0000;height: 40px;border-radius: 5px; margin-top: 20px;<?php isset($dueAmount) && $dueAmount > 0 ? print'display:none;' : print'' ?>" id="PayAsTipBox"><input type="checkbox" id="payAsTip" value="yes" class="checkbox-inline" style="margin:-3px 1px 0px 2px"><label style="font-size: 20px; padding: 7px;" class="text-center">PAY AS TIP</label></div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                            <div class="pin-calculatorbg payment-pin-calculatorbg">
                                <div style="height: 20px" class="text-center text-uppercase" id="paymentIdentity"></div>
                                <input type="text" id="paymentAmount" name="payment_amount" class="form-control" placeholder="<?php echo to_currency(0) ?>">
                                <input type="hidden" id="paymentVoucherCode" name="voucher_code" class="form-control" placeholder="<?php echo $this->lang->line('gkpos_voucher_code') ?>">
                                <ul class="paymentBtns">
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key1') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key2') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key3') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key4') ?></li>
                                </ul>
                                <ul class="paymentBtns">
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key5') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key6') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key7') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key8') ?></li>
                                </ul>
                                <ul class="paymentBtns">
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key9') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key0') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo '.' ?></li>
                                    <li class="btnPin paymentBtnPin" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key_del') ?></li>
                                </ul>
                                <ul class="numpad-last-row paymentBtns">
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key10') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key20') ?></li>
                                    <li class="numkey paymentNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key50') ?></li>
                                    <li class="btnPin paymentBtnPin" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key_clr') ?></li>
                                </ul>
                                <ul class="voucherBtns" style="display: none;">
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key1') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key2') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key3') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key4') ?></li>
                                </ul>
                                <ul class="voucherBtns" style="display: none;">
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key5') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key6') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key7') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key8') ?></li>
                                </ul>
                                <ul class="voucherBtns" style="display: none;">
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key9') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key0') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo '.' ?></li>
                                    <li class="btnPin voucherBtnPin" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key_del') ?></li>
                                </ul>
                                <ul class="numpad-last-row voucherBtns" style="display: none;">
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key10') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key20') ?></li>
                                    <li class="numkey voucherNumKey" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key50') ?></li>
                                    <li class="btnPin voucherBtnPin" style=" line-height: 83px; padding: 21px 32px;"><?php echo $this->lang->line('gkpos_numpad_key_clr') ?></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 payment-due-block">   
                            <div class="payment-option">
                                <br/>
                                <?php if (!empty($payments_option)): ?>
                                    <?php foreach ($payments_option as $key => $option): ?>
                                        <?php
                                        $payment_option_bg = '';
                                        if ($key == 'Cash') {
                                            $payment_option_bg = ' delivery-bg-color ';
                                        }
                                        if ($key == 'Cheque') {
                                            $payment_option_bg = ' waiting-bg-color ';
                                        }
                                        if ($key == 'EFT') {
                                            $payment_option_bg = ' collection-bg-color ';
                                        }
                                        if ($key == 'Voucher') {
                                            $payment_option_bg = ' table-bg-color ';
                                        }
                                        ?>
                                        <div style="cursor: pointer;" class="payment-info-button text-center text-uppercase <?php echo $payment_option_bg ?>"><?php echo $option ?><span class="delete-payment pull-right" onclick="deletePayment('<?php echo $key ?>')"><img src="<?php echo ASSETS_GKPOS_PATH . 'images/closebg.png' ?>" width="48px" height="48px"></span><br/><span><?php echo $this->config->item('currency_symbol') ?></span><span id="<?php echo $key . 'Amount' ?>"><?php isset($payments[$key]) ? print to_currency_no_money($payments[$key]['amount']) : print '0.00' ?></span></div>
                                        <br/>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                            </div>
                        </div>
                    </div>
                    <div class="row payment-row"><input class="form-submit-button mainsystembg2 waiting-bg img-responsive payment-info-submit-btn" type="submit" value="<?php echo $this->lang->line('gkpos_numpad_key_enter') ?>" onclick="savePayments('<?php echo $this->Orders_Model->get_current_orderid() ?>')"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function () {
        $('.paymentBtns').show();
        $('.voucherBtns').hide();
        setPaymentNumKeys('paymentAmount');
        setVoucherNumKeys('paymentVoucherCode');
        $('#PayAsTipBox').hide();
        $('.payment-line').hide();
        $('.closeServiceChargePopup').click(function () {
            $.colorbox.close();
            return false;
        });
    });
    function setPaymentOption(payment_id) {
        
        if (payment_id === 'Voucher') {
            var voucherCode = Number($('#paymentVoucherCode').val());
            var textFieldAmount = Number($('#paymentAmount').val());
            var dueAmount = Number($('#exactDueAmountTotal').val());
            var amount = 0;
            if (voucherCode > 0 && (textFieldAmount > 0 || dueAmount > 0)) {
                if (textFieldAmount > 0) {
                    amount = textFieldAmount;
                } else {
                    amount = dueAmount;
                }

                $.ajax({
                    url: "<?php echo site_url("gkpos/orders/checkvoucher") ?>",
                    data: {
                        code: voucherCode,
                        amount: amount
                    },
                    type: "POST",
                    dataType: "json",
                    success: function (output) {
                        if (output.success)
                        {
                            $('.paymentBtns').show();
                            $('.voucherBtns').hide();
                            $('#paymentVoucherCode').attr('type', 'hidden');
                            $('#paymentAmount').attr('type', 'text');
                            $('#paymentOption').val('');
                            $("#paymentAmount").val('');
                            $('#paymentVoucherCode').val('');
                            $('#paymentIdentity').text('');
                            addPayment(payment_id, output.amount, output.result.code);
                        } else
                        {
                            $('#paymentIdentity').text(output.message);
                        }
                    }
                });
            } else {
                $('.paymentBtns').hide();
                $('.voucherBtns').show();
                $('#paymentVoucherCode').attr('type', 'text');
                $('#paymentAmount').attr('type', 'hidden');
            }
            return false;
        } else {
            $('.paymentBtns').show();
            $('.voucherBtns').hide();
            $('#paymentIdentity').text('');
            $('#paymentVoucherCode').attr('type', 'hidden');
            $('#paymentAmount').attr('type', 'text');
            var voucherCode = $('#paymentVoucherCode').val();
            var textFieldAmount = $('#paymentAmount').val();
            var dueAmount = $('#exactDueAmountTotal').val();
            var amount = 0;
            if (Number(textFieldAmount) > 0) {
                amount = Number(textFieldAmount);
            } else {
                amount = Number(dueAmount);
            }
            addPayment(payment_id, amount, null);
        }
    }
    function setPaymentNumKeys(inputFiledId) {
        jQuery('.paymentNumKey').click(function (event) {
            
            var numBox = document.getElementById(inputFiledId);
            numBox.value = numBox.value + this.innerHTML;
            event.stopPropagation();
        });
        $('.paymentBtnPin').click(function (event) {
            
            if (this.innerHTML == 'DEL') {
                var numBox = document.getElementById(inputFiledId);
                if (numBox.value.length > 0) {
                    numBox.value = numBox.value.substring(0, numBox.value.length - 1);
                }
            } else {
                document.getElementById(inputFiledId).value = '';
            }
            event.stopPropagation();
        });
    }
    function setVoucherNumKeys(inputFiledId) {
        jQuery('.voucherNumKey').click(function (event) {
            
            var numBox = document.getElementById(inputFiledId);
            numBox.value = numBox.value + this.innerHTML;
            event.stopPropagation();
        });
        $('.voucherBtnPin').click(function (event) {
            
            if (this.innerHTML == 'DEL') {
                var numBox = document.getElementById(inputFiledId);
                if (numBox.value.length > 0) {
                    numBox.value = numBox.value.substring(0, numBox.value.length - 1);
                }
            } else {
                document.getElementById(inputFiledId).value = '';
            }
            event.stopPropagation();
        });
    }
    function addPayment(paymentOption, paymentAmount, code) {
        
        $.ajax({
            url: "<?php echo site_url("gkpos/orders/addpayment") ?>",
            data: {
                order_id: '<?php echo $this->Orders_Model->get_current_orderid() ?>',
                method: paymentOption,
                amount: paymentAmount,
                code: code
            },
            type: "POST",
            dataType: "json",
            success: function (output) {
                $('.paymentBtns').show();
                $('.voucherBtns').hide();
                $('#paymentVoucherCode').attr('type', 'hidden');
                $('#paymentAmount').attr('type', 'text');
                $('#paymentOption').val('');
                $("#paymentAmount").val('');
                $('#paymentVoucherCode').val('');
                $('#paymentIdentity').text('');
                if (output.payments) {
                    $.each(output.payments, function () {
                        $('#' + this.method + 'Amount').text(this.amount);
                        $('.' + this.method).text(this.method + ':');
                        var methodAmount = this.amount;
                        $('.' + this.method + 'Amount').text('<?php echo $this->config->item('currency_symbol') ?>' + methodAmount);
                    });
                    $('.payment-line').show();
                }
                if (output.dueAmount) {
                    var dueAmount = Number(output.dueAmount);
                    if (dueAmount < 0) {
                        $('#dueLabel').text('PAY BACK').css({'font-size': '27px', 'line-height': '5px'});
                        $('#PayAsTipBox').show();
                    } else {
                        $('#PayAsTipBox').hide();
                        $('#dueLabel').text('DUE').css({'font-size': '27px', 'line-height': '5px'});
                    }
                    $('#exactDueAmountTotal').val(dueAmount);
                    var FormattedDueAmount = Math.abs(dueAmount);
                    $('#dueAmount').text(FormattedDueAmount.toFixed(2));
                }
            }

        });
    }
    function deletePayment(method) {
        
        var currentAmount = $('#' + method + 'Amount').text();
        if (Number(currentAmount) <= 0) {
            return false;
        } else {
            $.ajax({
                url: "<?php echo site_url("gkpos/orders/deletepayment") ?>",
                data: {
                    order_id: '<?php echo $this->Orders_Model->get_current_orderid() ?>',
                    method: method
                },
                type: "POST",
                dataType: "json",
                success: function (output) {
                    if (true == output.success) {
                        $('.paymentBtns').show();
                        $('.voucherBtns').hide();
                        $('#paymentVoucherCode').attr('type', 'hidden');
                        $('#paymentAmount').attr('type', 'text');
                        $('#paymentOption').val('');
                        $("#paymentAmount").val('');
                        $('#paymentVoucherCode').val('');
                        $('#paymentIdentity').text('');
                        $('#' + method + 'Amount').text('0.00');
                        $('.' + method).text('');
                        $('.' + method + 'Amount').text('');
                        if (output.dueAmount) {
                            var dueAmount = Number(output.dueAmount);
                            if (dueAmount < 0) {
                                $('#dueLabel').text('PAY BACK').css({'font-size': '27px', 'line-height': '5px'});
                                $('#PayAsTipBox').show();
                            } else {
                                $('#dueLabel').text('DUE').css({'font-size': '27px', 'line-height': '5px'});
                                $('#PayAsTipBox').hide();
                            }
                            $('#exactDueAmountTotal').val(dueAmount);
                            var FormattedDueAmount = Math.abs(dueAmount);
                            $('#dueAmount').text(FormattedDueAmount.toFixed(2));
                        }
                    }
                }
            });
        }
    }
    function savePayments(order_id) {
        var dueAmount = $('#exactDueAmountTotal').val();
        if (dueAmount > 0) {
            $.confirm({
                'title': 'Payment Warning',
                'message': 'Sorry! payment not yet covered ',
                'buttons': {
                    'Ok': {
                        'class': 'btn btn-danger',
                        'action': function () {
                        }
                    }
                }
            });
        } else {
            var payAsTip = $('#payAsTip').is(":checked") ? 'yes' : 'no'
            $.confirm({
                'title': 'Bill Print Warning',
                'message': 'Do you want to print Guest Bill?',
                'buttons': {
                    'YES': {
                        'class': 'btn btn-success',
                        'action': function () {
                            $.ajax({
                                url: "<?php echo site_url("gkpos/orders/payandclose") ?>",
                                data: {
                                    order_id: order_id,
                                    pay_tip: payAsTip
                                },
                                type: "POST",
                                dataType: "json",
                                success: function (output) {
                                    if (output.success)
                                    {
                                        var printFromBrowser = '<?php echo $this->config->item('gk_guest_bill_from_browser') ?>'
                                        if (printFromBrowser == 'yes') {
                                            printGuestBillServer(order_id, 4);
                                        } else {
                                            printGuestBill(order_id, 4);
                                        }
                                    } else
                                    {
                                        alert(output.message);
                                    }
                                }
                            });

                        }
                    },
                    'NO': {
                        'class': 'btn btn-danger',
                        'action': function () {
                            $.ajax({
                                url: "<?php echo site_url("gkpos/orders/payandclose") ?>",
                                data: {
                                    order_id: order_id,
                                    pay_tip: payAsTip
                                },
                                type: "POST",
                                dataType: "json",
                                success: function (output) {
                                    if (output.success)
                                    {
                                        jQuery.colorbox.close();
                                        getSettingPage('<?php echo site_url('gkpos/report/online') ?>', 'Online Report');
                                    } else
                                    {
                                        alert(output.message);
                                    }
                                }
                            });
                        }
                    }
                }
            });
        }
    }

</script>