<script>
    $(document).ready(function () {
        $('#access-list').select2();
        $('#product-list').select2();
        $('#mini-cover-list').select2();
        $('#branch-list').select2();


        /**Selecting User Access Type**/
        $('#access-list').on('change', function () {
            var access = $(this).val();
            if (access != "") {
                $('#access-label').removeClass('error');
            } else {
                $('#access-label').addClass('error');
            }
        });
        /**Selecting User Branch**/
        $('#branch-list').on('change', function () {
            var branch = $(this).val();
            if (branch != "") {
                $('#branch-label').removeClass('error');
            } else {
                $('#branch-label').addClass('error');
            }
        });


        /**Entering the First name of user**/
        $('#f-name').on('input paste', function () {
            var fName = $(this).val();
            if (fName != "") {
                $('#first-name-label').removeClass('error');
            } else {
                $('#first-name-label').addClass('error');
            }
        });
        /**Entering the Last name of user**/
        $('#l-name').on('input paste', function () {
            var lName = $(this).val();
            if (lName != "") {
                $('#other-name-label').removeClass('error');
            } else {
                $('#other-name-label').addClass('error');
            }
        });
        /**Entering the username of user**/
        $('#username-name').on('input paste', function () {
            var username = $(this).val();
            if (username != "") {
                $('#username-label').removeClass('error');
            } else {
                $('#username-label').addClass('error');
            }
        });
        /**Entering the Phone Number of user**/
        $('#phone-name').on('input paste', function () {
            var phone = $(this).val();
            if (phone != "") {
                $('#phone-label').removeClass('error');
            } else {
                $('#phone-label').addClass('error');
            }
        });
        /**Entering Password of user**/
        $('#password-name').on('input paste', function () {
            var password = $(this).val();
            if (password != "") {
                $('#password-label').removeClass('error');
            } else {
                $('#password-label').addClass('error');
            }
        });
        /**Entering Password of user**/
        $('#confirm-name').on('input paste', function () {
            var confirm = $(this).val();
            if (confirm != "") {
                $('#confirm-label').removeClass('error');
            } else {
                $('#confirm-label').addClass('error');
            }
        });

        $('#password-name').keyup(function () {
            $('#strengthMessage').html(checkStrength($('#password-name').val()));
        });
        $('#confirm-name').keyup(function () {
            $('#confirmMessage').html(checkMatch($('#confirm-name').val()));
        });
        function checkMatch(password2) {
            var password1 = $('#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';
            }
        }
    });
</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>
<?php echo Form::open(['route'=>['user.create'], 'method'=>'POST', 'id'=>'add-user-account']); ?>

<div class="error" style="text-align: center;">On this Window, You can Add a New User Account in the System</div>
<div class="guestDetails_inputDivider"></div>
<button type="submit" disabled style="display: none" aria-hidden="true"></button>
<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('access', 'Select Access Level',['id'=>'access-label', 'class'=>'error']); ?>

        <span class="error">*</span>
    </div>
    <div class="guestDetails_input">
        <select name="access" id="access-list" style="width: 210px">
            <option value="">--Select User's Access Level--</option>
            
            <option value="1">System Admin</option>
            <option value="2">Chief Financial Officer(CFO)</option>
            <option value="3">Accounts</option>
            <option value="8">General User</option>
            <option value="14">Quoter(Quotations)</option>
            <option value="8">Prospecting</option>
            <option value="8">Reports</option>
            <option value="3">Stock Manager</option>
            <option value="1">IT Manager</option>
        </select>
    </div>
</div>
<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('branch', 'Select Branch',['id'=>'branch-label', 'class'=>'error']); ?>

        <span class="error">*</span>
    </div>
    <div class="guestDetails_input">
        <select name="branch" id="branch-list" style="width: 210px">
            <option value="">--Select Branch--</option>
            <?php $__currentLoopData = $branches; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $list): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <option value="<?php echo e($list->id); ?>"><?php echo strtoupper($list->name); ?></option>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
        </select>
    </div>
</div>
<div class="guestDetails_inputDividerNone"></div>
<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('f-name', 'Enter First Name',['id'=>'first-name-label','class'=>'error']); ?>

        <span class="error">*</span>
    </div>
    <div class="guestDetails_input">
        <?php echo Form::text('f-name', '', ['autocomplete'=>'off','id'=>'f-name', 'class'=>'input-text-height', 'size'=>'35', 'placeholder'=>'Enter User\'s First Name']); ?>

    </div>
</div>

<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('l-name', 'Enter Other Name(s)',['id'=>'other-name-label','class'=>'error']); ?>

        <span class="error">*</span>
    </div>
    <div class="guestDetails_input">
        <?php echo Form::text('l-name', '', ['autocomplete'=>'off','id'=>'l-name', 'class'=>'input-text-height', 'size'=>'35', 'placeholder'=>'Enter User\'s Other Name(s)']); ?>

    </div>
</div>
<div class="guestDetails_inputDividerNone"></div>
<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('user-name', 'Enter Username',['id'=>'username-label','class'=>'error']); ?>

        <span class="error">*</span>
    </div>
    <div class="guestDetails_input">
        <?php echo Form::text('username', '', ['autocomplete'=>'off','id'=>'username-name', 'class'=>'input-text-height', 'size'=>'35', 'placeholder'=>'Enter Username']); ?>

    </div>
</div>

<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('phone', 'Enter Phone Number',['id'=>'phone-label','class'=>'error']); ?>

        <span class="error">*</span>
    </div>
    <div class="guestDetails_input">
        <?php echo Form::text('phone', '', ['autocomplete'=>'off','id'=>'phone-name', 'class'=>'input-text-height', 'size'=>'35', 'placeholder'=>'Enter User\'s Phone Number']); ?>

    </div>
</div>
<div class="guestDetails_inputDividerNone"></div>
<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('password', 'Enter Password',['id'=>'password-label','class'=>'error']); ?>

        <span class="error">*</span>
        <span id="strengthMessage" style="margin-left: 15px"></span>
    </div>
    <div class="guestDetails_input">
        <?php echo Form::password('password', ['autocomplete'=>'off','id'=>'password-name', 'class'=>'input-text-height', 'size'=>'79', 'placeholder'=>'Enter User\'s Password']); ?>

    </div>
</div>
<div class="guestDetails_inputDividerNone"></div>
<div class="guestDetails_input">
    <div class="guestDetails_inputLabel">
        <?php echo Form::label('confirm', 'Confirm Password',['id'=>'confirm-label','class'=>'error']); ?>

        <span class="error">*</span>
        <span id="confirmMessage" style="margin-left: 15px"></span>
    </div>
    <div class="guestDetails_input">
        <?php echo Form::password('confirm', ['autocomplete'=>'off','id'=>'confirm-name', 'class'=>'input-text-height', 'size'=>'79', 'placeholder'=>'Confirm User\'s Password']); ?>

    </div>
</div>
<div class="guestDetails_inputDividerNone"></div>


<?php echo Form::close(); ?>




<?php /**PATH /home/zedarroot/public_html/edwulp/resources/views/adds/add-user-account.blade.php ENDPATH**/ ?>