Page 1 sur 1

Problème de donnée

Posté : 02 sept. 2012, 11:28
par Fre3z69
Salutation

J'ai un soucis avec js

j'ai un script qui me permet d’insérer un "bbcode" personnalisé dans un textarea.

J'ai souhaité rajouter un colorpicker (qui fonctionne bien) mais je n'arrive pas à faire l’insertion dans le textearea.

Voici le code que j'ai, il est supposé fonctionner en 2 partie, 1er, on choisit la couleur, secondo, on clique sur le champ text, et normalement ça devrais insérer la balise "bbcode" avec la bonne couleur.
La balise se place correctement, mais je n'arrive pas à récupérer la couleur qui proviens de la span "<span id="this" class="add-on"><i style="background-color:#730000;"></i></span>"
<div class="input-append color colorpicker" data-color="rgb(0, 0, 0)" id="cp3" title="choisissez votre couleur, et cliquez sur le champ texte">
  <input class="span1" value="" readonly="readonly" type="text" title="cliquez sur moi une fois la couleur choisie" onclick="add_bal3('font','texte','prev_texte','color',this); insert_recent('font', 'code', 'color',this); return false;select();">
  <span id="this" class="add-on"><i style="background-color:#730000;"></i></span>
</div>
Merci de m'aider à réaliser cela en gardant les 2 étapes, ça permet de visualiser la couleur avant de l'insérer.
Par contre je ne suis pas contre une petite optimisation.

Merci de votre aide

Cordialement

Re: Problème de donnée

Posté : 02 sept. 2012, 12:05
par sadeq
Bonjour,
Pourquoi ne pas utiliser un plugin comme : Tiny_mce

Re: Problème de donnée

Posté : 02 sept. 2012, 12:09
par Fre3z69
non merci j'ai déjà essayer.
Je souhaite utiliser cela pour un forum, pas un éditeur complet ^^

Merci quand même ^^

Re: Problème de donnée

Posté : 17 sept. 2012, 08:48
par Fre3z69
S'il vous plais, personne pour m'aider?

Re: Problème de donnée

Posté : 17 sept. 2012, 13:53
par moogli
Sans le code javascript on ne peux pas t'aider, c'est la qu'il faut que tu concentre !


@+

Re: Problème de donnée

Posté : 20 sept. 2012, 07:28
par Fre3z69
Le code Js est assez long, je vais le mettre, mais sachez le ^^

[javascript]var antiflood=false;var last=0;var smilies=new Array(":magicien:",":colere:",":diable:",":ange:",":ninja:",">_<",":pirate:",":zorro:",":honte:",":soleil:",":snif:",":waw:",":\\)",":D",";\\)",":p",":lol:",":euh:",":\\(",":o",":colere2:","o_O","\\^\\^",":\\-\u00b0");var smilies_url=new Array("magicien.png","angry.gif","diable.png","ange.png","ninja.png","pinch.png","pirate.png","zorro.png","rouge.png","soleil.png","snif.png","waw.png","smile.png","heureux.png","clin.png","langue.png","rire.gif","unsure.gif","triste.png","huh.png","mechant.png","blink.gif","hihi.png","siffle.png");var smilies_tpl=new Array(":)",":D",";)",":p",":lol:",":euh:",":(",":o",":colere2:","o_O","^^",":-°");var smilies_tpl_url=new Array("smile.png","heureux.png","clin.png","langue.png","rire.gif","unsure.gif","triste.png","huh.png","mechant.png","blink.gif","hihi.png","siffle.png");var smilies_more=new Array(":ange:",":colere:",":diable:",":magicien:",":ninja:",">_<",":pirate:",":snif:",":honte:",":soleil:",":waw:",":zorro:");var smilies_more_url=new Array("ange.png","angry.gif","diable.png","magicien.png","ninja.png","pinch.png","pirate.png","snif.png","rouge.png","soleil.png","waw.png","zorro.png");var page=new Array();var height_avant=200;var height_avant_final=500;var zform_names_of_text=Array();var last_hash_texte_backup=Array();var period_autobackup=60;var is_first_backup=true;var last_backup=null;var nbr_recent_languages=3;var recent_zcode=Array();var recent_zcode_attr=Array();var recent_zcode_actual=Array();function edit_zform_height(c,b,f,e){var g=document.getElementById(c);var d=document.getElementById(b);var a=document.getElementById(f);height_avant=height_avant+Number(e);if(height_avant<200){height_avant=200}if(height_avant>2000){height_avant=2000}height_avant_final=height_avant_final+Number(e);if(height_avant_final<200){height_avant_final=200}if(height_avant_final>2000){height_avant_final=2000}change=height_avant+"px";change_final=height_avant_final+"px";if(g!=null){g.style.height=change}if(d!=null){d.style.height=change}if(a!=null){a.style.maxHeight=change_final}return false}function ouvrir_page(c,b,a,d){window.open(c,b,"toolbar=yes,personalbar=yes,titlebar=yes,location=yes,directories=yes,width="+a+",height="+d+",scrollbars=yes,resizable=yes")}function switch_activ(a,b){div=document.getElementById(b);if(document.getElementById("activ_"+a).checked==true){div.style.display="block";storeCaret(a)}else{div.style.display="none"}}function storeCaret(a){champ=document.getElementById(a);if(champ.createTextRange){champ.curseur=document.selection.createRange().duplicate()}}function balise(c,f,e){var h=document.getElementById(e);var b=h.scrollTop;c=remplace(c,"<br />","\n");if(f==""){c=" "+c+" "}if(h.curseur){h.curseur.text=c+h.curseur.text+f}else{if(h.selectionStart>=0&&h.selectionEnd>=0){if(h.selectionStart==h.selectionEnd&&empty(trim(h.value.substring(h.selectionEnd,h.value.length)))){h.setSelectionRange(h.value.length,h.value.length)}var a=h.value.substring(0,h.selectionStart);var d=h.value.substring(h.selectionStart,h.selectionEnd);var g=h.value.substring(h.selectionEnd);h.value=a+c+d+f+g;h.focus();h.setSelectionRange(a.length+c.length,h.value.length-g.length-f.length)}else{h.value+=c+f;h.focus()}}h.scrollTop=b}function remplace(e,c,b){var a=e;var d=c.length;while(a.indexOf(c)>-1){pos=a.indexOf(c);a=(a.substring(0,pos)+b+a.substring((pos+d),a.length))}return a}function add_bal(a,e,d,c,b){bal=document.getElementById(d).value;if(bal!=""){balise("<"+a+" "+e+'="'+bal+'">',"</"+a+">",c)}else{balise("<"+a+">","</"+a+">",c)}if(document.getElementById(d)){document.getElementById(d).options[0].selected=true}}function add_bal2(a,d,c,b){var f=document.getElementById(c);var e="";if(a=="citation"){e="Veuillez renseigner l'auteur de la citation";bal=prompt(e);if(!bal&&a=="citation"){balise_debut="<"+a+">"}else{balise_debut="<"+a+" "+d+'="'+bal+'">'}balise_fin="</"+a+">"}else{if(a=="lien"){if(f.curseur){txt_selectionne=f.curseur.text}else{if(f.selectionStart>=0&&f.selectionEnd>=0){txt_selectionne=f.value.substring(f.selectionStart,f.selectionEnd)}else{txt_selectionne=""}}if(txt_selectionne.indexOf("http://")==0||txt_selectionne.indexOf("https://")==0||txt_selectionne.indexOf("ftp://")==0||txt_selectionne.indexOf("apt://")==0){e="Veuillez indiquer le texte du lien";bal2=prompt(e);balise_debut="<"+a+" "+d+'="';balise_fin='">'+bal2+"</"+a+">"}else{if(txt_selectionne==""){e="Veuillez indiquer l'adresse du lien";bal=prompt(e);bal2=prompt("Veuillez indiquer le texte du lien");balise_debut="<"+a+" "+d+'="'+bal+'">'+bal2;balise_fin="</"+a+">"}else{e="Veuillez indiquer le lien";bal=prompt(e);balise_debut="<"+a+" "+d+'="'+bal+'">';balise_fin="</"+a+">"}}}else{if(a=="email"){e="Veuillez indiquer l'email";bal=prompt(e);balise_debut="<"+a+" "+d+'="'+bal+'">';balise_fin="</"+a+">"}}}balise(balise_debut,balise_fin,c);if(document.getElementById(a)){document.getElementById(a).options[0].selected=true}}function add_bal3(b,e,d,c,a){if(b=="code"&&$("#coche_minicode_"+e+":checked").val()!=undefined){b="minicode"}if(a==null){balise_debut="<"+b+">";balise_fin="</"+b+">"}else{balise_debut="<"+b+" "+c+'="'+a+'">';balise_fin="</"+b+">"}balise(balise_debut,balise_fin,e);if(document.getElementById(b)){document.getElementById(b).options[0].selected=true}}function trim(a){return a.replace(/^\s\s*/,"").replace(/\s\s*$/,"")}function add_liste(e,g){var o="";var f=document.getElementById(e);var m=f.scrollTop;var h="";var l="";var b="";if(f.selectionStart>=0&&f.selectionEnd>=0){if(f.selectionStart==f.selectionEnd&&empty(trim(f.value.substring(f.selectionEnd,f.value.length)))){f.setSelectionRange(f.value.length,f.value.length)}var d=f.value.substring(0,f.selectionStart);var k=f.value.substring(f.selectionStart,f.selectionEnd);var n=f.value.substring(f.selectionEnd);k=trim(k);h=k.split("\n");if(h[0]==null||h[0]==""){l+="\t<puce>-</puce>\n";l+="\t<puce>-</puce>\n";l+="\t<puce>-</puce>\n"}else{for(var a=0,j=h.length;a<j;a++){if(h[a]==null||h[a]==""){h[a]="-"}l+="\t<puce>"+h[a]+"</puce>\n"}}f.value="";o=l;balise(d+"<liste>\n"+o,"</liste>"+n,e)}else{if(f.curseur){b=trim(f.curseur.text);h=b.split("\n");if(h[0]==null||h[0]==""){l+="\t<puce>-</puce>\n";l+="\t<puce>-</puce>\n";l+="\t<puce>-</puce>\n"}else{Aremplacer=new RegExp("(\r\n|\r|\n)","g");for(var a=0,j=h.length;a<j;a++){if(h[a]==null||h[a]==""){h[a]="-"}l+="\t<puce>"+h[a].replace(Aremplacer,"")+"</puce>\n"}}o=l;f.curseur.text="";balise("<liste>\n"+o,"</liste>",e)}}f.scrollTop=m}function add_table(d,c){var g="";var f="";var a="";var b="";var h,e;g=document.getElementById("row_nbr").value;f=document.getElementById("column_nbr").value;a=document.getElementById("table_header").checked;if(f>20){f=20}if(g>99){g=99}if(a){b+="<ligne>\n";for(h=0;h<f;h++){b+="<entete>-</entete>\n"}b+="</ligne>\n"}for(e=0;e<g;e++){b+="<ligne>\n";for(h=0;h<f;h++){b+="<cellule>-</cellule>\n"}b+="</ligne>\n"}balise("<tableau>\n"+b,"</tableau>",d)}function full_preview(d,f,b){var c=document.getElementById("lancer_apercu_"+d);var a=$("#prev_final_"+d+" div");var e='<div style="width:100%;text-align:center;display:none;"><img src="/images/designs/2/loading.gif" title="ajaxLoader" alt="ajaxLoader" /></div>';c.disabled=true;a.css("display","block");request_apercu("/ajax.php?do=xml_getzcode",document.getElementById(d).value,b);xmlhttp.onreadystatechange=function(){if(xmlhttp.readyState==4){if(xmlhttp.status==200){document.getElementById(f).innerHTML=e+xmlhttp.responseText}else{document.getElementById(f).innerHTML=an_error}}};c.disabled=false}function request_apercu(b,c,a){if(callInProgress(xmlhttp)){setTimeout('request_apercu("'+b+'","'+c+'","'+a+'")',100);return true}else{c=escape(c);c=remplace(c,"+","%2B");return Xsend("POST",b,"texte="+c+"&dir="+escape(a),true)}}function autosave(){for(i=0;i<zform_names_of_text.length;i++){if(is_first_backup){last_hash_texte_backup[zform_names_of_text]=sha1(document.getElementById(zform_names_of_text).value)}setTimeout("request_autobackup('"+zform_names_of_text+"',document.getElementById('"+zform_names_of_text+"').value, window.document.URL.substring(window.document.URL.lastIndexOf('/')+1))",1/10*period_autobackup*1000)}is_first_backup=false;setTimeout("autosave()",period_autobackup*1000)}function request_autobackup(c,d,a){var b=sha1(d);if(d.length>0&&b!=last_hash_texte_backup[c]){if(callInProgress(xmlhttp)){setTimeout("request_autobackup('"+c+"','"+d+"','"+a+"')",100)}else{$.post("/ajax.php?do=xml_autobackup_zform",{texte:d,url:escape(a)},function(f){var e=document.getElementById("date_dernier_backup_"+c).innerHTML.substr(0,document.getElementById("date_dernier_backup_"+c).innerHTML.lastIndexOf(">")+1);document.getElementById("date_dernier_backup_"+c).innerHTML=e+"Dernière sauvegarde le "+f});last_hash_texte_backup[c]=b}}}function sha1(s){function c(y,x){var j=(y<<x)|(y>>>(32-x));return j}function q(z){var y="";var j;var A;var x;for(j=0;j<=6;j+=2){A=(z>>>(j*4+4))&15;x=(z>>>(j*4))&15;y+=A.toString(16)+x.toString(16)}return y}function t(z){var y="";var x;var j;for(x=7;x>=0;x--){j=(z>>>(x*4))&15;y+=j.toString(16)}return y}var f;var v,u;var b=new Array(80);var l=1732584193;var h=4023233417;var g=2562383102;var e=271733878;var d=3285377520;var r,p,o,n,m;var w;var a=s.length;var k=new Array();for(v=0;v<a-3;v+=4){u=s.charCodeAt(v)<<24|s.charCodeAt(v+1)<<16|s.charCodeAt(v+2)<<8|s.charCodeAt(v+3);k.push(u)}switch(a%4){case 0:v=2147483648;break;case 1:v=s.charCodeAt(a-1)<<24|8388608;break;case 2:v=s.charCodeAt(a-2)<<24|s.charCodeAt(a-1)<<16|32768;break;case 3:v=s.charCodeAt(a-3)<<24|s.charCodeAt(a-2)<<16|s.charCodeAt(a-1)<<8|128;break}k.push(v);while((k.length%16)!=14){k.push(0)}k.push(a>>>29);k.push((a<<3)&4294967295);for(f=0;f<k.length;f+=16){for(v=0;v<16;v++){b[v]=k[f+v]}for(v=16;v<=79;v++){b[v]=c(b[v-3]^b[v-8]^b[v-14]^b[v-16],1)}r=l;p=h;o=g;n=e;m=d;for(v=0;v<=19;v++){w=(c(r,5)+((p&o)|(~p&n))+m+b[v]+1518500249)&4294967295;m=n;n=o;o=c(p,30);p=r;r=w}for(v=20;v<=39;v++){w=(c(r,5)+(p^o^n)+m+b[v]+1859775393)&4294967295;m=n;n=o;o=c(p,30);p=r;r=w}for(v=40;v<=59;v++){w=(c(r,5)+((p&o)|(p&n)|(o&n))+m+b[v]+2400959708)&4294967295;m=n;n=o;o=c(p,30);p=r;r=w}for(v=60;v<=79;v++){w=(c(r,5)+(p^o^n)+m+b[v]+3395469782)&4294967295;m=n;n=o;o=c(p,30);p=r;r=w}l=(l+r)&4294967295;h=(h+p)&4294967295;g=(g+o)&4294967295;e=(e+n)&4294967295;d=(d+m)&4294967295}var w=t(l)+t(h)+t(g)+t(e)+t(d);return w.toLowerCase()}function toogle_smilies(a){ID="_smilies";var b=false;for(text in page){if(text==a){b=true;break}}if(b){page[a]=(page[a]==0)?1:0}else{page[a]=1}if(page[a]==0){html='<a href="/Templates/html/fr/tous_smilies.html" onclick="toogle_smilies(\''+a+'\');return false;return false;">Autres smilies <img src="/images/designs/2/fleche_droite.png" alt="=>" title="Autres smilies" /></a><br />';for(i=0;i<smilies_tpl.length;i++){html+='<img src="/images/smilies/'+smilies_tpl_url+'" class="smiley_cliquable" alt="'+smilies_tpl+'" onclick="balise(\''+smilies_tpl+"','','"+a+"'); return false;\" /> ";if((i+1)%4==0){html+="<br />"}}document.getElementById(a+ID).innerHTML=html}else{html='<a href="/Templates/html/fr/tous_smilies.html" onclick="toogle_smilies(\''+a+'\');return false;return false;"><img src="/images/designs/2/fleche_gauche.png" alt="=>" title="Autres smilies" /> Autres smilies</a><br /><table><tr>';for(i=0;i<smilies_more.length;i++){html+='<td><img src="/images/smilies/'+smilies_more_url+'" class="smiley_cliquable" alt="'+smilies_more+'" onclick="balise(\''+smilies_more+"','','"+a+"'); return false;\" /></td>";if((i+1)%3==0){html+="</tr><tr>"}}html+="</tr></table>";document.getElementById(a+ID).innerHTML=html}}function insert_new_element(c,b){for(var a=nbr_recent_languages;a>1;a--){c[a]=c[a-1]}c[1]=b}function insert_recent(c,b,a,d){if($.inArray(c.innerHTML,recent_zcode)==-1){insert_new_element(recent_zcode,c.innerHTML);insert_new_element(recent_zcode_attr,new Array(b,a,d));display_recent(recent_zcode,recent_zcode_attr)}}function display_recent(f,e){var c;var d;if(f.length>1){for(var a=0;a<zform_names_of_text.length;a++){document.getElementById("title_recent_"+zform_names_of_text[a]).innerHTML="--Récent--"}}for(var b=1;b<nbr_recent_languages+1;b++){for(var a=0;a<zform_names_of_text.length;a++){c="recent_"+b+"_"+zform_names_of_text[a];$("#"+c).attr("style","display:none;");$("#"+c).html("");$("#"+c).unbind();if(f!=undefined){$("#"+c).html(f);$("#"+c).addClass("element bouton_cliquable");$("#"+c).click(function(){var j=$(this).attr("id").split("_");var h=parseInt(j[1]);var g=j.splice(2).join("_");add_bal3(e[h][0],g,"prev_"+g,e[h][1],e[h][2]);$(".zform_menu").hide()});$("#"+c).attr("style","display:block;")}}}}$(document).ready(function(){$(".zform_trigger").live("click",function(){if($(this).next().css("display")=="none"){$(".zform_menu").hide();$(this).next().show()}else{$(this).next().hide()}});$(".bouton_cliquable").click(function(){$(".zform_menu").hide()});$(".zform").click(function(){$(".zform_menu").hide()});$("div[id^='recent_']").click(function(){var a=$(this).html();$("#liste_code").each(function(b){if($(this).text()==a){$(this).click()}$(".zform_menu").hide()})});$(".form_info").mouseleave(function(){if($(".form .form_row input:focus").parent(".form_fields").next(".form_info").children(".form_tooltip_background").css("display")!=$(this).children(".form_tooltip_background").css("display")){$(".form_tooltip_background").hide();$(".form .form_row input:focus").focus()}});$(".form_info").mouseenter(function(){if($(this).children(".form_tooltip_background").css("display")=="none"){$(".form_tooltip_background").hide();$(this).children(".form_tooltip_background").fadeIn(350)}});$(".form .form_row input, .form .form_row select").blur(function(){$(".form_tooltip_background").hide()});$(".form .form_row input, .form .form_row select").focus(function(){var a=$(this).parent(".form_fields").next(".form_info").children(".form_tooltip_background");$(".form_tooltip_background").hide();a.fadeIn(350)})});$(document).ready(function(){$(".zform").each(function(){zform_names_of_text[zform_names_of_text.length]=$(this).children().attr("id")});autosave()});[/javascript]

En espérant que ça puis m'aider
(Au passage, j'en profite pour dire que j'utilise le colopicker Jquery)

Merci beaucoup

cordialement

Re: Problème de donnée

Posté : 29 sept. 2012, 22:39
par Fre3z69
On peux m'aider?

Merci beaucoup

Re: Problème de donnée

Posté : 09 déc. 2012, 16:15
par Fre3z69
Trop sympa, merci