https://www.ville-lamorlaye.fr/wp-content/themes/noyau/assets/js/Files/inputFilesControl.js?ver=1.0

1/*
2* We listen for all the input[type="file"] and check for their weight
3* We append error and empty the input if the condition are not met.
4* */
5
6
7ready = (callback) => {
8    if (document.readyState !== 'loading') {
9        callback()
10    } else {
11        document.addEventListener('DOMContentLoaded', callback)
12    }
13}
14
15ready(() => {
16
17    let $filesInput = document.querySelectorAll('input[type="file"]:not(.large):not(.medium):not(.small)')
18    let $submitButton = document.querySelector('[type="submit"]')
19
20    let $acfGroupReports = document.querySelector('.acf-field[data-name="report_details_group"]')
21
22    $filesInput.forEach(function (input) {
23        !!input && (
24            input.addEventListener('input', function () {
25
26                let limitSize = 1000000 // 1Mo
27                let fileError = false
28                let files = this.files
29                let $parent = this.closest('.acf-field') ?? this.closest('.gfield')
30
31
32                // Native way with File API
33                for (let i = 0; i < files.length; i++) {
34                    let file = files[i];
35
36                    if (file.type === 'application/pdf') {
37                        limitSize = 5000000 // 5Mo
38                    }
39
40                    if($acfGroupReports) {
41                        limitSize = 10000000 // 10Mo
42                    }
43
44                    if (file.size > limitSize) {
45                        this.value = ''
46                        fileError = true
47                    }
48
49                    if (fileError === true) {
50                        input.classList.add('error')
51                        $submitButton.setAttribute('disabled', 'true')
52                        if ($parent) {
53                            let $errorMessage = '<div class="acf-error-file"><p>Le poids maximal autorisé n\'est pas respecté, veuillez sélectionner un autre fichier.</p></div>'
54                            $parent.insertAdjacentHTML('beforeend', $errorMessage)
55                        }
56                    } else {
57                        input.classList.remove('error')
58                        $submitButton.removeAttribute('disabled')
59                        let $errorMessage = $parent.querySelector('.acf-error-file:not(.acf-error-file-multiple)')
60                        if ($errorMessage) {
61                            $errorMessage.remove()
62                        }
63                    }
64
65                }
66
67                if (this.getAttribute("multiple") !== null && files.length > 5) {
68                    this.value = ''
69                    if ($parent) {
70                        let $errorMessage = '<div class="acf-error-file acf-error-file-multiple"><p>Veuillez sélectionner 5 images maximum.</p></div>'
71                        $parent.insertAdjacentHTML('beforeend', $errorMessage)
72                    }
73                } else if (this.getAttribute("multiple") !== null && files.length <= 5) {
74                    let $errorMessage = $parent.querySelector('.acf-error-file-multiple')
75                    if ($errorMessage) {
76                        $errorMessage.remove()
77                    }
78                }
79            })
80        )
81    })
82})