<form id="eposCallerIdForm">
    <table class="report-table" style="background: transparent;margin-top: -6px;">
        <tr>
            <td style="width: 10%;border: none" class="text-center"><span class="icon icon-phone" style="color: #FFF"></span></td>
            <td style="width: 25%;border: none"><div class="form-group"><input type="text" class="form-control" id="eposCallerIdFormCustomerName" name="name" placeholder="<?php echo $this->lang->line('name') ?>" style="width: 99%;border-radius: 0px; height: 33px" onfocus="setTargetKeyboard('keyboard-fixed-orderpage', 'setting-pagination-keyboard')"></div></td>
            <td style="width: 25%;border: none"><div class="form-group"><input type="text" class="form-control" id="eposCallerIdFormCustomerPhone" name="phone" placeholder="<?php echo $this->lang->line('phone') ?>" style="width: 99%;border-radius: 0px; height: 33px"></div></td>
            <td style="width: 20%;border: none;"><div class="form-group"> <span class="btn btn-primary-custom-1" style="padding: 5px 0px;margin-top: 0px;width: 100%;	border-radius: 0px;font-size: 15px;" onclick="initiateCallerOrder('delivery')" >&nbsp;<strong><?php echo $this->lang->line('delivery') ?></strong></span></div></td>
            <td style="width: 20%;border: none;"><div class="form-group"> <span class="btn btn-primary-custom-1" style="padding: 5px 0px;margin-top: 0px;width: 100%;	border-radius: 0px;font-size: 15px;" onclick="initiateCallerOrder('collection')" >&nbsp;<strong><?php echo $this->lang->line('collection') ?></strong></span</div></td>
        </tr>
    </table>
    <div  id="callerDevicePhonePad" style="z-index: 2; position: relative; margin-top: -10px;background: #004651;display: none;">
        <div class="tab-group keypad">                     
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">1</div>
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">2</div>
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">3</div>  
        </div>
        <div class="tab-group keypad">
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">4</div>
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">5</div> 
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">6</div>
        </div>            
        <div class="tab-group keypad">
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">7</div>
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">8</div>
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">9</div>                      
        </div> 
        <div class="tab-group keypad">
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneActionKey">DEL</div>                        
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneNumKey">0</div>
            <div class="tab-item zaman-epos-nav quantity-digit keypad-key callerStaticPrimaryPhoneActionKey">CLR</div>        
        </div> 
    </div>
</form>
<script type="text/javascript">
    function initiateCallerOrder(type) {
        var callerCustomerName = $('#eposCallerIdFormCustomerName').val();
        var callerCustomerPhone = $('#eposCallerIdFormCustomerPhone').val();
        if ($.trim(callerCustomerPhone)) {
            hideAllCallerBoxKeyboardAndNumPad();
            $.ajax('<?php echo site_url('epos/updateCallerPhone') ?>', {
                type: 'post',
                dataType: 'json',
                data: {phone: callerCustomerPhone},
                error: function (xhr, textStatus) {
                    if (type === 'collection') {
                        zamanPlaceCollectionOrder(0, callerCustomerName, callerCustomerPhone, '', '', '');
                    }
                    if (type === 'delivery') {
                        zamanPlaceDeliveryOrder(0, callerCustomerName, callerCustomerPhone, '', '', '', '', '', '', '', '', '', '', '');
                    }
                },
                success: function (data) {
                    if (type === 'collection') {
                        zamanPlaceCollectionOrder(0, callerCustomerName, callerCustomerPhone, '', '', '');
                    }
                    if (type === 'delivery') {
                        zamanPlaceDeliveryOrder(0, callerCustomerName, callerCustomerPhone, '', '', '', '', '', '', '', '', '', '', '');
                    }
                }
            });
        } else {
            $('#eposCallerIdFormCustomerPhone').focus();
        }
    }
    function callerBoxCallerIdType(type) {
        $('#eposCallerIdFormCallerOrderType').val(type);
        $('#callerPhoneOrderType').hide();
    }
    $(document).ready(function () {
        $('#eposCallerIdFormCallerOrderType').bind('focus', function () {
            $('#callerPhoneOrderType').show();
            $('#callerDevicePhonePad').hide();
            $('#itemNumPad').hide();
            if ($('#Keyboard').length > 0) {
                $('#Keyboard').empty();
                $('#Keyboard').removeAttr('id');
            }
        });
        $('#eposCallerIdFormCustomerName').bind('focus', function () {
            $('#callerPhoneOrderType').hide();
            $('#callerDevicePhonePad').hide();
            $('#itemNumPad').hide();
        });
        $('#eposCallerIdFormCustomerPhone').bind('focus', function () {
            $('#callerPhoneOrderType').hide();
            $('#callerDevicePhonePad').show();
            if ($('#Keyboard').length > 0) {
                $('#Keyboard').empty();
                $('#Keyboard').removeAttr('id');
                $('#itemNumPad').hide();
            }
        });
    });
    function hideAllCallerBoxKeyboardAndNumPad() {
        $('#callerPhoneOrderType').hide();
        $('#callerDevicePhonePad').hide();
        if ($('#Keyboard').length > 0) {
            $('#Keyboard').empty();
            $('#Keyboard').removeAttr('id');
        }
    }
    function updateCallerIdIssue(issue) {
        if (!jQuery.isEmptyObject(issue)) {
            var currentCallerPhone = sessionStorage.getItem('currentCallerPhone');
            if (currentCallerPhone !== issue.phone) {
                sessionStorage.setItem('currentCallerPhone', issue.phone);
            }
            // palyDeskPhone();
        }
        var CallerPhone = sessionStorage.getItem('currentCallerPhone');
        if ($.trim(CallerPhone)) {
            zamanEposDb.epos_customer.get({phone: CallerPhone}).then(function (aCustomer) {
                if (typeof (aCustomer) !== 'undefined') {
                    $('#eposCallerIdFormCustomerName').val(aCustomer.name);
                    $('#eposCallerIdFormCustomerPhone').val(aCustomer.phone);
                } else {
                    $('#eposCallerIdFormCustomerName').val('');
                    $('#eposCallerIdFormCustomerPhone').val(CallerPhone);
                }
            });
        }
    }
</script>
