Commit 8509c233 authored by Sylvain Coulange's avatar Sylvain Coulange
Browse files

mise à jour copier/coller

parent 03eb607d
......@@ -99,42 +99,42 @@ function getPopUp() {
if (p1 == 'phon_wa'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_w');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_a');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_we_maj_nas'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_w');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_e_maj_nas');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_ij'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_i');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_j');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_nj'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_n');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_j');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_ts_maj'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_t');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_s_maj');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_dz_maj'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_d');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_z_maj');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_ks'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_k');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_s');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_gz'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_g');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_z');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else if (p1 == 'phon_ts'){
var col1 = getComputedStyle(document.documentElement).getPropertyValue('--phon_t');
var col2 = getComputedStyle(document.documentElement).getPropertyValue('--phon_s');
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: black;">';
var res = '<span style="background-color:'+col1+';color:'+col2+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
} else {
var col = getComputedStyle(document.documentElement).getPropertyValue('--'+p1);
var res = '<span style="color:'+col+';">';
var res = '<span style="color:'+col+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
}
console.log(p1+''+col);
console.log(res);
......@@ -142,11 +142,12 @@ function getPopUp() {
}
function bicol2color(correspondance, p1, decalage, chaine){
var col = getComputedStyle(document.documentElement).getPropertyValue('--phon_'+p1);
var res = '<span style="color:'+col+';">';
var res = '<span style="color:'+col+';-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;">';
console.log(p1+''+col);
console.log(res);
return res;
}
// outputContent = outputContent.replace('<span> </span>',''); // suppr du premier span vide
outputContent = outputContent.replace(/<span class="phon (\w+)">/g, phon2color);
outputContent = outputContent.replace(/<span class="phon \w+ (\w+)">/g, bicol2color);
outputContent = outputContent.replace(/onclick="changeAlign\(this\.id\)"/g,'');
......@@ -171,7 +172,7 @@ window.onclick = function(event) {
}
// COPIE AUTO DU LIEN DANS PRESSE-PAPIER
function toClipBoard(containerid) {
function toClipBoard(containerid,tooltipid) {
//var copyText = document.getElementById("pLienDiv");
// copyText.select();
// copyText.setSelectionRange(0, 99999);
......@@ -185,13 +186,14 @@ function toClipBoard(containerid) {
} else if (window.getSelection) {
var range = document.createRange();
range.selectNode(document.getElementById(containerid));
window.getSelection().empty();
window.getSelection().addRange(range);
document.execCommand("copy");
}
var tooltip = document.getElementById("myTooltip");
tooltip.innerHTML = "Copié !";
var tooltip = document.getElementById(tooltipid) ;
tooltip.innerHTML = "Copié !";
}
function outFunc() {
......
......@@ -113,7 +113,7 @@
}
.pLienDiv {
border: outset;
/* border: outset; */
/* background-color: black; */
padding: 10px 5px;
font-size: 2em;
......
......@@ -21,8 +21,8 @@
<div class="inputDiv">
<form action="/app/" method="post">{% csrf_token %}
<div class="param">
<input id="swcolor" type="radio" name="colorType" value="sw" {%if data.colorType == "sw" %}checked{% endif %}> Silent Way<br/>
<input id="bicolor" type="radio" name="colorType" value="bi" {%if data.colorType == "bi" %}checked{% endif %}> Bicolor
<input id="swcolor" type="radio" name="colorType" value="sw" {%if data.colorType == "sw" %}checked{% endif %}> <label for="swcolor">Silent Way</label><br/>
<input id="bicolor" type="radio" name="colorType" value="bi" {%if data.colorType == "bi" %}checked{% endif %}> <label for="bicolor">Bicolor</label>
<input type="hidden" id="defaultBg" name="defaultBg" value="{{ data.defaultBg }}"/>
</div>
<h2>Entrer du texte à coloriser :</h2>
......@@ -58,14 +58,14 @@
<h2>Copier/coller le résultat</h2>
</div>
<div class="modal-body">
<p>Le texte ci-dessous peut-être copié-collé dans Word, LibreOffice ou dans un email, par exemple.</p>
<p>Le texte ci-dessous peut être copié-collé dans Word, LibreOffice ou dans un email, par exemple.</p>
<div id="pLienDiv" contenteditable="true" class="pLienDiv" style="background-color: #000000; font-weight: bold;"></div>
<div class="copyButton">
<button onclick="toClipBoard('pLienDiv')" onmouseout="outFunc()"><span class="copyButtonText" id="myTooltip">Copier</span>Copier</button>
<button onclick="toClipBoard('pLienDiv','myTooltip')" onmouseout="outFunc()"><span class="copyButtonText" id="myTooltip">Copier</span>Copier</button>
</div>
<div id="pLienDivWhite" contenteditable="true" class="pLienDiv" style="font-weight: bold;-webkit-text-stroke-width: 0.5px;-webkit-text-stroke-color: #000000;"></div>
<div class="copyButton">
<button onclick="toClipBoard('pLienDivWhite')" onmouseout="outFuncWhite()"><span class="copyButtonText" id="myTooltipWhite">Copier</span>Copier</button>
<button onclick="toClipBoard('pLienDivWhite', 'myTooltipWhite')" onmouseout="outFuncWhite()"><span class="copyButtonText" id="myTooltipWhite">Copier</span>Copier</button>
</div>
</div>
<div class="modal-footer">
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment