mirror of
				https://github.com/Theodor-Springmann-Stiftung/hamann-ausgabe-core.git
				synced 2025-10-30 17:55:32 +00:00 
			
		
		
		
	Did a lot of styling on letter & register view; introduced a new accent color. Added scroll and submit vutton, TODO style submit button
This commit is contained in:
		| @@ -37,7 +37,11 @@ | ||||
|             </div> | ||||
|         } | ||||
|         </div> | ||||
|         <output id ="ha-filelistoutput"></output><input class="btn ha-filelistbutton" type="submit" value="Laden" /> | ||||
|         <output id ="ha-filelistoutput"></output> | ||||
|         <button type="submit" class="ha-filelistbutton" id="ha-filelistbutton" > | ||||
|             Laden | ||||
|             <div class="ha-lds-ellipsis-load" id="ha-lds-ellipsis-load"><div></div><div></div><div></div><div></div></div> | ||||
|         </button> | ||||
|         </form> | ||||
|     } | ||||
|     else { | ||||
| @@ -48,6 +52,8 @@ | ||||
| <script> | ||||
|     const USESubmit = async function (oFormElement, file = null) { | ||||
|       let fd = new FormData(oFormElement); | ||||
|       document.getElementById("ha-filelistbutton").style.pointerEvents = "none"; | ||||
|       document.getElementById("ha-lds-ellipsis-load").style.display = "inline-block"; | ||||
|       await fetch(oFormElement.action, { | ||||
|           method: 'POST', | ||||
|           headers: { | ||||
| @@ -58,16 +64,20 @@ | ||||
|         .then(response => response.json()) | ||||
|         .then(json => { | ||||
|           if ("Error" in json) { | ||||
|               document.getElementById("ha-filelistbutton").style.pointerEvents = "auto"; | ||||
|               document.getElementById("ha-lds-ellipsis-load").style.display = "none"; | ||||
|             document.getElementById("ha-filelistoutput").textContent = json.Error; | ||||
|           }  | ||||
|           else { | ||||
|               document.getElementById("ha-filelistbutton").style.pointerEvents = "auto"; | ||||
|               document.getElementById("ha-lds-ellipsis-load").style.display = "none"; | ||||
|             location.reload();  | ||||
|           } | ||||
|         }) | ||||
|         .catch ((e) => {  | ||||
|         .catch ((e) => { | ||||
|             document.getElementById("ha-filelistbutton").style.pointerEvents = "auto"; | ||||
|             document.getElementById("ha-lds-ellipsis-load").style.display = "none"; | ||||
|             document.getElementById("ha-filelistoutput").textContent = e; | ||||
|         }) | ||||
|     } | ||||
| 
 | ||||
|      | ||||
| </script> | ||||
| @@ -1,5 +1,5 @@ | ||||
| <!DOCTYPE html> | ||||
| <html lang="de"> | ||||
| <html lang="de" id="top"> | ||||
|  | ||||
| <head> | ||||
|     <meta charset="utf-8" /> | ||||
| @@ -42,10 +42,17 @@ | ||||
|         @await Html.PartialAsync("/Views/Shared/_Footer.cshtml") | ||||
|         </div> | ||||
|     </div> | ||||
|  | ||||
|     <environment exclude="Development"> | ||||
|         @await Html.PartialAsync("/Views/Shared/_Javascript.cshtml") | ||||
|     </environment> | ||||
|  | ||||
|     <a class="ha-scrollbutton" id="ha-scrollbutton"> | ||||
|         <svg class="ha-scrollbuttonarrow" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> | ||||
|             <path strokeLinecap="round" strokeLinejoin="round" stroke-width="2" d="M5 11l7-7 7 7M5 19l7-7 7 7" /> | ||||
|         </svg> | ||||
|     </div> | ||||
|  | ||||
|     @RenderSection("Scripts", required: false) | ||||
| </body> | ||||
|  | ||||
|   | ||||
| @@ -20,9 +20,9 @@ | ||||
|                         </div> | ||||
|                     </div> | ||||
|                 } | ||||
|                 else if (Model.ParsedZHString == null && Model.ShowZHData) { | ||||
|                 else if (Model.ParsedZHString == null) { | ||||
|                     <div class="ha-tooltip"> | ||||
|                         <div class="ha-pill"> | ||||
|                         <div class="ha-pill ha-newpill"> | ||||
|                             <span>Neu</span> | ||||
|                         </div> | ||||
|                     </div> | ||||
|   | ||||
| @@ -24,10 +24,9 @@ | ||||
|         <form class="ha-publishform" id="ha-publishform" asp-controller="API" asp-action="LocalPublish" method="post" enctype="multipart/form-data"> | ||||
|           <label class="ha-publishfilelabel" id="ha-publishfilelabel"> | ||||
|             <div class="ha-publishtext">Dateien Veröffentlichen</div> | ||||
|             <div class="ha-lds-ellipsis" id="ha-lds-ellipsis-publish"><div></div><div></div><div></div><div></div></div> | ||||
|             <div class="ha-lds-ellipsis-publish" id="ha-lds-ellipsis-publish"><div></div><div></div><div></div><div></div></div> | ||||
|           </label> | ||||
|           <div class="ha-publishmessage" id="ha-publishmessage"> | ||||
|             @* Fehler!<br/> *@ | ||||
|             <output form="uploadForm" name="publish-result" id="publish-result"></output> | ||||
|           </div> | ||||
|       </form> | ||||
|   | ||||
							
								
								
									
										91
									
								
								HaWeb/Views/Shared/_UploadForm.cshtml
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										91
									
								
								HaWeb/Views/Shared/_UploadForm.cshtml
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,91 @@ | ||||
| @model UploadViewModel; | ||||
|  | ||||
| <form class="ha-uploadform" id="uploadForm" asp-controller="API" asp-action="Upload" method="post" enctype="multipart/form-data"> | ||||
|     <label class="ha-uploadfilelabel" id="dropzone"> | ||||
|         <input class="hidden" id="file" type="file" accept=".xml" name="file" /> | ||||
|         <div class="ha-uploadtext">Upload</div> | ||||
|         <div class="ha-lds-ellipsis" id="ha-lds-ellipsis-upload"><div></div><div></div><div></div><div></div></div> | ||||
|     </label> | ||||
|     <div class="ha-uploadmessage" id="ha-uploadmessage"> | ||||
|         Fehler!<br/> | ||||
|         <output form="uploadForm" name="upload-result"></output> | ||||
|     </div> | ||||
| </form> | ||||
|  | ||||
| <script> | ||||
|     const dropHandler = function (formelement, ev, dropzone) { | ||||
|       ev.preventDefault(); | ||||
|       if (ev.dataTransfer.items) { | ||||
|         if (ev.dataTransfer.items[0].kind === 'file') { | ||||
|           var file = ev.dataTransfer.items[0].getAsFile(); | ||||
|           UPLOADSubmit(formelement, file); | ||||
|         } else { | ||||
|           var file = ev.dataTransfer.files[0]; | ||||
|           UPLOADSubmit(formelement, file); | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     const dragOverHandler = function (ev, dropzone) { | ||||
|       ev.preventDefault(); | ||||
|     } | ||||
|  | ||||
|     const dragLeaveHander = function (ev, dropzone) { | ||||
|       ev.preventDefault(); | ||||
|     } | ||||
|  | ||||
|     const dragEnterHandler = function (ev, dropzone) { | ||||
|       ev.preventDefault(); | ||||
|     } | ||||
|  | ||||
|     const UPLOADSubmit = async function (oFormElement, file = null) { | ||||
|       var fd = new FormData(); | ||||
|       if (file !== null) fd.append("file", file); | ||||
|       else fd = new FormData(oFormElement); | ||||
|       document.getElementById("dropzone").style.pointerEvents = "none"; | ||||
|       document.getElementById("ha-lds-ellipsis-upload").style.display = "inline-block"; | ||||
|       document.getElementById("ha-uploadmessage").style.opacity = "0"; | ||||
|       await fetch(oFormElement.action, { | ||||
|           method: 'POST', | ||||
|           headers: { | ||||
|             'RequestVerificationToken': getCookie('RequestVerificationToken') | ||||
|           }, | ||||
|           body: fd | ||||
|         }) | ||||
|         .then(response => response.json()) | ||||
|         .then(json => { | ||||
|           if ("Error" in json) { | ||||
|             document.getElementById("dropzone").style.pointerEvents = "auto"; | ||||
|             document.getElementById("ha-lds-ellipsis-upload").style.display = "none"; | ||||
|             document.getElementById("ha-uploadmessage").style.opacity = "1"; | ||||
|             oFormElement.elements.namedItem("upload-result").value = json.Error; | ||||
|           } else { | ||||
|             document.getElementById("dropzone").style.pointerEvents = "auto"; | ||||
|             document.getElementById("ha-lds-ellipsis-upload").style.display = "none"; | ||||
|             oFormElement.elements.namedItem("upload-result").value = "Erfolg!"; | ||||
|             if ("Prefix" in json[0]) { | ||||
|               document.getElementById("dropzone").style.pointerEvents = "auto"; | ||||
|               document.getElementById("ha-lds-ellipsis-upload").style.display = "none"; | ||||
|               window.location.replace("/Admin/Upload/" + json[0].Prefix); | ||||
|             } | ||||
|           } | ||||
|         }) | ||||
|         .catch ((e) => {  | ||||
|           document.getElementById("dropzone").style.pointerEvents = "auto"; | ||||
|           document.getElementById("ha-lds-ellipsis-upload").style.display = "none"; | ||||
|           document.getElementById("ha-uploadmessage").style.opacity = "1"; | ||||
|           oFormElement.elements.namedItem("upload-result").value = "Keine Antwort. Bitte Seite neu laden!"; | ||||
|         }) | ||||
|     } | ||||
|  | ||||
|     window.addEventListener("load", () => { | ||||
|         var submitelement = document.getElementById("file"); | ||||
|         var formelement = document.getElementById("uploadForm"); | ||||
|         var dropzone = document.getElementById("dropzone"); | ||||
|         submitelement.addEventListener("change", () => UPLOADSubmit(formelement)); | ||||
|         dropzone.addEventListener("drop", (ev) => dropHandler(formelement, ev, dropzone)); | ||||
|         dropzone.addEventListener("dragover", (ev) => dragOverHandler(ev, dropzone)); | ||||
|         dropzone.addEventListener("dragleave", (ev) => dragLeaveHander(ev, dropzone)); | ||||
|         dropzone.addEventListener("dragenter", (ev) => dragEnterHandler(ev, dropzone)); | ||||
|     }); | ||||
| </script> | ||||
		Reference in New Issue
	
	Block a user
	 schnulller
					schnulller