Thêm cửa sổ bật lên

Cửa sổ bật lên là một thao tác hiển thị một cửa sổ cho phép người dùng gọi nhiều tính năng của tiện ích. Thao tác này được kích hoạt bằng phím tắt hoặc bằng cách nhấp vào biểu tượng hành động của tiện ích. Cửa sổ bật lên sẽ tự động đóng khi người dùng tập trung vào một phần nào đó của trình duyệt bên ngoài cửa sổ bật lên. Không có cách nào để cửa sổ bật lên luôn mở sau khi người dùng nhấp vào.

Hình ảnh sau đây được lấy từ mẫu Sự kiện uống nước, cho thấy một cửa sổ bật lên cho thấy các lựa chọn hẹn giờ hiện có. Người dùng đặt báo thức bằng cách nhấp vào một trong các nút.

Ví dụ về một cửa sổ bật lên.
Ví dụ về một cửa sổ bật lên.

Đăng ký một cửa sổ bật lên trong tệp kê khai bằng khoá "action".

{
 "name": "Drink Water Event",
 ...
 "action": {
   "default_popup": "popup.html"
 }
 ...
}

Triển khai cửa sổ bật lên như cách bạn thực hiện với hầu hết các trang web khác. Lưu ý rằng mọi JavaScript được sử dụng trong cửa sổ bật lên phải nằm trong một tệp riêng biệt.

<html>
 <head>
   <title>Water Popup</title>
 </head>
 <body>
     <img src="./stay_hydrated.png" id="hydrateImage">
     <button id="sampleSecond" value="0.1">Sample Second</button>
     <button id="min15" value="15">15 Minutes</button>
     <button id="min30" value="30">30 Minutes</button>
     <button id="cancelAlarm">Cancel Alarm</button>
   <script src="popup.js"></script>
 </body>
</html>

Bạn cũng có thể tự động tạo cửa sổ bật lên bằng cách gọi action.setPopup().

chrome.storage.local.get('signed_in', (data) => {
  if (data.signed_in) {
    chrome.action.setPopup({popup: 'popup.html'});
  } else {
    chrome.action.setPopup({popup: 'popup_sign_in.html'});
  }
});