Modifier l'éditeur de texte

[seechi]

Bonjour à toutes et à tous !

Alors voilà, j'aimerais modifier l'éditeur de texte (Nouvelle discussion et nouvelle réponse), mais je n'y arrive pas, j'ai tenté de modifier le template de newthread mais rien n'y fait, il n'y a rien dedans tout est géré ailleurs.

Ayant trouvé un ID j'ai tenté d'insérer un nouvel élément avec Javascript, mais ça ne fonctionne pas non plus.

Ce que je cherche : ajouter un élement après le sélecteur de couleur du texte, dans lequel se trouverait un lien ouvrant un pop-up, pour héberger des images.

Voilà, si quelqu'un saurait comment faire je lui serais reconnaissant, bonne soirée à vous !

[spyto]

Le bouton pour insérer une image existe déjà...

Pour rajouter un bouton à la barre d’outils de l"éditeur, voir ce tuto :
http://www.mybb.fr/thread-903.html

[Saphir]

Oui, mais il demande pour que le bouton ouvre une popup à l'url d'un hébergeur d'images, et ça m'intéresserait aussi... :p

[seechi]

Je vous remercie, en m'inspirant du tuto j'ai pu faire ce que je voulais.

J'utilise MyBB 1.6.3, et ce que je voulais était d'avoir un bouton pour ouvrir un pop-up, guidant vers l'app portable de mon hébergeur.
Ca tombe bien car obligation d'insérer des balises au moment du clic donc j'ai mis les [img].

Pour ceux que ça intéresse, il faut trifouiller jscripts/editor.js à la ligne 209

Code :

this.createToolbar('topformatting', {
            container: 'top',
            items: [
                {type: 'dropdown', name: 'font', insert: 'font', title: this.options.lang.font, options: this.fonts},
                {type: 'dropdown', name: 'size', insert: 'size', title: this.options.lang.size, options: this.sizes},
                {type: 'button', name: 'color', insert: 'color', dropdown: true, color_select: true, image: 'color.gif', draw_option: this.drawColorOption, options: this.colors},
                {type: 'button', name: 'bildberg', insert: 'img'}
            ]
        });

Comme vous le voyez j'ai pour ma part insérer un bouton nommé bildberg, qui donnera lieu à un <span id="editor_item_bildberg"></span> et qui au clic insérera dans le texterea "[img]".

En revanche, pour le reste j'ai triché, afin d'avoir l'icône et ouvrir le pop-up, j'ai rajouté ceci :

Code :

var bildberg_open = true;
        document.getElementById('editor_item_bildberg').addEventListener('click', function() {
                                                                                           if(bildberg_open) {
                                                                                            window.open('http://bildberg.eu/apps.php','BildBerg_Portable_Apps','toolbar=0, location=0, directories=0, status=0, scrollbars=0, resizable=0, copyhistory=0, menuBar=0, width=320, height=320');
                                                                                           bildberg_open = false;
                                                                                           } else {
                                                                                            bildberg_open = true;
                                                                                           }
                                                                                           return false;
                                                                                           }, false);
        
        document.getElementById('editor_item_bildberg').className="toolbar_button toolbar_normal";
        
        document.getElementById('editor_item_bildberg').setAttribute('title', 'Uploader une image');
        document.getElementById('editor_item_bildberg').innerHTML='<img alt="BildBerg" src="jscripts/editor_themes/default/images/bildberg_add.png" width="16" height="16" />';

Voilà voilà, je pense que c'est une petite base qui pourra vous aider pour rajouter vos propres boutons sur MyBB 1.6

Merci à vous, bonne soirée

PS : si vous voulez avoir le code complet pour pouvoir ouvrir mon pop-up avec une icône qui ne bug pas voici le code à mettre :

Code :

setElementState: function(element, state) {
        if(element.id != "editor_item_bildberg") element.addClassName('toolbar_'+state);
//Ligne 391 après avoir collé le code au dessus
/* L'icône est téléchargeable ici http://icones.pro/image-ajouter-image-png.html en 16x16.
A placer dans jscripts/editor_themes/images.
Une position relative avec top:2px; ainsi qu'un background:none; ont rajoutés dans jscripts/editor_themes/default/stylesheet.css */