mirror of
				https://github.com/HendrikRauh/dmx-interface.git
				synced 2025-10-27 05:42:31 +00:00 
			
		
		
		
	implemented reset of config
This commit is contained in:
		
							parent
							
								
									2ee16f6452
								
							
						
					
					
						commit
						8a3bd49686
					
				
					 5 changed files with 47 additions and 4 deletions
				
			
		|  | @ -8,6 +8,7 @@ | |||
|         <script type="module" src="/input-visibility.js" defer></script> | ||||
|         <script type="module" src="/load-data.js" defer></script> | ||||
|         <script type="module" src="/submit.js" defer></script> | ||||
|         <script type="module" src="/reset.js" defer></script> | ||||
|     </head> | ||||
|     <body> | ||||
|         <main> | ||||
|  | @ -152,7 +153,10 @@ | |||
|                         /> | ||||
|                     </label> | ||||
|                 </fieldset> | ||||
|                 <button type="submit">Speichern</button> | ||||
|                 <div class="buttons"> | ||||
|                     <button type="reset">Zurücksetzen</button> | ||||
|                     <button type="submit">Speichern</button> | ||||
|                 </div> | ||||
|             </form> | ||||
|         </main> | ||||
|     </body> | ||||
|  |  | |||
|  | @ -18,7 +18,7 @@ async function loadData() { | |||
|     } | ||||
| } | ||||
| 
 | ||||
| function writeDataToInput(data) { | ||||
| export function writeDataToInput(data) { | ||||
|     console.log("write data", typeof data); | ||||
|     for (const [key, value] of Object.entries(data)) { | ||||
|         const element = document.querySelector(`[name=${key}]`); | ||||
|  |  | |||
							
								
								
									
										21
									
								
								data/reset.js
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										21
									
								
								data/reset.js
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,21 @@ | |||
| import { writeDataToInput } from "/load-data.js"; | ||||
| 
 | ||||
| const form = document.querySelector("form"); | ||||
| 
 | ||||
| form.addEventListener("reset", async (event) => { | ||||
|     event.preventDefault(); | ||||
| 
 | ||||
|     try { | ||||
|         const res = await fetch("/reset", { | ||||
|             method: "POST", | ||||
|         }); | ||||
|         if (!res.ok) { | ||||
|             throw new Error(`Response status: ${res.status}`); | ||||
|         } | ||||
| 
 | ||||
|         const json = await res.json(); | ||||
|         writeDataToInput(json); | ||||
|     } catch (error) { | ||||
|         console.error(error.message); | ||||
|     } | ||||
| }); | ||||
|  | @ -1,6 +1,7 @@ | |||
| :root { | ||||
|     --color-primary: #087e8b; | ||||
|     --color-on-primary: white; | ||||
|     --color-danger: #fa2b58; | ||||
| } | ||||
| 
 | ||||
| body { | ||||
|  | @ -59,14 +60,16 @@ select:focus { | |||
| } | ||||
| 
 | ||||
| button { | ||||
|     display: block; | ||||
|     border: none; | ||||
|     inset: none; | ||||
|     border-radius: 8px; | ||||
|     background-color: var(--color-primary); | ||||
|     color: var(--color-on-primary); | ||||
|     padding: 8px 16px; | ||||
|     margin: 0 auto; | ||||
| } | ||||
| 
 | ||||
| button[type="reset"] { | ||||
|     background-color: var(--color-danger); | ||||
| } | ||||
| 
 | ||||
| :is(div:has(:is(input, select)), input, select, label) | ||||
|  | @ -126,3 +129,10 @@ label.switch input:checked + .slider::before { | |||
|     left: 100%; | ||||
|     translate: -100% -50%; | ||||
| } | ||||
| 
 | ||||
| .buttons { | ||||
|     display: flex; | ||||
|     flex-direction: row; | ||||
|     justify-content: center; | ||||
|     gap: 8px; | ||||
| } | ||||
|  |  | |||
|  | @ -84,6 +84,14 @@ void setup() | |||
|     server.on("/config", HTTP_GET, [](AsyncWebServerRequest *request) | ||||
|               { onGetConfig(config, request); }); | ||||
| 
 | ||||
|     server.on("/reset", HTTP_POST, [](AsyncWebServerRequest *request) | ||||
|               { | ||||
|                 config.begin("dmx", false); | ||||
|                 config.clear(); | ||||
|                 config.end(); | ||||
|                 // respond with default config
 | ||||
|                 onGetConfig(config, request); }); | ||||
| 
 | ||||
|     server.onRequestBody([](AsyncWebServerRequest *request, uint8_t *data, size_t len, size_t index, size_t total) | ||||
|                          { | ||||
|                             if (request->url() == "/config" && request->method() == HTTP_PUT) { | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue
	
	 RaffaelW
						RaffaelW