Placement d'un bouton animateur comme ceux Aministrateur et Modérateur sur le message rapide

[Dragon594]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Opera, Safari, Autre
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Aujourd'hui
Lien du forum : http://dragon-graphisme59.forumactif.org

Description du problème

Bonjour,

Je viens vers vous déjà pour savoir ci cela est possible de le faire en ajoutant le bouton animateur et faire le même concept que pour les boutons " Administrateur et Modérateur " qui se trouve sur le lien ci-dessous.

https://forum.forumactif.com/t357504-bouton-avertissement-rapide-pour-modo-et-admin

Ci cela est possible je vous fourni déjà l'image du bouton animateur en question

Code:

http://ahp.li/9b4b33445111d1331db6.png

Bien sur ci vous avez d'autre question je suis près à y répondre ou ci vous avez besoin de code ou autre.

Je peux déjà vous fournir ceci le CSS ainsi que sont Scrip et également les code des widgets persos.

Scrip :

Code:

$(function() {  
        
        jQuery('div.postbody div').each(function () {
        if(jQuery(this).text().indexOf('[adm]') != -1) {
        jQuery(this).html(jQuery(this).html().replace(/\[adm\](.+?)\[\/adm\]/gi, '<div class="adm_mess"><div class="titl">Avertissement Administrateur</div><div>$1 </div></div>')) }  
        });  
        
        jQuery('div.postbody div').each(function () {
        if(jQuery(this).text().indexOf('[mod]') != -1) {
        jQuery(this).html(jQuery(this).html().replace(/\[mod\](.+?)\[\/mod\]/gi, '<div class="mod_mess"><div class="titl">Avertissement Modérateur</div><div>$1 </div></div>')) }  
        });  });

CSS :

Code:

/*()Bouton avertissement rapide */
        
        .mod_mess, .adm_mess {
        margin: 5px auto;
        width: 90%;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        }
        
        .mod_mess a.postlink, .adm_mess a.postlink {
        color: #FFF !important;
        text-decoration: underline !important;
        }
        
        /* administrateur bb-Code - bloc de message d'enregistrement */
        
        .adm_mess {
        background: #e54858;
        background: -moz-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%, #e54858), color-stop(100%, #f5b57a));
        background: -webkit-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: -o-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: -ms-linear-gradient(left, #e54858 0%, #f5b57a 100%);
        background: linear-gradient(left, #e54858 0%, #f5b57a 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e54858", endColorstr="#f5b57a", GradientType=1);
        -webkit-box-shadow: 4px 4px 0px 0px #352727;
        -moz-box-shadow: 4px 4px 0px 0px #352727;
        box-shadow: 4px 4px 0px 0px #352727;
        }
        
        /* Administrateur bb-Code - mise en page */
        .adm_mess .titl {
        font-size: 15px;
        font-weight: bold;
        padding: 5px;
        border-bottom: 1px dashed #B60505;  
        }
            
        /* Administrateur BB-Code - présentation du texte */
        .adm_mess .titl + div {
        display: block;
        margin-left: 10px;
        padding: 25px 5px 25px 80px;
        background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome-10.png) no-repeat left center;
        }
        
        /* Messages BB-Code - bloc de message d'enregistrement */
        
        .mod_mess {
        background: #5c93f5;
        background: -moz-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: -webkit-gradient(linear, left top, right top, color-stop(0%, #5c93f5), color-stop(100%, #afcfda));
        background: -webkit-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: -o-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: -ms-linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        background: linear-gradient(left, #5c93f5 0%, #afcfda 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5c93f5", endColorstr="#afcfda", GradientType=1);
        -webkit-box-shadow: 4px 4px 0px 0px #352727;
        -moz-box-shadow: 4px 4px 0px 0px #352727;
        box-shadow: 4px 4px 0px 0px #352727;
        }
        
        /* Messages BB-Code - Un titre */
        .mod_mess .titl {
        font-size: 15px;
        font-weight: bold;
        padding: 5px;
        border-bottom: 1px dashed #0D4DD3;    
        }
            
        /* modernité BB-Code - présentation du texte */
        .mod_mess .titl + div {
        display: block;
        margin-left: 10px;
        padding: 25px 5px 25px 80px;
        background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome610.png) no-repeat left center;  
        }

Les widgets :

Scrip pour le widget admid :

Code:

 <script type="text/javascript">
        jQuery(document).ready(function(){
        
        jQuery("#text_editor_textarea").before("<img src='http://ahp.li/e01381c1554c2a64835a.png' title='Avertissement Admin'  id='admbutt' />");
        
        jQuery('#admbutt').click(function(){
        jQuery("div.sceditor-toolbar + iframe").contents().find("body").append('[adm][/adm]');
        jQuery('.sceditor-container textarea')[0].value += '[adm][/adm]'
        });
        
        });
        </script>

Scrip pour le widget modo :

Code:

<script type="text/javascript">
        jQuery(document).ready(function() {
        
        jQuery("#text_editor_textarea").before("<img src='http://ahp.li/92b1b40f52529477181b.png' title='Avertissement Modo'  id='modbutt' />");
        
        jQuery('#modbutt').click(function(){
        jQuery("div.sceditor-toolbar + iframe").contents().find("body").append('[mod][/mod]');
        jQuery('.sceditor-container textarea')[0].value += '[mod][/mod]'
        });
        
        });
        </script>

Donc pour le widget animateur la permission de celui-ci sera pour l'administrateur uniquement.

Voilà je pense avoir tout mis.

Sur ceux je vous remercie en avance pour toutes informations qui me serai utile pour cette conception.

Cordialement Dragon594.

[Dragon594]

Salut,

Toujours aucune réponse alors je relance d'un UP.

[Chacha]

Bonjour, Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message. Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »

[Dragon594]

Salut Chacha,

Non, non, cela est toujours actif alors je relance d'un UP.

Et merci à toi de me l'avoir rappeler.

Bon fête de Pâques.

[Dragon594]

Salut,

Toujours aucune réponse alors je relance d'un UP.

[Dragon594]

Salut,

Toujours pas de news cela m'étonne de vous, les craques des codages et templates.

[MasDan]

Bonjour,

J'ai personnalisé la version du tuto. Ma version fonctionne avec un CSS et un seul javascript (pas de widget).
Les boutons sont disponibles pour les messages et les MP.

Intéressé à cette version ?

[Dragon594]

Salut MasDan,

Et bien pour être franc avec toi l'ami, tu as piqué ma curiosité !

Donc oui, je suis intéresser par ta version et merci à toi pour ton soutien.

Sur ceux bonne journée.

Amicalement Dragon594.

[MasDan]

Bonjour,

Voici les modifications.

À votre CSS
rechercher

Code:

.mod_mess, .adm_mess {

et remplacer par

Code:

.mod_mess, .adm_mess, .anim_mess {

rechercher

Code:

.mod_mess a.postlink, .adm_mess a.postlink {

et remplacer par

Code:

.mod_mess a.postlink, .adm_mess a.postlink, .anim_mess a.postlink {

et ajouter

Code:

/* début anim
/* Animateur bb-Code - bloc de message d'enregistrement */

.anim_mess {
  background: #c76f2b;
  background: -moz-linear-gradient(left, #c76f2b 0%, #f5b57a 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #c76f2b), color-stop(100%, #f5b57a));
  background: -webkit-linear-gradient(left, #c76f2b 0%, #f5b57a 100%);
  background: -o-linear-gradient(left, #c76f2b 0%, #f5b57a 100%);
  background: -ms-linear-gradient(left, #c76f2b 0%, #f5b57a 100%);
  background: linear-gradient(left, #c76f2b 0%, #f5b57a 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c76f2b", endColorstr="#f5b57a", GradientType=1);
  -webkit-box-shadow: 4px 4px 0px 0px #352727;
  -moz-box-shadow: 4px 4px 0px 0px #352727;
  box-shadow: 4px 4px 0px 0px #352727;
}
/* Animateur bb-Code - mise en page */
.anim_mess .titl {
  font-size: 15px;
  font-weight: bold;
  padding: 5px;
  border-bottom: 1px dashed #B60505; 
}

/* Animateur BB-Code - présentation du texte */
.anim_mess .titl + div {
  display: block;
  margin-left: 10px;
  padding: 25px 5px 25px 80px;
  background: transparent url(http://i33.servimg.com/u/f33/17/37/83/89/gnome-10.png) no-repeat left center;
}
/* fin anim

Les widgets et javascript du tuto ne sont plus requis, ils sont remplacés par le code javascript suivant (placement: sur toutes les pages)

Code:

$(function(){
  AvertMsg('div.postbody div');
  AvertMsg('div.postbody');
 
  if (_userdata["user_level"]==1) {
    $("#text_editor_textarea").before("<img src='http://i73.servimg.com/u/f73/11/66/92/55/bouton13.png' title='Avertissement Admin'  id='admbutt' />");
    $('#admbutt').click(function() {
      $("div.sceditor-toolbar + iframe").contents().find("body").append('[adm][/adm]');
      $('.sceditor-container textarea')[0].value+='[adm][/adm]'
    })
  }

  if (_userdata["user_level"]==2) {
    $("#text_editor_textarea").before("<img src='http://i73.servimg.com/u/f73/11/66/92/55/bouton12.png' title='Avertissement Modo'  id='modbutt' />");
    $('#modbutt').click(function() {
      $("div.sceditor-toolbar + iframe").contents().find("body").append('[mod][/mod]');
      $('.sceditor-container textarea')[0].value+='[mod][/mod]'
    })
  }
 
  if(_userdata["user_level"]==1) {
    $("#text_editor_textarea").before("<img src='http://ahp.li/9b4b33445111d1331db6.png' title='Avertissement Anim'  id='animbutt' />");
    $('#animbutt').click(function() {
      $("div.sceditor-toolbar + iframe").contents().find("body").append('[anim][/anim]');
      $('.sceditor-container textarea')[0].value+='[anim][/anim]'
    })
  }
 
});
 
function AvertMsg(sel) {
  $(sel).each(function() {
    if($(this).text().indexOf('[adm]')!=-1) {
      $(this).html($(this).html().replace(/\[adm\](.+?)\[\/adm\]/gi,'<div class="adm_mess"><div class="titl">Avertissement Administrateur</div><div>$1 </div></div>'))
      }
     
    if($(this).text().indexOf('[mod]')!=-1) {
      $(this).html($(this).html().replace(/\[mod\](.+?)\[\/mod\]/gi,'<div class="mod_mess"><div class="titl">Avertissement Modérateur</div><div>$1 </div></div>'))
    }
   
    if($(this).text().indexOf('[anim]')!=-1) {
      $(this).html($(this).html().replace(/\[anim\](.+?)\[\/anim\]/gi,'<div class="anim_mess"><div class="titl">Avertissement Animateur</div><div>$1 </div></div>'))
    }
   
  })
};

[Dragon594]

Bonsoir MasDan,

Je te remercie pour cela mon ami et je regarderai cela de plus prêt tout à l'heure.

Et je reviendrais par la suite te dire ce qu'il en est.

Merci encore et bonne fin de soirée.

Dragon594.

[Dragon594]

Salut MasDan,

Donc je reviens à propos des modifications que tu m'as donné plus au dessus l'ami en te remercient encore pour ton aide.

Pour ce qui est de la modification modo, j'ai du replacer le widget car celui-ci ne figurer par sur le haut du message rapide ( je parle du bouton à proprement dit ).

Voici en image de ce que j'obtiens suite à cela car les image explique mieux que les mots.



Voilà j'attends de voir la suite de ce que tu vas me dire l'ami, et dans cette attente je remet cela en conformité sur le forum.

Sur ceux bonne fin de soirée et bon week-end l'ami.

Dragon594.

[MasDan]

Bonjour,

Les permissions sont les suivantes
Pour les admins, les boutons Admin, anim..
Pour les modos, le bouton Modo.

Le bouton Modo est prévu pour les modérateurs seulement si vous voulez la permission pour les admin aussi rechercher (ligne 13)

Code:

if (_userdata["user_level"]==2) {

et remplacer par

Code:

if (_userdata["user_level"]!=0) {

Après cette modification de votre javascript, les admins auront les 3 boutons et les modos le bouton modo.

[Dragon594]

Re,

Oui c'est justement ce que je veux faire l'ami.

Donc je vais regarder cela et je vous dis de quoi cela en retourne.

[Dragon594]

Re,

Cela fonctionne nickel comme cela l'ami mais puis-je te demander quelques chose de plus ?

Et bien à vrai dire comme tu as pu le remarquer les petits triangles pour l'administrateur et l'animateur sont identique donc j'aimerai changer celui de l'administrateur par celui ci-dessous.



Lien url de ce triangle :

Code:

http://ahp.li/b2c2ffcd24ddfd9bdf81.png

Donc est ce possible l'ami ??

[Dragon594]

Re,

Et bien finalement j'ai trouvé comment changer cela l'ami.

Donc par conséquent je mets ce sujet en résolue en te remercient encore beaucoup pour ton aide précieuse.

Dragon594.