<script>
    $(document).ready(function (){
        $('#login-button').click(function (){
            $('#login').show();
            $('#deletion').hide();
            $('#email-smtp').hide();
        });
        $('#deletion-button').click(function (){
            $('#login').hide();
            $('#deletion').show();
            $('#email-smtp').hide();
        });
        $('#smtp-email-button').click(function (){
            $('#login').hide();
            $('#deletion').hide();
            $('#email-smtp').show();
        });

        {{--Login password--}}

        $('#login-password-name').keyup(function () {
            $('#strengthMessage').html(checkStrength($('#login-password-name').val()));
        });
        $('#confirm-login-password-name').keyup(function () {
            $('#confirmMessage').html(checkMatch($('#confirm-login-password-name').val()));
        });

        function checkMatch(password2) {
            var password1 = $('#login-password-name').val();
            if(password1 != password2 ){
                $('#confirmMessage').removeClass();
                $('#confirmMessage').addClass('notSame');
                return 'Password does not Match';
            }else{
                $('#confirmMessage').removeClass();
                $('#confirmMessage').addClass('Strong');
                return 'Password Matches';
            }
        }
        function checkStrength(password) {
            var strength = 0;
            if (password.length < 6) {
                $('#strengthMessage').removeClass();
                $('#strengthMessage').addClass('Short');
                return 'Password Too Short';
            }
            if (password.length > 7) strength += 1;
            // If password contains both lower and uppercase characters, increase strength value.
            if (password.match(/([a-z].*[A-Z])|([A-Z].*[a-z])/)) strength += 1;
            // If it has numbers and characters, increase strength value.
            if (password.match(/([a-zA-Z])/) && password.match(/([0-9])/)) strength += 1;
            // If it has one special character, increase strength value.
            if (password.match(/([!,%,&,@,#,$,^,*,?,_,~])/)) strength += 1;
            // If it has two special characters, increase strength value.
            if (password.match(/(.*[!,%,&,@,#,$,^,*,?,_,~].*[!,%,&,@,#,$,^,*,?,_,~])/)) strength += 1;
            // Calculated strength value, we can return messages
            // If value is less than 2
            if (strength < 2) {

                $('#strengthMessage').removeClass();
                $('#strengthMessage').addClass('Weak');
                return 'Password is Weak';
            } else if (strength == 2) {

                $('#strengthMessage').removeClass();
                $('#strengthMessage').addClass('Good');
                return 'Password is Good';
            } else {
                $('#strengthMessage').removeClass();
                $('#strengthMessage').addClass('Strong');
                return 'Password Very Strong';
            }
        }

        {{--Deletion Section--}}
        $('#deletion-password-name').keyup(function () {
            $('#strengthDeletionMessage').html(checkDeletionStrength($('#deletion-password-name').val()));
        });
        $('#confirm-deletion-password-name').keyup(function () {
            $('#confirmDeletionMessage').html(checkDeletionMatch($('#confirm-deletion-password-name').val()));
        });

        function checkDeletionMatch(password5) {
            var password4 = $('#deletion-password-name').val();
            if(password4 != password5 ){
                $('#confirmDeletionMessage').removeClass();
                $('#confirmDeletionMessage').addClass('notSame');
                return 'Password does not Match';
            }else{
                $('#confirmDeletionMessage').removeClass();
                $('#confirmDeletionMessage').addClass('Strong');
                return 'Password Matches';
            }
        }
        function checkDeletionStrength(password3) {
            var strength = 0;
            if (password3.length < 6) {
                $('#strengthDeletionMessage').removeClass();
                $('#strengthDeletionMessage').addClass('Short');
                return 'Password Too Short';
            }
            if (password3.length > 7) strength += 1;
            // If password contains both lower and uppercase characters, increase strength value.
            if (password3.match(/([a-z].*[A-Z])|([A-Z].*[a-z])/)) strength += 1;
            // If it has numbers and characters, increase strength value.
            if (password3.match(/([a-zA-Z])/) && password3.match(/([0-9])/)) strength += 1;
            // If it has one special character, increase strength value.
            if (password3.match(/([!,%,&,@,#,$,^,*,?,_,~])/)) strength += 1;
            // If it has two special characters, increase strength value.
            if (password3.match(/(.*[!,%,&,@,#,$,^,*,?,_,~].*[!,%,&,@,#,$,^,*,?,_,~])/)) strength += 1;
            // Calculated strength value, we can return messages
            // If value is less than 2
            if (strength < 2) {

                $('#strengthDeletionMessage').removeClass();
                $('#strengthDeletionMessage').addClass('Weak');
                return 'Password is Weak';
            } else if (strength == 2) {

                $('#strengthDeletionMessage').removeClass();
                $('#strengthDeletionMessage').addClass('Good');
                return 'Password is Good';
            } else {
                $('#strengthDeletionMessage').removeClass();
                $('#strengthDeletionMessage').addClass('Strong');
                return 'Password Very Strong';
            }
        }
    });
</script>
<style>
    .Short {
        width: 100%;
        height: 3px;
        color: #dc3545;
        font-weight: bold;
        font-size: 15px;
    }
    .Weak {
        width: 100%;
        height: 3px;
        color: #ffc107;
        font-weight: bold;
        font-size: 15px;
    }
    .Good {
        height: 3px;
        color: #d39e00;
        font-weight: bold;
        font-size: 15px;
    }
    .Strong {
        width: 100%;
        height: 3px;
        color: #3ee025;
        font-weight: bold;
        font-size: 15px;
    }
    .notSame {
        width: 100%;
        height: 3px;
        color: #dc1c0f;
        font-weight: bold;
        font-size: 15px;
    }
</style>
{!! Form::open(['route'=>['user.storeEditPassword'], 'method'=>'POST', 'id'=>'edit-user-passwords']) !!}
<div class="error" style="text-align: center;"><b>On this Window, You can Update your Password(s)</b></div><br>
<div class="guestDetails_inputDivider"></div>
<button type="submit" disabled style="display: none" aria-hidden="true"></button>


<div class="tab">
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            Login Password {!! Form::radio('type', 'login', true, ['id'=>'login-button']) !!}
        </div>
    </div>
    @if(app('UserDeletes')->perm_delete == 1)
        <div class="guestDetails_input">
            <div class="guestDetails_inputLabel">
                Deletion Password {!! Form::radio('type', 'deletion', false, ['id'=>'deletion-button']) !!}
            </div>
        </div>
    @endif
    @if(app('CompanyModules')->emails != 0)
        @if(auth()->user()->emails != 0)
            <div class="guestDetails_input">
                <div class="guestDetails_inputLabel">
                    Email SMTP Settings{!! Form::radio('type', 'smtp-email', false, ['id'=>'smtp-email-button']) !!}
                </div>
            </div>
        @endif
    @endif
</div>
<div class="tabcontent" id="login" style="display: block">
    <span onclick="this.parentElement.style.display='none'" class="topright" style="margin-left: 20px">&times</span>
    <h3 ><span class="error" style="margin-right: 20px">Update your System Login Password</span></h3>
    <div class="guestDetails_inputDivider"></div>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('login-password', 'Enter New Login Password') !!}
            <span class="error">*</span>
            <span id="strengthMessage" style="margin-left: 15px"></span>
        </div>
        <div class="guestDetails_input">
            {!! Form::password('login-password', ['id'=>'login-password-name', 'class'=>'input-text-height', 'size'=>'50']) !!}
        </div>
    </div>
    <div class="guestDetails_inputDivider1"></div>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('confirm-login-password', 'Confirm New Login Password') !!}
            <span class="error">*</span>
            <span id="confirmMessage" style="margin-left: 15px"></span>
        </div>
        <div class="guestDetails_input">
            {!! Form::password('confirm-login-password', ['id'=>'confirm-login-password-name', 'class'=>'input-text-height', 'size'=>'50']) !!}
        </div>
    </div>
    <div class="guestDetails_inputDivider1"></div>
</div>

<div class="tabcontent" id="deletion">
    <span onclick="this.parentElement.style.display='none'" class="topright" style="margin-left: 20px">&times</span>
    <h3 ><span class="error" style="margin-right: 20px">Update your System Deletion Password</span></h3>
    <div class="guestDetails_inputDivider"></div>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('deletion-password', 'Enter New Deletion Password') !!}
            <span class="error">*</span>
            <span id="strengthDeletionMessage" style="margin-left: 15px"></span>
        </div>
        <div class="guestDetails_input">
            {!! Form::password('deletion-password', ['id'=>'deletion-password-name', 'class'=>'input-text-height', 'size'=>'50']) !!}
        </div>
    </div>
    <div class="guestDetails_inputDivider1"></div>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('confirm-deletion-password', 'Confirm New Deletion Password') !!}
            <span class="error">*</span>
            <span id="confirmDeletionMessage" style="margin-left: 15px"></span>
        </div>
        <div class="guestDetails_input">
            {!! Form::password('confirm-deletion-password', ['id'=>'confirm-deletion-password-name', 'class'=>'input-text-height', 'size'=>'50']) !!}
        </div>
    </div>
    <div class="guestDetails_inputDivider1"></div>
</div>

<div class="tabcontent" id="email-smtp">
    <span onclick="this.parentElement.style.display='none'" class="topright" style="margin-left: 20px">&times</span>
    <h3 ><span class="error" style="margin-right: 20px">Update your Email SMTP Settings</span></h3>
    <div class="guestDetails_inputDivider"></div>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('company-email', 'Enter your Company Registered Email') !!}
            <span class="error">*</span>
        </div>
        <div class="guestDetails_input">
            {!! Form::text('smtp-email', auth()->user()->smtp_email ?? '',['class'=>'input-text-height', 'size'=>'50']) !!}
            {!! Form::hidden('smtp-email-password', auth()->user()->smtp_email_password ?? 'not required') !!}
        </div>
    </div>
    {{--<div class="guestDetails_inputDivider1"></div>
    <div class="guestDetails_input">
        <div class="guestDetails_inputLabel">
            {!! Form::label('smtp-email-password', 'Enter your SMTP Email Password') !!}
            <span class="error">*</span>
        </div>
        <div class="guestDetails_input">
            {!! Form::text('smtp-email-password', auth()->user()->smtp_email_password ?? '',['class'=>'input-text-height', 'size'=>'50']) !!}
        </div>
    </div>--}}
    <div class="guestDetails_inputDivider1"></div>
</div>
{!! Form::close() !!}
