<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Profile</title>

    <!-- Bootstrap core CSS -->
    <link href="../vendor//bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.14.0/css/all.min.css" />
    <link href="https://fonts.googleapis.com/css2?family=Kufam:wght@400;500;600;700;800;900&display=swap"
        rel="stylesheet">
    <link rel="stylesheet" href="../public//css/dropzone.css">
    <link rel="stylesheet" href="../public//css/jquery.tag.css">
    <link rel="stylesheet" href="../public//css/jquery.tagsinput-revisited.css">
    <!-- Custom styles for this template -->
    <link href="../public//css/main.css" rel="stylesheet">

</head>

<body>

    <div class="d-flex" id="wrapper">



        <!-- Page Content -->
        <div id="page-content-wrapper">

           <?php

           include ('../navbar_update.php');

           ?>

            <div class="container mt-5">
              <div class="row">
                  <div class="col-xl-4 offset-xl-4">
                      <?php
                      $query = "SELECT * FROM Admin";
                      $result = queryRunner($query);
                      $row = rowRetrieverArray($result);
                      $ciphering = "AES-128-CTR";
                      $options = 0;
                      $iv_length = openssl_cipher_iv_length($ciphering);
//                      $encryption_key = "Admin";
//                      $encryption_text = '1234567891011121';

                      $decryption=openssl_decrypt ($row['password'], $ciphering,
                          $row['encryption_key'], $options, $row['encryption_text']);

                      ?>
                      <div class="card profile_update_card">
                          <div class="card-body">
                              <form role="form" method="post" action="update-action.php" enctype="multipart/form-data">
                            <div class="form-group">
                              <label for="">Email</label>
                              <input type="text" name="email" id="" class="form-control" value="<?=$row['email'];?>" placeholder="Enter Email" aria-describedby="helpId">
                            </div>
                           <div class="form-group">
                             <label for="password_id">Password</label>
                             <input type="password" name="password_id" id="password_id" value="<?=$decryption;?>" class="form-control " placeholder="Enter Password" aria-describedby="helpId">
                          
                           </div>
                           <div class="button_update">
                            <button type="submit" name="update" id="submit" class="btn btn-lg btn-block">submit</button>
                           </div>
                              </form>
                          
                          </div>
                      </div>
                  </div>
              </div>

              
               
                <!-- /#wrapper -->
            </div>
        </div>

        <!-- Bootstrap core JavaScript -->
        <script src="../vendor//jquery/jquery.min.js"></script>
        <script src="../vendor//bootstrap/js/bootstrap.bundle.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
        <script src="//cdn.ckeditor.com/4.14.1/standard/ckeditor.js"></script>
        <script src="../public//js/jquery.tag.js"></script>
        <script src="../public//js/jquery.tagsinput-revisited.js"></script>
        <script src="../public//js/dropzone.js"></script>

        <!-- Menu Toggle Script -->
        <script>
            $("#menu-toggle").click(function (e) {
                e.preventDefault();
                $("#wrapper").toggleClass("toggled");
            });

            var options = {
                series: [{
                    name: 'Net Profit',
                    data: [44, 55, 57, 56, 61, 58, 63, 60, 66]
                }, {
                    name: 'Revenue',
                    data: [76, 85, 101, 98, 87, 105, 91, 114, 94]
                }, ],
                chart: {
                    type: 'bar',
                    height: 350
                },
                plotOptions: {
                    bar: {
                        horizontal: false,
                        columnWidth: '55%',
                        endingShape: 'rounded'
                    },
                },
                dataLabels: {
                    enabled: false
                },
                stroke: {
                    show: true,
                    width: 2,
                    colors: ['transparent']
                },
                xaxis: {
                    categories: ['Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct'],
                },
                yaxis: {
                    title: {
                        // text: '$ (thousands)'
                    }
                },
                fill: {
                    opacity: 1
                },
                tooltip: {
                    y: {
                        formatter: function (val) {
                            return "$ " + val + " thousands"
                        }
                    }
                }
            };

            var chart = new ApexCharts(document.querySelector("#profit_chart"), options);
            chart.render();

            $('#example').tagsInput({
                limit: 7,

            });
            // multiple certificate picture
            Dropzone.autoDiscover = false;

            function setup(id) {
                let options = {
                    thumbnailHeight: 210,
                    thumbnailWidth: 140,
                    maxFilesize: 50 / 1024,
                    maxFiles: 5,
                    dictResponseError: "Server not Configured",
                    dictFileTooBig: "File too big ({{filesize}}MB). Must be less than {{maxFilesize}}MB.",
                    dictCancelUpload: "",
                    acceptedFiles: ".png,.jpg,.jpeg,.webp",
                    init: function () {
                        var self = this;
                        //New file added
                        self.on("addedfile", function (file) {
                            console.log("new file added ", file);
                        });
                        // Send file starts
                        self.on("sending", function (file) {
                            console.log("upload started", file);
                        });

                        self.on("complete", function (file, response) {
                            if (file.name !== "442343.jpg") {
                                //this.removeFile(file);
                            }
                        });

                        self.on("maxfilesreached", function (file, response) {
                            //alert("too big");
                        });

                        self.on("maxfilesexceeded", function (file, response) {
                            this.removeFile(file);
                        });

                        self.on("addedfile", function (file) {
                            const pattern = /\d{6}(\.)(jpg|jpeg|png|webp)/;

                            if (!pattern.test(file.name)) {
                                //   this.removeFile(file);
                            }
                        });
                    },
                    accept: function (file, done) {
                        const pattern = /\d{6}(\.)/;

                        if (pattern.test(file.name)) {
                            done();
                        } else {
                            done("File name not a valid admission number");
                            return false;
                        }
                    },


                    previewTemplate: `
<div class="dz-preview dz-file-preview">

<div class="dz-image"><img data-dz-thumbnail /></div>
<div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress></span></div>

<div class="dz-error-message"><span data-dz-errormessage></span></div>
<div class="dz-error-message"><i class="fa fa-warning">&nbsp;</i><span data-dz-errormessage></span></div>
<div class="dz-filename"><span data-dz-name></span></div>
<div class="dz-progress">
<span class="dz-upload" data-dz-uploadprogress></span>
</div>
<div class="dz-remove">
<div>
<a href="javascript:undefined;" data-dz-remove=""style="color:red;" >Delete</a>
</div>
</div>
</div>
`
                };

                var myDropzone = new Dropzone(`#${id}`, options);
            }

            setup("demo-upload");
        </script>

</body>

</html>