Discussion :

[benouillor]

Je voudrais vous faire part d'une idée de conception WEB applicative autour des formulaires.
Je ne trouve pas beaucoup de modèle de conception orienté WEB/Ajax alors qu'avec la popularité des Framework Javascript comme JQuery, Dojo ou Prototype, les IHM deviennent plus malléables

L'idée serait d'avoir naturellement plusieurs couches:

1. Formulaire HTML (IHM)
2. Des structures (XML ou JSON, ...) décrivant:
   
   1. Structure de l'objet a éditer.
   2. Structure des évenements décrivant les interactions entre les champs (OnClick, OnChange, Hide, Show...).
   3. Structure de validation décrivant les règles de gestion (Champ obligatoire, Format, ...).
      Ces structures seraient générées par un objet 'Transformer' ou 'Builder'
3. Les couches habituelles (Parties non traitées ici):
   
   1. Métier
   2. Persistence

Attaquons la partie dynamique...
Au chargement du formulaire, les différentes structures (objet, évènement et validation ) seraient analysées afin de propager les informations autour du formulaire HTML.
Chaque champ du formulaire est identifié parallèlement a la structure de l'objet, ex:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
Formulaire HTML :'<input type="text" name="lastname" value="" id="lastname" >' 
Structure de l'objet (XML): '<lastname value="toto" >'

Les champs avec plusieurs valeurs (SELECT, RADIO, CHECKBOX) seraient aussi décrites dans la structure, ex:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<eyes value="blue">
 <choice id="BLUE" value="bleus" >
 <choice id="GREEN" value="verts" >
</eyes>

Au 'submit' du formulaire, le formulaire est validé par rapport a la structure de validation puis, en fonction du résultat, transmis au traitement ou au formulaire.

Le but étant de séparer les parties de l'ihm (html, évènement, validation) et permettre une génération dynamique de formulaire.

J'aimerai savoir ce que vous en pensez, est-ce qu'il existe déjà ce type de modélisation autour du WEB ? Est-ce que ca n'a aucun sens ?
Toute critique est la bienvenue

Merci

[gege2061]

Bonjour,

Tu as le framework symfony qui fait ça

Il récupère la structure de ta base, génère la couche modèle de l'architecture et peux même créer les pages de la partie administration des données (ajout, modification et suppression).

[benouillor]

Merci pour ta réponse.
Je ne connaissais pas Symfony.

Ce framework décrit le formulaire (template) en PHP avec des methodes propres et donc le client est limité par le Framework et ne code plus de HTML.

Mais c'est une piste intéressante !

[karakorum]

Salut Benouillor,

Je vous demande par avance de m'excusez concernant mon inexpérimentation des forums...


j'ai personnellement pas mal cherché de voies pour faire de l'IHM Web.
J'en suis arrivé au bout de plusieurs années de travail à l'architecture suivante:

Du Php pour envoyer la page qui décrit physiquement l'IHM
Celle-ci peut-être soit :
- un formulaire HTML/Php
mais plutot une interface graphique

[karakorum]

Salut Benouillor,

Je vous demande par avance de m'excusez concernant mon inexpérimentation des forums...

Mon idée est de faire dans une IHM par web, exactement ce qu'on fait dans une interface locale.

J'ai personnellement pas mal cherché de voies pour faire de l'IHM Web.
J'en suis arrivé au bout de plusieurs années de travail à l'architecture suivante:

1/ Du Php pour envoyer la page qui décrit physiquement l'IHM
Celle-ci peut-être soit :
- un formulaire HTML/Php
mais plutot une interface graphique :
- Soit Html contenant des photos de l'objet à piloter dont
les parties mobiles sont dans des photos séparées.
- Soit en SVG (partie graphiques +rotation translation, scale etc...)

2/ Réagir sur ce graphique :
L'utilisateur clique, deplace un curseur, une image etc...
Evenements + Javascript + DOM
Ex : GetElementByID("ma glissiere") .... on move.... mafonction

3/ Actions déployées :
-actions reflexes : C'est une animation locale à l'élément cliqué
on change la couleur du bouton cliqué
ou on translate la photo de l'element cliqué
ou on met a jour le widget numérique d'un curseur associé

- actions locales : C'est une action locale à la page IHM
: on ouvre une fenetre détail
on bouge un autre element
on met a jour une varaible javascript de saisie métier :
SaisieConsigneTemp = MonCurseur.value...

- action distante : atteindre la vraie logique de métier sur le serveur
distant


4/ Gérer la communication réseau : Ajax + flux Xml
- J'ai crée une classe en Javascript qui est générique et qui fait de l'ajax ( genre Prototype et autre)
On peut envoyer des infos en parametres et recevoir des reponses

- Pour une souplesse maximum les deux flux peuvent etre Xml :
Ce n'est pas obligatoire !!

Ex : flux aller : Calculette.php?requete="< mon xml>"
flux retour : <xml retour>

Ces flux peuvent etre ecrit en Texte, valeurs separées par des pipes "|",
notation JSon , ou flux Xml

L'interet du flux Xml c'est qu'on va créé une classe requete generique et reponse generique, C'est seulement le flux xml qui personnalise


5/ Flux XLM associé :
requete : ( genre XML-RPC ou SOAP )

<fonction> Addition
<parms>
<parm>4
<parm>5
fermer ttes les balises Xml evidemment!
reponse :
<reponse>
<parms>
<parm>9
fermer ttes les balises Xml evidemment!



6/ Php :
- une classe Formulaire pour recuperer le flux Ajax et lui repondre
- une classe requete : pour demonter le flux XML et appeller la fonction metier
- une classe de metier qui fait le boulot :
Add(4,5) { $resultat = $a + $b;}

7/ Si l'IHM commande une partie opérative
étage supplementaire : architecture 3 tiers
- en Php le flux Xml n'est pas demonté et est transmis par udp à la machine qui pilote le matériel
- le flux resultant est envoyé en réponse à Ajax

8/ La partie opérative
selon que la partie opérative est déja en réseau ou pas plusieurs solutions :

Ex : Camera IP, Boitier E/S advantech ethernet serie 6000
- Le Php fera une translation des données dans le bon format de reponse

Ex : ma carte commande chauffage ou autre
- Localement on mettra en réseau (socket et en flux Xml correct)
A faire en C++, C# ,ou Java

derniere solution :
- adaptateur RS232/Ethernet et récupere le flux en php



J'ai été un peu long
Peut-etre cela peut-il servir ?

Ce genre de framework une fois codé peut evoluer d'un projet a l'autre


J'ai personnellement codé ceci :
- Calculette distribuée :
IHM formulaire , calculs PHP

- Commande et surveillance de chauffage distant (Marche/arret, consigne, retour Temp maison)
- IHM formulaire , Php --> udp , partie opérative
et
- IHM images HTML, Php idem

- Cartograhie et Gps (flotte d'autobus)
- IHM SVG (carte en fond et tracé polyline de points recuperes ajax)
coté serveur php udp / C++ pour GPS

- Tableaubord automobile
- IHM SVG graphique avec compteurs voyants
ajax/ Xml :
<TB>
<VI>
<VM> etc...
traduction :
tableau de bord contient :
vitesse km, vitesse moteur, pression huile, temp eau, temp huile etc...

coté serveur php/udp puis C++/ bus Can et capteurs


A+


Je vais rarement sur ce forum mais si tu veux réagir tu peux m'envoyer un mail