GOOGLE

<?php 
if(isset($_GET['id'])){
    $qry = $conn->query("SELECT * FROM `file_list` where id = '{$_GET['id']}'");
    if($qry->num_rows > 0 ){
        foreach($qry->fetch_array() as $k => $v){
            if(!is_numeric($k))
            $$k = $v;
        }
    }else{
        echo "<script>alert('Unknown given ID')</script>";
    }
}
?>

<section class="py-5">
    <div class="container">
        <h2 class="fw-bolder text-center"><b><?= isset($id) ? "Update PDF File" : "Create New File" ?></b></h2>
        <hr>
        <div class="row justify-content-center">
            <div class="col-lg-8 col-md-10 col-sm-12 col-xs-12">
                <form action="" id="file-form">
                    <input type="hidden" name="id" value="<?= isset($id) ? $id : '' ?>">
                    <div class="input-group input-group-dynamic mb-3 <?= isset($name) ? 'is-filled' : '' ?>">
                        <label for="name" class="form-label">Name</label>
                        <input type="text" id="name" name="name" value="<?= isset($name) ? $name : '' ?>" autofocus class="form-control" required="required">
                    </div>
                    <div class="form-group mb-3">
                        <label for="content" class="form-label">File Content</label>
                        <textarea rows="10" id="content" name="content" class="form-control" required="required"><?= isset($file_path) && is_file('./'.$file_path) ? file_get_contents('./'.$file_path) : "" ?></textarea>
                    </div>
                    <div class="form-group">
                        <div class="form-check form-switch ps-0">
                            <input class="form-check-input ms-auto mt-1" type="checkbox" id="is_encrypted" name="is_encrypted" value="1" <?= isset($is_encrypted) && $is_encrypted == 1 ?'checked' : '' ?>>
                            <label class="form-check-label ms-2" for="is_encrypted">Encrypt File</label>
                        </div>
                    </div>
                    <div class="input-group input-group-dynamic mb-3  <?= isset($name) ? 'is-filled' : '' ?>">
                        <label for="password" class="form-label">Password</label>
                        <input type="password" id="password" name="password" value="<?= isset($password) ? $password : '' ?>" class="form-control" <?= !isset($password) || (isset($password) && $is_encrypted == 1) ? "readonly" : '' ?> <?= (isset($is_encrypted) && $is_encrypted == 1) ? "required" : '' ?>>
                        <button class="btn border-0 btn-default m-0 view_pass" type="button" id="button-addon2"><span class="material-icons ">visibility_off</span></button>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <button type="submit" class="btn bg-gradient-dark w-100">Save File</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>
<script>
    $(function(){
        $('#name').focusout()
        $('#name').focus()
        $('#is_encrypted').change(function(){
            if($(this).is(':checked') == true){
                $('#password').removeAttr('readonly')
                $('#password').attr('required',true)
                $('#password').focus()
            }else{
                $('#password').attr('readonly')
                $('#password').removeAttr('required')
            }
        })
        $('.view_pass').click(function(){
            var type = $('#password').attr('type')
            if(type=='password'){
                $('#password').attr('type','text').focus()
                $(this).html('<span class="material-icons ">visibility</span>')
            }else{
                $('#password').attr('type','password').focus()
                $(this).html('<span class="material-icons ">visibility_off</span>')
            }
        })
        $('#content').summernote({
            placeholder: 'Write your content here',
            tabsize: 2,
            height: '40vh',
            toolbar: [
                ['style', ['style']],
                ['font', ['bold', 'underline', 'clear']],
                ['color', ['color']],
                ['para', ['ul', 'ol', 'paragraph']],
                ['table', ['table']],
                ['insert', ['link', 'picture', 'video']],
                ['view', ['fullscreen', 'codeview', 'help']]
            ]
      });
        $('#file-form').submit(function(e){
            e.preventDefault()
            $('.pop-alert').remove()
            var _this = $(this)
            var el = $('<div>')
            el.addClass("pop-alert alert alert-danger text-light")
            el.hide()
            start_loader()
            $.ajax({
                url:'./action.php?action=save_file',
                method:'POST',
                data:$(this).serialize(),
                dataType:'json',
                error:err=>{
                    console.error(err)
                    el.text("An error occured while saving data")
                    _this.prepend(el)
                    el.show('slow')
                    $('html, body').scrollTop(_this.offset().top - '150')
                    end_loader()
                },
                success:function(resp){
                    if(resp.status == 'success'){
                        location.href= './?page=file_list';
                    }else if(!!resp.msg){
                        el.text(resp.msg)
                        _this.prepend(el)
                        el.show('slow')
                        $('html, body').scrollTop(_this.offset().top - '150')
                    }else{
                        el.text("An error occured while saving data")
                        _this.prepend(el)
                        el.show('slow')
                        $('html, body').scrollTop(_this.offset().top - '150')
                    }
                    end_loader()
                    console

                }
            })
        })
    })
</script>