Notifications API का इस्तेमाल करना

browser.notifications API की मदद से, टेंप्लेट का इस्तेमाल करके सूचनाएं बनाई जा सकती हैं. साथ ही, इन सूचनाओं को उपयोगकर्ता की सिस्टम ट्रे में दिखाया जा सकता है:

ये कैसी दिखती हैं

ज़्यादा जानकारी वाली सूचनाएं चार तरह की होती हैं: बुनियादी, इमेज, सूची, और प्रोग्रेस. सभी सूचनाओं में ये चीज़ें शामिल होती हैं: टाइटल, मैसेज, सूचना के मैसेज के बाईं ओर दिखने वाला छोटा आइकॉन, और contextMessage फ़ील्ड. यह फ़ील्ड, हल्के रंग के फ़ॉन्ट में तीसरे टेक्स्ट फ़ील्ड के तौर पर दिखता है.

बुनियादी सूचना:

सूची की सूचनाओं में, सूची के आइटम की कोई भी संख्या दिख सकती है:

इमेज की सूचनाओं में, इमेज की झलक शामिल होती है:

प्रोग्रेस बार में, ऐप्लिकेशन के इंस्टॉल होने की प्रोग्रेस दिखती है:

उनका व्यवहार कैसा है

ChromeOS पर, सूचनाएं उपयोगकर्ता की सिस्टम ट्रे में दिखती हैं. ये सूचनाएं तब तक सिस्टम ट्रे में बनी रहती हैं, जब तक उपयोगकर्ता इन्हें खारिज नहीं कर देता. सिस्टम ट्रे में, सभी नई सूचनाओं की संख्या दिखती है. जब उपयोगकर्ता को सिस्टम ट्रे में सूचनाएं दिख जाती हैं, तब सूचनाओं की संख्या शून्य पर रीसेट हो जाती है.

सूचनाओं को -2 से 2 के बीच प्राथमिकता दी जा सकती है. शून्य से कम प्राथमिकता वाली सूचनाएं, ChromeOS के सूचना केंद्र में दिखती हैं. साथ ही, अन्य प्लैटफ़ॉर्म पर गड़बड़ी का मैसेज दिखता है. डिफ़ॉल्ट प्राथमिकता 0 होती है. प्राथमिकता 0 से ज़्यादा होने पर, सूचनाएं ज़्यादा समय तक दिखती हैं. साथ ही, सिस्टम ट्रे में ज़्यादा ज़रूरी सूचनाएं दिख सकती हैं.

priority सेटिंग का असर, macOS पर सूचनाओं के क्रम पर नहीं पड़ता.

सूचनाएं दिखाने के साथ-साथ, सभी तरह की सूचनाओं में ज़्यादा से ज़्यादा दो ऐक्शन आइटम शामिल किए जा सकते हैं. जब उपयोगकर्ता किसी ऐक्शन आइटम पर क्लिक करते हैं, तो आपका एक्सटेंशन सही कार्रवाई करके जवाब दे सकता है. उदाहरण के लिए, जब उपयोगकर्ता जवाब दें पर क्लिक करता है, तो ईमेल ऐप्लिकेशन खुल जाता है. इसके बाद, उपयोगकर्ता जवाब लिख सकता है:

उन्हें कैसे बेहतर बनाया जाए

इस एपीआई का इस्तेमाल करने के लिए, notifications.create() तरीके को कॉल करें. साथ ही, options पैरामीटर का इस्तेमाल करके सूचना की जानकारी पास करें:

await browser.notifications.create(id, options);

notifications.NotificationOptions में notifications.TemplateType शामिल होना चाहिए. इससे सूचना की उपलब्ध जानकारी और उसे दिखाने के तरीके के बारे में पता चलता है.

बुनियादी सूचना बनाना

सभी टेंप्लेट टाइप (basic, image, list, और progress) में सूचना title और message के साथ-साथ iconUrl भी शामिल होना चाहिए. , एक छोटे आइकॉन का लिंक होता है. यह आइकॉन, सूचना वाले मैसेज के बाईं ओर दिखता है.

यहां basic टेंप्लेट का एक उदाहरण दिया गया है:

var opt = {
  type: "basic",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon"
}

किसी इमेज का इस्तेमाल करना

image टेंप्लेट टाइप में imageUrl भी शामिल होता है. यह एक ऐसी इमेज का लिंक होता है जिसकी झलक सूचना में दिखती है. ध्यान दें कि macOS पर उपयोगकर्ताओं को इमेज नहीं दिखती हैं.

var opt = {
  type: "image",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  imageUrl: "url_to_preview_image"
}

सूची से जुड़ी सूचना बनाना

list टेंप्लेट में items को सूची के फ़ॉर्मैट में दिखाया जाता है. ध्यान दें कि macOS पर उपयोगकर्ताओं को सिर्फ़ पहला आइटम दिखता है.

var opt = {
  type: "list",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  items: [{ title: "Item1", message: "This is item 1."},
          { title: "Item2", message: "This is item 2."},
          { title: "Item3", message: "This is item 3."}]
}```

### Create progress notification {: #progress }

The `progress` template displays a progress bar where current progress ranges from 0 to 100. On macOS the progress bar displays as a percentage value in the notification title instead of in the progress bar.

```js
var opt = {
  type: "progress",
  title: "Primary Title",
  message: "Primary message to display",
  iconUrl: "url_to_small_icon",
  progress: 42
}

इवेंट सुनने और उनका जवाब देने की अनुमति

सभी सूचनाओं में इवेंट लिसनर और इवेंट हैंडलर शामिल हो सकते हैं. ये उपयोगकर्ता की कार्रवाइयों का जवाब देते हैं (browser.events देखें). उदाहरण के लिए, notifications.onButtonClicked इवेंट का जवाब देने के लिए, इवेंट हैंडलर लिखा जा सकता है.

इवेंट लिसनर:

browser.notifications.onButtonClicked.addListener(replyBtnClick);

इवेंट हैंडलर:

function replyBtnClick {
    //Write function to respond to user action.
}

सर्विस वर्कर में इवेंट लिसनर और हैंडलर शामिल करें, ताकि एक्सटेंशन के चालू न होने पर भी सूचनाएं दिख सकें.