সমৃদ্ধ বিজ্ঞপ্তি API, সমৃদ্ধ বিজ্ঞপ্তি API

রিচ নোটিফিকেশন এপিআই আপনাকে টেমপ্লেট ব্যবহার করে নোটিফিকেশন তৈরি করতে এবং ব্যবহারকারীর সিস্টেম ট্রে-তে সেই নোটিফিকেশনগুলো দেখানোর সুযোগ দেয়:

তারা দেখতে কেমন

রিচ নোটিফিকেশন চার ধরনের হয়ে থাকে: বেসিক, ইমেজ, লিস্ট এবং প্রোগ্রেস। সব নোটিফিকেশনে একটি টাইটেল, মেসেজ, নোটিফিকেশন মেসেজের বাম দিকে প্রদর্শিত একটি ছোট আইকন এবং একটি `contextMessage` ফিল্ড থাকে, যা হালকা রঙের ফন্টে তৃতীয় টেক্সট ফিল্ড হিসেবে প্রদর্শিত হয়।

একটি মৌলিক চিত্র:

তালিকা বিজ্ঞপ্তিগুলি যেকোনো সংখ্যক তালিকা আইটেম প্রদর্শন করে:

ইমেজ নোটিফিকেশনে একটি ইমেজ প্রিভিউ অন্তর্ভুক্ত থাকে:

অগ্রগতি বিজ্ঞপ্তিতে একটি অগ্রগতি বার দেখানো হয়:

তারা কীভাবে আচরণ করে

ChromeOS-এ, নোটিফিকেশনগুলো ব্যবহারকারীর সিস্টেম ট্রে-তে দেখা যায় এবং ব্যবহারকারী সেগুলোকে বাতিল না করা পর্যন্ত সেখানেই থাকে। সিস্টেম ট্রে সমস্ত নতুন নোটিফিকেশনের সংখ্যা গণনা করে রাখে। ব্যবহারকারী সিস্টেম ট্রে-তে নোটিফিকেশনগুলো দেখে ফেলার সাথে সাথে, সংখ্যাটি শূন্যে রিসেট হয়ে যায়।

নোটিফিকেশনগুলোকে -২ থেকে ২ এর মধ্যে একটি প্রায়োরিটি দেওয়া যেতে পারে। প্রায়োরিটি < ০ ChromeOS নোটিফিকেশন সেন্টারে দেখানো হয় এবং অন্যান্য প্ল্যাটফর্মে একটি এরর তৈরি করে। প্রায়োরিটি ০ হলো ডিফল্ট প্রায়োরিটি। প্রায়োরিটি > ০ ক্রমবর্ধমান সময়কালের জন্য দেখানো হয় এবং আরও উচ্চ প্রায়োরিটির নোটিফিকেশন সিস্টেম ট্রে-তে প্রদর্শন করা যেতে পারে।

তথ্য প্রদর্শনের পাশাপাশি, সব ধরনের নোটিফিকেশনে সর্বোচ্চ দুটি অ্যাকশন আইটেম অন্তর্ভুক্ত থাকতে পারে। ব্যবহারকারীরা যখন কোনো অ্যাকশন আইটেমে ক্লিক করেন, তখন আপনার অ্যাপ উপযুক্ত পদক্ষেপ নিতে পারে। উদাহরণস্বরূপ, যখন ব্যবহারকারী "Reply"-তে ক্লিক করেন, তখন ইমেল অ্যাপটি খোলে এবং ব্যবহারকারী উত্তরটি সম্পূর্ণ করতে পারেন:

কীভাবে তাদের বিকাশ করা যায়

এই API ব্যবহার করতে, options প্যারামিটারের মাধ্যমে নোটিফিকেশনের বিবরণ দিয়ে notifications.create মেথডটি কল করুন:

chrome.notifications.create(id, options, creationCallback);

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 অন্তর্ভুক্ত থাকে, যা এমন একটি ইমেজের লিঙ্ক যা নোটিফিকেশনের মধ্যে প্রিভিউ করা হয়:

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

ক্রোম অ্যাপে, কঠোর কন্টেন্ট সিকিউরিটি পলিসির কারণে এই URL-গুলিকে অবশ্যই কোনো লোকাল রিসোর্সের দিকে নির্দেশ করতে হবে অথবা একটি ব্লব বা ডেটা URL ব্যবহার করতে হবে। আপনার ছবির জন্য ৩:২ অনুপাত ব্যবহার করুন; অন্যথায় একটি কালো বর্ডার ছবিটিকে ঘিরে ফেলবে।

তালিকা বিজ্ঞপ্তি তৈরি করুন

list টেমপ্লেটটি items একটি তালিকা বিন্যাসে প্রদর্শন করে:

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."}]
}

অগ্রগতি বিজ্ঞপ্তি তৈরি করুন

progress টেমপ্লেটটি একটি প্রোগ্রেস বার প্রদর্শন করে, যেখানে বর্তমান অগ্রগতির পরিসীমা ০ থেকে ১০০ পর্যন্ত থাকে:

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

ঘটনা শোনা এবং সে অনুযায়ী প্রতিক্রিয়া জানানো

সকল নোটিফিকেশনে ইভেন্ট লিসেনার এবং ইভেন্ট হ্যান্ডলার অন্তর্ভুক্ত থাকতে পারে, যা ব্যবহারকারীর কার্যকলাপের প্রতিক্রিয়া জানায় ( chrome.events দেখুন)। উদাহরণস্বরূপ, আপনি notifications.onButtonClicked ইভেন্টের প্রতিক্রিয়া জানাতে একটি ইভেন্ট হ্যান্ডলার লিখতে পারেন।

ইভেন্ট লিসেনার:

chrome.notifications.onButtonClicked.addListener(replyBtnClick);

ইভেন্ট হ্যান্ডলার:

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

ইভেন্ট পেজে ইভেন্ট লিসেনার এবং হ্যান্ডলার অন্তর্ভুক্ত করার কথা বিবেচনা করুন, যাতে অ্যাপ বা এক্সটেনশনটি চালু না থাকলেও নোটিফিকেশন পপ-আপ হতে পারে।