HandCoder : extension Nvu pour Tidy et PHP

Le premier forum francophone sur l'éditeur de pages Web multiplateforme (Linux, Mac OS X, Windows) qui monte… KompoZer, héritier de Nvu, permet de créer vos pages Web graphiquement (wysiwyg) sans aucune connaissance du langage HTML.

Modérateur : chinon37

dude
Gecko
Messages : 89
Inscription : 08 juin 2005, 13:50

Message par dude »

Concernant les fenêtre que j'appel "accrochée", terme qui n'implique que moi et dont je ne suis pas sur de l'exactitude, voici quelques photos pour illustrer.

oups, comment on fait pour uploader des images depuis sont disque local? la balise img demande une url, mais j'en ai pas, help
[/img]
Flore
Administratrice
Messages : 3567
Inscription : 19 nov. 2003, 23:04

Message par Flore »

Sur mac, on parle de fenêtres modales ou non modales.
Modale : on dirait une feuille qui se déroule depuis la barre de titre. Elle est seule active et on ne peut pas toucher à la fenêtre derrière. Elle n'a pas de barre supérieure avec les boutons fermer, agrandir...
Non modale : même chose que sous windows et linux, une fenêtre indépendante.
Flore
Mac OSX + Nightly / Laptop Linux Mint + Nightly / Nightly sur Android
dude
Gecko
Messages : 89
Inscription : 08 juin 2005, 13:50

Message par dude »

merci Flore pour cette description simple et claire, contrairement à la mienne :oops:

donc, la boite de dialogue de handcoder/tidy est modale, comme celle du cssEditor, par exemple, et au contraire de celle du gestionnaire d'extension qui est non modale.
Kazé
Varan
Messages : 1743
Inscription : 10 févr. 2005, 10:26

Message par Kazé »

Quelques notes (personnelles ?) concernant HandCoder. Vu le nombre de pages de ce sujet, un billet de plus ou de moins...

Je vais essayer de publier rapidement une version qui permette d'éditer les fichiers PHP avec l'onglet source, c'est-à-dire qui permette d'ajouter un prologue avant le DOCTYPE (authentification & co), ainsi que d'éditer des fragments HTML (sans DOCTYPE, <html>, <head> ni <body>), sans recourir à un éditeur externe.

Ceux qui ont la patience de lire mes trop nombreux et trop long billets ont dû saisir que je n'aime pas du tout l'onglet "Source" de Nvu. Et plus j'y travaille, moins je l'apprécie... quelques raisons en vrac :
  1. ce n'est pas (et ça ne sera jamais) un éditeur texte ;
  2. ça n'est pas non plus un onglet comme "Normal", "Balises HTML" ni "Aperçu" : il s'agit d'un composant "Editor" à part entière, qui est complètement décorrélé du "tabEditor" (l'éditeur HTML de Nvu) ;
  3. cet onglet ne modifie pas le code HTML réel du document, mais une vue HTML du code générée par un mécanisme du genre du "view-source" de Firefox ;
  4. le passage d'un mode d'édition "Normal" au mode "Source" suppose toute une machinerie vraiment lourde, qui est susceptible de corrompre le code du document ;
  5. on ne peut pas annuler les changements qu'on a fait dans cet onglet "Source" ; pire, ça rompt même la chaîne des "undos".
Donc, mon objectif pour les versions 0.4.x de HandCoder sera de supprimer cet onglet "Source", ou plus précisément de le remplacer par une boite de dialogue, avec un joli bouton "Annuler" en bas.

Je pense que la façon "naturelle" d'éditer du code HTML depuis Nvu, ce n'est pas d'éditer l'ensemble de la page (comme avec l'affichage "Source" ou avec un éditeur externe), mais plutôt d'éditer des éléments HTML :
  • soit avec un clic droit "code HTML" sur la balise de l'élément dans la barre d'état (déjà dans HandCoder 0.3.x) ;
  • soit avec la fenêtre "Propriétés avancées" (améliorée pour la prochaine version), qui dissocie les attributs (html + javascript) du style et du contenu
On peut même envisager d'éditer directement le code HTML de l'élément courant dans une boite de texte "dockée" en bas de l'éditeur (je n'ai pas attendu "Maurice" pour tester ça ;) ) :
  • Image
Il manque encore une façon simple d'accéder aux éléments "pré-body", mais ce n'est pas insurmontable, loin de là.
Pour finir, je vous recommande de tester cette extension (Firefox) ; elle préfigure de la suite probable de HandCoder.

Le principal reproche que je m'auto-adresse vis-à-vis de tout ça, c'est que ça nous éloigne beaucoup (trop ?) de l'ergonomie d'origine de Nvu. Et si le chantier actuel sur NsmConText aboutit, ça sera encore pire...
KompoZer lead dev
Ubuntu 10.04 Lucid Lynx — « L'erreur est humaine, mais vraiment foutre la merde nécessite le mot de passe root. »
Mongo Bob
Varan
Messages : 1903
Inscription : 10 sept. 2005, 01:51

Message par Mongo Bob »

Kaze a écrit :Le principal reproche que je m'auto-adresse vis-à-vis de tout ça, c'est que ça nous éloigne beaucoup (trop ?) de l'ergonomie d'origine de Nvu.
Personnellement, sans en rajouter, j'ai fini de m'énerver avec NVU du jour où j'ai 1/arrêté de toucher à l'onglet Source et 2/ réussi à modifier le code de façon propre par Scite dans Handcoder (parce que c'est peut-être du vice, mais je ne modifie quasiment rien dans "Normal" par wysiwyg. Pourquoi? Ca m'est venu principalement en trouvant que c'était 10 fois plus facile d'insérer un div par le code que par "Normal" (à tort ou à raison, là n'est pas le problème)).
L'onglet "Normal" remplace pour moi l'onglet "Aperçu" qui lui-même ne me sert strictement à rien du tout, il serait pas là, ce serait pareil.
Par conséquent, je vais être clair : je me moque comme de ma première paire de chaussettes de l'ergonomie de NVU, je préfère un outil moins "classe", moins "joli", et pratique!
Donc : Continue Kaze, par pitié, pas de culpabilité! (et merci)
Do-IT
Iguane
Messages : 537
Inscription : 03 juil. 2005, 09:46

Message par Do-IT »

HTML>
J'adore cette boite 'dockée' en bas. Elle a visiblement également l'avantage d'avoir un rôle pédagogique pour les débutants.

Quand je travaille le source d'un html, c'est parfois pour la vue d'ensemble pour faire des gros couper/copier/coller/supprimer, parfois juste pour editer un element. La non indentation de l'onglet source de nvu me permet seulement d'editer un element après l'avoir peniblement trouvé (meme si tu en dit du mal reste que ca fonctionne quand meme les couper/copier/..., c'est vrai depuis il y a eu handcoder). Pour la vue globale, l'editeur externe via tidy reste necessaire pour l'instant.
Si j'ai bien compris tu veux faire une boite de dialogue dans laquelle tu va afficher 'view formated source' et qui sera editable ? Ce qui permettrait de garder la chaine des undos ? Pourquoi pas si c'est plus facile qu'un nouvel onglet ?

A par editer l'element courant dans cette boite dockée, on pourra y coller du html ? Si on clic dans la barre en bas sur body div dl on editera le contenu en entier ?

PHP>
Le php lui, s'il depasse 1 ligne je l'"include" maintenant surtout a cause des nombreux "die('</body></html>')" que j'ai encore la sale habitude d'utiliser.
Qu'en est-il de l'edition des simples ligne php ? dans la fenetre dockée ? avec un clic droit sur la barre d'etat ? Dans la nouvelle boite de dialogue ? Y compris le pre body ?

Gadget >
Dans la roadmap gadget tu as ajouté la convertion html/xhtml transitional/strict ?

Bon courage pour tous ces chantiers.
Redhat, CentOs, Mandriva, Ubuntu au boulot. Ubuntu à la maison. Vista et Xp grâce à la vente liée.
Soutenir KompoZer
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Message par Ymai »

Kaze a écrit : Le principal reproche que je m'auto-adresse vis-à-vis de tout ça, c'est que ça nous éloigne beaucoup (trop ?) de l'ergonomie d'origine de Nvu. Et si le chantier actuel sur NsmConText aboutit, ça sera encore pire...
Evidemment, si le but du jeu est de révérer à l'infini un outil qui est resté en phase de développement et pour lequel on ne peut attendre de correctif dans un temps prévisible, il est clair que tu es entré dans la zone du Sacrilège impie.
Si l'idée est de développer un outil libre, génial, fonctionnel et performant, vive le Sacrilège et l'impiété.
A moins que Dieu se manifeste et décide de participer au projet (son blog n'indique pas grand chose dans ce sens), je ne vois pas où est la place des scrupules.
Bon courage.
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
Do-IT
Iguane
Messages : 537
Inscription : 03 juil. 2005, 09:46

Message par Do-IT »

Ymai a écrit :A moins que Dieu se manifeste et décide de participer au projet (son blog n'indique pas grand chose dans ce sens)
+1 :lol: C'est un rire nerveux.
Je suppose que Daniel attend un sponsor. Mais meme, vu les nouveau clients qu'il a, encore faudrait-il qu'il ai le temps.
Redhat, CentOs, Mandriva, Ubuntu au boulot. Ubuntu à la maison. Vista et Xp grâce à la vente liée.
Soutenir KompoZer
Kazé
Varan
Messages : 1743
Inscription : 10 févr. 2005, 10:26

Message par Kazé »

Mongo Bob a écrit :L'onglet "Normal" remplace pour moi l'onglet "Aperçu" qui lui-même ne me sert strictement à rien du tout, il serait pas là, ce serait pareil.
+1
Ou alors, il faudrait que cet onglet "Aperçu" ne permette aucune modification, mais uniquement la visualisation de la page, avec les effets JavaScript...
Do-IT a écrit :J'adore cette boite 'dockée' en bas. Elle a visiblement également l'avantage d'avoir un rôle pédagogique pour les débutants.
Oui, je le crois aussi.
Elle est aussi très pratique pour le débug de HandCoder... :wink:
Do-IT a écrit :Si j'ai bien compris tu veux faire une boite de dialogue dans laquelle tu va afficher 'view formated source' et qui sera editable ? Ce qui permettrait de garder la chaine des undos ? Pourquoi pas si c'est plus facile qu'un nouvel onglet ?
En fait, l'affichage source est déjà un éditeur HTML de la sortie 'view source' de Mozilla...
  • [edit] Oui, l'idée serait effectivement d'utiliser la sortie "view formatted source" plutôt que le "view source" syndical... L'autre point intéressant de cette extension "view-formatted-source", c'est qu'elle récupère les styles interne et parents de chaque élément HTML.[/edit]
mais le fait qu'il soit faussement intégré dans Nvu ne fait que compliquer le code, et n'apporte aucun avantage du point de vue ergonomie (on ne peut pas avoir deux onglets en mode "Source").
Ca ne permettrait probablement pas de garder la chaîne des undos, mais au moins on aurait un bouton "Annuler" pour les fois où on a pourri le code source avec un mauvais copier / coller (ce qui m'arrive trop souvent).

J'imagine volontiers une fenêtre modale "Source" avec 3 onglets :
  • un onglet "Edition" (l'onglet "Source" actuel quoi)
  • un onglet "Original" qui contiendrait le code HTML du document tel que sauvegardé sur le disque
  • un onglet "Sortie" qui présenterait le code prêt à être enregistré (reformatté par Tidy).
Ca permettrait de jouer plus facilement avec les options de Tidy, ainsi que de convertir un document d'un format à l'autre (html <=> xhtml, transitional <=> strict)... et accessoirement ça serait beaucoup plus facile à débugger.
Cette fenêtre pourrait aussi être utile pour visualiser les outrages que Nvu est susceptible de faire subir à une page PHP avant de la sauvegarder...
Do-IT a écrit :A par editer l'element courant dans cette boite dockée, on pourra y coller du html ? Si on clic dans la barre en bas sur body div dl on editera le contenu en entier ?
Pour l'instant, cette boite me sert surtout au débug, elle est encore en lecture seule. Mais la rendre éditable n'est pas un problème, il suffit de 10 lignes de JavaScript (ou à peine plus) : il suffirait que l'élément que l'on édite en bas soit inclus dans le document dès qu'on clique hors de cette boite (sachant que le Ctrl-Z fonctionne dans ce cas-là).
Cette boite permet d'éditer tous les éléments sauf <html>, <head> et <body>. Elle pourrait éditer le contenu de <body>.
Pour éditer le contenu de <head> et de l'éventuel prologue, je pense ajouter deux boutons dans la boite des propriétés de la page. Je vais également filer un coup de main à Simon Wunderlin pour qu'il ajoute des boutons "prologue" et "PHP" dans sa barre "HTML Header".
Pour éditer le DOCTYPE ou l'ensemble du document, il faudra passer par l'éditeur externe (ou la boite "Source"), mais là on perdra vraisemblablement les undos.
Do-IT a écrit :Le php lui, s'il depasse 1 ligne je l'"include" maintenant surtout a cause des nombreux "die('</body></html>')" que j'ai encore la sale habitude d'utiliser.
Je vais refaire des tests, mais je crois que les "die('</body></html>')" passent désormais correctement avec ma version de travail.
Do-IT a écrit :Dans la roadmap gadget tu as ajouté la convertion html/xhtml transitional/strict ?
Non, il s'agirait de la roadmap de HandCoder, et non celle de NsmConText.
NsmConText est quasiment stable, les fonctionnalités prévues ne sont pas très techniques à réaliser, donc une "roadmap" est envisageable. Ce n'est pas le cas de HandCoder !
Ymai a écrit :Si l'idée est de développer un outil libre, génial, fonctionnel et performant, vive le Sacrilège et l'impiété.
Euh... libre et fonctionnel dans un premier temps !

Merci pour vos encouragements ! :oops: :D
KompoZer lead dev
Ubuntu 10.04 Lucid Lynx — « L'erreur est humaine, mais vraiment foutre la merde nécessite le mot de passe root. »
Do-IT
Iguane
Messages : 537
Inscription : 03 juil. 2005, 09:46

Message par Do-IT »

Tant que j'y suis. handcoder 0.3.0 20051201
A l'ouverture d'un fichier php > fenetre > Accepter les modification (pourquoi il me demande ca ?)

Code : Tout sélectionner

Erreur : uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMWindowInternal.focus]"  nsresult: "0x80004005 (NS_ERROR_FAILURE)"  location: "JS frame :: chrome://editor/content/editor.js :: SetFocusOnStartup :: line 615"  data: no]
Erreur : GetCurrentEditor() has no properties
Fichier source : chrome://editor/content/editorUtilities.js
Ligne : 1233
Erreur : e has no properties
Fichier source : chrome://editor/content/bindings/tabeditor.xml
Ligne : 444
Hop cinema maintenant ! Faut que j'arrette !
Redhat, CentOs, Mandriva, Ubuntu au boulot. Ubuntu à la maison. Vista et Xp grâce à la vente liée.
Soutenir KompoZer
Kazé
Varan
Messages : 1743
Inscription : 10 févr. 2005, 10:26

Message par Kazé »

Une nouvelle beta s'approche lentement mais sûrement.
Un point sur les corrections à apporter :
  • support de l'éditeur texte : fonctionnel, mais encore quelques bugs sur la fenêtre d'alerte (fichier modifié) ; il faudrait également pouvoir ouvrir l'éditeur "Source" de Nvu dans une boite de dialogue (OK/Annuler) ;
  • support ASP/JSP/PHP : en cours de réécriture (encore). L'objectif n'est plus d'éditer n'importe quel document PHP, mais de pouvoir créer tout type de document PHP, à savoir :
    • les "templates" PHP : je suppose dorénavant que ces documents ne portent jamais l'extension *.html, et qu'il doivent toujours débuter par un prologue avant le DOCTYPE (s'ils ne contiennent pas de prologue, HandCoder en rajoutera un, vide) ; c'est plus facile à coder comme ça, et c'est plus cohérent avec les types MIME de Gnome.
    • les "fragments" HTML : les fichiers sans DOCTYPE, <html>, <head>, <body> peuvent être enregistrés sans que Nvu ne rajoute les en-têtes HTML (quelle extension ces fragments devraient-ils utiliser ? html, php ou autre ?). Corollaire : si on supprime les en-têtes HTML depuis l'affichage "Source", Nvu de devrait pas les rajouter lors de la sauvegarde.
    Pour éditer ces fichiers, HandCoder crée encore un fichier temporaire (avec l'extension *.html pour éviter certains problèmes sous Linux). On pourra désormais éditer le code source de ces fichiers depuis l'affichage "Source" de Nvu.
  • support de Tidy : perfectible ; il faudrait intégrer Tidy comme DLL pour simplifier l'installation et permettre l'indentation du code en affichage "Source". Ca marchouille chez moi mais pour l'instant il y a trop de problèmes avec la version que j'utilise (il va falloir que je compile mon propre composant XPCOM). Un assistant de paramétrage de Tidy serait un plus, et il faudrait également disposer d'une fenêtre "Validateur de code HTML (Tidy)".
  • nettoyage du code : outre Tidy, HandCoder fait déjà du reformattage de code (comme les <BR> qui sont remplacés par des fins de ligne dans les blocs <PRE>). Il faut étendre cette fonctionnalité pour insérer des gadgets comme la date de dernière sauvegarde, et améliorer encore le nettoyeur de balises (meilleure suppression des blocs vides et création d'une feuille de style interne remplaçant les styles en ligne, notamment).
Bref, y'a encore du boulot, mais je commence à en voir le bout.
Le support ASP/JSP/PHP a la priorité, j'espère pouvoir poster une beta pour ce week-end.
Do-IT a écrit :A l'ouverture d'un fichier php > fenetre > Accepter les modification (pourquoi il me demande ca ?) [Erreur]
C'est parce que la détection des modifications est encore perfectible... :oops:
C'est en cours de réécriture.
Ymai a écrit :Je tente de visualiser une page préalablement enregistrée dans un navigateur. Je choisis FF parmi les deux disponibles.
FF ne démarre pas mais la console Javascript m'indique:

Code : Tout sélectionner

Erreur : FilePath is not defined
Fichier source : chrome://handcoder/content/kazio.js
Ligne : 121
Pour rassurer tout le monde: IE ne démarre pas non plus.
Redémarrer NVU: pas de résultat.
Désinstaller et réinstaller HandCoder: OK.
Il faut que je définisse un espace commun entre NsmConText et HandCoder pour le lancement des applications externes (les deux extensions se marchent encore dessus). Le nouveau mode de support ASP/JSP/PHP de HandCoder devrait faciliter la chose...
KompoZer lead dev
Ubuntu 10.04 Lucid Lynx — « L'erreur est humaine, mais vraiment foutre la merde nécessite le mot de passe root. »
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Message par chinon37 »

Bon courage :P
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Message par Ymai »

Kaze a écrit :
Do-IT a écrit :A l'ouverture d'un fichier php > fenetre > Accepter les modification (pourquoi il me demande ca ?) [Erreur]
C'est parce que la détection des modifications est encore perfectible... :oops:
C'est en cours de réécriture.
J'ai eu un autre truc gênant, mais dont je n'ai pas pu percevoir les causes. Ce post est donc sans grand intérêt, du coup.
Tant pis.
Modification d'un fichier ouvert dans NVU à partir d'un éditeur externe (essayé avec Scite et Context), retour à NVU qui ne voyait pas la modification externe. Normalement, on reçoit l'avertissement de la modification et la demande d'acceptation. Là, rien. Et donc, toutes les modifications opérées de l'extérieur, même sauvegardées dans Scite ou Context, se trouvent perdues dès qu'une touche est frappée dans NVU et qu'on enregistre.
J'ai tout réinstallé et, à l'instant où j'écris, le fonctionnement est redevenu normal.
Ne pourrait-il s'agir d'un croc-en-jambe d'une extension sur l'autre? J'ai l'impression que l'ordre dans lequel on installe les extensions n'est pas innocent.
Tu avais déjà évoqué les interactions possibles et les bouts de codes croisés entre les différentes extensions. Serait-ce une cause possible?

Pour le reste, tous ces projets sont vraiment géants. On ne peut qu'être admiratif.
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
Kazé
Varan
Messages : 1743
Inscription : 10 févr. 2005, 10:26

Message par Kazé »

Ymai a écrit :Ne pourrait-il s'agir d'un croc-en-jambe d'une extension sur l'autre? J'ai l'impression que l'ordre dans lequel on installe les extensions n'est pas innocent.
Tu avais déjà évoqué les interactions possibles et les bouts de codes croisés entre les différentes extensions. Serait-ce une cause possible?
Oui, c'est une cause possible (et l'ordre d'installation n'est pas innocent). C'est ce qui fait que les extensions ne sont pas un bon moyen de corriger les bugs de Nvu. Mais à défaut d'autre chose...

Il est possible aussi que ça vienne d'un autre bug de Nvu (grave) que je viens de trouver, auquel cas la solution risque de tarder à venir. :(
KompoZer lead dev
Ubuntu 10.04 Lucid Lynx — « L'erreur est humaine, mais vraiment foutre la merde nécessite le mot de passe root. »
Do-IT
Iguane
Messages : 537
Inscription : 03 juil. 2005, 09:46

Message par Do-IT »

Concernant l'edition interne à nvu. Pour le html tu parles d'une boite de dialogue avec ok/annuler. Pour le php tu parles de l'onglet source. Se serait pas mieux de tout faire dans une fenetre (ou fenetre 'docké') de maniere a maitriser entirement ce que tu veux y afficher/editer, et d'abandonner definitivement l'onglet source et d'abandonner egalement définitivement l'editeur externe ?

Pour les extensions de fragments, dans ma pratique c'est .inc.php (surtout depuis que j'utilise handocder qui digerait pas mon php). J'ai jamais vu de .inc.html . Si on a un fragment c'est qu'il faut bien pouvoir l'inclure avec un script donc meme si le fragment contient que du html on peut quand meme lui mettre l'extension du language ? .inc.php .inc.asp etc... ?

Le travail sur plusieurs documents simultanement, des fois ca passe, des fois j'ai des crashites aigues à répétition meme avec un seul document ouvert. Peut-etre que c'est du a l'ordre d'installation des extensions. La desinstallation de toutes les extensions suffit à resoudre ça ou faut-il supprimer le profil nvu ?
Redhat, CentOs, Mandriva, Ubuntu au boulot. Ubuntu à la maison. Vista et Xp grâce à la vente liée.
Soutenir KompoZer
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 3 invités