Styled uploadUI
- Updated privacy disclaimer - Updated libs used
This commit is contained in:
parent
a0a096b9e7
commit
fea0db7b9f
@ -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>
|
||||
|
@ -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>
|
||||
|
@ -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>
|
||||
|
@ -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);*/
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -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;
|
||||
|
Loading…
x
Reference in New Issue
Block a user