AccueilRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.


1 résultat trouvé pour punBB

Afficher la zone Lancés de dés dans une catégorie précise - Lun 16 Mar 2015 - 13:01



Afficher la zone "Lancés de dés" seulement dans un forum en particulier



Ce code permet d'afficher la zone "lancer de dés" seulement dans certaines catégories / forums ! (version phpBB2)

Note : le code n'est pas sous hide, je tenterai de vérifier les commentaires donc si vous avez la moindre question pour une amélioration / une précision, n'hésitez pas. ♥

Ce code a été créé pour un forum en phphbb2, mais il fonctionne aussi sur PunBB et Invision :)


Rendu



Pour en savoir plus sur le lancé de dés, je vous invite à lire le Tutoriel officiel de ForumActif ainsi que le Tutoriel par Halloween sur Never Utopia


Par défaut, le lancé de dés est disponible dans tous les sujets de votre forum.
Mais, parfois on ne l'utilise que dans une zone précise du forum, et on n'en a pas besoin partout.
Cette option permet de masquer la zone "Lancé de dés" par défaut puis l'afficher seulement dans un forum / catégorie :)
/!\ Attention, je parle ici de l'ensemble de zone lancé de dé, pas d'afficher seulement un dé en particulier Wink

Ce code peut-il totalement empêcher le lancé de dés dans les forums non autorisés ? Non. Dans les catégories où on ne souhaite pas avoir le lancé de dés, la zone est seulement masquée visuellement, les membres peuvent toujours y accéder dans le code source.


Attention, il ne faut pas accepter l'option "Activer le bbcode [ roll ] pour le lancé de dé"
En effet, cette option permet d'éditer un message pour changer le lancé de dé.


Connaissances



Avant de se lancer dans le code, on commence par réfléchir à ce qu'on sait :)

Où se trouvent la zone lancé de dé ? → dans les pages "Répondre" et quand on prévisualise un message de réponse.
On va donc commencer par regarder si on est bien sur une page pour poster un message. Quand on envoie un message, notre URL ressemble à ceci : https://www.never-utopia.com/post

Comment savoir dans quelle catégorie / forum on est ? → le fil d’Ariane
Quand on répond à un sujet, on a le fil d'Ariane en haut.
Tag punbb sur Never Utopia - graphisme, codage et game design 66RzZUX
Ce fil d’Ariane est constitué de liens qui permettent de naviguer sur le forum, et on peut donc regarder si les liens sont dans notre liste des forums "autorisés" ou non.

Fonctionnement



Donc, si on suit la logique, voici ce qu'on peut faire :
(il y a souvent 100 manières de faire la même chose. Ici j'ai fait un choix d'appréhender le problème comme ça, mais on aurait pu s'y prendre autrement Very Happy)


  1. On établit une liste de forums et catégories où le lancé de dés est autorisé.
  2. On va vérifier si le chemin de la page sur laquelle on se trouve est bien /post.
  3. On regarde une zone de lancé de dé sur la page (si la zone n'est pas là, ça ne sert à rien de continuer le reste du code) et si elle est là, on la cache.
    Pourquoi ne pas cacher l'élément par défaut tout simplement (en CSS), puis l'afficher à certains moments ? Par ce que si la personne a le javascript désactivé ou bien qu'il y a une erreur de JS dans la page... Notre JS pour afficher la zone de lancé de dé juste aux bons endroits ne fonctionnera pas.

  4. On récupère les liens du fil d’Ariane.
  5. On regarde si l'un de ces liens est présent dans notre liste "Fora / catégories autorisés".
    → si oui : on affiche la zone lancé de dés



Template posting_body


PA > Affichages > Templates > Poster & Messages privés

On va commencer par entourer toute la zone dans une div, pour pouvoir la sélectionner ensuite en javascript.

On va repérer toute la zone qui correspond au lancé de dé, elle commence ici :
Code:
<!-- BEGIN switch_roll_dice -->


Et se finit ici
Code:
<!-- END switch_roll_dice -->


Tout le code au milieu ne s'affiche que si le lancé de dé est activé :)

On va donc remplacer
Code:
<!-- BEGIN switch_roll_dice -->

Par :
Code:
<!-- BEGIN switch_roll_dice -->
    <div class="js-roll-dice">
    <!-- modification pour le javascript "afficher le lancer de dés seulement sur certaines pages" -->


Et ensuite
Code:
<!-- END switch_roll_dice -->


Par
Code:
 </div> <!-- fermeture de .js-roll-dice -->
<!-- END switch_roll_dice -->


On valide, on publie, et normalement, il n'y a aucun changement visuel.

Javascript


PA > Modules > Html & Javascript
On crée un nouveau javascript activé sur toutes les pages avec un nom clair.

Je vous mets l'ensemble du code :
Code:
/*
 * Tuto lancé de dés
 * Masquer la zone lancé de dés partout sauf dans certains forums
 *
 * version : phpbb2
 * Never Utopia
 */
$(function () {
    if (document.location.pathname === "/post") {

        /* url des parties autorisées
         * MODIFIER ICI
         * */
        /* url des parties autorisées */
        var exceptions = [
            "/f6-banniere-concours-ga",
            "/f3-presentations",
            "/c5-arene"
        ];
        
        var $dices = $(".js-roll-dice").hide();

        if ($dices.length < 1) return;

        $("a.nav").each(function () {
            if (exceptions.indexOf($(this).attr("href")) > -1) {
                $dices.show();
                return false;
            }
        });
    }
});


La version avec plus de commentaires :
Spoiler:

Code:
/*
 * Tuto lancé de dés
 * Masquer la zone lancé de dés partout sauf dans certains forums
 *
 * version : phpbb2
 * Never Utopia
 */
$(function () {
    /* on vérifie si on est dans une page pour poster */
    if (document.location.pathname === "/post") {

        /* url des parties autorisées */
        var exceptions = [
            "/f6-banniere-concours-ga",
            "/f3-presentations",
            "/c5-arene"
        ];
        
        /* on sélectionne la zone lancé de dé et on la masque */
        var $dices = $(".js-roll-dice").hide();

        /* on vérifie s'il y a bien le lancé de dés sur la page */
        if ($dices.length < 1) return;

        /* On regarde chaque liens sur le fil d'Arianne */
        $("a.nav").each(function () {
            /*On regarde s'il est présent dans les exceptions  */
            if (exceptions.indexOf($(this).attr("href")) > -1) {
                /* si on est dans un forum autorisé */
                $dices.show(); /* on affiche le lancé de dé */
                return false; /* on sort du each */
            }
        });
    }
});



Rajouter les lien des catégories autoriseés


On modifie cette partie là :
Code:
/* url des parties autorisées */
var exceptions = [
    "/f6-banniere-concours-ga",
    "/f3-presentations",
    "/c5-arene"
];


Prenez l'url de votre catégorie exemple, et gardez juste la partie après le nom de domaine.
Ainsi si vous avez : https://www.never-utopia.com/f3-presentations
Il faut mettre "/f3-presentations".

De la même manière, si on a https://www.never-utopia.com/c21-communaute
On va mettre : "/c21-communaute".

Attention, il y a des virgules entre chaque lien, mais pas de virgule à la fin Wink

Exemples:
Exemple avec seulement 2 liens :
Code:
/* url des parties autorisées */
var exceptions = [
    "/f3-presentations",
    "/c5-arene"
];


Vous pouvez très bien les mettre sur la même ligne :
Code:
/* url des parties autorisées */
var exceptions = ["/f3-presentations","/c5-arene"];


Exemple avec seulement 1 lien :
Code:
/* url des parties autorisées */
var exceptions = ["/f3-presentations"];



Toutes les sous catégories et sous forums à l'intérieur des liens que vous mettrez seront pris en compte. Ainsi si je mets "Communauté" dans les exceptions, tous les sous forums de cette catégorie auront la zone "Lancé de dés" affichée.


Conclusion



A partir de ce principe là, on pourrait aussi autoriser le lancé de dés partout, sauf sur certains forums (^-^).

Pour tout problème, je vous invite à vous rendre dans la section "Problème en codage".


Revenir en haut

La date/heure actuelle est Mer 1 Avr 2020 - 2:49