Astuces Forumactif
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Astuces Forumactif

EDGE/ PHPBB2 / PHPBB3/ PUNBB / INVISION/ MODERNBB/ AWESOMEBB

Membres connectés récemment
Voir tous les membres

[PHPBB3] Bouton chatbox sur barre de notification

 :: Astuces Forumactif :: Les sujets résolus

Voir le sujet précédent Voir le sujet suivant Aller en bas

Sujet résolu [PHPBB3] Bouton chatbox sur barre de notification

1
avatar
photoclic
https://photoclic.forum-pro.fr/

Messagephotoclic Lun 1 Juin 2020 - 22:02

  • Version du forum :
    PHPBB3
  • Templates modifiés :
    oui
  • Navigateur :
    Firefox
Bonjour à tous les milouziens,

J'ai installé sur mon forum ce script FA:
https://forum.forumactif.com/t391323-integrer-la-chatbox-a-la-toolbar

Code:

// original ici https://forum.forumactif.com/t391323-integrer-la-chatbox-a-la-toolbar
(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: '0px',
            width: '0px',

            live_notif: true,
            sound_notif: {
                enabled: true,
                file: 'https://illiweb.com/fa/fdf/future.mp3'
            },
            notifRate: 10000
        },

        // language settings
        lang: {
            chatbox: 'Chatbox',
            new_msg: 'Nouveau membre connecté sur la <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.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()
            });
        },

    };

    $(function() {
        // initialize the chat when the document is ready and the user is logged in
        if (_userdata.session_logged_in) $(FA.Chat.init);
    });
})();

//Aller en bas de page quand on clique sur le bouton + title
    $(function(){$(function(){
        $('#fa_chat_button').attr('title','Cliquer pour rejoindre la Chatbox et consulter les archives.').css('cursor','pointer').click(function(){
        $(this).attr('href','/forum#M14_CHATBOX_NAME');
                  
        });    
      // start tooltipster
         $('#fa_chat_button').tooltipster({
          animation : 'fade',
          arrow : true,
          speed : 300,
          delay : 300,
          onlyOne : true,
          theme : 'tooltipster-default'          
        });
        })});

//retirer les lignes de connexions et déconnexions chatbox ttes pages
$(window).load(function() {
  var chatbox_script = function() {
    $('#chatbox > p > .msg > span').filter('[style="color:green"],[style="color:red"]').closest('p').remove();
    var overrided = Chatbox.prototype.refresh;
    Chatbox.prototype.refresh = function(data) {
      if (data.messages && data.messages.length) {
        data.messages = $.grep(data.messages, function(v) {
          return v.userId != -10 || $.inArray(v.msgColor, ["red", "green"]) == -1;
        });
      }
      overrided.call(this, data);
    };
  };
  var s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox"],iframe[src^="/chatbox"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
});

// changer onglet et icône à la réception d'un message
window.localStorage && $(window).load(function() {
          var chatbox_script = function() {
            var t_icon = window.top.$.find('link[rel="shortcut icon"]')[0];
            var t_doc = window.top.document;
            var title = t_doc.title;
            var icon = t_icon.getAttribute('href');
        
            var rep_title = '--> Chatbox nouveau message !! '+title;
            var rep_icon = 'https://illiweb.com/fa/fdf/al.ico';
        
            $(window).on("focus", function(){ localStorage.cb_blurred='' }).on("blur", function(){ localStorage.cb_blurred=1; });
            var overrided = Chatbox.prototype.refresh;
            Chatbox.prototype.refresh = function(data) {
              if (data.messages && data.messages.length) {
                var lm = data.messages.slice(-1)[0];
                var last_message = lm.time+','+lm.action+','+lm.msg;
                if(this.last_message != last_message) {
                  var user = $.grep(data.users, function(v){return v.id==chatbox.userId});
                  user = user.length ? user[0] : [{}];
                  if(this.last_message!==undefined) {
                    if(lm.userId!=chatbox.userId && user.username!=lm.username) {
                      if(localStorage.cb_blurred) (function(){
                        var blink = function(){
                          if(title == t_doc.title) {
                            if(!localStorage.cb_blurred) return;
                            var new_title = rep_title;
                            var new_icon = rep_icon;
                          } else {
                            var new_title = title;
                            var new_icon = icon;
                          }
                          t_doc.title = new_title;
                          var new_t_icon = t_icon.cloneNode(true);
                          new_t_icon.setAttribute('href', new_icon);
                          var t_icon_parent = t_icon.parentNode;
                          t_icon_parent.removeChild(t_icon);
                          t_icon_parent.appendChild(new_t_icon);
                          t_icon = new_t_icon;
                          setTimeout(blink, 500);
                        };
                        blink();
                      })();
                    } else {
                      localStorage.cb_blurred='';
                    }
                  }
                  this.last_message = lm;
                }
              }
              overrided.call(this, data);
            };
          };
          var s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
        });

//Connexion auto shatbox modos sauf Foxy    
$(function () { if ((_userdata.user_level ==1||_userdata.user_level == 2) && (_userdata["user_id"] != '1') ) {
$(window).load(function() {
var chatbox_script = function() {
            setTimeout(function(){ $('#chatbox_option_co:visible').click() }, 1000);
          };
          var s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
        });
 }
});


Dans ce script, seul m'intéresse le bouton qui s'affiche sur la barre de notification en haut à droite avec le nombre de membres connectés.

Je vais donc retirer ce script pour soulager mon forum.

Mais serai-til possible d'avoir un autre script uniquement pour avoir ce bouton.

Mercipour votre aide.



Dernière édition par photoclic le Mar 2 Juin 2020 - 17:34, édité 1 fois

Sujet résolu Re: [PHPBB3] Bouton chatbox sur barre de notification

2
Milouze14
Milouze14
Fondateur

https://www.milouze14.net/

MessageMilouze14 Mar 2 Juin 2020 - 17:02

Coucou Serge,
alors, je me souviens d'un script d'Arnaud récupérant le nombre de membre connectés de la Chatobx sur l'index du forum.

Dans le template index_body:
Affichage/Templates/Général/index_body


Recherches cette variable:
Code:
{CHATBOX_BOTTOM}

Juste avant déposes ceci:
Code:
  <p id="chattersList" style="display:none">{CHATTERS_LIST}</p>


Penses a enregistrer puis à valider en cliquant respectivement sur Enregistr puis Ajout


La c.s.s:

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:


 #fa_chat_button {
          color:#FFF;
          line-height:30px;
          margin-left:10px;
          padding:0 5px;
          cursor:pointer;
        }

Penses a cliquer sur le bouton [PHPBB3] Bouton chatbox sur barre de notification Sans_t10






Puis le script:

Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.

Cocher sur toutes les pages.

Déposes ceci:

Code:

$(function(){
$(function(){
$('<a id="fa_chat_button">Chatbox <span id="fa_chatters">(<span>0</span>)</span></a>').insertAfter('#fa_notifications');
          try{
          var chattersList=function(){
            $.get("/",function(d){
              var a=$("#chattersList a",d);
$("#fa_chatters span").html(a.length);
            });
          };
          chattersList();
          setInterval(chattersList,5000);
          }catch(e){}
})
});

Penses a cliquer sur le bouton Valid

Le script va rechercher toutes les 5 secondes les membres connectés,tu peux le modifier ici:

Code:
setInterval(chattersList,5000);



C'est à s'y méprendre heuu








Sujet résolu Re: [PHPBB3] Bouton chatbox sur barre de notification

3
avatar
photoclic
https://photoclic.forum-pro.fr/

Messagephotoclic Mar 2 Juin 2020 - 17:33

Bonjour Philippe,

Super! Un grand merci.
Une substitution aux petits oignons :-)

C'est tout bon l'ami  tape la

PS:ça rame chez FA et pas de mail sur les sujets suivis.

Sujet résolu Re: [PHPBB3] Bouton chatbox sur barre de notification

4
Milouze14
Milouze14
Fondateur

https://www.milouze14.net/

MessageMilouze14 Mar 2 Juin 2020 - 17:59

De rien Serge,

PS:ça rame chez FA et pas de mail sur les sujets suivis.

La sortie du confinement surement lOL .


Hello


Sujet résolu et déplacé dans le forum adéquate

A bientôt pour une prochaine demande clin oeil



Voir le sujet précédent Voir le sujet suivant Revenir en haut

Sujets similaires
»  [PHPBB3]Masquage barre de notification
» [PHPBB3] Affichage membres sur barre de notification
» [PHPBB3] Membres connectés chatbox
» [PhpBB3]Notification lorsqu'un MP est lu...
» [PHPBB3] Incohérence affichage notification

Créer un compte ou se connecter pour répondre

Vous devez être membre pour répondre.

S'enregistrer

Rejoignez notre communauté ! C'est facile !


S'enregistrer

Connexion

Vous êtes déjà membre ? Aucun soucis, cliquez ici pour vous connecter.


Connexion

Astuces Forumactif :: Astuces Forumactif :: Les sujets résolus

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Forumactif.com