[Aide au Jeu] Couleurs automatiques.

DeletedUser8 · 2. Fev 2010

Couleurs automatiques sur le forum

Ce tutoriel explique comment automatiquement mettre des couleurs sur ce forum (pas le forum interne des tribus), pour éviter d'avoir à taper [color][/color] à chaque fois.

Pré-requis :
Ne pas utiliser un navigateur trop moisi. Bon, c'est formulé méchamment, et je ne donne la méthode que pour Firefox et Opera alors que c'est sans doute possible sur d'autres navigateurs. D'ailleurs, si vous savez comment faire sur d'autres navigateurs, répondez avec une explication et je l'ajouterai... mais ici c'est moi qui décide, et comme je suis pas sympa, je n'ajouterai rien qui permette de faire ça sous IE.
Pour l'instant, ça ne marche que pour l'éditeur standard, pas pour le WYSIWYG. A venir, peut-être.

Sous Firefox

Installer GreaseMonkey, puis redémarrer Firefox,
L'icône de GreaseMonkey (

) apparaît à droite de la barre d'état de Firefox (en bas de l'écran). Faire un Clic Droit dessus, puis "New User Script",
Une fenêtre apparaît avec plusieurs champs à remplir. Les seuls champs importants sont le champ Name et le champ Include. Le premier sert à donner un nom au script (par exemple "Couleurs forum GT"), le second sert à dire à GreaseMonkey dans quelles pages ce script devra s'exécuter (on peut commencer par http://forum.guerretribale.fr/newreply.php*, avec l'étoile),
Il me semble que c'est à ce moment que GreaseMonkey demande quel programme utiliser pour ouvrir des fichiers texte. Le plus simple sur Windows est de répondre C:\Windows\notepad.exe (je crois qu'il est là sur toutes les versions récentes de Windows),
Un fichier texte devrait s'ouvrir dans le bloc note et contenir plus ou moins :
Code:
```
[COLOR="SeaGreen"]// ==UserScript==
// @name           Couleurs forum GT
// @include        http://forum.guerretribale.fr/newreply.php*
// ==/UserScript==[/COLOR]
```
On va ajouter, après ces lignes qui servent juste à se souvenir des données entrées à l'étape 3, les lignes qui constitueront le code du script, c'est-à-dire pour moi :
Code:
```
var textarea = document.getElementById("vB_Editor_001_textarea") || document.getElementById("message");
if (!textarea) return;
var newtext = textarea.value + "[COLOR=Purple[b][/b]]\n\n\n[/COLOR[b][/b]]";
textarea.value = newtext;
```
Les deux premières lignes trouvent la boite de texte dans laquelle on tape les messages. La dernière ligne applique les modifications. La ligne qui nous intéresse est la troisième, qui définit le texte qui sera automatiquement ajouté aux nouveaux posts, réponses, quotes etc,
On peut modifier cette troisième ligne en respectant les règles suivantes :
- Le var newtext = et le ; de fin de ligne ne doivent pas être changés,
- textarea.value désigne le texte qui était déjà dans la zone de texte au chargement du script (par exemple lors d'un edit ou d'un quote). Note : pas de guillemets,
- N'importe quel texte peut être rajouté avant ou après en tapant ce qu'on veut ajouter entre guillemets, et en mettant un + comme dans l'exemple.
- Certains caractères spéciaux peuvent être utiles dans les textes entre guillemets : \n pour un saut de ligne et \t pour une tabulation, en particulier.
Penser à enregistrer le fichier après l'avoir modifié,
Normalement, ça marche.

Sous Opera

Lire le tutoriel sur les userjs d'Opera,
Faire la même chose que pour Firefox à partir de l'étape 5, avec les userjs à la place de GreaseMonkey... en gros.
Normalement, ça marche aussi.

DeletedUser · 2. Fev 2010

Merci de ce tuto, mais arrivé au notepad et après avoir entré les commandes, cela ne marche pas :x

DeletedUser · 2. Fev 2010

Je fais un test du script

Edit: Toujours pas :x

DeletedUser8852 · 2. Fev 2010

re test

DeletedUser · 2. Fev 2010

Moi non plus, cela ne fonctionne pas, j'ai pourtant bien suivi le tutoriel...

DeletedUser8852 · 2. Fev 2010

Chez moi ca marche

il faut clic droit sur le singe(non pas toi Whoozi) cliquer sur Activer et le singe doit etre en couleur ensuite aller faire repondre quelque part et avant de marquer quelque chose , clic droit sur le singe il y aura marqué Couleur Auto forum ou le nom que vous avez donner vous cliquer dessus et un V de validation doit apparaitre a coté.

Il ne vous reste plus qu'a redemarer firefox et le tour est joué, il se mettra en automatique

voila la fin de ma console

var textarea = document.getElementById("vB_Editor_001_textarea") || document.getElementById("message");
if (!textarea) return;
var newtext = textarea.value + "[*COLOR=DarkSlateGray][*B][*I]\n\n\n[*/COLOR][*/B][*/I]";
textarea.value = newtext;

merci de ne pas copier et enlever les *

DeletedUser · 2. Fev 2010

Cela marche maintenant, j'avais gardé l'éditeur WYSIWYG, c'est pour ça

DeletedUser399 · 2. Fev 2010

Merci pour ce tuto

DeletedUser · 3. Fev 2010

Voilà, tout est parfait sans WYSIWYG, merci Lay

DeletedUser · 3. Fev 2010

J'ai une question lay

Peux-tu m'expliquer comment fonctionne cette ligne :

Code:

var newtext = [B]textarea.value[/B] + "[[b][/b]COLOR=Purple]\n\n\n[[b][/b]/COLOR]";

Car moi j'aurais fait :

Code:

var newtext = "[[b][/b]COLOR=Purple]\n" + [B]textarea.value[/B] + "\n[[b][/b]/COLOR]";

A moins que GM considère que le contenu doit être mit à la place des "\n\n\n" ?

Merci de m'éclairer ^^

DeletedUser8852 · 3. Fev 2010

les \n servent a mettre la console de fin 3 lignes en dessus en fait, il faut les enlever si vous voulez que votre console de fin soit a coté de celle de debut et inserer le texte entre

var newtext = textarea.value + "[*COLOR=Purple]\n\n\n[*/COLOR]";

Cliquez pour agrandir...

il ne faut pas toucher le texrarea value

si tu veux rajouter du gras et de l'italique et que les veux veux sur la meme ligne tu fait, il faut enlever les etoile sur les pointillié mettre le nom de l'ecriture sans les " "

var newtext = textarea.value + "[*I][*B][*COLOR=...][*/I][*/B][*/COLOR]";

Cliquez pour agrandir...

DeletedUser8 · 3. Fev 2010

GregDGreg a dit:
J'ai une question lay

Peux-tu m'expliquer comment fonctionne cette ligne :

Code:

var newtext = [B]textarea.value[/B] + "[[b][/b]COLOR=Purple]\n\n\n[[b][/b]/COLOR]";

Car moi j'aurais fait :

Code:

var newtext = "[[b][/b]COLOR=Purple]\n" + [B]textarea.value[/B] + "\n[[b][/b]/COLOR]";

A moins que GM considère que le contenu doit être mit à la place des "\n\n\n" ?

Merci de m'éclairer ^^

Ca me permet d'avoir le code couleur plus facilement copie-collable puisqu'il est en un bloc, puisque parfois je l'ajoute à l'intérieur d'un quote. A part ça les deux solutions ne diffèrent que peu.

DeletedUser8 · 4. Fev 2010

Une petite update pour ceux qui aiment faire des trucs rigolos avec ce qu'ils écrivent, mais en prévenant que ça risque de faire des trucs non-voulus parce que c'est codé de manière un peu crade et donc sujet à erreurs. Dites le moi si vous en remarquez.

Bref, cette mise à jour permet d'ajouter automatiquement :

Du texte au début de la boite texte,
Du texte à la fin de la boite texte,
Des BBCodes autour des lettres majuscules.

Pour ça, il suffit simplement de remplacer l'ancien script par celui-ci et d'en éditer les quatre premières lignes :

Code:

var pre_text  = "[[b][/b]COLOR=Purple]";
var post_text = "[[b][/b]/COLOR]";
var pre_cap   = "[[b][/b]b]";
var post_cap  = "[[b][/b]/b]";



var textarea = document.getElementById("vB_Editor_001_textarea");
if (!textarea) return;

var status = 0;

function textarea_onkeypress(event) {
	code = event.which;
	if (code>=65 && code<=90) {
		if (status == 0) {
			var start = textarea.selectionStart;
			var end   = textarea.selectionEnd;
			var content = 
				textarea.value.substring(0,start) +
				pre_cap + 
				post_cap + 
				textarea.value.substring(end);
			textarea.value = content;
			textarea.selectionStart = start + pre_cap.length;
			textarea.selectionEnd   = textarea.selectionStart;
			status = 2;
		}
	} else if (status == 1 && (code < 97 || code > 122)) {
		status = 0;
	}
}

function textarea_onkeyup(event) {
	code = event.which;
	if (status == 2 && code>=65 && code<=90) {
		textarea.selectionStart += post_cap.length;
		status = 1;
	}
}

function reset_status(event) {
	status = 0;
}

function init(){
	textarea.addEventListener('keypress', textarea_onkeypress, true);
	textarea.addEventListener('keyup',    textarea_onkeyup,    true);
	textarea.addEventListener('mousedown',reset_status,        true);

	textarea.focus();
	
	var text  = textarea.value;
	
	if (
			(text.substring(0,pre_text.length) != pre_text) ||
			(text.substring(text.length-post_text.length) != post_text)
		) textarea.value = pre_text + text + post_text;

	textarea.selectionStart = textarea.value.length - post_text.length;
	textarea.selectionEnd   = textarea.selectionStart;
}

init();

J'ai essayé de le rendre un peu intelligent pour qu'il ne change en gros que la première majuscule d'un mot, mais dans certaines circonstances c'est possible que le résultat ne soit pas celui attendu. Vérifiez que c'est bon au fur et à mesure que vous tapez, et utilisez CTRL+Z pour annuler si besoin.

D'autre part, si le texte à ajouter au début et le texte à ajouter à la fin sont déjà tous les deux au début et à la fin du message quand la page se charge (par exemple pour un edit, ou ce genre de choses), alors ils ne sont dorénavant plus ajoutés en double.

DeletedUser · 5. Fev 2010

layrajha a dit:
Ca me permet d'avoir le code couleur plus facilement copie-collable puisqu'il est en un bloc, puisque parfois je l'ajoute à l'intérieur d'un quote. A part ça les deux solutions ne diffèrent que peu.

OK ! Je me disais aussi que ça ne devait pas marcher sans manip

Et c'est vrai qu'à ce moment là, un simple copié/collé suffit à les placer où on veut

Je suppose que dans ta version perso tu les as ajouté en fin de texte pour les avoir à portée de main

Sinon excellent travail, on voit bien que tu t'amuses en faisant ça, code très lisible et facilement modifiable... Je te félicite

DeletedUser8 · 5. Fev 2010

La version que j'utilise en ce moment est exactement celle que j'ai posté dans mon post précédent ^^ Et oui, j'aime bien coder de manière assez claire, sinon c'est du travail à recommencer à zéro si je veux m'y remettre après quelques semaines/mois et que je n'arrive pas à ma relire.

Par contre, je commente rarement, mais certains codeurs réputés affirment qu'un code qui a besoin d'être commenté est un code qui n'est pas assez lisible, et que le temps passé à commenter devrait être passé à faire un code clair (je suis assez d'accord, mais vu que je code toujours des trucs assez courts, je peux pas vraiment parler pour du codage plus orienté "grosse application commerciale").

DeletedUser · 5. Fev 2010

Pour le codage "grosse application" j'en connais un rayon et crois-moi que travailler en groupe, les commentaires ça aide

et ça permet aussi de faire des bouts de code très condensés, ça le rend plus lisible quand il y a des milliers de lignes de code par page

(excusez le hors sujet

)

DeletedUser · 12. Fev 2010

Merci pour le rajout, c'est tellement d'écrire tout simplement et de ne pas cliquer sur tout ces boutons

DeletedUser · 9. Avr 2010

Serait-il possible que le script fonctionne avec les réponses rapides ?

DeletedUser8 · 9. Avr 2010

RCool a dit:
Serait-il possible que le script fonctionne avec les réponses rapides ?

Code:

// ==UserScript==
// @name           Purple Post
// @namespace      http://layrajha.com
// @include        http://forum.guerretribale.fr/*
// ==/UserScript==


var pre_text  = "[[b][/b]COLOR=Purple]";
var post_text = "[[b][/b]/COLOR]";
var pre_cap   = "[[b][/b]b]";
var post_cap  = "[[b][/b]/b]";



var textarea = document.getElementById("vB_Editor_001_textarea") || document.getElementById("vB_Editor_QR_textarea");
if (!textarea) return;

var status = 0;

function textarea_onkeypress(event) {
	code = event.which;
	if (code>=65 && code<=90) {
		if (status == 0) {
			var start = textarea.selectionStart;
			var end   = textarea.selectionEnd;
			var content = 
				textarea.value.substring(0,start) +
				pre_cap + 
				post_cap + 
				textarea.value.substring(end);
			textarea.value = content;
			textarea.selectionStart = start + pre_cap.length;
			textarea.selectionEnd   = textarea.selectionStart;
			status = 2;
		}
	} else if (status == 1 && (code < 97 || code > 122)) {
		status = 0;
	}
}

function textarea_onkeyup(event) {
	code = event.which;
	if (status == 2 && code>=65 && code<=90) {
		textarea.selectionStart += post_cap.length;
		status = 1;
	}
}

function reset_status(event) {
	status = 0;
}

function init(){
	textarea.addEventListener('keypress', textarea_onkeypress, true);
	textarea.addEventListener('keyup',    textarea_onkeyup,    true);
	textarea.addEventListener('mousedown',reset_status,        true);

	textarea.focus();
	
	var text  = textarea.value;
	
	if (
			(text.substring(0,pre_text.length) != pre_text) ||
			(text.substring(text.length-post_text.length) != post_text)
		) textarea.value = pre_text + text + post_text;

	textarea.selectionStart = textarea.value.length - post_text.length;
	textarea.selectionEnd   = textarea.selectionStart;
}

if (textarea.enabled) {
	init();
} else {
	textarea.addEventListener('focus',init,true);
}

Pense à modifier le "include" qui a changé (dans les lignes en commentaire en haut du script) et à remettre tes paramètres.

DeletedUser · 9. Avr 2010

C'est bon ça marche, merci

[Aide au Jeu] Couleurs automatiques.

DeletedUser8

Guest

DeletedUser

Guest

DeletedUser

Guest

DeletedUser8852

Guest

DeletedUser

Guest

DeletedUser8852

Guest

DeletedUser

Guest

DeletedUser399

Guest

DeletedUser

Guest

DeletedUser

Guest

DeletedUser8852

Guest

DeletedUser8

Guest

DeletedUser8

Guest

DeletedUser

Guest

DeletedUser8

Guest

DeletedUser

Guest

DeletedUser

Guest

DeletedUser

Guest

DeletedUser8

Guest

DeletedUser

Guest