imgtask/index.php at master · GrytsenkoAndrey/imgtask · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<?php
/**
 * Created by PhpStorm.
 * User: APG
 * Date: 19.05.2020
 * Time: 18:47
 */
require_once 'constant.php';
require_once 'CutImage.php';

?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Player</title>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery-ui.js"></script>
    <link rel="stylesheet" href="style/style.css">
</head>
<body>

<div id="input">
<input type="file" name="file" id="file" accept="<?= implode(',', FILE_TYPES) ?>">
</div>

<div id="imgBox"></div>


<script>
    $('#file').on('change', function(){

        if ($('img') != 'undefined') {
            $('img').remove();
        }

        file = this.files[0];
        // ничего не делаем если files пустой
        if (typeof file == 'undefined') {
            return;
        }


         var data = new FormData();
         data.append('uploadSubmit', 1);
         data.append('file', file);

        // загружаем изображение
         $.ajax({
             type: "POST",
             url: "upload.php",
             data: data,
             processData: false,
             contentType: false,
             success: function (data) {
                 $('#imgBox').html(data);

                 $.ajax({
                     type:'POST',
                     url:'chimg.php',
                     data:{'src': $('img').attr('src')},
                     success: function (data) {
                         $('img').remove();
                         $('#imgBox').html(data);
                         $('#info').css('display', 'none');
                     }
                 });
             }
         });
    });


</script>

</body>
</html>