<!DOCTYPE html>
<html class="no-js" lang="en">
    <head>
        <?php
            $this->load->view('user/common_style');    
        ?>
            
        <link rel="stylesheet" href="<?php echo base_url();?>styles/css/set1.css">
        <link href="<?php echo base_url();?>/assets/boots/css/formValidation.min.css" rel="stylesheet" type="text/css">
        <style>
            .contact_one .contact_left_content form input[type="text"]{border:0px;color:#F5AB35;font-family: 'Poppins', sans-serif;}
            .contact_left_content{background: rgba(255, 255, 255, 0.10) none repeat scroll 0% 0%;margin-top:100px;
            padding: 20px;-webkit-box-shadow: 0px 0px 24px 0px rgba(0,0,0,0.19);
            -moz-box-shadow: 0px 0px 24px 0px rgba(0,0,0,0.19);
            box-shadow: 0px 0px 24px 0px rgba(0,0,0,0.19);}
            .yellow-btn button {
             all: unset;
             cursor: pointer;
            }   
            .form-page {
  background: rgb(255, 255, 255) none repeat scroll 0 0;
  padding: 30px;
} 

.page-container {
  background-color: rgb(239, 239, 239);
  padding-left: 5px;
  padding-right: 5px;
  height: 500px;
}
        </style>
    </head>
    <body>
        
        <!-- this code is for main body content -->
        <div class="page-container page-section-1-ptb">
            <div class="container">
                <div class="row">  
                    <div class="col-md-4 col-md-offset-4">
                        <div class="form-page">
                            <div class="col-lg-12 text-center">
                                     <?php
                                $logo_img = site_info('site_logo');
                                if($logo_img)
                                {
                                ?>
                                    <a href="<?php echo base_url();?>"><img class="img-responsive center-block mb-30" src="<?php echo base_url()."content/site/".site_info('site_logo');?>" alt="<?php echo site_info('site_logo');?>"></a>
                                <?php
                                }
                                else
                                {
                                ?>
                                    <a href="<?php echo base_url();?>user"><img class="img-responsive center-block mb-30" src="<?php echo base_url();?>styles/img/logo_white.png"></a>
                                <?php 
                                }
                                ?>

                                </div>
                                <h4 class="other-title theme-color fw-3"><?php echo $this->lang->line('transpin_title'); ?></h4>
                                <form action="<?php echo base_url();?>traspinupdate" class="form-validate trans_confirm" method="post">
                                                    
                                    <div class="form">

                                        <?php if($this->session->flashdata('error_message')) {?>
                                            <p class="frgtpwd frgtpwd1 frgtpwdred"><i class="fa fa-thumbs-down"></i><?php echo $this->session->flashdata('error_message');?></p>
                                        <?php } else { }?>
                                        <div style="margin-bottom: 0;" class="form-block form-group has-feedback has-feedback-left">
                                        <i class="fa fa-lock"></i> 
                                            <input placeholder="<?php echo $this->lang->line('trans_pin_lbl'); ?>"  type="password" id="input-5" name="trans_pin" required="required"/>
                                                
                                            <?php echo form_error('trans_pin');?>
                                        </div>
                                        <input name="tmp_id" type="hidden" value="<?php if($this->session->userdata('tmp_id')){ echo $this->session->userdata('tmp_id');} else { echo ""; }?>" />
                                    </div>

                                    <div class="clearfix"><br></div>

                                    <div class="contact_page_btn" style="width:100%;">
                                       <button style="width: 97%;" class="yellow-btn" type="submit"><?php echo $this->lang->line('contact_submit'); ?></button>
                                    </div>

                                </form>
                                
                            </div>
                        </div> <!-- col-md-5 end -->                       
                    </div> <!-- row end -->
                </div> <!-- container end -->
            </div>
            <?php
                $this->load->view('user/footer');
          ?>         
                
        <!--===============================================

                          **** JS ****
                          
        ================================================-->
        
        <!-- jquery necessary for all plug in -->
        <script src="<?php echo base_url();?>styles/js/jquery-1.12.2.min.js"></script>
        
        <!-- meanmenu -->
        <script src="<?php echo base_url();?>styles/js/jquery.meanmenu.js"></script>
        
        <!-- owl-carousel -->
        <script src="<?php echo base_url();?>styles/js/owl.carousel.min.js"></script>
        
        <!-- counter up -->
        <script src="<?php echo base_url();?>styles/js/waypoints.min.js"></script>
        <script src="<?php echo base_url();?>styles/js/jquery.counterup.min.js"></script>
        
        <!-- mixit up -->
        <script src="<?php echo base_url();?>styles/js/jquery.mixitup.min.js"></script>
        
        <!-- wow js -->
        <script src="<?php echo base_url();?>styles/js/waypoints.min.js"></script>
        
        <!-- instafeed -->
        <script src="<?php echo base_url();?>styles/js/instafeed.min.js"></script>
        
        <!-- parallax -->
        <script src="<?php echo base_url();?>styles/js/jquery-parallax.js"></script>
        
        <!-- bootstrap -->
        <script src="<?php echo base_url();?>styles/js/bootstrap.min.js"></script>
        
        <!-- custom -->
        <script src="<?php echo base_url();?>styles/js/main.js"></script>
        <script src="<?php echo base_url();?>styles/js/classie.js"></script>
        
        <!-- Bootsrap form validation JS files -->
        <script type="text/javascript" src="<?php echo base_url();?>assets/js/formValidation.js"></script>
        <script type="text/javascript" src="<?php echo base_url();?>assets/js/bootstrap.js"></script>
        <script>
            jQuery.noConflict();
            (function( $ ) {
                $(function() {

                    $(document).ready(function() {

                        $('.trans_confirm').formValidation({
                            framework: 'bootstrap',
                            excluded: [':disabled'],
                            icon: {
                                // valid: 'glyphicon glyphicon-ok',
                                // invalid: 'glyphicon glyphicon-remove',
                                // validating: 'glyphicon glyphicon-refresh'
                            },
                            fields: {
                                    trans_pin: {
                                    validators: {
                                        notEmpty: {
                                            message: '<?php echo $this->lang->line("email_confirm_required");?>'
                                        },
                                        digits: {
                                            message: '<?php echo $this->lang->line("registration_trans_digit_err");?>'
                                        }
                                    }
                                }
                            }
                        })
                        
                    });

                });
            })(jQuery);
            (function() {
                if (!String.prototype.trim) {
                    (function() {
                        // Make sure we trim BOM and NBSP
                        var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
                        String.prototype.trim = function() {
                            return this.replace(rtrim, '');
                        };
                    })();
                }

                [].slice.call( document.querySelectorAll( 'input.input__field' ) ).forEach( function( inputEl ) {
                    // in case the input is already filled..
                    if( inputEl.value.trim() !== '' ) {
                        classie.add( inputEl.parentNode, 'input--filled' );
                    }

                    // events:
                    inputEl.addEventListener( 'focus', onInputFocus );
                    inputEl.addEventListener( 'blur', onInputBlur );
                } );

                function onInputFocus( ev ) {
                    classie.add( ev.target.parentNode, 'input--filled' );
                }

                function onInputBlur( ev ) {
                    if( ev.target.value.trim() === '' ) {
                        classie.remove( ev.target.parentNode, 'input--filled' );
                    }
                }
            })();

        </script>
        
    </body>
</html>