إضافة نافذة منبثقة

النافذة المنبثقة هي إجراء يعرض نافذة تتيح للمستخدمين استدعاء ميزات متعددة للإضافة. يتم تفعيلها من خلال اختصار لوحة المفاتيح أو بالنقر على رمز إجراء الإضافة أو عن طريق طلب browser.action.openPopup(). يتم إغلاق النوافذ المنبثقة تلقائيًا عندما يركّز المستخدم على جزء من المتصفّح خارج النافذة المنبثقة. لا توجد طريقة لإبقاء النافذة المنبثقة مفتوحة بعد أن ينقر المستخدم خارجها.

تعرض الصورة التالية، المأخوذة من نموذج حدث شرب الماء، نافذة منبثقة تعرض خيارات المؤقت المتاحة. يضبط المستخدمون المنبّه من خلال النقر على أحد الأزرار.

مثال على نافذة منبثقة
مثال على نافذة منبثقة

سجِّل نافذة منبثقة في ملف البيان ضمن المفتاح "action".

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

نفِّذ النافذة المنبثقة كما تفعل مع أي صفحة ويب أخرى تقريبًا. يُرجى العِلم أنّ أي JavaScript مستخدَم في نافذة منبثقة يجب أن يكون في ملف منفصل.

<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>

يمكنك أيضًا إنشاء نوافذ منبثقة بشكلٍ ديناميكي عن طريق استدعاء action.setPopup().

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