diff options
Diffstat (limited to 'public/js/Input.js')
| -rw-r--r-- | public/js/Input.js | 96 |
1 files changed, 96 insertions, 0 deletions
diff --git a/public/js/Input.js b/public/js/Input.js new file mode 100644 index 0000000..0b6912b --- /dev/null +++ b/public/js/Input.js | |||
| @@ -0,0 +1,96 @@ | |||
| 1 | class Input{ | ||
| 2 | constructor(name){ | ||
| 3 | this.name = name; | ||
| 4 | /*const name_array = name.split('_'); | ||
| 5 | this.node = name_array[0]; | ||
| 6 | this.what = name_array[1];*/ | ||
| 7 | this.parent = document.getElementById(name); | ||
| 8 | } | ||
| 9 | open(){ | ||
| 10 | this.parent.querySelector('#' + this.name + '_content').classList.add('hidden'); | ||
| 11 | this.parent.querySelector('#' + this.name + '_input').classList.remove('hidden'); | ||
| 12 | this.parent.querySelector('#' + this.name + '_open').classList.add('hidden'); | ||
| 13 | this.parent.querySelector('#' + this.name + '_submit').classList.remove('hidden'); | ||
| 14 | this.parent.querySelector('#' + this.name + '_cancel').classList.remove('hidden'); | ||
| 15 | } | ||
| 16 | close(){ | ||
| 17 | this.parent.querySelector('#' + this.name + '_content').classList.remove('hidden'); | ||
| 18 | this.parent.querySelector('#' + this.name + '_input').classList.add('hidden'); | ||
| 19 | this.parent.querySelector('#' + this.name + '_open').classList.remove('hidden'); | ||
| 20 | this.parent.querySelector('#' + this.name + '_submit').classList.add('hidden'); | ||
| 21 | this.parent.querySelector('#' + this.name + '_cancel').classList.add('hidden'); | ||
| 22 | } | ||
| 23 | cancel(){ | ||
| 24 | this.close(); | ||
| 25 | } | ||
| 26 | } | ||
| 27 | |||
| 28 | class InputFile extends Input{ | ||
| 29 | submit(){ | ||
| 30 | const file = this.parent.querySelector('#' + this.name + '_input').files[0]; | ||
| 31 | if(!file){ | ||
| 32 | console.error("Erreur: aucun fichier sélectionné."); | ||
| 33 | toastNotify("Erreur: aucun fichier sélectionné."); | ||
| 34 | return; | ||
| 35 | } | ||
| 36 | const form_data = new FormData(); | ||
| 37 | form_data.append('file', file); | ||
| 38 | |||
| 39 | fetch('index.php?head_foot_image=' + this.name, { | ||
| 40 | method: 'POST', // apparemment il faudrait utiliser PUT | ||
| 41 | body: form_data | ||
| 42 | }) | ||
| 43 | .then(response => response.json()) | ||
| 44 | .then(data => { | ||
| 45 | if(data.success){ | ||
| 46 | // cas particuliers | ||
| 47 | if(this.name === 'head_favicon'){ | ||
| 48 | const link = document.querySelector('link[rel="icon"]'); | ||
| 49 | link.type = data.mime_type; | ||
| 50 | link.href = data.location; | ||
| 51 | } | ||
| 52 | else if(this.name === 'header_background'){ | ||
| 53 | document.querySelector('header').style.backgroundImage = "url('" + data.location + "')"; | ||
| 54 | } | ||
| 55 | |||
| 56 | this.parent.querySelector('#' + this.name + '_content').src = data.location; | ||
| 57 | this.close(); | ||
| 58 | } | ||
| 59 | else{ | ||
| 60 | console.error("Erreur: le serveur n'a pas enregistré l'image'."); | ||
| 61 | } | ||
| 62 | }) | ||
| 63 | .catch(error => { | ||
| 64 | console.error('Erreur:', error); | ||
| 65 | }); | ||
| 66 | } | ||
| 67 | } | ||
| 68 | |||
| 69 | class InputText extends Input{ | ||
| 70 | submit(){ | ||
| 71 | const new_text = this.parent.querySelector('#' + this.name + '_input').value; | ||
| 72 | |||
| 73 | fetch('index.php?head_foot_text=' + this.name, { | ||
| 74 | method: 'POST', | ||
| 75 | headers: { 'Content-Type': 'application/json' }, | ||
| 76 | body: JSON.stringify({new_text: new_text}) | ||
| 77 | }) | ||
| 78 | .then(response => response.json()) | ||
| 79 | .then(data => { | ||
| 80 | if(data.success){ | ||
| 81 | this.parent.querySelector('#' + this.name + '_content').innerHTML = new_text; | ||
| 82 | this.close(); | ||
| 83 | } | ||
| 84 | else{ | ||
| 85 | console.error("Erreur: le serveur n'a pas enregistré le nouveau texte."); | ||
| 86 | } | ||
| 87 | }) | ||
| 88 | .catch(error => { | ||
| 89 | console.error('Erreur:', error); | ||
| 90 | }); | ||
| 91 | } | ||
| 92 | cancel(){ // surcharge | ||
| 93 | this.parent.querySelector('#' + this.name + '_input').value = this.parent.querySelector('#' + this.name + '_content').innerHTML; | ||
| 94 | this.close(); | ||
| 95 | } | ||
| 96 | } \ No newline at end of file | ||
