Kiosk Navigation Helper - Chrome Extension

📖 Mô tả

Extension Chrome hỗ trợ điều hướng cho hệ thống Kiosk Tiện ích của Trung tâm y tế khu vực Đức Trọng. Extension sẽ hiển thị thanh điều hướng khi người dùng truy cập các trang dịch vụ công và VNeID để dễ dàng quay về Kiosk.

✨ Tính năng chính

🎯 Thanh điều hướng tự động

• Hiển thị thanh điều hướng trên trang dichvucong.gov.vn
• Hiển thị thanh điều hướng trên trang vneid.gov.vn
• Giao diện đẹp mắt, thân thiện với người dùng

🔧 Các nút chức năng

• 🏠 Quay về Kiosk: Chuyển về tab Kiosk (không đóng tab hiện tại)
• ✖ Đóng & Quay về: Đóng tab hiện tại và quay về Kiosk
• − Thu gọn: Thu gọn thanh điều hướng
• Mở rộng: Mở rộng thanh điều hướng đã thu gọn

📱 Popup quản lý

• Cài đặt URL Kiosk
• Bật/tắt extension
• Mở Kiosk nhanh
• Đóng các tab khác
• Xem trạng thái extension

🚀 Cài đặt Extension

Bước 1: Chuẩn bị files

1. Đảm bảo bạn có thư mục chrome-extension với các files:

   chrome-extension/
   ├── manifest.json
   ├── background.js
   ├── content.js
   ├── navigation.css
   ├── popup.html
   ├── popup.js
   └── icons/
       ├── icon16.png (cần tạo từ SVG)
       ├── icon32.png (cần tạo từ SVG)
       ├── icon48.png (cần tạo từ SVG)
       └── icon128.png (cần tạo từ SVG)
   

Bước 2: Tạo icons PNG

Do Chrome Extension cần file PNG, bạn cần chuyển đổi file SVG thành PNG:

Cách 1: Sử dụng online converter

1. Truy cập https://convertio.co/svg-png/
2. Upload các file SVG trong thư mục icons
3. Chuyển đổi thành PNG với các kích thước:
   • icon16.png (16x16)
   • icon32.png (32x32)
   • icon48.png (48x48)
   • icon128.png (128x128)

Cách 2: Sử dụng GIMP/Photoshop

1. Mở file SVG
2. Resize theo kích thước cần thiết
3. Export thành PNG

Bước 3: Cài đặt Extension vào Chrome

1. Mở Chrome Extensions

   • Gõ chrome://extensions/ vào address bar
   • Hoặc Menu → More tools → Extensions

2. Bật Developer mode

   • Bật toggle "Developer mode" ở góc trên phải

3. Load Extension

   • Click "Load unpacked"
   • Chọn thư mục chrome-extension
   • Click "Select Folder"

4. Kiểm tra Extension

   • Extension sẽ xuất hiện trong danh sách
   • Icon sẽ hiển thị trên thanh toolbar

⚙️ Cấu hình Extension

Cài đặt URL Kiosk

1. Click vào icon Extension trên toolbar

2. Trong popup, cập nhật "URL Kiosk" nếu cần:

   http://localhost/kiosk/index.html
   

   hoặc URL thực tế của server

3. Click vào ô khác để lưu

Bật/tắt Extension

• Sử dụng checkbox "Bật Extension" trong popup
• Hoặc disable extension trong chrome://extensions/

🎮 Cách sử dụng

Khi truy cập trang dịch vụ công hoặc VNeID:

1. Thanh điều hướng tự động xuất hiện ở đầu trang

2. Các nút có sẵn:

   • 🏠 Quay về Kiosk: Mở/focus tab Kiosk
   • ✖ Đóng & Quay về: Đóng tab này và về Kiosk
   • − Thu gọn: Ẩn thanh điều hướng

3. Thông báo hiển thị khi thực hiện hành động

Sử dụng Popup:

1. Click icon extension trên toolbar
2. Các tùy chọn có sẵn:
   • Mở Kiosk: Mở tab Kiosk mới
   • Đóng các tab khác: Đóng tất cả tab (trừ Kiosk)

🔧 Khắc phục sự cố

Extension không hiển thị thanh điều hướng:

1. Kiểm tra extension đã được bật
2. Refresh trang dịch vụ công/VNeID
3. Kiểm tra URL trong popup có đúng không

Nút "Quay về Kiosk" không hoạt động:

1. Kiểm tra URL Kiosk trong popup
2. Đảm bảo server Kiosk đang chạy
3. Thử mở Kiosk thủ công từ popup

Extension không load:

1. Kiểm tra tất cả files có trong thư mục
2. Kiểm tra file manifest.json đúng cú pháp
3. Kiểm tra icons PNG đã được tạo

📋 Keyboard Shortcuts (trong popup)

• Ctrl+K (Windows) / Cmd+K (Mac): Mở Kiosk
• Ctrl+W (Windows) / Cmd+W (Mac): Đóng các tab khác

🔒 Quyền và Bảo mật

Extension yêu cầu các quyền:

• activeTab: Để tương tác với tab hiện tại
• tabs: Để quản lý tabs (mở/đóng/focus)
• storage: Để lưu cài đặt người dùng
• host_permissions: Để chạy trên dichvucong.gov.vn và vneid.gov.vn

📞 Hỗ trợ

Nếu gặp vấn đề, vui lòng:

1. Kiểm tra console Chrome để xem lỗi
2. Disable và enable lại extension
3. Restart Chrome

---

© 2025 Kiosk Navigation Helper v1.0.0 Trung tâm y tế khu vực Đức Trọng