كيفية تمييز الرسائل الجديدة عن المقروءة في الدردشة العامة لصفحة ويب

بتاريخ 13 ساعات قال Wael Aljamal:

يمكنك حفظ ID آخر رسالة مقروءة ضمن ملفات Cookies في متصفح المستخدم.

وعند جلب رسائل جديدة، أي رسالة لها معرف ID أكبر هي جديدة.. ثم قم بإسناد آخر ID لل Cookies كتحديث (بعد كل رسالة جديدة).

توضيح للآلية:

يمكن استخدام الدوال التالية، لإضافة وجلب Cookies:

• set cookie نمرر له اسم و قيمة و تاريخ الصلاحية ويقوم بإضافتها
• get cookie يبحث عن cookie موجودة لدينا ويجلبها
• check cookie يتأكد من صلاحيتها

function setCookie(cname, cvalue, exdays) {
  var d = new Date();
  d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
  var expires = "expires="+d.toUTCString();
  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

function getCookie(cname) {
  var name = cname + "=";
  var ca = document.cookie.split(';');
  for(var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ') {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "-1"; // أو فارغة
}

function checkCookie() {
  var user = getCookie("username");
  if (user != "") {
    alert("Welcome again " + user);
  } else {
    user = prompt("Please enter your name:", "");
    if (user != "" && user != null) {
      setCookie("username", user, 365);
    }
  }
}

• خلال دورة جلب الرسائل، نجلب ID آخر رسالة مقروءة لدينا من خلال cookies وإن لم تكن موجودة نضع رقمها الافتراضي بقيمة أصغر من أي رسالة أخرى مثلا قيمة سالبة -1.
• ثم نقوم بعمل استعلام من قاعدة البيانات ونجلب الرسائل، ربما تكون بعض الرسائل قد قرأها المستخدم، لذلك نقارن بين معرفات الرسائل و نسند أصناف CSS مختلفة بين رسالة مقروءة و رسالة جديدة.
• الرسائل القديمة لها معرف أصغر من المعرف المحفوظ لدى المستخدم، أما الجديدة فأكبر لأن id تلقائي متزايد.

seenId = getCookie("messageId");

messages = getAllMessages();

loop on messages as msg {
	if msg.id < seenId
  		old message CSS
  	else
  		new message CSS
    
  	seenId = msg.id // update تحديث
}

setCookie("messageId",seenId,365);// update تحديث

يمكنك حفظ ID آخر رسالة مقروءة ضمن ملفات Cookies في متصفح المستخدم.

وعند جلب رسائل جديدة، أي رسالة لها معرف ID أكبر هي جديدة.. ثم قم بإسناد آخر ID لل Cookies كتحديث (بعد كل رسالة جديدة).

بتاريخ 11 ساعات قال علي الكاسر:

هل أقوم بأضافة الرسائل الجديدة إلى الرسائل القديمه التي في الحاويه أو أمسح محتويات الحاويه واضيف الرسائل العائدة من السيرفر الجديده والقديمه إلى الحاويه 

عادةً نريد الاحتفاظ بكل الرسائل، عند جلب رسالة جديدة نضيف لها صنف CSS يميزها عن الرسائل القديمة، ثم اربط التعديل للرسائل الجديدة بدالة set Time Out التي تزيل الصنف المميز بعد انقضاء نصف ثانية مثلا.

setTimeout(function(){
            $(formMessages).removeClass('newMassage');
    }, 2000);

يمكن دمج الإضافة والحذف للصنف المميز سويا هكذا:

$(formMessages)
  .addClass('newMassage')
  .delay(2000)
  .queue(function(next){
    $(this).removeClass('newMassage');
  })

حيث تم استخدام الرتل queue لتنظيم استدعاء الدوال

بتاريخ 1 دقيقة مضت قال Wael Aljamal:

يمكنك حفظ ID آخر رسالة مقروءة ضمن ملفات Cookies في متصفح المستخدم.

وعند جلب رسائل جديدة، أي رسالة لها معرف ID أكبر هي جديدة.. ثم قم بإسناد آخر ID لل Cookies كتحديث (بعد كل رسالة جديدة).

فكرة رائعة جدا، وأعتقد أنها سوف تحل الموضوع 

بتاريخ 4 دقائق مضت قال Wael Aljamal:

يمكنك حفظ ID آخر رسالة مقروءة ضمن ملفات Cookies في متصفح المستخدم.

وعند جلب رسائل جديدة، أي رسالة لها معرف ID أكبر هي جديدة.. ثم قم بإسناد آخر ID لل Cookies كتحديث (بعد كل رسالة جديدة).

أخي أنا أستخدم أجاكس، أخي أي الطرق أفضل،، هل أقوم بأضافة الرسائل الجديدة إلى الرسائل القديمه التي في الحاويه أو أمسح محتويات الحاويه واضيف الرسائل العائدة من السيرفر الجديده والقديمه إلى الحاويه