diff options
Diffstat (limited to 'public/js/InputFile.js')
| -rw-r--r-- | public/js/InputFile.js | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/public/js/InputFile.js b/public/js/InputFile.js new file mode 100644 index 0000000..f5e450c --- /dev/null +++ b/public/js/InputFile.js | |||
| @@ -0,0 +1,51 @@ | |||
| 1 | // étendre une classe parente avec InputFile? | ||
| 2 | class InputFile{ | ||
| 3 | constructor(name){ | ||
| 4 | this.name = name; | ||
| 5 | this.parent = document.getElementById(name); | ||
| 6 | } | ||
| 7 | open(){ | ||
| 8 | this.parent.querySelector('#' + this.name + '_img').classList.add('hidden'); | ||
| 9 | this.parent.querySelector('#' + this.name + '_input').classList.remove('hidden'); | ||
| 10 | this.parent.querySelector('#' + this.name + '_open').classList.add('hidden'); | ||
| 11 | this.parent.querySelector('#' + this.name + '_submit').classList.remove('hidden'); | ||
| 12 | this.parent.querySelector('#' + this.name + '_cancel').classList.remove('hidden'); | ||
| 13 | } | ||
| 14 | close(){ | ||
| 15 | this.parent.querySelector('#' + this.name + '_img').classList.remove('hidden'); | ||
| 16 | this.parent.querySelector('#' + this.name + '_input').classList.add('hidden'); | ||
| 17 | this.parent.querySelector('#' + this.name + '_open').classList.remove('hidden'); | ||
| 18 | this.parent.querySelector('#' + this.name + '_submit').classList.add('hidden'); | ||
| 19 | this.parent.querySelector('#' + this.name + '_cancel').classList.add('hidden'); | ||
| 20 | } | ||
| 21 | submit(){ | ||
| 22 | const file = this.parent.querySelector('#' + this.name + '_input').files[0]; | ||
| 23 | if(!file){ | ||
| 24 | console.error("Erreur: aucun fichier sélectionné."); | ||
| 25 | return; | ||
| 26 | } | ||
| 27 | const form_data = new FormData(); | ||
| 28 | form_data.append('file', file); | ||
| 29 | |||
| 30 | fetch('index.php?head_foot_image=' + this.name, { | ||
| 31 | method: 'POST', // apparemment il faudrait utiliser PUT | ||
| 32 | body: form_data | ||
| 33 | }) | ||
| 34 | .then(response => response.json()) | ||
| 35 | .then(data => { | ||
| 36 | if(data.success){ | ||
| 37 | this.parent.querySelector('#' + this.name + '_img').src = data.location; | ||
| 38 | this.close(this.name); | ||
| 39 | } | ||
| 40 | else{ | ||
| 41 | console.error("Erreur: le serveur n'a pas enregistré l'image'."); | ||
| 42 | } | ||
| 43 | }) | ||
| 44 | .catch(error => { | ||
| 45 | console.error('Erreur:', error); | ||
| 46 | }); | ||
| 47 | } | ||
| 48 | cancel(){ | ||
| 49 | this.close(this.name); | ||
| 50 | } | ||
| 51 | } \ No newline at end of file | ||
