<div class="page-content">
    <!-- Page Breadcrumb -->
    <div class="page-breadcrumbs">
        <ul class="breadcrumb">
            <li>
                <i class="fa fa-home"></i>
                <a href="#"><?php echo $this->lang->line("FINANCE"); ?></a>
            </li>
            <li class="active"><?php echo $this->lang->line("FINANCE"); ?></li>
        </ul>
    </div>
    <!-- /Page Breadcrumb -->
    <!-- Page Header -->
    <div class="page-header position-relative">
        <div class="header-title">
            <h1>
                <?php echo $this->lang->line("TRANSFERFORM"); ?>
            </h1>
        </div>
        <!--Header Buttons-->
        <div class="header-buttons">
            <a class="sidebar-toggler" href="#">
                <i class="fa fa-arrows-h"></i>
            </a>
            <a class="refresh" id="refresh-toggler" href="">
                <i class="glyphicon glyphicon-refresh"></i>
            </a>
            <a class="fullscreen" id="fullscreen-toggler" href="#">
                <i class="glyphicon glyphicon-fullscreen"></i>
            </a>
        </div>
        <!--Header Buttons End-->
    </div>
    <!-- /Page Header -->
    <!-- Page Body -->
    <!-- End Page Body -->
    <div class="page-body">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="row">
                    <div class="col-xs-12 col-md-12">
                        <div class="widget">
                            <?php
                            if ($this->session->flashdata('success_msg')) {
                            ?>
                            <div class="alert alert-success">
                            <a href="#" class="close" data-dismiss="alert">&times;</a>
                            <?php echo $this->session->flashdata('success_msg'); $this->session->unset_userdata('success_msg');?>
                            </div>
                            <?php
                            }
                            ?>
                            
                            <div class="widget-body">
                                <div class = "row center">
                                    <div class="col-lg-12 col-sm-12 col-xs-12">
                                        <div class="widget center">
<div>
    <div id="horizontal-form">
        <form class="form-horizontal" role="form" id="togglingForm" method="POST" action="<?php echo site_url('finance/transfer/transferamount')?>">
            <div class="form-group">
                <label for="inputEmail3" class="col-sm-2 control-label no-padding-right"><?php echo $this->lang->line("DATE"); ?></label>
                <div class="col-sm-3">
                    <div class="input-group">
                        <input class="form-control date-picker" id="id-date-picker-1 TRANSACTION_DATE"
                               name="TRANSACTION_DATE" type="text" data-date-format="dd-mm-yyyy"
                               readonly value="<?php echo (isset($depositdetails)) ? $this->formatslist->dateFormat($depositdetails->TRANSACTION_DATE): date('d-m-Y'); ?>" />
                        <span class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                        </span>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label for="inputEmail3" class="col-sm-2 control-label no-padding-right"><?php echo $this->lang->line("ACCOUNTFROM"); ?></label>
                <div class="col-sm-10">
                    <select id="accountfrom" name="accountfrom" style="width:100%" required onchange="getBalance(this.value)">
                        <option value><?php echo $this->lang->line("SELECTACCOUNT"); ?></option>
                        <?php
                        foreach ($accounts as $key => $value) {
                            echo "<option value=\"".$value->ID."\" />".$value->ACCOUNT_NAME;    
                        }
                        ?>
                    </select>
                    <p id="available_balance" style="color:red; display:none"><?php echo $this->lang->line("AVAILABLEBALANCEIS"); ?>
                        <strong id="avbalamount"></strong></p>
                    <input type="hidden" name="availbalhidden" id="availbalhidden" value="" />
                </div>
            </div>
            <div class="form-group">
                <label for="inputEmail3" class="col-sm-2 control-label no-padding-right"><?php echo $this->lang->line("ACCOUNTTO"); ?></label>
                <div class="col-sm-10">
                    <select id="accountto" name="accountto" style="width:100%" required>
                        <option value><?php echo $this->lang->line("SELECTACCOUNT"); ?></option>
                        <?php
                        foreach ($accounts as $key => $value) {
                            echo "<option value=\"".$value->ID."\" />".$value->ACCOUNT_NAME;    
                        }
                        ?>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label for="inputPassword3" class="col-sm-2 control-label no-padding-right"><?php echo $this->lang->line("AMOUNT"); ?></label>
                <div class="col-sm-10">
                    <input id="amount" type="number" class="form-control" name="amount"
                           placeholder="<?php echo $this->lang->line("AMOUNT"); ?>" required step="any" value="" />
                </div>
            </div>
            <div class="form-group">
                <label for="inputPassword3" class="col-sm-2 control-label no-padding-right"><?php echo $this->lang->line("COMMENTS"); ?></label>
                <div class="col-sm-10">
                    <textarea id="comments" name="comments" class="form-control" placeholder="<?php echo $this->lang->line("COMMENTS"); ?>"></textarea>
                </div>
            </div>
            
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-success shiny">
                    <span class="fa fa-check"></span>
                    <?php echo $this->lang->line("SAVE"); ?></button>
                    <a id="close" href="<?php echo base_url('finance/transfer')?>" class="btn btn-danger shiny">
                        <span class="fa fa-close"></span>
                        <?php echo $this->lang->line("CLEAR"); ?>
                    </a>
                </div>
            </div>
    <button id="dangerbuttonalert" class="btn btn-danger" data-toggle="modal" data-target="#modal-danger" style="display: none;">Danger</button>
    <div id="modal-danger" class="modal modal-message modal-danger fade" style="display: none;" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <i class="glyphicon glyphicon-fire"></i>
                </div>
                <div class="modal-title"><?php echo $this->lang->line("INSUFFICIENTBALANCE"); ?></div>

                <div class="modal-body">
                    <?php echo $this->lang->line("CANTTRANSFERDUETOINSUFFICIENTFUND"); ?></div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal"><?php echo $this->lang->line("OK"); ?></button>
                </div>
            </div> <!-- / .modal-content -->
        </div> <!-- / .modal-dialog -->
    </div>
  
        </form>
    </div>
</div>
                                        </div>
                                    </div> 
                                    
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End Page Content -->
<script type="text/javascript">
    // Get Balance of the Account
    function getBalance(accid){
        if(accid){
            $.ajax({
                method: "POST",
                url: "<?php echo base_url('finance/Deposits/get_account'); ?>",
                data: {
                    account: accid
                }
            }).done(function (msg) {
                $("#available_balance").show();
                $("#avbalamount").html(msg);
                $("#availbalhidden").val(msg);
            });
        }else{
            $("#available_balance").hide();
            $("#availbalhidden").val('');
        }
    }
</script>
<script src="<?php echo base_url(); ?>assets/js/validation/bootstrapValidator.js"></script>
<script type="text/javascript">
    $('#togglingForm').bootstrapValidator({
        live: 'enabled',
        fields: {
            accountfrom: {
                validators: {
                    notEmpty: {
                        message: '<?php echo $this->lang->line("SELECTACCOUNT"); ?>'
                    }
                }
            },
            accountto: {
                validators: {
                    notEmpty: {
                        message: '<?php echo $this->lang->line("SELECTACCOUNT"); ?>'
                    }
                }
            },
            amount: {
                validators: {
                    notEmpty: {
                        message: '<?php echo $this->lang->line("PLEASEENTERAMOUNT"); ?>'
                    }
                }
            }
        },
        onSuccess: function(e, data) {
            //this section before submit
//            var availbalhidden  =   $("#availbalhidden").val();
//            var amount          =   $("#amount").val();
//            availbalhidden      =   parseFloat(availbalhidden);
//            amount              =   parseFloat(amount);
//            if(availbalhidden>0 && availbalhidden>=amount){
//                //
//            }else {
//                e.preventDefault();
//                $("#dangerbuttonalert").click();
//            }
            
            
        }
    });
</script>