Avoir un "son" à la récèption de messages sur la Chatbox

2 participants

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

Résolu Avoir un "son" à la récèption de messages sur la Chatbox

Message par Rorom13 Lun 22 Juin 2015 - 21:25

Détails techniques


Version du forum : phpBB3
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Lundi 22 Juin 2015
Lien du forum : http://saphiriadb.forumactif.org/

Description du problème


Bonsoir,

Je prends le temps de vous écrire pour vous exposer mon petit problème, qui j'espère, pourra-t être résolu Smile

En début de soirée j'ai trouvé un petit "Tuto" expliquant comme avoir un son à chaque récéption de message sur la chatbox
Voici le lien > https://forum.forumactif.com/t376396-codes10-pour-la-chatbox

J'ai réussi à avoir un son, les personnes étant présente aussi.
Seulement, je n'ai pas réussi à changer celui-ci, ni même diminuer le volume via ma feuille CSS, sauf en utilisant les commandes : /Sound ON ou OFF > /Sound volume 0-100

J'ai copié le code qui est donné dans : Panneau de config / Affichage / Couleur / Feuille de Style CSS (à la suite, en prenant bien soin de le mettre sur une nouvelle ligne).

Actuellement j'ai supprimé le code de ma "feuille", je n'ai plus aucun son mais les personnes présentes sur la Chatbox l'ont toujours !

Pouvez-vous m'aider à paramètrer correctement mon chat, pour que tout le monde puisse avoir la même configuration automatiquement (sans utiliser les commandes /sound ON etc...)

En vous remerciant !

Cordialement.
Rorom


Dernière édition par Rorom13 le Lun 22 Juin 2015 - 23:55, édité 1 fois
avatar

Rorom13
Nouveau membre

Masculin
Messages : 19
Inscrit(e) le : 10/03/2014

http://alliancehonor.forumactif.org/
Rorom13 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir un "son" à la récèption de messages sur la Chatbox

Message par horusbk Lun 22 Juin 2015 - 21:56

Bonjour,
Si je comprend bien vous souhaitez avoir une configuration et une seule pour votre chatbox.
Cependant :

J'ai copié le code qui est donné dans : Panneau de config / Affichage / Couleur / Feuille de Style CSS (à la suite, en prenant bien soin de le mettre sur une nouvelle ligne).
Ce serait-ce pas plutôt un jaavscript comme il est mentionné dans le tutoriel à placer dans la gestion de vos codes Java Script dans le Panneau d'Administration.

Regardons le code JS d'un peu plus près :

Code:
window.localStorage && $(window).load(function() {
  var chatbox_script = function() {
    var sounds = {
      'future': 'http://illiweb.com/fa/fdf/future.mp3',
      'hal': 'http://illiweb.com/fa/fdf/hal.mp3',
      'secret': 'http://illiweb.com/fa/fdf/secret.mp3',
      'zelda': 'http://illiweb.com/fa/fdf/zelda.mono.mp3'
    };
    var default_sound = sounds['zelda'];
    var default_freq = 'new';
    var default_when = 'once';
    var default_volume = 100;
 
 
    if(localStorage.cb_sound && !localStorage.cb_sound.indexOf('https://dl.dropboxusercontent.com/u/181621985/')) localStorage.removeItem('cb_sound');
    var a = document.createElement('audio');
    if(!a.canPlayType) return;
    a.volume = Math.min(1, Math.max(0, localStorage.cb_volume||(default_volume/100)));
 
    var origin_send = Chatbox.prototype.send;
    Chatbox.prototype.send = function(params) {
      var m = $.trim($("#message").val());
      if(m.indexOf('/sound')&&m.indexOf('/soudn'))
        return origin_send.call(this, params);
      m = $.trim(m.substr(6)).split(/\s+/,3);
      var bad_apple = false;
      switch(m[0].toLowerCase()) {
        case "":
          if(!a.src) {
            a.src = localStorage.cb_sound||default_sound;
            a.load();
        }
          a.play();
          break;
        case "all":
        case "new":
          localStorage.cb_freq = m[0]; break;
        case "always":
        case "off":
        case "on":
        case "once":
        case "never":
          localStorage.cb_when = m[0]; break;
        case "stop":
          if(!a.paused) a.pause();
          if(!a.ended && a.readyState > 0) a.currentTime = 0;
          break;
        case "pause":
          if(!a.paused) a.pause();
          break;
        case "volume":
          if(m.length>1) {
            localStorage.cb_volume = Math.min(1, Math.max(0, parseFloat(m[1].replace(',','.'))/100));
            a.volume = localStorage.cb_volume;
            break
          }
        default:
          bad_apple = true;
      };
      if(bad_apple) {
        if(m[0] in sounds) {
          m[0]= sounds[m[0]];
        }
        if(m[0]=="default") {
          m[0]=default_sound;
          localStorage.removeItem('cb_sound');
          localStorage.removeItem('cb_freq');
          localStorage.removeItem('cb_volume');
          localStorage.removeItem('cb_when');
          a.volume = Math.min(1, Math.max(0, default_volume/100));
        }
        if(/^https?:\/\/.+/.test(m[0])) {
          localStorage.cb_sound = m[0];
          a.pause();
          a.src = m[0];
          a.load();
          a.play();
        } else {
          var message = $('#message').val();
          alert('/sound [all | new]\n/sound [always | off | on | once | never]\n/sound [stop | pause]\n/sound default\n/sound volume 0-100\n/sound ['+$.map(sounds,function(_,k){return k}).join(' | ')+']\n/sound [http://* | https://*]');
          setTimeout(function(){ $("#message").val(message).select().focus(); }, 100);
          return;
        }
      }
      return $("#message").val('').focus();
    };
 
    $(window).on("focus", function(){ localStorage.removeItem('cb_once'); localStorage.removeItem('cb_blurred') }).on("blur", function(){ localStorage.cb_blurred=1; });
 
    var play_sound = function(){
      if(a.paused || a.ended) {
        if(a.readyState > 0) a.currentTime=0;
        if(!a.src) {
          a.src = localStorage.cb_sound||default_sound;
          a.load()
        }
        a.play()
      }
    };
    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_sound != last_message) {
          var user = $.grep(data.users, function(v){return v.id==chatbox.userId});
          user = user.length ? user[0] : [{}];
          if(this.last_message_sound!==undefined) {
            var freq = (localStorage.cb_freq||default_freq);
            var when = (localStorage.cb_when||default_when);
            if(when != "never" && (when != "off" || localStorage.cb_blurred) && (when != "on" || !localStorage.cb_blurred) && (when != "once" || (localStorage.cb_blurred && !localStorage.cb_once))) {
              if(freq =="all" || (lm.userId!=chatbox.userId && user.username!=lm.username)) {
                if(when!="once" || !localStorage.cb_once) {
                  play_sound();
                  localStorage.cb_once = 1;
                }
              }
            }
          }
          this.last_message_sound = 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){}})
});

Pour changer les sons :
Code:
 var sounds = {
      'future': 'http://illiweb.com/fa/fdf/future.mp3',
      'hal': 'http://illiweb.com/fa/fdf/hal.mp3',
      'secret': 'http://illiweb.com/fa/fdf/secret.mp3',
      'zelda': 'http://illiweb.com/fa/fdf/zelda.mono.mp3'

Vous devez changer les liens entre les ' ... ' par d'autres liens mp3 préalablement hébergés.

Cordialement,
1baptiste
horusbk

horusbk
*****

Masculin
Messages : 625
Inscrit(e) le : 14/02/2015

http://horus.forumactif.com/
horusbk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir un "son" à la récèption de messages sur la Chatbox

Message par Rorom13 Lun 22 Juin 2015 - 22:12

Merci beaucoup pour cette réponse rapide et clair !!

Sur le tutoriel, il y parle de "code CSS" à mettre sur la "feuille".

Code:
        window.localStorage && $(window).load(function() {
          var chatbox_script = function() {
            var sounds = {
              'future': 'http://illiweb.com/fa/fdf/future.mp3',
              'hal': 'http://illiweb.com/fa/fdf/hal.mp3',
              'secret': 'http://illiweb.com/fa/fdf/secret.mp3',
              'zelda': 'http://illiweb.com/fa/fdf/zelda.mono.mp3'
            };
            var default_sound = sounds['zelda'];
            var default_freq = 'new';
            var default_when = 'once';
            var default_volume = 100;
       
       
            if(localStorage.cb_sound && !localStorage.cb_sound.indexOf('https://dl.dropboxusercontent.com/u/181621985/')) localStorage.removeItem('cb_sound');
            var a = document.createElement('audio');
            if(!a.canPlayType) return;
            a.volume = Math.min(1, Math.max(0, localStorage.cb_volume||(default_volume/100)));
       
            var origin_send = Chatbox.prototype.send;
            Chatbox.prototype.send = function(params) {
              var m = $.trim($("#message").val());
              if(m.indexOf('/sound')&&m.indexOf('/soudn'))
                return origin_send.call(this, params);
              m = $.trim(m.substr(6)).split(/\s+/,3);
              var bad_apple = false;
              switch(m[0].toLowerCase()) {
                case "":
                  if(!a.src) {
                    a.src = localStorage.cb_sound||default_sound;
                    a.load();
                }
                  a.play();
                  break;
                case "all":
                case "new":
                  localStorage.cb_freq = m[0]; break;
                case "always":
                case "off":
                case "on":
                case "once":
                case "never":
                  localStorage.cb_when = m[0]; break;
                case "stop":
                  if(!a.paused) a.pause();
                  if(!a.ended && a.readyState > 0) a.currentTime = 0;
                  break;
                case "pause":
                  if(!a.paused) a.pause();
                  break;
                case "volume":
                  if(m.length>1) {
                    localStorage.cb_volume = Math.min(1, Math.max(0, parseFloat(m[1].replace(',','.'))/100));
                    a.volume = localStorage.cb_volume;
                    break
                  }
                default:
                  bad_apple = true;
              };
              if(bad_apple) {
                if(m[0] in sounds) {
                  m[0]= sounds[m[0]];
                }
                if(m[0]=="default") {
                  m[0]=default_sound;
                  localStorage.removeItem('cb_sound');
                  localStorage.removeItem('cb_freq');
                  localStorage.removeItem('cb_volume');
                  localStorage.removeItem('cb_when');
                  a.volume = Math.min(1, Math.max(0, default_volume/100));
                }
                if(/^https?:\/\/.+/.test(m[0])) {
                  localStorage.cb_sound = m[0];
                  a.pause();
                  a.src = m[0];
                  a.load();
                  a.play();
                } else {
                  var message = $('#message').val();
                  alert('/sound [all | new]\n/sound [always | off | on | once | never]\n/sound [stop | pause]\n/sound default\n/sound volume 0-100\n/sound ['+$.map(sounds,function(_,k){return k}).join(' | ')+']\n/sound [http://* | https://*]');
                  setTimeout(function(){ $("#message").val(message).select().focus(); }, 100);
                  return;
                }
              }
              return $("#message").val('').focus();
            };
       
            $(window).on("focus", function(){ localStorage.removeItem('cb_once'); localStorage.removeItem('cb_blurred') }).on("blur", function(){ localStorage.cb_blurred=1; });
       
            var play_sound = function(){
              if(a.paused || a.ended) {
                if(a.readyState > 0) a.currentTime=0;
                if(!a.src) {
                  a.src = localStorage.cb_sound||default_sound;
                  a.load()
                }
                a.play()
              }
            };
            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_sound != last_message) {
                  var user = $.grep(data.users, function(v){return v.id==chatbox.userId});
                  user = user.length ? user[0] : [{}];
                  if(this.last_message_sound!==undefined) {
                    var freq = (localStorage.cb_freq||default_freq);
                    var when = (localStorage.cb_when||default_when);
                    if(when != "never" && (when != "off" || localStorage.cb_blurred) && (when != "on" || !localStorage.cb_blurred) && (when != "once" || (localStorage.cb_blurred && !localStorage.cb_once))) {
                      if(freq =="all" || (lm.userId!=chatbox.userId && user.username!=lm.username)) {
                        if(when!="once" || !localStorage.cb_once) {
                          play_sound();
                          localStorage.cb_once = 1;
                        }
                      }
                    }
                  }
                  this.last_message_sound = 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){}})
        });


Ce n'est pas celui la ??
Ou alors, je n'ai simplement pas compris !

Donc, je dois coller ce code dans la partie JS, et le modifier si besoin directement de cette endroit ?
Pour ce qui est des "sons", est-il possible d'utiliser ceux la ?

Code:
        var sounds = {
              'future': 'http://illiweb.com/fa/fdf/future.mp3',
              'hal': 'http://illiweb.com/fa/fdf/hal.mp3',
              'secret': 'http://illiweb.com/fa/fdf/secret.mp3',
              'zelda': 'http://illiweb.com/fa/fdf/zelda.mono.mp3'

(De cette façon : var default_sound = sounds['https://illiweb.com/fa/fdf/future.mp3']; ??)

PS : Je suis vraiment désolé de tout expliquer de cette façon, mais j'ai un peu de mal à tout expliquer clairement, sans en oublier la moitié ^^'
avatar

Rorom13
Nouveau membre

Masculin
Messages : 19
Inscrit(e) le : 10/03/2014

http://alliancehonor.forumactif.org/
Rorom13 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir un "son" à la récèption de messages sur la Chatbox

Message par horusbk Lun 22 Juin 2015 - 22:15

Bonsoir. Vous avez très bien compris. Il faut placer le code dans la gestion des Java Script.

Ensuite pour les musiques, le lien doit être entouré de { } et non de crochet [ ]

Mais sinon vous avez tout compris.

Cordialement
1baptiste
horusbk

horusbk
*****

Masculin
Messages : 625
Inscrit(e) le : 14/02/2015

http://horus.forumactif.com/
horusbk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir un "son" à la récèption de messages sur la Chatbox

Message par Rorom13 Lun 22 Juin 2015 - 22:30

Je viens d'essayer et rien n'y fait ... aucun son !

Je suis allé copié/collé ce code dans la partie J.S, sans rien modifier et il n'y a pas de son quand je reçois un message, ou quand la personne reçoit.
Code:
        window.localStorage && $(window).load(function() {
          var chatbox_script = function() {
            var sounds = {
              'future': 'http://illiweb.com/fa/fdf/future.mp3',
              'hal': 'http://illiweb.com/fa/fdf/hal.mp3',
              'secret': 'http://illiweb.com/fa/fdf/secret.mp3',
              'zelda': 'http://illiweb.com/fa/fdf/zelda.mono.mp3'
            };
            var default_sound = sounds['zelda'];
            var default_freq = 'new';
            var default_when = 'once';
            var default_volume = 100;
     
     
            if(localStorage.cb_sound && !localStorage.cb_sound.indexOf('https://dl.dropboxusercontent.com/u/181621985/')) localStorage.removeItem('cb_sound');
            var a = document.createElement('audio');
            if(!a.canPlayType) return;
            a.volume = Math.min(1, Math.max(0, localStorage.cb_volume||(default_volume/100)));
     
            var origin_send = Chatbox.prototype.send;
            Chatbox.prototype.send = function(params) {
              var m = $.trim($("#message").val());
              if(m.indexOf('/sound')&&m.indexOf('/soudn'))
                return origin_send.call(this, params);
              m = $.trim(m.substr(6)).split(/\s+/,3);
              var bad_apple = false;
              switch(m[0].toLowerCase()) {
                case "":
                  if(!a.src) {
                    a.src = localStorage.cb_sound||default_sound;
                    a.load();
                }
                  a.play();
                  break;
                case "all":
                case "new":
                  localStorage.cb_freq = m[0]; break;
                case "always":
                case "off":
                case "on":
                case "once":
                case "never":
                  localStorage.cb_when = m[0]; break;
                case "stop":
                  if(!a.paused) a.pause();
                  if(!a.ended && a.readyState > 0) a.currentTime = 0;
                  break;
                case "pause":
                  if(!a.paused) a.pause();
                  break;
                case "volume":
                  if(m.length>1) {
                    localStorage.cb_volume = Math.min(1, Math.max(0, parseFloat(m[1].replace(',','.'))/100));
                    a.volume = localStorage.cb_volume;
                    break
                  }
                default:
                  bad_apple = true;
              };
              if(bad_apple) {
                if(m[0] in sounds) {
                  m[0]= sounds[m[0]];
                }
                if(m[0]=="default") {
                  m[0]=default_sound;
                  localStorage.removeItem('cb_sound');
                  localStorage.removeItem('cb_freq');
                  localStorage.removeItem('cb_volume');
                  localStorage.removeItem('cb_when');
                  a.volume = Math.min(1, Math.max(0, default_volume/100));
                }
                if(/^https?:\/\/.+/.test(m[0])) {
                  localStorage.cb_sound = m[0];
                  a.pause();
                  a.src = m[0];
                  a.load();
                  a.play();
                } else {
                  var message = $('#message').val();
                  alert('/sound [all | new]\n/sound [always | off | on | once | never]\n/sound [stop | pause]\n/sound default\n/sound volume 0-100\n/sound ['+$.map(sounds,function(_,k){return k}).join(' | ')+']\n/sound [http://* | https://*]');
                  setTimeout(function(){ $("#message").val(message).select().focus(); }, 100);
                  return;
                }
              }
              return $("#message").val('').focus();
            };
     
            $(window).on("focus", function(){ localStorage.removeItem('cb_once'); localStorage.removeItem('cb_blurred') }).on("blur", function(){ localStorage.cb_blurred=1; });
     
            var play_sound = function(){
              if(a.paused || a.ended) {
                if(a.readyState > 0) a.currentTime=0;
                if(!a.src) {
                  a.src = localStorage.cb_sound||default_sound;
                  a.load()
                }
                a.play()
              }
            };
            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_sound != last_message) {
                  var user = $.grep(data.users, function(v){return v.id==chatbox.userId});
                  user = user.length ? user[0] : [{}];
                  if(this.last_message_sound!==undefined) {
                    var freq = (localStorage.cb_freq||default_freq);
                    var when = (localStorage.cb_when||default_when);
                    if(when != "never" && (when != "off" || localStorage.cb_blurred) && (when != "on" || !localStorage.cb_blurred) && (when != "once" || (localStorage.cb_blurred && !localStorage.cb_once))) {
                      if(freq =="all" || (lm.userId!=chatbox.userId && user.username!=lm.username)) {
                        if(when!="once" || !localStorage.cb_once) {
                          play_sound();
                          localStorage.cb_once = 1;
                        }
                      }
                    }
                  }
                  this.last_message_sound = 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){}})
        });

Je ne comprends vraiment pas ...
Pourtant au début, quand j'ai essayé j'avais un son (en collant dans la feuille CSS il me semble)
Ensuite en voulant modifier le volume, le son, je n'avais plus rien.
J'ai donc supprimé, recollé et plus rien !

Par contre pour diminuer le volume j'utilisais la commande "/sound volume 0-10" directement dans la chatbox, et le son diminué.

La, honnêtement ... je ne comprends pas trop, même avec vos explications =/


PS : Dans le tutoriel, il parle d'insérer les scripts sur les pages de votre forum contenant votre/vos chatbox ET ajouter les codes CSS dans Panneau d'administration > Affichage > Couleurs | Feuille de style.
Peut-être dois-je le faire à deux endroit ?
avatar

Rorom13
Nouveau membre

Masculin
Messages : 19
Inscrit(e) le : 10/03/2014

http://alliancehonor.forumactif.org/
Rorom13 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Avoir un "son" à la récèption de messages sur la Chatbox

Message par Rorom13 Lun 22 Juin 2015 - 23:54

Problème résolu !

Il suffisait simplement de coller le code dans le script J.S, le modifier directement ...
J'avais oublié de supprimé une commande !!

Merci beaucoup et encore désolé !
avatar

Rorom13
Nouveau membre

Masculin
Messages : 19
Inscrit(e) le : 10/03/2014

http://alliancehonor.forumactif.org/
Rorom13 a été remercié(e) par l'auteur de ce sujet.

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

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum