@php
    $rolesArr = Auth::user()->roles;
    $userrolename = isset($user)?$user->roles->implode('name', ', '):'';
@endphp

<div class="row clearfix">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
        <div class="card">
            
            <div class="body">
                <div class="row clearfix">
                    <div class="col-md-4">
                        <b> Name   <span style="color:red">*</span> </b>
                        <div class="input-group">
                            <div class="form-line">
                                {!! Form::text('name', null, ['class' => 'form-control alphabetsOnly', 'required', 'maxlength' => '250']) !!}
                            @if ($errors->has('name')) <p class="help-block text-danger">{{ $errors->first('name') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                    <div class="col-md-4">
                        <b>Gender </b>
                        <div class="input-group">
                            <div class="form-group">
                                <select class="form-control" data-placeholder="Select" name="gender" id="gender">
                                    @php
                                        $select_active = ''; $select_inactive = '';
                                        $gender = isset($user->gender) ? $user->gender : old('gender');
                                        
                                        if($gender=='Male') {
                                            $select_active = 'selected';
                                        }
                                        if($gender=='Female') {
                                            $select_inactive = 'selected';
                                        }
                                    @endphp
                                    <option value="">Select</option>
                                    <option value="Male" {{$select_active}}>Male</option>
                                    <option value="Female" {{$select_inactive}}>Female</option>
                                </select>     
                                @if ($errors->has('status')) <p class="help-block text-danger mb-25">{{ $errors->first('status') }}</p> @endif      
                            </div>
                        </div>
                    </div>

                    <div class="col-md-4" style="display: none;">
                        <b>Email   </b>
                        <div class="input-group">
                            <div class="form-line">
                                {!! Form::email('email', null, ['class' => 'form-control mb-20', 'maxlength' => '250']) !!}
                            @if ($errors->has('email')) <p class="help-block text-danger">{{ $errors->first('email') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                    <div class="col-md-4" style="display: none;">
                        <b>Phone Number </b>
                        <div class="input-group">
                            <div class="form-line">
                                {!! Form::text('phone_no', null, ['class' => 'form-control mb-20 numbersOnly', 'maxlength' => '15']) !!}
                                @if ($errors->has('phone_no')) <p class="help-block text-danger">{{ $errors->first('phone_no') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                     <div class="col-md-4" style="display: none;">
                        <b>Role </b>
                        <div class="input-group">
                            <div class="form-group">
                                {!! Form::select('roles[]', $roles, isset($user) ? $user->roles->pluck('id')->toArray() : null,  ['class' => 'form-control select2-selection__rendered roleselect']) !!}
                                    @if ($errors->has('roles')) <p class="help-block text-danger">{{ $errors->first('roles') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                     <div class="col-md-4" style="display: none;">
                        <b>Password </b>
                        <div class="input-group">
                            <div class="form-line">
                                {!! Form::password('password', ['class' => 'form-control', 'id' => 'password']) !!}

                                <span id="password_showpwd" style="display: none;" class="fa fa-fw fa-eye field-icon" onclick="showpwd('pwd','password')"></span>
                                <span id="password_hidepwd" class="fa fa-fw fa-eye-slash field-icon" onclick="showpwd('text','password')"></span>

                                @if ($errors->has('password')) <p class="help-block text-danger">{{ $errors->first('password') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                    <div class="col-md-4">
                        <b>Status </b>
                        <div class="input-group">
                            <div class="form-group">
                                <select class="form-control" data-placeholder="Select" name="status" id="status">
                                    @php
                                        $select_active = ''; $select_inactive = '';
                                        $status = isset($user->status) ? $user->status : old('status');
                                        
                                        if($status=='Active') {
                                            $select_active = 'selected';
                                        }
                                        if($status=='Inactive') {
                                            $select_inactive = 'selected';
                                        }
                                    @endphp
                                    <option value="Active" {{$select_active}}>Active</option>
                                    <option value="Inactive" {{$select_inactive}}>Inactive</option>
                                </select>     
                                @if ($errors->has('status')) <p class="help-block text-danger mb-25">{{ $errors->first('status') }}</p> @endif      
                            </div>
                        </div>
                    </div>

                    <div class="col-md-4">
                        <b>DOB <span style="color:red">*</span></b>
                        <div class="input-group">
                            <div class="form-line">
                                <input type="date" id="dob" name="dob" required="" value="{{isset($user->dob)?$user->dob:old('dob')}}" class="form-control">
                            @if ($errors->has('dob')) <p class="help-block text-danger">{{ $errors->first('dob') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                    <div class="col-md-3">
                        <b>Profile Picture </b>
                        <div class="input-group">
                            <div class="form-group">
                                <input type="file" class="onlyImage" name="profile_picture" id="profile_picture" accept="image/jpg,image/png,image/jpeg">

                                                   
                                @if ($errors->has('profile_picture')) <p class="help-block text-danger mb-25">{{ $errors->first('profile_picture') }}</p> @endif      
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6" style="display: none;">
                        <b>Address Line 1</b>
                        <div class="input-group">
                            <div class="form-line">
                                <input type="text" id="address" name="address" value="{{isset($user->address)?$user->address:old('address')}}" class="form-control" maxlength="250">
                            @if ($errors->has('address')) <p class="help-block text-danger">{{ $errors->first('address') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                    <div class="col-md-6" style="display: none;">
                        <b>Address Line 2</b>
                        <div class="input-group">
                            <div class="form-line">
                                <input type="text" id="address1" name="address1" value="{{isset($user->address1)?$user->address1:old('address1')}}" class="form-control" maxlength="250">
                            @if ($errors->has('address1')) <p class="help-block text-danger">{{ $errors->first('address1') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                    <div class="col-md-4" style="display: none;">
                        <b>Country</b>
                        <div class="input-group">
                                        <div class="form-group">
                                <select class="form-control" data-placeholder="Select" onchange="get_State(this.value)" name="country" id="country">
                                    <option value="">Select a Country</option>
                                    @foreach($country as $key=>$item)
                                         @php
                                            $country = isset($user->country) ? $user->country : old('country');
                                        @endphp
                                        <option  value="{{$item['COUNTRYID']}}">{{$item['COUNTRYNAME']}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-4" style="display: none;">
                        <b>State</b>
                        <div class="input-group">
                            <div class="form-group">
                                <div id="state_div">
                                <select id="state" name="state" class="form-control" data-placeholder="Select"  onchange="get_City(this.value)" >
                                    <option value="">Select a State</option>
                                    @foreach($states as $key=>$item)
                                        <option  value="{{$item['STATEID']}}">{{$item['STATENAME']}}</option>
                                    @endforeach
                                </select>
                                </div>
                                @if ($errors->has('state')) <p class="help-block text-danger">{{ $errors->first('state') }}</p> @endif
                            </div>
                        </div>
                    </div>

                    <div class="col-md-4" style="display: none;">
                        <b>City</b>
                        <div class="input-group">
                            <div class="form-group">
                                <div id="city_div">
                                <select id="city" name="city" class="form-control" data-placeholder="Select"  >
                                        <option value=""></option>
                                    @php
                                        if(isset($user->city)) { 
                                    @endphp
                                        <option selected="" value="{{$user->city}}">{{ get_city_name($user->city)}}</option>
                                    @php } @endphp
                                    </select> 
                                </div>
                                   </div>
                               
                                @if ($errors->has('city')) <p class="help-block text-danger">{{ $errors->first('city') }}</p> @endif
                            </div>
                            <span class="input-group-addon">
                                <i></i>
                            </span>
                        </div>
                    </div>

                     <!-- @if(isset($user))
                        <div class="col-md-4">
                        <div class="input-group">
                            <div class="form-check m-l-10">
                                <label class="form-check-label">
                                    <input class="form-check-input" type="checkbox" value="1" name="verified" id="verified"> Verified
                                    <span class="form-check-sign">
                                        <span class="check"></span>
                                    </span>
                                </label>
                            </div>
                        </div>
                    </div>
                     @endif -->

                     <input type="hidden" name="is_changed" id="is_changed" value="0">

                </div>
            </div>
        </div>

    </div>
</div>
    
<style type="text/css">
    .field-icon {
      float: right;
      margin-left: -25px;
      margin-top: 13px;
      position: relative;
      z-index: 2;
    }

    .container{
      padding-top:50px;
      margin: auto;
    }
</style>
<script type="text/javascript">
    @if(isset($user))
        get_City("{{$user->state}}");
        get_State("{{$user->country}}");
    @endif
    function showpwd(val,id) {
        if(val=='text') { 
            $('#'+id).attr('type', 'text'); 
            $('#'+id+'_hidepwd').hide(); 
            $('#'+id+'_showpwd').show(); 
        }
        if(val=='pwd') {
            $('#'+id).attr('type', 'password'); 
            $('#'+id+'_hidepwd').show(); 
            $('#'+id+'_showpwd').hide(); 
        }
    }
    function get_City(val){

        var sid=val;

        $('#city_div').html('');

        var select = document.createElement("select");

            select.id = "city";

            select.className = "form-control selectpicker";

            select.name = "city";

            $('#city_div').html(select);

            

        $.ajax({

            type:"GET",

            headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') },

            url:"{{ url('/') }}/members/GET-CITY",

            data:{SID:sid,_token:$('meta[name=_token]').attr('content')},

            async:false,

            dataType:"JSON",

            completed:function(e, x, settings, exception){ajax_errors(e, x, settings, exception)},

            error:function(e, x, settings, exception){ajax_errors(e, x, settings, exception)},

            

            success:function(response){

                $('#city').find('option').remove().end();

                $('#city').append('<option value="" disabled selected>Select a City</option>');

                for(var i=0;i<response.length;i++){

                    var option = document.createElement("option");

                        option.value = response[i]['CITYID'];

                        option.text = response[i]['CITYNAME'];

                        select.appendChild(option);

                }

            }

        });

        $('#city').attr('data-live-search',true);

        $('#city').selectpicker(); 
    }

    function get_State(val){

        var sid=val;

        /*$('#state_div').html('');

        var select = document.createElement("select");

            select.id = "state";

            select.className = "form-control";

            select.name = "state";

            $('#state_div').html(select);*/

            

        $.ajax({

            type:"GET",

            headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') },

            url:"{{ url('/') }}/members/GET-STATE",

            data:{SID:sid,_token:$('meta[name=_token]').attr('content')},

            async:false,

            dataType:"JSON",

            completed:function(e, x, settings, exception){ajax_errors(e, x, settings, exception)},

            error:function(e, x, settings, exception){ajax_errors(e, x, settings, exception)},

            

            success:function(response){

                $('#state').find('option').remove().end();

                $('#state').append('<option value="" disabled selected>Select a State</option>');

                for(var i=0;i<response.length;i++){

                    var option = document.createElement("option");

                        $('#state').append('<option value="'+response[i]['STATEID']+'" >'+response[i]['STATENAME']+'</option>');

                }

            }

        });

        $('#state').attr('data-live-search',true);

        $('#state').selectpicker(); 
    }

    $( ".roleselect" ).change(function() {
        var roleName  = $('.roleselect option:selected').text();
        
        $("#gymList").hide();

        if(roleName=='Gym Branch') {
            $("#gymList").show();
        }

    });

    function showPwd() {
        var x = document.getElementById("password");
        if (x.type === "password") {
            x.type = "text";
        } else {
            x.type = "password";
        }
    }
</script>