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é : 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