Script de choix d'image de fond fait disparaître l'éditeur

3 participants

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

Résolu Script de choix d'image de fond fait disparaître l'éditeur

Message par Mattatat Jeu 17 Avr 2014 - 20:57

Bonjour à tous, et merci pour votre temps.
J'ai cherché un peu partout et je n'ai pas trouvé. J'ai suivi l'astuce qui permets d'ajouter un bouton de choix d'image de fond dans un message, celle ci : https://forum.forumactif.com/t355590-bouton-de-choix-d-image-de-fond-pour-message.

Le bouton s'affiche, tout va bien, je peux sélectionner mon arrière plan dans mon message, je le poste, tout va bien. Puis lorsque je veux faire une réponse à ce message, l'éditeur à disparu. L'éditeur remarche sur un autre sujet, jusqu'à ce que l'on utilise ce bouton.

Avant :
Script de choix d'image de fond fait disparaître l'éditeur 1397760717-av

Après :
Script de choix d'image de fond fait disparaître l'éditeur 1397760716-ap

Notez que je n'ai touché le script qu'uniquement pour mettre mes images, et j'ai tout remplacé pour être sur, même résultat.

Voici le script :
Code:
$(function() {
  $("div.postbody").each(function() {
    var n = this;
    if($(".post-entry", n).length) {
      n = $(".post-entry", n)[0]
    }else {
      if($(".content", n).length) {
        n = $(".content", n)[0]
      }
    }
    while(n.nodeType != 3 && n.hasChildNodes()) {
      n = n.childNodes[0]
    }
    if(n.nodeType != 3) {
      return val
    }
    if(n.nodeValue.substr(0,  != "[postbg=") {
      return val
    }
    var m = n.nodeValue.match(/^\[postbg=([^\[]*)\]/);
    $(this).closest("div.post-container,div.post,td.row1,td.row2,div.postmain").addClass("postbg").css("background-image", "url(" + m[1] + ")");
    n.nodeValue = n.nodeValue.replace(/^\[postbg=[^\[]*\]\n?/, "");
    if(!n.nodeValue && n.nextSibling.nodeType == 1 && n.nextSibling.tagName == "BR") {
      $(n.nextSibling).remove()
    }
  });
  if($("#text_editor_textarea").length && $.sceditor) {
    var bglist = "http://image.noelshack.com/fichiers/2013/44/1383232530-00000000000012151a-146.png,http://image.noelshack.com/fichiers/2014/16/1397758649-bg4.jpg,".split(",");
    var bgnum = -1;
    var val = $("#text_editor_textarea").val();
    if(val.substr(0,  == "[postbg=") {
      var m = val.match(/^\[postbg=([^\[]*)\]/);
      if(m) {
        var r = $.inArray(m[1], bglist);
        if(r != -1) {
          bgnum = r
        }else {
          bgnum = bglist.length - 1
        }
        $(function() {
          $(".sceditor-container").css("background-position", "0 " + ($(".sceditor-toolbar").height() + 6) + "px");
          $(".sceditor-container").css("background-image", "url(" + m[1] + ")")
        });
        $("#text_editor_textarea").val(val.replace(/^\[postbg=[^\[]*\]/, ""))
      }
    }
    $(function() {
      if(!$("#text_editor_textarea").sceditor("instance")) {
        return
      }
      $('<a class="sceditor-button" unselectable="on" title="Fond de message"><div unselectable="on" style="background:url(http://i.imgur.com/Hrf5w1i.gif);opacity:1">Fond de message</div></a>').insertAfter(".sceditor-button-fahide").click(function(e) {
        if(e.ctrlKey) {
          $(".sceditor-container").css("background-image", "");
          bgnum = -1
        }else {
          bgnum++;
          if(!bgnum) {
            $(".sceditor-container").css("background-position", "0 " + ($(".sceditor-toolbar").height() + 6) + "px")
          }
          $(".sceditor-container").css("background-image", "url(" + bglist[bgnum % bglist.length] + ")")
        }
      })
    });
    $(function() {
      $('form[name="post"]').submit(function() {
        if(bgnum != -1) {
          $("#text_editor_textarea").val(function(i, val) {
            return"[postbg=" + bglist[bgnum % bglist.length] + "]" + val
          })
        }
      })
    })
  }
});

Et le Css mis dans la feuille de style.
Code:
div.sceditor-container iframe, div.sceditor-container textarea {
  background: transparent;
}
.postbg {
  background-position: 0 0; background-repeat: repeat;
}


Si vous avez la solution, ou besoin de plus d'informations, n'hésitez pas !
Merci à tous.


Dernière édition par Mattatat le Mar 22 Avr 2014 - 12:15, édité 1 fois
avatar

Mattatat
Nouveau membre

Masculin
Messages : 13
Inscrit(e) le : 01/02/2009

http://taisen-dynasties.forumactif.biz
Mattatat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de choix d'image de fond fait disparaître l'éditeur

Message par kiwi14637 Jeu 17 Avr 2014 - 22:28

Bonsoir,

Essayez ce JS :
Code:
        $(function() {
          $("div.postbody").each(function() {
            var n = this;
            if($(".post-entry", n).length) {
              n = $(".post-entry", n)[0]
            }else {
              if($(".content", n).length) {
                n = $(".content", n)[0]
              }
            }
            while(n.nodeType != 3 && n.hasChildNodes()) {
              n = n.childNodes[0]
            }
            if(n.nodeType != 3) {
              return val
            }
            if(n.nodeValue.substr(0,  != "[postbg=") {
              return val
            }
            var m = n.nodeValue.match(/^\[postbg=([^\[]*)\]/);
            $(this).closest("div.post-container,div.post,td.row1,td.row2,div.postmain").addClass("postbg").css("background-image", "url(" + m[1] + ")");
            n.nodeValue = n.nodeValue.replace(/^\[postbg=[^\[]*\]\n?/, "");
            if(!n.nodeValue && n.nextSibling.nodeType == 1 && n.nextSibling.tagName == "BR") {
              $(n.nextSibling).remove()
            }
          });
          if($("#text_editor_textarea").length && $.sceditor) {
            var bglist = "http://image.noelshack.com/fichiers/2013/44/1383232530-00000000000012151a-146.png,http://image.noelshack.com/fichiers/2014/16/1397758649-bg4.jpg".split(",");
            var bgnum = -1;
            var val = $("#text_editor_textarea").val();
            if(val.substr(0,  == "[postbg=") {
              var m = val.match(/^\[postbg=([^\[]*)\]/);
              if(m) {
                var r = $.inArray(m[1], bglist);
                if(r != -1) {
                  bgnum = r
                }else {
                  bgnum = bglist.length - 1
                }
                $(function() {
                  $(".sceditor-container").css("background-position", "0 " + ($(".sceditor-toolbar").height() + 6) + "px");
                  $(".sceditor-container").css("background-image", "url(" + m[1] + ")")
                });
                $("#text_editor_textarea").val(val.replace(/^\[postbg=[^\[]*\]/, ""))
              }
            }
            $(function() {
              if(!$("#text_editor_textarea").sceditor("instance")) {
                return
              }
              $('<a class="sceditor-button" unselectable="on" title="Fond de message"><div unselectable="on" style="background:url(http://i.imgur.com/Hrf5w1i.gif);opacity:1">Fond de message</div></a>').insertAfter(".sceditor-button-fahide").click(function(e) {
                if(e.ctrlKey) {
                  $(".sceditor-container").css("background-image", "");
                  bgnum = -1
                }else {
                  bgnum++;
                  if(!bgnum) {
                    $(".sceditor-container").css("background-position", "0 " + ($(".sceditor-toolbar").height() + 6) + "px")
                  }
                  $(".sceditor-container").css("background-image", "url(" + bglist[bgnum % bglist.length] + ")")
                }
              })
            });
            $(function() {
              $('form[name="post"]').submit(function() {
                if(bgnum != -1) {
                  $("#text_editor_textarea").val(function(i, val) {
                    return"[postbg=" + bglist[bgnum % bglist.length] + "]" + val
                  })
                }
              })
            })
          }
        });

Bonne soirée !
kiwi14637

kiwi14637
Membre habitué

Masculin
Messages : 1387
Inscrit(e) le : 19/05/2010

kiwi14637 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de choix d'image de fond fait disparaître l'éditeur

Message par Mattatat Ven 18 Avr 2014 - 0:51

Merci pour cette réponse rapide.
Toutefois, le script ne marche toujours pas, même il ne marche plus du tout. Par contre, j'ai fait d'autres tests, et j'ai remarqué que l'éditeur ne disparaît pas lorsqu'à la fois je sélectionne l'arrière plan grâce au bouton ET que je mets le bbcode bgpost= dans le message. (Celui confié par l'auteur du script pour mettre un background différent, non contenu dans la liste). Outre l'esthétisme foireux, c'est pas très très pratique. Si quelqu'un à la solution ...

Merci encore.
avatar

Mattatat
Nouveau membre

Masculin
Messages : 13
Inscrit(e) le : 01/02/2009

http://taisen-dynasties.forumactif.biz
Mattatat a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de choix d'image de fond fait disparaître l'éditeur

Message par kiwi14637 Ven 18 Avr 2014 - 15:24

Bonjour,

J'ai essayé le code du tuto. La première fois, ça marche. Après, j'édite le code et ça ne marche plus du tout. L'éditeur disparaît et on voit le BBcode postbg en "brut".
En se déconnectant, le BBcode est transformé.
J'ai vidé le cache.

Je crois qu'il faudrait en parler à Ea.

Bonne journée !

PS : Dans la console Firebug, j'ai trouvé ceci :
TypeError: m is null


...ay(m[1],bglist);if(r!=-1){bgnum=r}else{bgnum=bglist.length-1}$(function(){$(".sc...

kiwi14637

kiwi14637
Membre habitué

Masculin
Messages : 1387
Inscrit(e) le : 19/05/2010

kiwi14637 a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Script de choix d'image de fond fait disparaître l'éditeur

Message par Ea Dim 20 Avr 2014 - 20:10

Bonjour,


J'ai réalisé une modification ( au code présent dans le tutoriel ) pour un problème arrivant dans certains cas ( par exemple laisser le message vide ).

Le message d'erreur ne semble pas indiquer cela mais il faudrait déjà essayé, j'ai ajouté un test sur la première variable 'm' également ( mais l'erreur semble pointer vers la deuxième variable 'm' qui était déjà testée ).

Cordialement.
Ea

Ea
Aidactif
Aidactif

Messages : 23583
Inscrit(e) le : 04/04/2008

Ea a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de choix d'image de fond fait disparaître l'éditeur

Message par kiwi14637 Lun 21 Avr 2014 - 12:19

Bonjour Ea,

Le script marche pour moi ! Smile
Merci beaucoup !

Bonne journée !
kiwi14637

kiwi14637
Membre habitué

Masculin
Messages : 1387
Inscrit(e) le : 19/05/2010

kiwi14637 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script de choix d'image de fond fait disparaître l'éditeur

Message par Mattatat Mar 22 Avr 2014 - 12:15

Bonjour Ea, merci pour tout, tout fonctionne à merveille !
avatar

Mattatat
Nouveau membre

Masculin
Messages : 13
Inscrit(e) le : 01/02/2009

http://taisen-dynasties.forumactif.biz
Mattatat 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