دراسة حالة ملحق Jetpack: تذكير عبر البريد الإلكتروني في Gmail

دراسة حالة ملحق Jetpack الخاص بـ Firefox: تذكير عبر البريد الإلكتروني في Gmail

هناك وظيفة جيدة وعملية للغاية في الجزء السفلي من برنامج Gtalk، وهي وظيفة التذكير عبر البريد الإلكتروني في Gmail. سيتم تحديث عدد رسائل البريد الإلكتروني الجديدة غير المقروءة في Gmail الخاص بك بانتظام.

فقط تخيل كم سيكون الأمر مثيرًا للاهتمام إذا قمنا بنقل هذه الميزة إلى Firefox!

الخطوة الأولى هي عرض الرموز والبيانات في شريط الحالة

من خلال مقال "كيفية إنشاء ملحق Jetpack لمتصفح فايرفوكس"، يمكننا بسهولة إنشاء:

jetpack.statusBar.append({
html: '<img src="http://mail.google.com/mail/images/favicon.ico"/><span id="count"></span>', // رمز بريد Gmail والرقم غير المقروء من الرسائل الجديدة
العرض: 55، // العرض على شريط الحالة هو 55
جاهز: الوظيفة (القطعة) {
$("#count"، widget).css({ // أضف نمطًا إلى عدد رسائل البريد الإلكتروني الجديدة غير المقروءة
المؤشر: "المؤشر"،
الحشو الأيسر:"4px"،
عائلة الخطوط: "Tahoma، Arial، sans-serif"،
محاذاة عمودية: "أعلى"،
حجم الخط: "10 بكسل"،
ارتفاع الخط: "18 بكسل"،
});
}
});

الخطوة الثانية هي الحصول على بيانات Gmail وتحديث عدد رسائل البريد الإلكتروني الجديدة غير المقروءة.

يمكن الحصول عليه من خلال خلاصة بريد Gmail (يلزم تسجيل الدخول): https://mail.google.com/mail/feed/atom

يتم استخدام علامة العدد الكامل في كود مصدر الخلاصة لتسجيل العدد الحالي من رسائل البريد الإلكتروني الجديدة غير المقروءة.

حسنًا، أولاً مصدر البيانات متاح. بعد ذلك، نستخدم تقنية Ajax المألوفة للحصول على البيانات وتخصيصها للعنصر المحدد.

تحديث الوظيفة (القطعة) {
فار القطعة = $(القطعة);
$.get(" https://mail.google.com/mail/feed/atom ", function(xml) {
var el = $(xml).find("fullcount"); // العقدة التي تسجل عدد رسائل البريد الإلكتروني الجديدة غير المقروءة
إذا (ش){
var newcount = parseInt(el.get(0).textContent);
widget.find("#count").text(newcount); // تعيين للعنصر المحدد
} else { // إذا لم تقم بتسجيل الدخول، فاعرض "تسجيل الدخول"
widget.find("#count").text( "تسجيل الدخول" );
}
});
}

يمكننا أيضًا إجراء بعض التحسينات: على سبيل المثال، عندما يكون عدد رسائل البريد الإلكتروني الجديدة غير المقروءة أكبر من العدد الأصلي لرسائل البريد الإلكتروني، تتم إضافة معلومات سريعة، وما إلى ذلك.
يتم استخدام الأسلوب jetpack.notifications.show(options) للحصول على معلومات سريعة. تحتوي معلمة الخيارات على ثلاث سمات: العنوان (السلسلة): عنوان رمز الإشعار (URL): عنوان URL لنص الإشعار (السلسلة)؛ : محتوى موضوع الإخطار.

الكود الأمثل هو كما يلي:

تحديث الوظيفة (القطعة) {
القطعة فار = $(القطعة)،
notify = function(msg) { // الطريقة العامة لتحديد الإشعارات
jetpack.notifications.show({
العنوان: "Gmail"،
الجسم: رسالة،
الرمز: " http://mail.google.com/mail/images/favicon.ico "
});
};
$.get(" https://mail.google.com/mail/feed/atom ", function(xml) {
var el = $(xml).find("fullcount"); // العقدة التي تسجل عدد رسائل البريد الإلكتروني الجديدة غير المقروءة
إذا (ش){
var newcount = parseInt(el.get(0).textContent);
if(newcount > count) { // إذا كان عدد رسائل البريد الإلكتروني الجديدة غير المقروءة أكبر من عدد رسائل البريد الإلكتروني الأصلية، فمن أين تأتي المطالبة؟
فار المرسل = $(xml).find("name").get(0).textContent;
notify("رسالة جديدة من"+sender);
}
العد = العدد الجديد؛
widget.find("#count").text(count); // تعيين للعنصر المحدد
} else { // إذا لم تقم بتسجيل الدخول، فاطلب تسجيل الدخول
widget.find("#count").text( "تسجيل الدخول" );
notify("الرجاء تسجيل الدخول إلى Gmail");
}
});
}

الخطوة 3: إعداد بيانات التحديث المجدولة

قمنا بتعيين البيانات ليتم تحديثها كل دقيقة واحدة:

setInterval( function() { update(widget) }, 60*1000 );

الخطوة 4: قم بتعيين نافذة الارتباط بعد النقر فوق الامتداد

$(widget).click(function() { // قم بتعيين نافذة الارتباط بعد النقر فوق التوسيع
jetpack.tabs.open(" http://mail.google.com ");
jetpack.tabs[ jetpack.tabs.length-1].focus();
});

jetpack.tabs هو كائن علامة التبويب في نافذة المتصفح، و.open(url) هو طريقة فتح علامة تبويب نافذة متصفح جديدة، و.focus() هو طريقة تحديد علامة التبويب هذه كعلامة التبويب الحالية.

حسنًا، يمكن إكمال ملحق Jetpack الخاص بمتصفح Firefox - التذكير عبر البريد الإلكتروني في Gmail، بسهولة في أربع خطوات بسيطة.

الكود بأكمله هو كما يلي:

عدد فار = 0؛
تحديث الوظيفة (القطعة) {
القطعة فار = $(القطعة)،
notify = function(msg) { // الطريقة العامة لتحديد الإشعارات
jetpack.notifications.show({
العنوان: "Gmail"،
الجسم: رسالة،
الرمز: " http://mail.google.com/mail/images/favicon.ico "
});
};
$.get(" https://mail.google.com/mail/feed/atom ", function(xml) {
var el = $(xml).find("fullcount"); // العقدة التي تسجل عدد رسائل البريد الإلكتروني الجديدة غير المقروءة
إذا (ش){
var newcount = parseInt(el.get(0).textContent);
if(newcount > count) { // إذا كان عدد رسائل البريد الإلكتروني الجديدة غير المقروءة أكبر من عدد رسائل البريد الإلكتروني الأصلية، فمن أين تأتي المطالبة؟
فار المرسل = $(xml).find("name").get(0).textContent;
notify("رسالة جديدة من"+sender);
}
العد = العدد الجديد؛
widget.find("#count").text(count); // تعيين للعنصر المحدد
} else { // إذا لم تقم بتسجيل الدخول، فاطلب تسجيل الدخول
widget.find("#count").text( "تسجيل الدخول" );
notify("الرجاء تسجيل الدخول إلى Gmail");
}
});
}
jetpack.statusBar.append({
html: '<img src=" http://mail.google.com/mail/images/favicon.ico"/><span id="count"></span>', // رمز بريد Gmail والرقم غير المقروء من الرسائل الجديدة
width: 40, // عرض شريط الحالة هو 40، ويتم حجز عرض مكون من 3 أرقام.
جاهز: الوظيفة (القطعة) {
$("#count"، widget).css({ // أضف نمطًا إلى عدد رسائل البريد الإلكتروني الجديدة غير المقروءة
المؤشر: "المؤشر"،
الحشو الأيسر:"4px"،
عائلة الخطوط: "Tahoma، Arial، sans-serif"،
محاذاة عمودية: "أعلى"،
حجم الخط: "10 بكسل"،
ارتفاع الخط: "18 بكسل"،
}); $(widget).click(function() { // قم بتعيين نافذة الرابط بعد النقر على التوسيع
jetpack.tabs.open(" http://mail.google.com ");
jetpack.tabs[ jetpack.tabs.length-1].focus();
});
تحديث(القطعة);
setInterval( function() {update(widget) }, 60*1000 );
}
});

العرض التجريبي: http://www.planabc.net/lab/jetpack/gmail/

للحصول على واجهة برمجة التطبيقات التفصيلية لـ Jetpack، يمكنك قراءة قسم العلامة المرجعية لواجهة برمجة التطبيقات في صفحة about: jetpack.

يأتي كود مصدر الحالة من: https://jetpack.mozillalabs.com/demos/gmail-checker.js