הוספת חלון קופץ

חלון קופץ הוא פעולה שפותחת חלון שמאפשר למשתמשים להפעיל כמה תכונות של התוסף. הוא מופעל באמצעות מקש קיצור, בלחיצה על סמל הפעולה של התוסף או בקריאה ל-browser.action.openPopup(). החלונות הקופצים נסגרים אוטומטית כשהמשתמש מתמקד בחלק מסוים בדפדפן מחוץ לחלון הקופץ. אין אפשרות להשאיר את החלון הקופץ פתוח אחרי שהמשתמש לחץ במקום אחר.

בתמונה הבאה, שנלקחה מהדוגמה Drink Water Event, מוצג חלון קופץ עם אפשרויות לטיימר. המשתמשים מגדירים שעון מעורר בלחיצה על אחד מהלחצנים.

דוגמה לחלון קופץ.

רושמים את החלון הקופץ במניפסט מתחת למפתח "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'});
  }
});