• Effectuer un code Javasript si le visiteur a une notification

    Vous avez déjà peut-être remarqué que lorsque vous vous promenez sur EklaFastoche et que vous avez une ou plusieurs notifications, l’icône de notifications de la Menubar devient noir et un point rouge avec le nombre de notifications apparait ?

    Eh bien ceci grâce à un code Javascript, que nous allons apprendre à réaliser ici !

    Donc en fait, pour savoir si le visiteur a une notification, on va demander d'abord si le visiteur a l’icône de notification (s'il est connecté) :

    A insérer avant chaque code :

    if (document.querySelector("#menubar_notifications")) {
        // a remplacer par le code
    }

    Si oui, on va demander si il y a un nombre de notifications indiqué (celui en rouge).

    Si oui, cela veut dire le visiteur a une ou plusieurs notifications, donc on va effecteur le code voulu,

    si non, cela veut dire que le visiteur n'a pas de notification, donc on va effecteur le code voulu, ou ne rien effectuer, au choix.

    Voici par exemple un code JS qui va envoyer un message indiquant si oui ou non le visiteur a une notification :

    if (document.querySelector("#nb_new_notifs").innerHTML == "") {
        alert('Vous n\'avez pas de notifications.');
    // Vos autres fonctions ici
    } else {
        alert('Vous avez une ou plusieurs notifications.');
    // Vos autres fonctions ici
    }

    Si vous avez juste envie d'effectuer un code JS si le visiteur a une ou plusieurs notifications, alors au lieu de demander s'il y a un chiffre dans les notifications, on va plutôt demander "est-ce qu'il n'y a pas de nombre ?". Ingénieux non ?

    if (document.querySelector("#nb_new_notifs").innerHTML != "") {
        alert('Vous avez une ou plusieurs notifications.');
    // Vos autres fonctions ici
    }

    Bonus : récupérer le nombre de nouvelles notifications du visiteur

    Peut-être avez-vous envie d'avoir la précision sur le nombre de notification du visiteur si il en a, si oui, alors c'est très simple, voici comment nous allons le récupérer :

    document.querySelector("#nb_new_notifs").innerHTML

    Bon, là ça veut rien dire, mais voici une petite fonction pour savoir combien de notifs non lues a le visiteur, et s'il n'en a pas dire qu'il en a zéro :

    if(typeof(onJSFilesLoaded) != "object")
        onJSFilesLoaded = [];
    onJSFilesLoaded.push(function(){
    function savoirNombreNotifs() {
       if (document.querySelector("#nb_new_notifs").innerHTML != "") {
        return document.querySelector("#nb_new_notifs").innerHTML;
       } else {
        return '0';
       }
    }
    });

    Ce qui pourrait donner en tout :

    if(typeof(onJSFilesLoaded) != "object")
        onJSFilesLoaded = [];
    onJSFilesLoaded.push(function(){
    function savoirNombreNotifs() {
       if (document.querySelector("#nb_new_notifs").innerHTML != "") {
        return document.querySelector("#nb_new_notifs").innerHTML;
       } else {
        return '0';
       }
    }
    alert('Vous avez ' + savoirNombreNotifs() + ' notifications.');
    // Vos autres fonctions ici
    });

    Voilà, j'espère que ce tutoriel vous a aidé, si vous avez des questions n'hésitez pas à les poser en commentaires, et à bientôt sur un autre tutoriel !


    Tags Tags :
  • Commentaires

    Aucun commentaire pour le moment

    Suivre le flux RSS des commentaires

    Vous devez être connecté pour commenter

Veuillez activer le Javascript pour naviguer correctement sur EklaFastoche