Styled uploadUI

- Updated privacy disclaimer
- Updated libs used
This commit is contained in:
Max W. 2024-02-15 20:42:27 +01:00
parent a0a096b9e7
commit fea0db7b9f
5 changed files with 28 additions and 25 deletions

View File

@ -1,10 +1,21 @@
<p>credits works!</p>
<h2>
<h2 class="text-2xl font-semibold text-gray-800 mb-4">
Used media
</h2>
<ul>
<ul class="list-disc pl-5 space-y-2">
<li>
<p>App Icon by flaticon.com</p>
<a href="https://www.flaticon.com/de/autoren/najmunnahar">NajmunNahar</a>
<p class="font-medium text-gray-700">Icons used:</p>
<a href="https://fontawesome.com/" class="text-blue-500 hover:text-blue-600 transition duration-300 ease-in-out">Fontawesome</a>
</li>
<li>
<p class="font-medium text-gray-700">HTML, CSS, JS Libraries used:</p>
<a href="https://tailwindcss.com/" class="text-blue-500 hover:text-blue-600 transition duration-300 ease-in-out">TailwindCSS</a>,
<a href="https://axios-http.com/" class="text-blue-500 hover:text-blue-600 transition duration-300 ease-in-out">AXIOS http</a>,
<a href="https://www.npmjs.com/package/tailwindcss-animate" class="text-blue-500 hover:text-blue-600 transition duration-300 ease-in-out">TailwindCSS Animations</a>
</li>
<li>
<p class="font-medium text-gray-700">App Icon by flaticon.com</p>
<a href="https://www.flaticon.com/de/autoren/najmunnahar" class="text-blue-500 hover:text-blue-600 transition duration-300 ease-in-out">NajmunNahar</a>
</li>
</ul>

View File

@ -23,7 +23,13 @@
<div class="bg-white shadow-lg rounded-lg p-6 mt-10 animate-in fade-in slide-in-from-bottom duration-500">
<h2 class="text-2xl font-bold text-gray-700 mb-4 text-center">Data Privacy/Security</h2>
<p class="text-gray-600 text-center mb-4">We prioritize data security and privacy consequently.
Any files uploaded by our clients are securely stored on our servers for a maximum duration of one day,
after which they are permanently and irretrievably wiped to ensure the utmost confidentiality and data protection.</p>
Files uploaded by our clients are securely stored on our servers for a maximum duration of one day,
after which they are permanently deleted to guarantee the highest level of confidentiality and data protection.</p>
</div>
</div>
<!-- Invisible SVGs to prevent lazy loading -->
<div class="invisible h-0 w-0">
<img src="./assets/cloud-arrow-up-solid.svg">
<img src="./assets/cloud-arrow-down-solid.svg">
</div>

View File

@ -1,7 +1,7 @@
<div class="container mx-auto p-4 mt-4">
<h1 class="text-4xl font-bold text-center text-gray-800 mb-10">Upload Your File</h1>
<div class="bg-white shadow-lg rounded-lg p-6">
<div *ngIf="!uploadStarted" class="flex flex-col items-center justify-center">
<div *ngIf="!uploadStarted" class="flex flex-col items-center justify-center lg:p-5">
<!-- File Drop Area -->
<div
*ngIf="!fileToUpload && !uploadStarted"
@ -44,6 +44,7 @@
</div>
<!-- Upload Button -->
<button class="btn btn-primary w-full max-w-xs" (click)="startUpload()">Upload File</button>
<p class="text-gray-600 text-center mt-6">Drag and drop files, or click to select the files you want to share.</p>
</div>
<!-- Upload Progress -->
<div *ngIf="uploadStarted && fileToUpload && !uploadFinished" class="flex flex-col items-center justify-center animate-in fade-in duration-500">
@ -57,10 +58,9 @@
<button class="btn btn-primary w-full max-w-xs">Upload Another File</button>
</div>
</div>
<p class="text-gray-600 text-center mt-6">Drag and drop files, or click to select the files you want to share.</p>
</div>
<!-- Invisible SVGs to prevent lazy loading -->
<div class="invisible">
<div class="invisible h-0 w-0">
<img src="./assets/file-solid.svg">
<img src="./assets/circle-check-solid.svg">
</div>

View File

@ -31,9 +31,7 @@ export class UploadComponent {
uploadStarted: boolean = false;
uploadProgress = 0; // Real progress
targetUploadProgress = 0; // New target progress to reach
uploadFinished = false;
uploadSpeedBps: number = 0;
@ -103,18 +101,6 @@ export class UploadComponent {
.catch(error => {
console.error('Upload failed:', error.response ? error.response.data : error.message);
});
/*// Old simulation of upload progress
const interval = setInterval(() => {
if (this.uploadProgress < 100) {
this.uploadProgress++;
} else {
clearInterval(interval); // Stop the interval when progress reaches 100%
this.uploadFinished = true;
}
}, 10);*/
}
}

View File

@ -22,7 +22,7 @@ public class SpeedTest extends ApiRestController {
*/
@GetMapping("/speed-test")
public void speedTest(HttpServletResponse response) {
byte[] dummyData = new byte[1024 * 1024];
byte[] dummyData = new byte[1024 * 1024 / 2];
response.setContentType("application/octet-stream");
response.setContentLength(dummyData.length);
response.setStatus(HttpServletResponse.SC_OK);
@ -37,7 +37,7 @@ public class SpeedTest extends ApiRestController {
@PostMapping("/upload-speed-test")
public void uploadSpeedTest(HttpServletRequest request, HttpServletResponse response) {
final int maxBytes = 1024 * 1024; // Limit to 1MB
final int maxBytes = 1024 * 1024 / 2; // Limit to 0.5MB
byte[] buffer = new byte[1024]; // Buffer to read data
int bytesRead;
int totalBytesRead = 0;