From 44ac59c2e0cfc7c60b183d278d36c6138dacbda0 Mon Sep 17 00:00:00 2001
From: Thuan Bui <9248622+10h30@users.noreply.github.com>
Date: Sun, 11 May 2025 19:56:58 +0900
Subject: [PATCH] Complete Part 9

---
 resources/views/upload.blade.php | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/resources/views/upload.blade.php b/resources/views/upload.blade.php
index 3c1984a..99a5625 100644
--- a/resources/views/upload.blade.php
+++ b/resources/views/upload.blade.php
@@ -98,7 +98,6 @@
     <script src="https://unpkg.com/filepond-plugin-file-validate-type/dist/filepond-plugin-file-validate-type.min.js">
     </script>
     <script>
-        //FilePond.registerPlugin(FilePondPluginImagePreview);
         // Register plugins
         FilePond.registerPlugin(
             FilePondPluginImagePreview,
@@ -106,20 +105,35 @@
             FilePondPluginFileValidateType
         );
 
+        // Chọn input HTML có id là "files"
         const inputElement = document.querySelector('input[id="files"]');
+
+        // Khởi tạo FilePond trên input đó với các tùy chọn cấu hình
         FilePond.create(inputElement, {
+            // Cho phép chọn nhiều file cùng lúc
             allowMultiple: true,
+            // Số lượng tệp tối đa được phép tải lên là 5
             maxFiles: 5,
+            // Chỉ chấp nhận các loại tệp hình ảnh (ví dụ: .jpg, .png, .gif)
             acceptedFileTypes: ['image/*'],
+            // Kích thước tệp tối đa cho phép là 100KB
             maxFileSize: '100KB',
+            // Thông báo hiển thị khi tệp vượt quá kích thước tối đa
             labelMaxFileSizeExceeded: 'The file is too big',
+            // Gửi file lên server bằng phương pháp POST trực tiếp qua form.
             storeAsFile: true,
+            // Hàm được gọi khi có cảnh báo từ FilePond
             onwarning: (error, file, status) => {
+                // Ghi cảnh báo ra console của trình duyệt
                 console.warn('FilePond warning:', error, file, status);
+                // Hiển thị thông báo cảnh báo cho người dùng
                 alert('Warning: ' + error.main);
             },
+            // Hàm được gọi khi có lỗi nghiêm trọng từ FilePond
             onerror: (error, file, status) => {
+                // Ghi lỗi ra console của trình duyệt
                 console.error('FilePond error:', error, file, status);
+                // Hiển thị thông báo lỗi cho người dùng
                 alert('Error: ' + error.main);
             }
         });