حصري : كود جعل الدردشة فى عارضة المنتدي مع ظهور اشعارات منبثقة مثل الفيسبوك
اخترنا لك
اشخاص فى صن سيت
مشاهدة المزيد
المتواجدون الآن ؟
ككل هناك 15 عُضو متصل حالياً :: 0 عضو مُسجل, 0 عُضو مُختفي و 15 زائر :: 2 عناكب الفهرسة في محركات البحث

لا أحد

أكبر عدد للأعضاء المتواجدين في هذا المنتدى في نفس الوقت كان 1792 بتاريخ الأحد 29 يناير 2017 - 11:31
اختصار سريع


صلِ على محمد

حصري : كود جعل الدردشة فى عارضة المنتدي مع ظهور اشعارات منبثقة مثل الفيسبوك

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

avatar
اسلام
الادارة العليا

الادارة العليا
اسم الدولة : : مصـــر
العمر : 23
عدد المساهمات : 2236
المعجبون بمواضيعى : 104
معاينة صفحة البيانات الشخصي للعضو

مُساهمةاسلام في السبت 22 سبتمبر 2018 - 19:14

بسم الله الرحمن الرحيم
كود جعل الدردشة فى عارضة المنتدي مع ظهور اشعارات منبثقة مثل الفيسبوك
هذه الاضافة ستعطي لمنتداك جمالا مبهجا لكل اعضاء منتداك وهذا الكود حصري منا
صورة للكود :

تتضمن بعض الميزات الإضافية من مربع الدردشة الافتراضي ، مثل إشعارات الصوت وشريط الأدوات حتى تعرف متى يتم نشر رسالة جديدة أثناء تسجيل الدخول إلى الدردشة. بالإضافة إلى عداد صغير على الزر لعرض إجمالي الأعضاء في chatbox.
ملاحظة: يجب أن يكون مربع الدردشة نشطًا بالإضافة إلى شريط الأدوات .

شرح تركيب الكود
أولا اذهب الى الcss واضف هذا الكود
الكود مخفى للرد

ثم بعد ذلك توجه الى اكواد الجافا سكريبت واضف هذا الكود
الكود:
(function() {
  if (!window.FA) window.FA = {};
  if (FA.Chat) {
    if (window.console) console.warn('FA.Chat has already been initialized');
    return;
  }
 
  FA.Chat = {
 
    // chatbox settings
    config : {
      height : '60%',
      width : '70%',
   
      live_notif : true,
      sound_notif : {
        enabled : true,
        file : 'http://illiweb.com/fa/fdf/zelda.mono.mp3'
      },
      notifRate : 10000
    },
 
    // language settings
    lang : {
      chatbox : 'Chatbox',
      new_msg : 'A new message has been posted in the <a href="javascript:FA.Chat.toggle();">chatbox</a>.'
    },
 
    // technical data below
    node : {}, // node cache
    users : 0, // users in chat
    messages : 'initial', // total chat messages
    actif : false, // tells us if the chatbox is opened
    notifActif : false, // tells us if the notifications are active
 
    // initial setup of the chatbox
    init : function() {
      var right = document.getElementById('fa_right'),
          container = document.createElement('DIV'),
          button = document.createElement('A'),
          audio;
 
      button.id = 'fa_chat_button';
      button.innerHTML = FA.Chat.lang.chatbox + ' <span id="fa_chatters">(0)</span>';
      button.onclick = FA.Chat.toggle;
      FA.Chat.node.button = button;
 
      container.id = 'fa_chat_container';
      container.innerHTML = '<iframe id="fa_chat" src="/chatbox/index.forum"></iframe>';
      container.style.width = FA.Chat.config.width;
      container.style.height = FA.Chat.config.height;
      container.style.bottom = '-' + FA.Chat.config.height;
      container.style.visibility = 'hidden';
 
      if (right) {
        right.insertBefore(button, right.lastChild); // add the chat button to the right side of the toolbar
        document.body.appendChild(container);
     
        // create the notification audio element
        if (FA.Chat.config.sound_notif.enabled) {
          audio = document.createElement('AUDIO');
          audio.src = FA.Chat.config.sound_notif.file;
          if (audio.canPlayType) {
            FA.Chat.node.audio = audio;
            document.body.appendChild(audio);
          }
        }
 
        FA.Chat.node.container = document.getElementById('fa_chat_container');
        FA.Chat.node.chatters = document.getElementById('fa_chatters');
        FA.Chat.node.frame = document.getElementById('fa_chat');
        FA.Chat.node.frame.onload = FA.Chat.getFrame;
      }
   
      delete FA.Chat.init;
    },
 
    // get the frame window, document, and elements
    getFrame : function() {
      if (FA.Chat.poll) window.clearInterval(FA.Chat.poll);
      if (this.contentDocument || this.contentWindow) {
        FA.Chat.window = this.contentWindow;
        FA.Chat.document = this.contentDocument ? this.contentDocument : FA.Chat.window.document;
     
        FA.Chat.node.message = FA.Chat.document.getElementById('message');
        FA.Chat.node.members = FA.Chat.document.getElementById('chatbox_members');
     
        FA.Chat.poll = window.setInterval(FA.Chat.listen, 300); // listen for changes every 0.3 seconds
      }
    },
 
    // listen for changes in the chatbox
    listen : function() {
      var users = FA.Chat.node.members.getElementsByTagName('LI').length,
          messages = FA.Chat.window.chatbox.messages.length;
   
      // update user count
      if (users > FA.Chat.users || users < FA.Chat.users) {
        FA.Chat.users = users;
        FA.Chat.node.chatters.innerHTML = '(' + FA.Chat.users + ')';
      }
   
      // initial / active updates
      if ((FA.Chat.messages == 'initial' && messages) || FA.Chat.notifActif || FA.Chat.actif) FA.Chat.messages = messages;
   
      // notify new messages while connected and the chatbox is closed
      if (!FA.Chat.actif && !FA.Chat.notifActif && FA.Chat.window.chatbox.connected && (messages > FA.Chat.messages || messages < FA.Chat.messages)) {
        FA.Chat.messages = messages; // update message count
        FA.Chat.notifActif = true;
     
        if (FA.Chat.config.live_notif) FA.Chat.notify(FA.Chat.lang.new_msg); // show live notification
        if (FA.Chat.config.sound_notif.enabled && FA.Chat.node.audio) FA.Chat.node.audio.play(); // play sound notification
     
        // wait before notifying the user again
        window.setTimeout(function() {
          FA.Chat.notifActif = false;
        }, FA.Chat.config.notifRate);
      }
    },
 
    // create a custom notification
    notify : function(msg) {
   
      var notif = document.createElement('DIV'),
          live = document.getElementById(Toolbar.LIVE_NOTIF);
       
      notif.className = 'fa_notification';
      notif.innerHTML = '<div class="content ellipsis">' + msg + '</div>';
      notif.style.display = 'none';
   
      $(notif).mouseover(function() { $(this).stop(true, true) });
      $(notif).mouseleave(function() { $(this).delay(5000).fadeOut() });
   
      live.insertBefore(notif, live.firstChild);
      $(notif.firstChild).dotdotdot();
   
      $(notif).fadeIn(100, function() { $(this).delay(10000).fadeOut() });
    },
 
    // toggle the display state of the chatbox
    toggle : function() {
      var container = FA.Chat.node.container.style;
     
      if (/hidden/i.test(container.visibility)) {
        FA.Chat.node.button.className = 'fa_chat_active';
        FA.Chat.actif = true;
       
        container.visibility = 'visible';
        container.bottom = '3px';
       
        // auto focus the message field
        window.setTimeout(function() {
          FA.Chat.node.message.focus();
        }, 350); // some browsers ( firefox ) need a delay
      } else {
        FA.Chat.node.button.className = '';
        FA.Chat.actif = false;
       
        container.visibility = 'hidden';
        container.bottom = '-' + FA.Chat.config.height;
      }
    }
 
  };
 
  $(function(){
    // initialize the chat when the document is ready and the user is logged in
    if (_userdata.session_logged_in) $(FA.Chat.init);
  });
})();
ومبروك عليك هذه الاضافة الجديدة والجميلة التى تتحلي بها فى منتداك

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة

للمشاركة أنت بحاجة إلى تسجيل الدخول أو الإنضمام إلينا

يجب أن تعرف بنفسك بتسجيل الدخول أو التسجيل فى صن سيت

التسجيل

انضم الينا لن يستغرق منك إلا ثوانى معدودة!


أنشئ حساب جديد

تسجيل الدخول

قم بتسجيل الدخول وانضم لجمهورية صن سيت الكبرى


تسجيل الدخول

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى