| <?php |
| if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_FILES['file_image'])) { |
| require 'config/app.php'; |
| require 'config/upload.php'; |
|
|
| $options = array( |
| 'upload_path' => './uploads/images/', |
| 'thumb_path' => './uploads/thumb/', |
| 'extension' => array('jpeg', 'jpg', 'png', 'gif', 'webp'), |
| 'mime_type' => array('image/jpeg', 'image/jpg', 'image/png', 'image/gif', 'image/webp'), |
| ); |
|
|
| $upload = new hcgImageUploads($options); |
| $upload->do_upload('file_image'); |
| $data = $upload->get_result(); |
| } |
| ?> |
| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> |
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"> |
| <title>PHP Image upload</title> |
| </head> |
| <body> |
|
|
|
|
| <div class="container-fluid p-5"> |
| |
| <ul class="nav nav-pills"> |
| <li class="nav-item"> |
| <a class="nav-link" href="jquery-image-upload.php">JQuery Image upload</a> |
| </li> |
| <li class="nav-item"> |
| <a class="nav-link" href="jquery-multiple-image-upload.php">JQuery multiple Images upload</a> |
| </li> |
| <li class="nav-item"> |
| <a class="nav-link active" href="index.php">Image upload</a> |
| </li> |
| </ul> |
| |
| <br> |
| |
| <div class="text-center"><h1>HTML form Image upload</h1></div> |
| <hr> |
| |
| <div class="col-lg-5 mx-auto text-left"> |
| |
| <form action="" method="post" enctype="multipart/form-data"> |
| |
| <div class="form-group"> |
| <label for="file_image">Select image </label> |
| <input type="file" class="form-control-file" name="file_image"> |
| </div> |
| |
| <div class="form-group"> |
| <label for="img-title">Title (optional)</label> |
| <input type="text" class="form-control" name="title" id="img-title"> |
| </div> |
| |
| <button type="submit" class="btn btn-primary">upload</button> |
| </form> |
| <br> |
| </div> |
| |
| <?php |
| if (isset($data)) { |
| if ($data['status'] == 'success') { |
| echo '<div class="alert alert-success" role="alert">image upload successful</div> |
| |
| <div class="text-center"><img class="img-thumbnail" src="' . ($data['image_data']['thumb'] == "" ? $data['image_data']['url'] : $data['image_data']['thumb']) . '" alt="demo image"></div> |
| |
| <div class="card-body text-left"> |
| <pre>Name : ' . $data['image_data']['name'] . '</pre> |
| <pre>Type : ' . $data['image_data']['type'] . '</pre> |
| <pre>Size : ' . $data['image_data']['size_format'] . '</pre> |
| <pre>Size byte : ' . $data['image_data']['size'] . '</pre> |
| <pre>Width : ' . $data['image_data']['width'] . 'px</pre> |
| <pre>Height : ' . $data['image_data']['height'] . 'px</pre> |
| <pre>thumb : ' . $data['image_data']['thumb'] . '</pre> |
| <pre>Link : ' . $data['image_data']['url'] . '</pre> |
| </div> '; |
| } else { |
| echo '<div class="alert alert-danger m-5" role="alert"> |
| ' . $data['msg'] . ' |
| </div>'; |
| } |
| } |
| ?> |
|
|
|
|
|
|
| </div> |
|
|
| <script> |
| if ( window.history.replaceState ) { |
| window.history.replaceState( null, null, window.location.href ); |
| } |
| </script> |
| </body> |
| </html> |
