Partage
  • Partager sur Facebook
  • Partager sur Twitter

insertion d'image via zcode

dufo
    7 juillet 2010 à 18:07:45

    bonjour,

    j'utilise le zcode que j'ai récupéré sur le tuto de thunderseb !
    je souhaite pouvoir insérer des images, malheureusement je suis plus que débutant en js ! :honte:

    j'utilise un script PHP pour charger des images (et autres docs) sur le serveur mais comment le faire via une boite de dialogue et l'insérer dans mon zcode ?

    voici mon code js :
    Secret (cliquez pour afficher)
function insertTag(startTag, endTag, textareaId, tagType) {
var field = document.getElementById(textareaId);
var scroll = field.scrollTop;
field.focus();

/* === Partie 1 : on récupère la sélection === */
if (window.ActiveXObject) {
var textRange = document.selection.createRange();
var currentSelection = textRange.text;
} else {
var startSelection = field.value.substring(0, field.selectionStart);
var currentSelection = field.value.substring(field.selectionStart, field.selectionEnd);
var endSelection = field.value.substring(field.selectionEnd);
}

/* === Partie 2 : on analyse le tagType === */
if (tagType) {
switch (tagType) {
case "lien":
endTag = "</lien>";
if (currentSelection) { // Il y a une sélection
if (currentSelection.indexOf("http://") == 0 || currentSelection.indexOf("https://") == 0 || currentSelection.indexOf("ftp://") == 0 || currentSelection.indexOf("www.") == 0) {
// La sélection semble être un lien. On demande alors le libellé
var label = prompt("Quel est le libellé du lien ?") || "";
startTag = "<lien url=\"" + currentSelection + "\">";
currentSelection = label;
} else {
// La sélection n'est pas un lien, donc c'est le libelle. On demande alors l'URL
var URL = prompt("Quelle est l'url ?");
startTag = "<lien url=\"" + URL + "\">";
}
} else { // Pas de sélection, donc on demande l'URL et le libelle
var URL = prompt("Quelle est l'url ?") || "";
var label = prompt("Quel est le libellé du lien ?") || "";
startTag = "<lien url=\"" + URL + "\">";
currentSelection = label;
}
break;

case "citation":
endTag = "</citation>";
if (currentSelection) { // Il y a une sélection
if (currentSelection.length > 30) { // La longueur de la sélection est plus grande que 30. C'est certainement la citation, le pseudo fait rarement 20 caractères
var auteur = prompt("Quel est l'auteur de la citation ?") || "";
startTag = "<citation nom=\"" + auteur + "\">";
} else { // On a l'Auteur, on demande la citation
var citation = prompt("Quelle est la citation ?") || "";
startTag = "<citation nom=\"" + currentSelection + "\">";
currentSelection = citation;
}
} else { // Pas de selection, donc on demande l'Auteur et la Citation
var auteur = prompt("Quel est l'auteur de la citation ?") || "";
var citation = prompt("Quelle est la citation ?") || "";
startTag = "<citation nom=\"" + auteur + "\">";
currentSelection = citation;
}
break;

}
}

/* === Partie 3 : on insère le tout === */
if (window.ActiveXObject) {
textRange.text = startTag + currentSelection + endTag;
textRange.moveStart("character", -endTag.length - currentSelection.length);
textRange.moveEnd("character", -endTag.length);
textRange.select();
} else {
field.value = startSelection + startTag + currentSelection + endTag + endSelection;
field.focus();
field.setSelectionRange(startSelection.length + startTag.length, startSelection.length + startTag.length + currentSelection.length);
}

field.scrollTop = scroll;
}



function preview(textareaId, previewDiv) {
var field = textareaId.value; // Le contenu du textarea est dans la variable field
}




function preview(textareaId, previewDiv) {
var field = textareaId.value;
if (document.getElementById('previsualisation').checked && field) {

var smiliesName = new Array(':magicien:', ':colere:', ':diable:', ':ange:', ':ninja:', '&gt;_&lt;', ':pirate:', ':zorro:', ':honte:', ':soleil:', ':\'\\(', ':waw:', ':\\)', ':D', ';\\)', ':p', ':lol:', ':euh:', ':\\(', ':o', ':colere2:', 'o_O', '\\^\\^', ':\\-°');
var smiliesUrl = new Array('magicien.png', 'angry.gif', 'diable.png', 'ange.png', 'ninja.png', 'pinch.png', 'pirate.png', 'zorro.png', 'rouge.png', 'soleil.png', 'pleure.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 smiliesPath = "http://www.siteduzero.com/Templates/images/smilies/";

field = field.replace(/&/g, '&amp;');
field = field.replace(/</g, '&lt;').replace(/>/g, '&gt;');
field = field.replace(/\n/g, '<br />').replace(/\t/g, '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;');

field = field.replace(/&lt;gras&gt;([\s\S]*?)&lt;\/gras&gt;/g, '<strong>$1</strong>');
field = field.replace(/&lt;italique&gt;([\s\S]*?)&lt;\/italique&gt;/g, '<em>$1</em>');
field = field.replace(/&lt;lien&gt;([\s\S]*?)&lt;\/lien&gt;/g, '<a href="$1">$1</a>');
field = field.replace(/&lt;lien url="([\s\S]*?)"&gt;([\s\S]*?)&lt;\/lien&gt;/g, '<a href="$1" title="$2">$2</a>');
field = field.replace(/&lt;image&gt;([\s\S]*?)&lt;\/image&gt;/g, '<img src="$1" alt="Image" />');
field = field.replace(/&lt;citation nom=\"(.*?)\"&gt;([\s\S]*?)&lt;\/citation&gt;/g, '<br /><span class="citation">Citation : $1</span><div class="citation2">$2</div>');
field = field.replace(/&lt;citation lien=\"(.*?)\"&gt;([\s\S]*?)&lt;\/citation&gt;/g, '<br /><span class="citation"><a href="$1">Citation</a></span><div class="citation2">$2</div>');
field = field.replace(/&lt;citation nom=\"(.*?)\" lien=\"(.*?)\"&gt;([\s\S]*?)&lt;\/citation&gt;/g, '<br /><span class="citation"><a href="$2">Citation : $1</a></span><div class="citation2">$3</div>');
field = field.replace(/&lt;citation lien=\"(.*?)\" nom=\"(.*?)\"&gt;([\s\S]*?)&lt;\/citation&gt;/g, '<br /><span class="citation"><a href="$1">Citation : $2</a></span><div class="citation2">$3</div>');
field = field.replace(/&lt;citation&gt;([\s\S]*?)&lt;\/citation&gt;/g, '<br /><span class="citation">Citation</span><div class="citation2">$1</div>');
field = field.replace(/&lt;taille valeur=\"(.*?)\"&gt;([\s\S]*?)&lt;\/taille&gt;/g, '<span class="$1">$2</span>');

for (var i=0, c=smiliesName.length; i<c; i++) {
field = field.replace(new RegExp(" " + smiliesName[i] + " ", "g"), "&nbsp;<img src=\"" + smiliesPath + smiliesUrl[i] + "\" alt=\"" + smiliesUrl[i] + "\" />&nbsp;");
}

document.getElementById(previewDiv).innerHTML = field;
}
}


function getXMLHttpRequest() {
var xhr = null;

if (window.XMLHttpRequest || window.ActiveXObject) {
if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
} else {
xhr = new XMLHttpRequest();
}
} else {
alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
return null;
}

return xhr;
}

function view(textareaId, viewDiv){
var content = encodeURIComponent(document.getElementById(textareaId).value);
var xhr = getXMLHttpRequest();

if (xhr && xhr.readyState != 0) {
xhr.abort();
delete xhr;
}

xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200){
document.getElementById(viewDiv).innerHTML = xhr.responseText;
} else if (xhr.readyState == 3){
document.getElementById(viewDiv).innerHTML = "<div style=\"text-align: center;\">Chargement en cours...</div>";
}
}

xhr.open("POST", "view.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("string=" + content);
}




    voici mon code php :

    <form action="liste_page_activite.php" method="post">
<div>
<p>
<input type="button" value="G" onclick="insertTag('','','textarea');" />
<input type="button" value="I" onclick="insertTag('','','textarea');"/>
<input type="button" value="U" onclick="insertTag('','','textarea');"/>
<input type="button" value="Lien" onclick="insertTag('<lien>','</lien>','textarea','lien');"/>
<input type="button" value="Image" onclick="insertTag('<image>','</image>','textarea','image');"/>
<input type="button" value="Citation" onclick="insertTag('Citation
','
','textarea','citation');"/>



<select onchange="insertTag('<couleur valeur=&quot;' + this.options[this.selectedIndex].value + '&quot;>', '</couleur>', 'textarea');">
<option value="none" class="selected" selected="selected">Couleur</option>
<option value="vert">vert</option>
<option value="bleu">bleu</option>
<option value="rouge">rouge</option>
<option value="blanc">blanc</option>
<option value="gris">gris</option>
<option value="jaune">Jaune</option>
</select>


<br />

<img onclick="insertTag(':magicien:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/magicien.png" alt="smiley" />
<img onclick="insertTag(':colere:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/angry.gif" alt="smiley" />
<img onclick="insertTag(':ange:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/ange.png" alt="smiley" />
<img onclick="insertTag(':zorro:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/zorro.png" alt="smiley" />
<img onclick="insertTag(':honte:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/rouge.png" alt="smiley" />
<img onclick="insertTag(':waw:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/waw.png" alt="smiley" />
<img onclick="insertTag(':D', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/heureux.png" alt="smiley" />
<img onclick="insertTag(':p', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/langue.png" alt="smiley" />
<img onclick="insertTag(':lol:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/rire.gif" alt="smiley" />
<img onclick="insertTag(':euh:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/unsure.gif" alt="smiley" />
<img onclick="insertTag(':\\(', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/triste.png" alt="smiley" />
<img onclick="insertTag(':o', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/huh.png" alt="smiley" />
<img onclick="insertTag(':colere2:', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/mechant.png" alt="smiley" />
<img onclick="insertTag('o_O', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/blink.gif" alt="smiley" />
<img onclick="insertTag('\\^\\^', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/hihi.png" alt="smiley" />
<img onclick="insertTag(':\\-°', '', 'textarea');" src="http://www.siteduzero.com/Templates/images/smilies/siffle.png" alt="smiley" />

</p>
<p>
<input name="previsualisation" type="checkbox" id="previsualisation" value="previsualisation" />
<label for="previsualisation">Prévisualisation automatique</label>
</p>
</div>
<p>Titre pour le lien de la page: <input type="text" size="75" name="titre_page" value="<?php echo $titre_page; ?>" /></p>
<p>Titre de la présentation : <input type="text" size="75" name="titre_contenu" value="<?php echo $titre_contenu; ?>" /></p>

<textarea name="contenu" onkeyup="preview(this, 'previewDiv');" onselect="preview(this, 'previewDiv');" id="textarea" cols="100" rows="15"><?php echo $contenu; ?></textarea>

<div id="previewDiv"></div>

<p>
<input type="hidden" name="id_news" value="<?php echo $id_news; ?>" />
<input type="button" value="Visualiser" onclick="view('textarea', 'viewDiv');" />
<input type="submit" value="envoyer" />
</p>

<div id="viewDiv"></div>

</form>
</div>

<script src="fichier.js" type="text/javascript"></script>


    merci de vos conseils !
    cordialement
    • Partager sur Facebook
    • Partager sur Twitter

    insertion d'image via zcode

    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
    • Editeur ●
    • Markdown