|
Publicité ' | |||||||||||||||||||||||
|
|
#1 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
Bonjour,
Je dois intégrer un éditeur de WYSIWYG dans un site et je dois impérativement le développer moi-même, ceux qu'on trouve gratuits sur google sont beaucoup trop compliqués par rapport à la demande client, pour deux raisons: - Il va être utilisé par des gens qui n'ont jamais bossé pour le web, qui ont une très mauvaise connaissance des trucs du web et des ordinateurs en général - La mise en page doit coller parfaitement à la charte du site, y'a très peu de typos différentes, je dois y mettre très peu de boutons: gras, italique, insérer et positionner image, insérer lien, deux trois classes css toutes faites pour les titres... bref un truc assez ciblé qui va pas coller avec une solution générique bref si j'utilise les éditeurs tout faits super compliqués, ils vont être largués ... donc il faut que je développe un truc simple moi-même J'ai passé 2 plombes à chercher sur google et je trouve rien qui me guide sur la marche à suivre... j'ai trouvé de la doc sur les execCommand mais apparemment ça marche que sur iexplorer est-ce qu'il faut bêtement analyser la chaine de caractères selectionnée et ajouter/virer des balises pour garder un truc cohérent, ou est-ce que y'a des fonctions natives compatibles ie/mozilla qui gèrent ça automatiquement ? |
|
|
01
|
|
|
#2 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
Houlàlà... après une plombe supplémentaire de recherche je suis toujours largué, ça m'a pas l'air super clair...
Apparemment il faut utiliser un va-et-vient entre un div éditable et un textArea et je capte pas bien pourquoi si on est logique, le script analyse ce qui a été selectionné dans le div, et puis il modifie le code html en conséquence, donc je vois pas bien ce que vient faire le textArea là dedans... |
|
|
00
|
|
|
#3 | ||
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
bon donc je démarre par le commencement...
je commence par regarder ce que me renvoie ma sélection: Code :
je sais pas si planquer un textarea derrière pourrait servir à quelque chose... |
||
|
|
00
|
|
|
#4 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
bon là de toutes façons ça me sert à rien le résultat renvoyé, il me faudrait plutôt quelque chose comme un "start" et un "end"
ensuite je peux m'en sortir avec un tableau qui pour chaque index de caractère de la chaine html, enregistre l'index de caractère de la chaine texte simple, et là je m'y retrouve... mais j'ai peur que ça foire au niveau des retour à la ligne et je me demande s'il y'a pas une technique plus simple |
|
|
00
|
|
|
#5 |
|
Membre expérimenté
![]() ![]() Duke Jikel Inscription : mai 2010 Messages : 340 ![]() |
Tu es en train de te planter une épine dans le pied.
Devoir recoder un RTE à la main c'est du pur suicide. Tu prends TinyMCE, et tu ne mets QUE les icônes dont tu as besoin. Les RTE existants n'ont rien de compliqués, ils ont juste une tonne d'options, mais c'est à toi de configurer quelles options tu veux afficher ou non. Tu mettras 10x plus de temps à recoder un RTE bancal dont tu n'es même pas sur du résultat, que d'implémenter un RTE existant en ne mettant que les options nécessaires. |
|
|
01
|
|
|
#6 |
![]() ![]() Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 007 ![]() |
__________________
Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag ![]() ![]() réalisations :www.planet-languages.com|www.saftair.com| www.ouestisol.fr | www.sebemex.fr | www.extramiante.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr |
|
|
00
|
|
|
#7 | |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
Citation:
moi je me méfie des wysiwyg tout faits parce que y'en a qui font pas les choses bien (je le souviens de celui de la version gratos de typepad, ça plantait de partout) je veux être bien sûr du truc, qu'il prenne bien le temps d'analyser toute la structure html de ma page pour éviter qu'il rajoute des balises n'importe où, qu'il prenne bien soin d'en virer là ou il faut virer des balises avant d'en mettre ailleurs, ou alors de signaler des erreurs à l'user (genre lui dire nan t'as pas le droit de faire ça ici) |
|
|
|
00
|
|
|
#8 | |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
Citation:
en fait si je dois récupérer un code tout fait j'aurais juste besoin d'une fonction - mais bien faite - qui m'analyse bien tout l'innerhtml avant d'insérer des balises n'importe comment, qui en vire si besoin, ou qui renvoie un message d'erreur genre "selection incohérente" pour la coder moi-même j'aurais besoin de la technique qui me trouve le "startselection" et le "endselection" au bon endroit dans le code html... après je peux me débrouiller bon mais si ça me prend un mois à développer moi-même c'est pas la peine j'aurais jamais le temps... je pensais que ça serait jouable en une semaine mais c'est ptêt pas sûr dans ce cas faut que je choisisse un éditeur tout fait qui soit bien propre, bien sécurisé carré au niveau des risques de bugs html, et qui soit facilement paramétrable pour que je puisse y mettre exactement les balises que je veux |
|
|
|
01
|
|
|
#9 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
Bon donc récapitulatif si jamais je dois prendre un éditeur tout fait il faut impérativement qu'il puisse:
- être facilement paramétrable (que ça prenne pas plus de temps que de tout redévelopper moi-même) - que je puisse y mettre un field qui applique mes propres classes css et les balises que je veux où je veux (par ex une balise <font class="maclass"></font>, une balise <h1>, <h2>, <h3>, etc) - qu'il soit hyper carré quand à la correction des bugs html, qu'il n'imbrique pas les balises n'importe comment, qu'il empêche les mecs de faire n'importe quoi, qu'il dégage les balises si besoin, bref qu'il soit 100% fiable quand à avoir un résultat exempt de tout bug de html - qu'il puisse me mettre des images où on veut, calées à gauche, à droite, etc - que je passe pas une semaine à en essayer une tonne avant de trouver le bon Si ça n'existe pas alors je dois le développer moi-même. |
|
|
01
|
|
|
#10 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
j'ai regardé la lib jquery, j'ai pas besoin d'un machin aussi énorme qui sait faire une tonne de trucs dont j'ai pas besoin
si je la prends tel quel bonjour le gâchis de bande et de ram... et je vais pas comprendre comment ça marche en 5 minutes... y'a pas moyen d'isoler les fonctions qui servent à faire du wysiwyg ? |
|
|
00
|
|
|
#11 | |
|
Membre expérimenté
![]() ![]() Duke Jikel Inscription : mai 2010 Messages : 340 ![]() |
Citation:
Les rte comme tinyMCE ou Ckeditor sont plus que complet, ils proposent des tonnes de choses. Recoder toi même un RTE reviens à réinventer la roue et se planter droit dans le mur. Ces RTE possèdent une communauté, une doc, ils existent déjà dans pleins de CMS. En ce qui concerne Tinymce il est entièrement paramétrable, tu peux coder tes propres plugins, tu en prends un existant, tu le dupliques et tu le modifies. J'avais mis 3 jours à faire un plugin qui permettait de générer des tableaux complexes. J'ai juste eu à modifier le plugin des tableaux mais en lui apportant pleins d'options. Réinventer la roue t'obligerai à refaire tout le coeur d'un RTE, la sélection le mode HTML ou code, etc, etc. En utilisant un rte existant (tinymce dans le cas actuelle) tu aura juste à trouver des plugins qui t'intéresse un peu. Va lire un peu la doc ou regarder les exemples, il y a tellement de doc et d'exemples et de plugins que je ne comprends pas pourquoi tu t'obstines à en recoder un. |
|
|
|
11
|
|
|
#12 | |
|
Membre expérimenté
![]() ![]() Duke Jikel Inscription : mai 2010 Messages : 340 ![]() |
Citation:
|
|
|
|
11
|
|
|
#13 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
excuse j'ai pas eu envie de passer des plombes à me taper la doc de jquery alors qu'à la base je suis pas super chaud pour m'en servir... c'est quoi, c'est un émulateur de c# en javascript ?
|
|
|
01
|
|
|
#14 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
Ha ben voilà j'ai trouvé un truc déjà plus simple
TinyEditor, un petit script de 8ko, qui se débrouille sans usine à gaz jquery c# ou chépakoi il sait tout faire en 200 lignes de script, et encore la plupart du code sert à afficher les menus... je me disais bien qu'il fallait pas des semaines pour développer un wysiwyg javascript je vois que ça utilise les execCommand, en fait y'en a plein qui passent sous firefox |
|
|
01
|
|
|
#15 | ||
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
bon pour gras/italique/souligné j'ai trouvé là c'est fastoche...
Code :
maintenant faut que j'arrive à fourrer mes classes css, là je sais pas si execCommand gère ça |
||
|
|
00
|
|
|
#16 | ||
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
bien là j'arrive à mettre les links headers et paragraphes et font size et color et face en +, rien de difficile jusque là
Code :
bon si j'y arrive pas tant pis ils auront qu'à se débrouiller avec size/face le dernier truc qu'il me reste à mettre en place c'est pouvoir faire des images qui s'incrustent dans les blocs de texte... là je ne sais pas bien comment faire ça... |
||
|
|
01
|
|
|
#17 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
bon ben à priori j'ai réussi à faire tout ce que je voulais... il me reste à faire un petit toggle pour uniformiser le format
je reviendrai peut-être demander de l'aide + tard |
|
|
00
|
|
|
#18 | ||
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
mon p'tit code de test pour les curieux:
Code :
|
||
|
|
00
|
|
|
#19 | ||
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
heu je vois que y'a un mec qui met des tôles à tous mes posts ou je parle des execCommand...
par curiosité j'aimerais avoir son avis là dessus les execCommand c'est spécialement fait pour faire du wysiwyg nativement en appelant du beau code c++ tout propre derrière donc je pije pas bien pourquoi ça l'irrite j'ai réussi à faire tout ce dont j'avais besoin avec seulement 7 petites fonctions javascript donc je vois pas trop l'interêt de me prendre la tête avec le jquery super compliqué Code :
|
||
|
|
01
|
|
|
#20 |
|
Inactif
![]() Inscription : novembre 2010 Messages : 166 ![]() |
ouais bon okay en fait je vois le problème posé par les ecexcommand, d'un navigateur à l'autre ça encode le html de façon complètement différente donc ça peut vite être le bazar
donc ok je pije l'interêt de passer par un plugin à la place. quitte à passer par un plugin, ça serait pas mieux de faire le boulot avec flash player ? |
|
|
00
|
Copyright © 2000-2012 - www.developpez.com