HTML Playground

[falsam]

Un utilitaire pour tester du code HTML/CSS/Javascript et voir le résultat sans enregistrer le source.

Application.
Vous codez dans un scintilla gadget.
Vous voyez le résultat dans un WebViewGadget.
La coloration syntaxique est en place.
La console de débogage (Touche F12) est native dans le WebViewGadget.

100% natif PureBasic. Pas d'API. Normalement ça doit fonctionner sous Windows, MacOS et Linux.

Todo List.
Sauvegarde du projet (format JSON)
Sauvegardes du code (format (HTML)
Utilitaires choix des couleurs application et lexique.
Ajout de mots clés.
Améliorer l'auto complétion en affichant uniquement les mots qui commence par les premières lettres de la saisie.

Les bugs.

[Done] Correction de la coloration des commentaires HTML
La balise ouvrante et fermante ne sont pas colorées de la même couleur que le commentaire.

Parfois la balise </html> est mal colorée.


Download des sources.
https://falsam.com/download/purebasic/H ... nd_201.zip

[venom]

Merci pour le partage grand falsam.
Perso je ne code pu html, css .... Mais merci pour ce précieux partage.

KCC va être content






@++

[Kwai chang caine]

KCC va être content

Oui c'est un travail formidable
Ce que je cherche, c'est exactement ce genre de code magique que j'ai énormément de mal à réaliser , mais avec la gestion aussi du PHP
Car mes pages contiennent toujours les 4 en même temps

Moi aussi le miens avait des problèmes avec la coloration syntaxique , les fermetures de balise, l'écriture d'une certaine couleur dans une mauvaise zone
Car dès que l'on ajoute le PHP c'est l'enfer les imbrications
On dirait pas, mais si c'est mal codè, ou à l'ancienne comme je code moi même , une même phrase peut avoir les 4 langages, et même 5 car il y a aussi les commentaires qui eux aussi ne sont pas les mêmes pour les 4 langages... Un enfer je te dis, j'en aurais pleurè

[venom]

@falsam va t'aider a sortir de cet enfer






@++

[falsam]

@falsam va t'aider a sortir de cet enfer

Non. Cette petite application permet de saisir du code HTML/CSS/Javascript et envoie le résultat directement le résultat dans le WebViewGadget qui va l'interpréter puis affichement le rendu final.

le WebViewGadget est incapable d'interpréter le Php. Ce qui est le cas aussi de n'importe quel navigateur.

Php est interpréter par un serveur Php distant ou localhost qui renverra le résultat interprétable par le WebViewGadget ou l'interpréteur.

Pour résumer :
- Mon application envoie directement le résultat du code dans le WebViewGadget.
- Php a besoin d'un serveur distant ou localhost.

Pour ces deux raisons, je ne pourrais pas accéder à la demande de KCC

[Kwai chang caine]

Oui moi ce que je cherche à faire, c'est un editeur de code, comme par exemple notepad++, mais aussi bien d'autres editeurs WEB, et qui gere le PHP et JS/HTML/CSS, mais aussi tous les autres langages avec une coloration typique par langage

Perso juste les 4 du web sont mon but, et bien sûr sur la même page, car un éditeur n'est pas un navigateur, le navigateur est un client qui recoit et affiche le résultat, donc comme le dit FALSAM il est du côté client (frontend) donc ne traîne pas le PHP sur le serveur (backend)
Alors qu'un editeur c'est pas du tout ça, c'est comme celui de PB il sert à programmer aussi bien le côté client que serveur, il ne visionne ni n'affiche rien si ce n'est des lignes de code... Et de préférence de la bonne couleur et c'est la que pour l'instant on y arrive pas pour les 4 langages simultanément ou seulement en partie

[venom]

Ah oui. Je n'avais pas compris qu'il fallait y inclure php... Forcément là c'est pas la même histoire

Sacré KCC toujours des idées tordus

N'empêche ce que falsam propose est déjà pas mal






@++

[Kwai chang caine]

Sacré KCC toujours des idées tordus

tu as raison
Maintenant pour le coup... Un editeur WEB... C'est assez droit comme idée, c'est même tellement banal que c'est bizarre que ce soit moi qui l'ai eue

N'empêche ce que falsam propose est déjà pas mal

Ce que propose FALSAM est TOUJOURS bien mieux que "pas mal"
C'est juste que pour ce code, je n'en ai pas pour l'instant l'utilité, et que pour le WEBBASE , il ne fait malheureusement pas ce que je cherche désespérément à faire

[falsam]

il ne fait malheureusement pas ce que je cherche désespérément à faire

J'ai compris que ce que tu cherches, c'est une application fonctionnant en localhost ou à distance qui permet de coder en HTML/CSS/JS/PHP avec coloration syntaxique et que tu puisses presser la touche F5 pour voir immédiatement le résultat. Ce qui implique de mettre en place un FTP qui puisse mettre à jour le code.

Effectivement mon application est loin de ta demande. Son objectif est de pouvoir tester du code et voir le résultat sans obligatoirement enregistrer le source.

[Kwai chang caine]

Non non même pas, ma recherche est pas aussi gourmande... Juste en local
Mais je me doit d'inclure le PHP car un éditeur WEB est obligé de le gérer, sinon c'est pas un éditeur WEB
Et même dans le PHP il y a du HTML ou JS avec les "echo" ou peut être autres joyeuseries que réserve cette daube de langage décousu

La seule chose qui me bloque pour l'instant, c'est cette satanée coloration syntaxique
Oui au final je veux faire un notepad++ en beaucoup plus simple

Mais j'ai déjà tout codè, le splitter d'accueil, le client FTP, le client SSH, et je me suis attaqué à l'éditeur en pensant comme toi que ce serait sûrement pas facile, qu'est ce qui est "facile" en programmation .. Mais jamais au grand jamais j'aurais cru que ce meli melo de 4 langages serait aussi difficile à gérer

Avant de couiner, j'ai recodé déjà plusieurs fois en plusieurs semaines, chaque fois en repartant de rien et changé radicalement les methodes (recherche de mots clefs, analyse caractère par caractère, analyse d'une fenetre glissante, etc...) et y'a toujours un MIASM à un moment ou un autre, tu crois que cette fois tu vas y arriver... Et paf.. Ça commence à merder pour X raison à chaque fois différente par version
Je pense que la bonne methode est un mix de plusieurs methodes, mais j'en ai un peu marre de noircir de code mon ecran sans résultat probant

Comme toi je suis arrivé au mieux à 80 a 95% de réussite et avec les 4 langages, donc pas si loin parfois, mais les derniers petits bugs sont les plus durs à corriger, voir même impossible si la méthode n'est pas la bonne

[Ar-S]

Donc KCC tu veux un Notepad Light pour html/css/php/js uniquement afin d'avoir des codes colorés. Mais tu ne veux pas d'interpreteur (qui va afficher le résultat) si j'ai bien compris.
Tu peux donc reprendre le code de Falsam (La coloration syntaxique est en place) et tu n'aura qu'à ajouter une coloration pour php. Et même si tu veux tu peux peut être lancer un rendu temporaire dans un dossier htdoc via Xamp (serveur php/mysql local)
@ Falsam, je le testerai ça parait cool. Ne serait-ce que pour voir la gueule du rendu CSS
j'initialiserai avec

Code : Tout sélectionner

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mon Titre</title>
</head>
<body>
    
</body>
</html>

Par contre il faudrait un onglet pour éditer un css externe.

[Kwai chang caine]

Bonjour ARS

Oui ce que je veux c'est simple, c'est pour ça qu'on se fait avoir, un proverbe dit de ne jamais sous estimer ton ennemi, et ben dans ce cas cette phrase prend tout son sens

Je veux pas dans un 1er temps d'une usine a gaz
C'est sur que petit à petit j'essaierai de rajouter des fonctions, si j'y arrive.... ça risque de le devenir, mais je voulais en 1er lieu faire une version très très simple, robuste avec le moins de menus possible et après. on verra pour les addons
Je trouve que même notepad++ a trop de menus car il gère trop de langages

En ce qui concerne le PHP, sur le papier ça paraît simple, on se dit comme tu viens de dire : "yaka rajouter les mots clefs de PHP un pot de peinture différent des autres pour lui et roule ma poule !!!"

Et on se rends compte rapidement que c'est pas si simple, vraiment pas si simple... Pas simple... Et même.. Dur voir très dur
Après je ne connais pas le code de FALSAM qui est très sophistiqué au 1er abord, alors peut être as tu raison... Mais a mon "ave" il peut avoir les mêmes problèmes que j'ai eu par mes 3 methodes, la détection exacte de la zone de code, savoir si tel caractère est dans une zone html, css, js ou php et voir même être dans une zone php/html ou php/js et le CSS qui peut etre en ligne dans le html, c'est l'ancienne norme celle que j'utilise donc etre dans du html/css, à cause des echo on est dans 2 voir 3 zones en même temps, php/html/css quand il est en ligne
Et les même mots clefs pour plusieurs langage.. Ça aussi c'est top
Sans compter qu'il faut prevoir TOUT ce qu'un nul comme moi peut ecrire parce qu'il y connaît rien, et que les navigateurs analysent correctement même si tu ne respecte pas à 100 % les normes du W3C, et les espaces, les tab, les retours ligne, les caractères spéciaux ... Ça c'est une merde... Car il peut y'en avoir partout de suite ou non, et on peut pas les supprimer car certains sont vitaux
Aussi les commentaires différents pour presque chaque langage, qui sont un langage à part entière car il ne faut pas détecter un mot clef dedans, etc... Etc.. Etc
Je te souhaite de réussir si tu essais... Prépare toi quelques nuits de bonheur et colle ton clavier sur la table.. Ça aide en cas de coup de nerf

[morosh]

as-tu essayé l'éditeur emeditor (www.emeditor.com), dans tools --> Select configuration il y a toutes les configurations y compris php, html, css et beaucoup autres.
il y a une version payante et une gratuite.
Moi je l'utilise tout le temps, je ne peux pas m'en passer

[Kwai chang caine]

Merci pour le lien, je ne connaissais pas celui là
Mais au premier regard, ce n'est pas ce que je cherchais, car il a l'air extrêmement complet encore plus que NotePad++ et je cherchais un truc qui fait "papa maman" avec trois boutons les gros menus me fatiguent à la longue en plus il est pas portable apparemment
Mais encore merci