Вы находитесь на странице: 1из 256

WebDev - Concepts Version 17 - (1) 10-2011

Visitez rgulirement le site www.pcsoft.fr, espace tlchargement, pour vrifier si des mises jour sont proposes.

Adresse e-mail du Support Technique Gratuit : supportgratuit@pcsoft.fr.

Conseil : Pour recevoir directement des mises jour intermdiaires et des conseils dutilisation, abonnez-vous la LST (revue trimestrielle + DVD), en franais.

Cette documentation nest pas contractuelle. Des modifications ont pu intervenir dans le logiciel depuis la parution de ce manuel. Veuillez consulter laide en ligne.

Tous les noms de produits ou autres marques cits dans cet ouvrage sont des marques dposes par leurs propritaires respectifs. PC SOFT 2011 : Aucune reproduction intgrale ou partielle du prsent ouvrage sur quelque support que ce soit ne peut tre effectue sans lautorisation expresse de PC SOFT.

Introduction

Dans quel ordre lire les manuels ?


WebDev est un puissant outil de dveloppement de sites web, qui fournit en standard tous les outils ncessaires la conception et la ralisation de sites. Pour une formation rapide et efficace WebDev, nous vous conseillons lordre dapprentissage suivant :

1 2 3

Ce manuel prsente les principaux concepts ncessaires la cration dun site

Lecture des "Concepts".

WebDev performant. Certains concepts sont suivis dune partie "Pratique" dtaillant certaines fonctionnalits de lditeur.

Le guide dauto-formation permet une premire approche "pratique" de WebDev.


Vous pouvez ainsi vous familiariser avec les principaux diteurs de WebDev.

"Auto-formation" (livre + exercices)

Testez les diffrents exemples livrs avec WebDev dans les domaines qui vous
intressent (e-commerce, annuaire, planning, ...)

Test des exemples

Le livre "WLangage" prsente la programmation en WLangage. Pour chaque thme de programmation, vous trouverez une description de la fonctionnalit associe et la liste des fonctions du WLangage correspondantes. Laide en ligne, accessible par Internet ladresse http://doc.pcsoft.fr ou installe avec WebDev permet de trouver rapidement la syntaxe dune fonction du WLangage, dobtenir une aide sur linterface, ... Remarque : En cas de divergence entre le manuel et laide en ligne, suivez les instructions de laide en ligne. Nous vous souhaitons une agrable prise en main de WEBDEV.

Introduction

Organisation du manuel
Ce manuel prsente les principaux concepts ncessaires la cration dun site WebDev performant. Certains concepts sont suivis dune partie "Pratique" dtaillant certaines fonctionnalits de lditeur. Deux types de pages sont donc prsentes dans ce manuel :

Page concept

Page de mise en pratique

Introduction

Sommaire
Partie 1 - Internet : Concepts de base
Quest-ce quun site web ? .................................................................................................11 Site statique, semi-dynamique ou dynamique ? ...............................................................12 Les diffrents types de sites dynamiques..........................................................................13 Machines et logiciels ncessaires......................................................................................14 Les diffrents types de pages.............................................................................................15 Pages dynamiques et pages AWP.......................................................................................19 Technologie AJAX.................................................................................................................. 21 Si vous connaissez dj WinDev........................................................................................ 24

Partie 2 - Dveloppement dun site


Projet et Analyse.................................................................................................................. 27 Cycle de dveloppement dun site......................................................................................32 Je cre une page sous lditeur .........................................................................................34 Les fichiers suivants sont automatiquement crs: .......................................................35 Edition dune page : mode zoning......................................................................................36 Page interne......................................................................................................................... 37 Modles de pages................................................................................................................38 Les diffrents types de champs standard..........................................................................45 Rpter un groupe de champs: les zones rptes.........................................................55 Les deux types de code.......................................................................................................56 Le WLangage: un langage simple et trs puissant...........................................................59 Ordre dexcution des codes des boutons/ liens.............................................................60 Upload : Envoi de fichiers vers le serveur..........................................................................62 Modles de champs............................................................................................................63 Les tats...............................................................................................................................64 Modles dtats...................................................................................................................65 Diffrents modes dimpression...........................................................................................66 Afficher et enchaner les pages..........................................................................................67 Raliser un traitement sur plusieurs pages successives..................................................73 Feuilles de styles: pour simplifier la mise en page........................................................... 74 Site centr ou adapt ? ......................................................................................................75 Rfrencement dun site..................................................................................................... 76

Partie 3 : Environnement de dveloppement


Les diteurs de WebDev......................................................................................................83 Tableau de bord du projet................................................................................................... 87 WebDev, WinDev, WinDev Mobile: 100% compatible......................................................88 Configuration de projet........................................................................................................89 Gnration multiple.............................................................................................................90 Gestionnaire de sources (GDS)........................................................................................... 91 Composant interne..............................................................................................................98
Introduction 5

Composant externe............................................................................................................101 Modes de gnration.........................................................................................................109 Les Centres de Contrle....................................................................................................113 Gestion des exigences.......................................................................................................114 Centre de Suivi de Projets.................................................................................................115 Gestion des rgles mtier.................................................................................................116

Partie 4 : Dveloppement de sites web : concepts avancs


RAD RID..............................................................................................................................119 Le modle UML................................................................................................................. 120 Groupware utilisateur........................................................................................................127 Sites multilingues...............................................................................................................136 10 conseils dergonomie ..................................................................................................140 Superposer les champs.....................................................................................................144 Type dimage: dynamique, statique, gnre, ... ? ........................................................145 Personnaliser laspect dun site: lments dambiance................................................147 Choisir un type de bouton/lien.........................................................................................149 Empcher le retour sur une page.....................................................................................150 Avantage scuritaire: la gestion du "Back".....................................................................151 Cookies: des informations conserves chez linternaute..............................................157 Protger laccs au site: mots de passe.........................................................................158 TLS/SSL: Crypter les informations sur le Web................................................................159 Paiement scuris avec prestataire.................................................................................160 Envoyer des emails............................................................................................................161

Partie 5 : Bases de donnes


Analyse: Structure de la base de donnes.....................................................................165 Les diffrents types de fichiers accessibles.................................................................... 176 HyperFileSQL Classic.........................................................................................................178 HyperFileSQL Client/Serveur............................................................................................179 Clusters HyperFileSQL Client/Serveur..............................................................................180 HyperFileSQL: les fichiers crs physiquement..............................................................181 Associer les champs et les donnes................................................................................182 Les requtes...................................................................................................................... 184 Les requtes intgres......................................................................................................185 Le champ Table/Zone Rpte.........................................................................................186 Rcuprer des donnes sur un site..................................................................................188 Rplication universelle......................................................................................................193 Architecture 3-tiers............................................................................................................194

Partie 6 : Tester un site web


Tester un site: Les lments tester..............................................................................197 Comment tester un site ? .................................................................................................198 Le dbogueur.................................................................................................................... 200 Quand peut-on utiliser le dbogueur ? ............................................................................201
6 Introduction

Partie 7 : Dployer un site web


Dploiement dun site statique ........................................................................................211 Dploiement dun site dynamique WebDev.....................................................................213 Mise en service dun site dynamique WebDev................................................................217

Partie 8 : Hbergement de sites WebDev


A quoi sert ladministrateur WebDev ? ............................................................................227 Configuration du serveur.................................................................................................. 233 Serveur ddi ou mutualis ? ......................................................................................... 234 Quel type de serveur choisir ? ........................................................................................ 236 Centre de Contrle dhbergement..................................................................................237 Site dynamique sur des configurations spcifiques....................................................... 238 Statistiques de frquentation des sites dynamiques......................................................241 Surveillez vos sites, serveurs, ..........................................................................................242

Partie 9 : Annexes
Fonctions du WLangage spcifiques WebDev 17.........................................................245 Composants livrs avec WebDev..................................................................................... 250 Exemples livrs avec WebDev...........................................................................................251

Introduction

Introduction

Partie 1 Internet: Concepts de base

10

Partie 1 : Concepts de base

Quest-ce quun site web?


Un site web est un ensemble de pages HTML (HyperText Markup Language) stockes sur un serveur web. Ces pages HTML sont organises dans un but prcis (par exemple, prsenter une entreprise, vendre des produits, ...). Un site est destin tre utilis par des internautes. Les internautes utilisent un simple navigateur pour accder au site. WebDev permet de crer facilement des sites web qui grent ou non des donnes.

Partie 1 : Concepts de base 11

Site statique, semi-dynamique ou dynamique?


Plusieurs types de sites peuvent tre raliss: des sites statiques, des sites semi-dynamiques, des sites dynamiques. Le tableau ci-dessous prsente les principales diffrences entre ces types de sites:

Site statique
Le contenu des pages du site est fixe, dtermin une fois pour toutes. Un site statique ne peut pas interagir avec des donnes.

Site semi-dynamique
Le contenu des pages du site est construit partir de donnes prsentes dans des fichiers de donnes. Cependant, le contenu des pages est fixe.

Site dynamique
Les donnes affiches dans les pages varient. En gnral, les pages permettent de: - raliser des traitements et/ou des calculs par programmation. - afficher des donnes stockes dans une base de donnes. - afficher des images et du texte interactif. Site dynamique WebDev: le Serveur dApplication WebDev ou le langage PHP sont ncessaires.

Site statique WebDev: le Serveur dApplication WebDev nest pas ncessaire.

Site semi-dynamique WebDev: le Serveur dapplication WebDev nest pas ncessaire.

Remarque: Un site dynamique peut contenir une partie statique (prsentation de lentreprise, ...). WebDev permet de crer: des pages statiques, des pages semi-dynamiques, des pages dynamiques.

12

Partie 1 : Concepts de base

Les diffrents types de sites dynamiques


Un site dynamique permet dafficher des pages dont le contenu varie. Le plus souvent, le contenu de ces pages est li une base de donnes. Il est ainsi possible par exemple dans un site dynamique de grer en temps rel les rservations de voyages. Ces rservations sont directement enregistres dans un fichier de donnes et peuvent tre affiches tout moment. WebDev propose deux types de sites dynamiques: site dynamique WebDev. Ce type de site ncessite un Serveur dApplication WebDev sur le serveur. Il permet de manipuler de nombreuses bases de donnes. site dynamique PHP. Ce type de site ncessite un moteur PHP sur le serveur. Ce type de site est conseill pour hberger des sites dynamiques chez un hbergeur grand public.

Partie 1 : Concepts de base 13

Machines et logiciels ncessaires


Linternaute
une machine: PC, Mac, Unix, Smartphone, ... un navigateur: Internet Explorer, FireFox, Chrome, ... un accs Internet (ou Intranet)
Aucun module ne sera tlcharger. Le fonctionnement est immdiat et rapide.

Le serveur
1 machine serveur: PC 1 systme dexploitation serveur (Windows ou Linux):
Windows 2000 ou suprieur.

La machine de dveloppement
1 machine: PC 1 systme dexploitation:
Windows 2000 ou suprieur.

logiciel

serveur

Web:

1 logiciel serveur Web:


IIS, Apache, ...

IIS, Apache, ...

1 Serveur dApplication WebDev


ou

1 Moteur PHP
(version 4.3.2 minimum)

1 logiciel WebDev "Dveloppement" le site lui-mme les donnes * (site dynamique uniquement) le site en cours de dveloppement les donnes (optionnel) * au moins un navigateur:

*

Internet Explorer, FireFox, Chrome, ...

Les donnes peuvent se trouver sur une autre machine relie en rseau.

14

Partie 1 : Concepts de base

Les diffrents types de pages


Diffrents types de pages peuvent tre utiliss dans les sites crs avec WebDev: Les pages statiques. Ce type de page permet dafficher des donnes fixes. Les pages semi-dynamiques. Ces pages permettent dafficher des donnes disponibles dans une base de donnes. Ces pages et leur contenu sont gnrs sur le poste de dveloppement lors de la cration du site. Lorsque les pages HTML correspondant aux pages dynamiques sont cres, le contenu de la page est alors dfini. Les pages dynamiques WebDev. Ces pages permettent dafficher dynamiquement les informations contenues dans une base de donnes. Le contenu de la page varie en fonction de lenregistrement affich. Lors de laffichage dune page dynamique, le contexte correspondant est automatiquement sauvegard et mis jour sur le serveur. Le contexte de lapplication contient principalement les variables globales, les variables de positionnement dans les fichiers de donnes, ... Les pages dynamiques WebDev AWP. Ces pages permettent dafficher dynamiquement des donnes contenues dans une base de donnes. Le contenu de la page varie en fonction de lenregistrement affich. Les pages AWP peuvent utiliser ou non le contexte de lapplication. Ce contexte peut tre stock sous forme de cookie ou sur disque. Si les pages AWP nutilisent pas le contexte de lapplication, elles sont autonomes. Les pages dynamiques PHP. Ces pages permettent dafficher dynamiquement des donnes contenues dans une base de donnes. Ces pages peuvent uniquement tre utilises dans un site PHP. Les pages suivantes prsentent ces diffrents types de pages.

Partie 1 : Concepts de base 15

Principe dune page statique


Poste de dveloppement

Dveloppement

Cration dune page statique sous WebDev (fichier ".WWH")

Dploiement
Poste Serveur

Page HTML

Consultation
Poste de linternaute

Page statique visualise sous le navigateur

16

Partie 1 : Concepts de base

Principe dune page semi-dynamique Dveloppement


Poste de dveloppement

Base de donnes associe au projet

Cration dune page semi-dynamique sous WebDev (fichier ".WWH")

Gnration des pages statiques ncessaires (fichiers ".HTM")

Dploiement
Poste Serveur Pages HTML

Consultation

Poste de linternaute

Pages statiques (correspondant aux pages semi-dynamiques) en excution sous le navigateur. La page affiche correspond aux informations demandes par linternaute.

Partie 1 : Concepts de base 17

Principe dune page dynamique


Poste de dveloppement

Dveloppement

Cration dune page dynamique sous WebDev (fichier ".WWH")

Dploiement
Poste Serveur
Page HTML Moteur WebDev Base de donnes

Consultation
Poste de linternaute

Page dynamique en excution sous le navigateur. Les donnes affiches dans les pages varient en fonction des manipulations de linternaute.

18

Partie 1 : Concepts de base

Pages dynamiques et pages AWP


Page dynamique
Lors de laffichage dune page dynamique WebDev, les oprations suivantes sont effectues: 1. Demande daffichage de la page. 2. Lancement du moteur WebDev. Le moteur sera prsent sur le serveur jusqu la fin de lapplication. 3. Cration du contexte de lapplication. Ce contexte sera prsent sur le serveur jusqu la fin de lapplication. 4. Le moteur WebDev excute le code serveur et construit la page HTML ( partir des donnes de la base de donnes par exemple). 5. Lorsque le moteur a fini de construire la page HTML, le serveur transmet le rsultat au client (le navigateur).

Partie 1 : Concepts de base 19

Pages AWP
Une page AWP est un fichier binaire contenant le code HTML de la page, et le code serveur (saisi sous lditeur de code par le dveloppeur). Ce fichier doit avoir lextension ".awp" pour pouvoir tre interprt par le serveur. Ainsi, lorsquun navigateur (le client) dsire accder une page dynamique AWP ralise avec WebDev: 1. Le serveur reconnat quil sagit dun fichier AWP. 2. Le serveur appelle le moteur WebDev pour lire le fichier AWP. 3. Le moteur WebDev excute le code serveur et construit la page HTML ( partir des donnes de la base de donnes par exemple). 4. Lorsque le moteur a fini de construire la page HTML, le moteur se ferme. 5. Le serveur transmet le rsultat (la page HTML) au client (le navigateur).

Remarque: il est possible dutiliser un contexte avec les pages AWP en dfinissant les variables persistantes grce la fonction DclareContexteAWP.

20

Partie 1 : Concepts de base

Technologie AJAX
La technologie AJAX est disponible nativement dans WebDev. Que signifie AJAX et quel est son intrt? AJAX (pour Asynchronous Javascript and XML) permet de rafrachir uniquement les donnes modifies dans une page HTML sans rafficher la totalit de la page. Par exemple, si certains lments prsents dans une page affiche (le contenu du panier, les caractristiques dun produit, une liste de villes, une carte gographique, ...) doivent tre modifis, seuls ces lments seront rafrachis. Le serveur naura pas envoyer la page entire sur le poste de linternaute. Cette technologie a de multiples avantages: le serveur est moins sollicit. Il peut alors supporter un plus grand nombre de connexions simultanes. les informations qui circulent sont de taille rduite. la dure de transmission est plus courte. laffichage pour linternaute est immdiat et sans effet visuel. AJAX peut tre utilis deux niveaux diffrents dans un site WebDev: AJAX automatique et immdiat: un simple clic suffit pour accder aux avantages AJAX. Le code reste le mme. AJAX programm: utilisation des fonctions de gestion AJAX pour les traitements complexes. Remarque: Seuls les navigateurs suffisamment rcents supportent la technologie AJAX: Internet Explorer 5.5 et suprieur, FireFox 1.0 et suprieur, Netscape 7 et suprieur, Opera 8 et suprieur, Safari 1.2 et suprieur, ... La fonction AJAXDisponible permet de savoir si le navigateur en cours supporte la technologie AJAX. Si un traitement utilisant la technologie AJAX est excut sur un navigateur ne supportant pas cette technologie, le traitement sexcute "comme si" il nutilisait pas la technologie AJAX (rafrachissement de la page entire par exemple).

Partie 1 : Concepts de base 21

AJAX automatique et immdiat


Le schma suivant prsente lutilisation automatique et immdiate de AJAX dans un site WebDev:

Navigateur Envoi de la requte Action Mise jour automatique des lments modifis Envoi des lments modifis uniquement

Serveur Web

Excution de la requte

Par exemple, une page dun site permet de connatre diffrentes caractristiques dun pays (capitale, devise, drapeau, situation, ...). En fonction du pays slectionn par linternaute, les informations correspondantes sont affiches. Action de linternaute. Dans notre exemple, slection du pays dans la combo "Slectionner le pays souhait". Envoi de la requte au serveur. Excution de la requte: recherche des caractristiques du pays choisi. Envoi du rsultat de la requte: - sans AJAX: toute la page est envoye. - avec AJAX: seules les caractristiques du pays sont envoyes. Affichage des caractristiques du pays: - sans AJAX: toute la page est raffiche. - avec AJAX: seuls les champs contenant les caractristiques du pays sont rafrachis.

22

Partie 1 : Concepts de base

AJAX programm
Le schma suivant prsente lutilisation de "AJAX programm" dans un site WebDev:

Navigateur Demande dexcution de la procdure Action Mise jour automatique des lments modifis

Serveur Web

Excution de la procdure serveur Envoi du rsultat uniquement Analyse du rsultat Gnration du rsultat: Document XML, chane de caractres

Excution dun traitement navigateur (fonction AJAXExcute ou AJAXExcuteAsynchrone). Demande dexcution dune procdure serveur. Excution de la procdure serveur. Gnration du rsultat. Le rsultat de la procdure sera exprim sous forme dune chane de caractres ou dun document XML. Envoi du rsultat de la procdure (Mot-cl RENVOYER). Analyse du rsultat de la procdure. Affichage des informations modifies. Seuls les champs ncessaires sont rafrachis.

Partie 1 : Concepts de base 23

Si vous connaissez dj WinDev


Voici les principales diffrences entre WebDev et WinDev: - WebDev permet de crer des pages alors que WinDev permet de crer des fentres. - Dans WebDev, diffrents types de code peuvent tre saisis: un code WLangage sexcutant sur le serveur, un code WLangage sexcutant sur le navigateur, et un code Javascript sexcutant sur le navigateur. Si vous crez une page PHP, un code supplmentaire apparat: un code PHP sexcutant sur le serveur. - De nouvelles fonctions du WLangage spcifiques au web sont disponibles. - Certaines fonctions du WLangage inadaptes au web nexistent plus. - Certaines fonctions du WLangage sont uniquement utilisables dans un traitement excutable en code serveur. - Certaines fonctions du WLangage sont uniquement utilisables dans un traitement excutable en code navigateur. - De nouveaux types de champs plus spcifiques une application web sont disponibles:
Champ daffichage format Champ Applet Java Champ Captcha Champ Cellule Champ Chemin de navigation Champ Flash Champ Flex Champ Image clicable (Map Area) Champ IFrame Champ Libell HTML Champ Lien Champ Ligne Champ Page Interne Champ Page Corne Champ Plan du site Champ Rglette Champ SilverLight Champ Tableau HTML Champ Upload Champ Vignette

- Certains types de champs inutiles sur Internet ont disparu: ascenseur, potentiomtre, ActiveX, Objet OLE, spin, ...

24

Partie 1 : Concepts de base

Partie 2 Dveloppement dun site

26

Partie 2 : Dveloppement dun site

Projet et Analyse
Le dveloppement dun site web en utilisant WebDev repose sur deux lments principaux: le Projet et lAnalyse. Un Projet WebDev est un ensemble dlments: pages, tats, champs, classes, composants, ... dont lassemblage permet de raliser un site web. Une Analyse WebDev regroupe la description des fichiers de donnes du site. Un site est construit partir dun projet. Un projet est gnralement associ une analyse. Une analyse peut tre associe un ou plusieurs projets.

Partie 2 : Dveloppement dun site

27

Le projet en pratique
1 Prsentation
La premire tape de la description dun site consiste crer un projet. Lors de la cration dun projet, plusieurs questions vous sont poses afin que votre projet corresponde toutes vos attentes. Toutes les caractristiques du projet spcifies lors de la cration du projet pourront tre modifies par la suite.

2 Cration du projet
Pour crer un projet: 1.Slectionnez loption "Fichier.. Nouveau .. Projet". Lassistant de cration du projet souvre. 2.Spcifiez les diffrentes options du projet: le nom et lemplacement. Ces options ne seront pas modifiables. Le projet correspond un fichier ".WWP". Tous les objets associs au projet seront crs dans le rpertoire spcifi. le type de gnration du projet cest--dire quel sera le type de site gnr par le projet: site statique, site dynamique WebDev, site semi-dynamique, site dynamique PHP, ... le mode de cration du projet : il est possible de crer un projet vierge ou un projet bas sur le RAD Applicatif. si le projet va tre manipul par plusieurs dveloppeurs. Il est possible dutiliser le groupware dveloppeur ou le gestionnaire de sources (GDS) pour partager le projet. la charte de programmation. Cette charte permet de prfixer automatiquement les variables, les noms de champs, de pages, ... la charte graphique. les langues gres. Ces langues seront proposes par dfaut ds quune option dun champ, dune page, dun tat, ... pourra tre traduite. 3.Indiquez si le projet est associ ou non une base de donnes. Si oui, la base de donnes peut exister ou tre cre. 4.Validez lassistant. Le projet cr devient le projet en cours. Remarques: Si vous avez demand la cration dune analyse, lassistant correspondant se lance automatiquement. Lensemble des informations fournies peut tre modifi dans la description du projet (option "Projet.. Description du projet").

3 Tableau de bord et graphe du projet


3.1Tableau de bord
Tout responsable de projet cherche avoir une vision globale et synthtique de ltat davancement des projets quil dirige. Tout responsable qualit veut connatre le nombre et limportance des bogues des projets et en suivre lvolution. Le responsable fonctionnel cherche savoir quelles sont les volutions demandes par les utilisateurs. Le dveloppeur cherche lancer directement et rapidement les lments du projet, les codes les plus utiliss, ... Le tableau de bord permet de rpondre tous ces souhaits. Le tableau de bord propose diffrents voyants permettant dobtenir une vision globale des diffrents indicateurs. Les diffrents voyants passent du vert au rouge chaque fois quune partie du projet ncessite une intervention. Pour afficher le tableau de bord de votre projet, il suffit de slectionner loption "Projet .. Tableau de bord du projet".

28

Partie 2 : Dveloppement dun site

3.2Graphe du projet
Lditeur de projet permet de visualiser de manire graphique les diffrents lments du projet (pages, tats, requtes, ...) et leurs enchanements. Pour afficher le graphe du projet, il suffit de slectionner loption "Projet .. Graphe du projet".

3.3Les lments du projet


Le projet est compos de pages, dtats, de requtes, de collections de procdures, ... Pour connatre la liste des lments dun projet, slectionnez loption "Projet.. Liste des lments du projet".

Cette option permet de: ajouter votre projet des lments appartenant des projets accessibles depuis votre poste. Les fichiers correspondants ne seront pas dplacs dans le rpertoire de votre projet. supprimer des lments de votre projet. Les fichiers correspondants ne sont pas supprims physiquement. Pour rechercher rapidement un lment de votre projet, utilisez la combinaison de touches "CTRL + E" depuis nimporte quel diteur.

4 Manipulations du projet
Voici les principales manipulations pouvant tre ralises sur un projet: Archiver un projet Restaurer un projet Dupliquer un projet Copier ou supprimer un projet Renommer un projet Pour plus de dtails sur ces fonctionnalits, consultez laide en ligne.

5 Dossier du projet
WebDev permet dimprimer diffrents dossiers dtaillant lensemble des lments (page, tat, fichier de donnes, rubrique, ...) du projet. Ces dossiers peuvent tre imprims grce : loption "Projet.. Imprimer le dossier du projet". Le dossier peut contenir lensemble des caractristiques du projet. loption "Fichier.. Imprimer le dossier". Le dossier est alors constitu uniquement des caractristiques de llment (page, tat, requte,...) en cours. les descriptions techniques de tous les lments du projet. Dossier Complet :Contient toutes les informations du projet. Ce dossier correspond la fusion de tous les types de dossiers. Type ddition du dossier Le dossier peut au choix tre: imprim, export vers un document RTF, vers un fichier XML, export vers un fichier HTML (un navigateur internet doit tre install sur le poste en cours), export vers un fichier texte.

5.1Type de dossier
Plusieurs types de dossier sont proposs: Dossier Analyse / Fichier / Requtes:Contient les informations sur lanalyse, les fichiers de donnes et les requtes du projet. Dossier IHM (Interface Homme Machine) :Contient uniquement la reprsentation des pages et des tats, ainsi que leur enchanement. Dossier Code :Contient lensemble des traitements de tous les lments du projet. Dossier Technique:Contient les traitements et

5.2Zones dimpression
Si des reprsentations graphiques (graphe du projet, MLD, diagrammes UML ...) doivent tre imprimes, il est ncessaire de configurer les zones dimpression avant dimprimer le dossier. Pour spcifier les zones dimpression de la reprsentation graphique en cours: 1.Slectionnez loption "Affichage.. Zones dimpression". Des bordures reprsentant les zones Partie 2 : Dveloppement dun site 29

imprimables dans le dossier apparaissent sous lditeur en cours. 2.Rduisez laffichage de la reprsentation graphique (option "Affichage.. Zoom" ou [Ctrl] +Roulette de la souris) pour visualiser lensemble du graphe. 3.A laide de la souris: dplacez ces bordures lendroit dsir en maintenant le bouton de la souris enfonc (la couleur du curseur de la souris est noire). choisissez le nombre de pages sur lesquelles la reprsentation graphique doit tre imprime (le

curseur de la souris se transforme en doubleflche Nord-Ouest / Sud-Est). Si le format dimpression est modifi (passage de A4 A3 par exemple dans les proprits de limprimante), il est possible dadapter le format des pages du dossier. Pour cela: 1.Dfinissez des zones dimpression. 2.Affichez les options de mise en page du dossier (option "Fichier .. Mise en page du dossier"). 3.Slectionnez loption "Adapter la taille des zones dimpression des documents ouverts". 4.Lancez limpression du dossier.

30

Partie 2 : Dveloppement dun site

Partie 2 : Dveloppement dun site

31

Cycle de dveloppement dun site


WebDev couvre la totalit du cycle de dveloppement dun site:

Dtail des diffrentes phases: Phase de conception: Il est possible de concevoir un site partir dun simple cahier des charges, dune modlisation UML des traitements ou mme partir de fichiers de donnes prexistants. Phase de dveloppement: La cration du projet et de lanalyse est ralise laide dassistants trs complets. Le dveloppement peut tre effectu en mode RAD (Rapid Development Application) avec gnration automatique du code et des IHM ou tre le rsultat dune cration manuelle des diffrents lments du projet.

32

Partie 2 : Dveloppement dun site

Phase de tests et gnration: WebDev offre toute une panoplie doutils de tests automatiques pour garantir la fiabilit des applications et assurer la non-rgression entre les phases de dveloppement. Phase de dploiement: Le dploiement dun site dynamique WebDev est ralis sur un serveur dapplication WebDev. Lorsque le site est dploy, il est possible de raliser les derniers tests avant douvrir le site aux utilisateurs.

Partie 2 : Dveloppement dun site

33

Je cre une page sous lditeur ...


Pour crer une page avec WebDev, les tapes sont les suivantes: Cration de la page sous lditeur de pages de WebDev.

Saisie du code (tape optionnelle).

Code navigateur

Code serveur

Enregistrement de la page.
34 Partie 2 : Dveloppement dun site

Les fichiers suivants sont automatiquement crs:

Lgende:

.WWH: Format source des pages


Ce fichier contient la description complte de la page (champ, code navigateur, code serveur). Ce fichier est utilis par lditeur et reste sur la machine du dveloppeur.

.WDL: Bibliothque du projet


Gnre lors du dploiement du site dynamique, la bibliothque contient le code serveur des pages du projet. Ce fichier sera prsent sur le serveur.

.HTM gnrique
Ce fichier contient la description complte de la page (champ, code navigateur, code serveur). Certains paramtres de cette page sont gnriques et seront remplis dynamiquement lors de laffichage de la page.

.AWP: Page AWP


Gnr partir du fichier WWH, ce fichier contient la description des champs, le code serveur, le code navigateur. Ce fichier sera prsent sur le serveur.

.HTM: Page HTML du site


Gnr partir du fichier WWH, ce fichier contient la description des champs en HTML et le code navigateur (si le code a t saisi en WLangage, il est automatiquement traduit en Javascript). Ce fichier sera prsent sur le serveur.

.PHP: Page PHP


Gnr partir du fichier WWH, ce fichier contient la description des champs, le code serveur, le code navigateur au format PHP. Ce fichier sera prsent sur le serveur.

Partie 2 : Dveloppement dun site

35

Edition dune page : mode zoning


Ldition dune page en mode zoning est simple et puissant : il suffit de dcouper la page en "zones" grce loutil "Crayon". Ces zones sont automatiquement paramtres et permettent de dfinir larchitecture de la page : en-tte, pied de page, ... Ces zones sont facilement manipulables sous lditeur : lagrandissement de la hauteur de la zone den-tte dplace automatiquement la zone du corps de la page.

Ldition respecte la position relative des champs contenus dans chaque zone ainsi que leur ancrage.

Il est possible dassocier une information smantique HTML 5 chaque zone : cela amliore la pertinence du rfrencement par certains moteurs de recherche.

36

Partie 2 : Dveloppement dun site

Page interne
Le champ Page interne permet dinclure une page (et son code) dans une autre page. A lexcution, la page interne sera dynamiquement fusionne la page hte.

1. Cration dune page interne


Une page interne est une page spcifique qui ne comporte ni barre de titre, ni menu. Dans cette page, tous les types de champs peuvent tre utiliss.

Dans lexemple, une page interne permet de grer le panier.

2. Utilisation dune page interne


Pour utiliser une page interne, il suffit de: crer un champ de type page interne. slectionner dans la description du champ la page interne utiliser et valider.

Remarques: Il nest pas possible de modifier par programmation la page interne utilise dans le champ "Page interne". La zone daccueil est rectangulaire et aucune surcharge nest possible. Pour raliser des surcharges, il est conseill dutiliser des modles de champs.
Partie 2 : Dveloppement dun site 37

Modles de pages
WebDev permet de crer des modles de pages. Un modle est destin contenir des lments communs un ensemble de pages du site. Les modifications effectues dans un modle de pages sont automatiquement reportes sur toutes les pages utilisant ce modle. Un modle de pages permet, par exemple, de respecter la charte graphique dfinie pour un site.

Dfinition dun modle de pages. Le modle est encadr dun trait jaune sous lditeur.

Utilisation du modle dans plusieurs pages. Les lments appartenant au modle sont identifis par un carr jaune.

Pour crer une page utilisant un modle, slectionnez le modle utiliser lors de la cration de la page. Remarque: La programmation associe aux lments du modle peut tre directement ralise dans le modle. Les caractristiques des lments peuvent tre dsolidarises du modle. Par exemple, dsolidariser la position dun champ du modle pour positionner le champ ailleurs tout en conservant les autres volutions sur le champ (code, style, ...). On parle alors dhritage. Dans ce cas, les lments sont identifis par un carr bleu.
38 Partie 2 : Dveloppement dun site

Les pages en pratique


Une page a pour but dafficher, de consulter et de saisir des informations. Ces informations peuvent provenir des fichiers de donnes dune analyse, de fichiers externes, de requtes, ... WebDev propose plusieurs solutions pour crer les pages dun projet: Crer une page vierge avec lassistant. Construire lensemble des pages du site partir de la description de lanalyse. Crer une page partir de la description de lanalyse (avec son code ou non). Crer des pages bases sur un modle, ... Quelle que soit la mthode utilise, la page pourra tre modifie aprs cration: il sera possible dajouter, modifier ou supprimer des champs, de modifier les caractristiques de la page. Pour plus de dtails sur la manipulation des champs dune page, consultez "Les champs en pratique", page 49. Ce chapitre traite les sujets suivants: "Cration dune page", page 39 "Manipulations simples sur une page", page 40 "Principales caractristiques dune page", page 40 "Page interne", page 41 "Modles de pages", page 41 "Actualiser une page dynamique", page 41 "Les contextes de pages", page 42 "Ouvrir une page dans un site WebDev", page 42 "Traitements associs aux pages", page 43 "Les menus", page 44

1 Cration dune page


WebDev propose plusieurs mthodes pour crer une page: Cration de pages vierges, sans aucun champ. Cration de pages pr-dfinies (de type RAD Dynamique, RAD Semi-Dynamique, RAD PHP ou Standard). Cration de pages par le RAD projet. Remarque: Les principales caractristiques des pages sont dtailles dans laide en ligne. "Principales caractristiques dune page", page 40. Les diffrents types de champs sont prsents dans le chapitre "Les diffrents types de champs standard", page 45.

1.2Cration de pages pr-dfinies


Pour crer une page pr-dfinie: 1.Slectionnez loption "Fichier.. Nouveau.. Page". 2.Choisissez le type de la page crer. Cette page peut tre: Vierge / Modles: Permet de crer une page vierge utilisant le modle de pages slectionn. Page interne: Permet de crer des pages internes qui seront utilises dans des champs de type "Page interne". Les pages internes permettent dinclure une page (et son code) dans un champ dune autre page. RAD Dynamique: Cette page permettra de visualiser et/ou de modifier les enregistrements dun ou de plusieurs fichiers de donnes. RAD Semi-dynamique : Cette page permettra de visualiser les enregistrements dun ou de plusieurs fichiers de donnes. RID: Cette page permettra de visualiser et/ou de modifier les enregistrements dun ou de plusieurs fichiers. Seule linterface de la page est Partie 2 : Dveloppement dun site 39

1.1Cration de pages vierges


Pour crer une page vierge: 1.Slectionnez loption "Fichier.. Nouveau.. Page". 2.Choisissez le type "Vierge". 3.Spcifiez le modle de la page. 4.Validez la cration de la page. Une page vierge est cre. 5.Enregistrez la page (option "Fichier.. Enregistrer"). 6.Spcifiez le nom de la page. La page correspond un fichier ".WWH". Par dfaut, ce fichier sera cr dans le rpertoire principal du projet. Ce nom sera utilis pour manipuler la page. 7.Crez les champs dans la page. Par dfaut la page cre est dynamique. Le type de la page peut tre modifi dans la fentre de description de la page. Pour plus de dtails, consultez

gnre. Le code est la charge du dveloppeur. Frameset: Permet de crer diffrents types de Framesets. Chaque Frame devra tre associe aux pages de votre projet sous lditeur. 3.Selon le type de page choisi, saisissez les informations demandes dans les diffrents crans de lassistant (ces crans varient selon le type de page slectionn). 4.Validez la cration de la page.

1.3Cration des pages du projet par construction automatique du site (R.A.D.)


Pour les sites dynamiques, les pages du projet peuvent tre crs directement en une seule opration partir de la description de lanalyse, par la construction automatique du site (RAD). Pour plus de dtails sur les pages cres par le RAD, consultez laide en ligne.

Pour crer le site dynamique par le R.A.D.: 1.Slectionnez loption "Atelier .. RAD Application complte". Attention: Pour utiliser cette option, le projet doit tre associ une analyse gnre au moins une fois. 2.Slectionnez le pattern RAD utiliser. 3.Slectionnez les fichiers de donnes utiliss pour la gnration. 4.Slectionnez les fichiers de donnes principaux qui seront les points dentre dans lapplication (principalement, ces fichiers de donnes seront utiliss pour mettre en place les options de menu). 5.Associez si ncessaire une image chaque fichier de donnes. Cette image sera utilise pour reprsenter les fichiers de donnes. 6.Validez la cration de votre application par le RAD.

2 Manipulations simples sur une page


Lditeur de pages permet de raliser les manipulations suivantes sur les pages: Ouvrir une page sous lditeur: Il suffit de doublecliquer sur le nom de la page affich dans le volet "Explorateur de projet". Sauvegarder et copier une page. Importer et exporter une page. Modifier lordre de navigation. Pour plus de dtails sur ces manipulations, consultez laide en ligne.

3 Principales caractristiques dune page


Une page peut accueillir tous les types de champs disponibles. Une page peut: avoir une image de fond: cette image est affiche en fond de la page et les champs viennent se superposer cette image. avoir un menu droulant: ce menu permettra aux internautes daccder plus rapidement aux principales fonctionnalits du site. Pour crer un menu droulant dans une page, il suffit dutiliser loption "Insertion .. Menu". Les deux premires options apparaissent dans la page. Les options peuvent tre manipules grce au menu contextuel des options. Les options de menu peuvent ensuite tre manipules par programmation. Pour plus de dtails, consultez "Manipuler les options de menu par programmation", page 44. avoir une barre de message: cette barre de message affichera les messages daide associs aux diffrents champs de la page. Pour plus de dtails, consultez laide en ligne. tre multilingue: toutes les langues dfinies pour la page seront disponibles pour tous les champs de la page. Une page peut tre associe plus de langues que le projet (cas par exemple des pages partages entre plusieurs projets). Pour plus de dtails, consultez le chapitre "Sites multilingues", page 136.

40

Partie 2 : Dveloppement dun site

4 Page interne
Les pages internes permettent de partager dynamiquement une mme partie dinterface au sein dun ou de plusieurs sites. Linterface utiliser plusieurs fois est cre dans une page de type "Page Interne". Cette interface est utilise dans les diffrentes pages de votre site grce au champ de type "Page interne". Remarque: La page fusionner peut tre issue dun composant. Pour plus de dtails, consultez laide en ligne.

5 Modles de pages
WebDev permet de crer des modles de pages. Ces modles contiennent tous les lments graphiques et le code communs lensemble des pages de votre site. Les modifications effectues dans un modle de pages sont automatiquement reportes sur toutes les pages utilisant ce modle. Un modle de pages permet de respecter la charte graphique dfinie pour un site. Lutilisation de modles de pages dans vos sites permet de: simplifier la cration des pages du site. simplifier la mise en page des pages du site. simplifier la mise jour de la charte graphique du site. Un modle de pages se cre aussi simplement quune page. Pour crer une page en utilisant un modle, il suffit de choisir loption "base sur un modle". Par dfaut, toute modification effectue dans le modle est reporte dans les pages lutilisant. Il est cependant possible dans une page spcifique de grer des cas particuliers en surchargent les lments du modle. Pour plus de dtails, consultez laide en ligne.

6 Actualiser une page dynamique


6.1Prsentation
Lactualisation dune page consiste r-afficher une page dj ouverte sous le navigateur. Cette action est identique lutilisation de la touche "Rafrachir" du navigateur. Lors de lactualisation de la page, les donnes dynamiques prsentes dans la page sont mises jour en fonction du contexte de page prsent sur le serveur. Seules les donnes modifies sont raffiches. Par exemple, lors de la saisie dune commande dans une application commerciale, chaque nouvelle commande dun article, la page affichant le rcapitulatif de la commande (le panier) est ractualise.

6.2Mise en place
Pour actualiser une page, il suffit dutiliser la fonction du WLangage PageActualise. Lors de lactualisation dune page, les oprations effectues automatiquement sont les suivantes: 1.Vrification de lexistence du contexte de la page sur le serveur. 2.R-affichage de la page en fonction de son contexte prsent sur le serveur. Lutilisation de la fonction PageAffiche est dconseille pour actualiser une page, car le temps de chargement de la page est beaucoup plus long.

Partie 2 : Dveloppement dun site

41

7 Les contextes de pages


7.1Prsentation
Dans une application Windows, toutes les informations relatives la fentre sont conserves avec la fentre. Dans un site dynamique WebDev, pour chaque page affiche sur le navigateur de linternaute, un contexte de page existe sur le serveur. Le contexte de page regroupe toutes les informations relatives la page: contenu des champs, variables locales, variables globales, code WLangage "serveur", ... Gestion avance WebDev offre la possibilit de raliser une gestion avance des contextes grce aux fonctions ContexteXXX. Il est ainsi possible de: ouvrir le contexte dune page sans en lancer laffichage sur le navigateur (ContexteOuvre), tester lexistence du contexte dune page sur le serveur (ContexteExiste), fermer le contexte dune page inutilise (ContexteFerme). Cette gestion avance des contextes de page peut tre utilise pour: Economiser lespace mmoire du serveur (par exemple, en fermant les contextes des pages prcdemment ouvertes mais inutilises). Prparer des pages destines dialoguer avec dautres applications (par exemple, la page recevant les informations en retour dun site de paiement scuris). Manipuler des pages partir dautres pages. Cas particulier Lors de lutilisation de la touche "Prcdent" du navigateur, une dsynchronisation peut exister entre la page et son contexte. Pour plus de dtails, consultez "Avantage scuritaire: la gestion du "Back"", page 151.

7.2Fonctionnement
Gestion automatique Par dfaut, WebDev gre automatiquement les contextes de pages dynamiques: Un contexte de page est ouvert lors de laffichage de la page dynamique sur le navigateur. Le contexte dune page est mis jour en fonction des informations saisies par linternaute sous le navigateur. Cette mise jour se fait lors de la validation de la page ( laide dun bouton de type "Envoi au serveur" ou de la fonction PageValide). Les contextes de page existants sont ferms lors de lutilisation des fonctions PageUtilise ou FramesetUtilise. Les contextes de pages correspondants aux pages afficher sont alors ouverts.

8 Ouvrir une page dans un site WebDev


8.1Prsentation
Louverture dune nouvelle page dans un site WebDev peut tre ralise selon plusieurs mthodes: directement depuis la description du champ qui doit ouvrir la page (bouton, lien, menu, ...) par programmation en WLangage. Pour ouvrir directement une page "xxx" partir dun bouton, lien, image, : 1.Affichez la description de llment (option "Description" du menu contextuel de llment). 2.Slectionnez laction effectuer: "Afficher la page xxx". 3.Slectionnez la destination de laction: page en cours, navigateur en cours, (frame spcifique dans le cas dun frameset). Laction prcdemment slectionne sera effectue dans cette frame. 4.Validez.

8.2Ouverture dune page depuis la description dun champ


Lors de la description dun bouton, dun lien, dune image clicable, il est possible de dfinir directement laction effectue et la destination de cette action. 42 Partie 2 : Dveloppement dun site

8.3Ouverture dune page par programmation


Le WLangage propose plusieurs fonctions permettant douvrir une page. PageActualise Actualise la page affiche par rapport son contexte. PageAffiche Ouvre et affiche une nouvelle page dans le navigateur de linternaute. PageUtilise Ferme toutes les pages en cours et leurs contextes, et ouvre une nouvelle page. Lors de louverture de la page, il est possible de passer des paramtres la page. Pour plus de dtails, consultez laide en ligne.

Remarque: Par dfaut, lors de louverture dune page en programmation, la destination choisie est: soit la destination dfinie dans la description de lobjet lanant louverture de la page (bouton, lien, ). soit la destination dfinie pour la page en cours.

8.4Cas des pages dynamiques


Lors de laffichage dune page dynamique, les actions effectues sont les suivantes: 1.Vrification de lexistence du contexte de la page sur le serveur. 2.Si le contexte existe, fermeture du contexte. 3.Ouverture du contexte de la page. Toutes les variables, champs, ... lis la page sont r-initialiss. 4.Affichage de la page demande sous le navigateur.

9 Traitements associs aux pages


9.1Traitements grs par dfaut
WebDev gre par dfaut les traitements suivants (ordre dapparition sous lditeur de code): Dclaration globales (code serveur): Dclaration des variables globales la page. Cest le premier code excut louverture de la page. Initialisation (code serveur): Excut lors de louverture de la page. Le traitement dinitialisation des champs de la page est excut avant ce code. Chargement (onload) de la page (code navigateur): Code navigateur excut lors de laffichage de la page dans le navigateur. Dchargement (onunload) de la page (code navigateur): Code navigateur excut lors de laffichage dune nouvelle page dans le navigateur. Synchronisation de la page (code serveur): Code serveur permettant de grer la synchronisation de la page lors de lutilisation de la touche "Prcdent" du navigateur. Fermeture de la page (code serveur): Excut lors de la fermeture de la page. Affectation de la proprit ..Valeur (page interne uniquement) Excut lors de lutilisation de la proprit Valeur en affectation sur le champ Page Interne. Rcupration de la proprit ..Valeur (page interne uniquement) Excut lors de lutilisation de la proprit Valeur en lecture sur le champ Page Interne.

9.2Traitements optionnels
Plusieurs traitements optionnels peuvent tre grs. Pour grer un traitement optionnel, il suffit de le slectionner dans la barre dicnes de la fentre de code.

Il est ainsi possible de grer par exemple: le survol du champ par la souris, le bouton gauche enfonc, relch, avec doubleclic, le bouton droit enfonc, relch, avec double-clic, la roulette de la souris, etc.

Partie 2 : Dveloppement dun site

43

10 Les menus principaux


WebDev permet de crer un menu droulant dans vos pages HTML. Ce menu peut tre vertical ou horizontal. A partir des diffrentes options de ce menu, il est possible: dafficher des pages, dexcuter le code de boutons prsents dans la page, ... WebDev permet de: Crer un menu principal Editer un menu principal Supprimer un menu principal. Pour plus de dtails, consultez laide en ligne.

11 Les options de menu


11.1Prsentation
Un menu est compos dune ou de plusieurs options et sous-options. Chaque option permet dexcuter un code WLangage. Pour manipuler les options de menu, il suffit dditer le menu concern. Pour diter (ou afficher sous lditeur), le menu principal dune page: 1.Ouvrez la page concerne sous WebDev. 2.Cliquez deux fois sur le menu: un cadre jaune apparat. leurs caractristiques sont modifiables grce une fentre de description. La fentre de description des options de menu permet par exemple de: modifier le libell de loption. cocher ou dcocher une option de menu associer une image une option de menu associer un raccourci clavier une option de menu. Il est galement possible dassocier du code WLangage une option de menu. Seules les options de menu ne possdant pas de sous-menu peuvent lancer un traitement WLangage. Pour plus de dtails, consultez laide en ligne.

11.2Manipuler les options de menu sous lditeur


Lditeur de pages permet de raliser trs simplement les manipulations suivantes: Ajouter une option de menu Ajouter un sparateur Ajouter un sous-menu Supprimer une option de menu Les options de menu peuvent galement tre directement manipules sous lditeur de fentres et

11.3Manipuler les options de menu par programmation


Pour manipuler par programmation une option de menu, utilisez la notation: "<NomOption>" si loption de menu est manipule depuis la page. "<NomPage>.<NomMenu>.<NomOption>" si loption est manipule depuis une autre page.

44

Partie 2 : Dveloppement dun site

Les diffrents types de champs standard


Vous voulez...
Afficher du texte, un titre, ... Libell HTML, Libell Dfinir une zone de couleur

Utilisez un champ...

Cellule, Tableau HTML

Afficher un prix, une quantit, une adresse, une date, une heure, ... Slectionner une valeur parmi une liste (Pays, Ville,)

Champ daffichage format

Slecteur, Combo, Liste

Slectionner plusieurs valeurs parmi une liste (les destinataires dun message, des fichiers tlcharger, ...)

Interrupteur, Liste

Afficher une image graphique (Photo, ...)


Image,

Image clicable

Partie 2 : Dveloppement dun site

45

Afficher une animation (Gif anim)

Image

Afficher une page selon la zone clique sur une image Afficher le contenu dun fichier de donnes en table (Liste des clients, dtail dune commande, ...)

Image clicable Table fichier ou table mmoire, Zone rpte fichier ou zone rpte mmoire

Afficher une image rafrachie rgulirement Web Camra Rpter des champs dans une page (Catalogue Produits avec la photo, ...)

Zone rpte

Utiliser un code HTML existant


Champ HTML

Utiliser une applet Java (horloge, ...)


Champ Java

Saisir des informations


Champ de saisie

Afficher des informations hirarchises (contenu dun rpertoire, ...)


46 Partie 2 : Dveloppement dun site

Champ Arbre

Afficher une animation Flash

Champ Flash

Aligner des champs (tableau HTML) Cellule, Tableau HTML Programmer une action dans une page (afficher une page, valider une saisie, ...)

Bouton, Champ Lien

Slectionner et afficher une date sur un calendrier

Champ Calendrier

Afficher une vido Champ Vido Afficher une page dun autre site dans une de vos pages Afficher un histogramme, une courbe, un graphe de type camembert

IFrame

Champ Graphe

Partie 2 : Dveloppement dun site

47

Afficher une page de votre site lintrieur dune de vos pages Afficher un menu automatique (qui se construit au fur et mesure du parcours du site) Permettre linternaute de donner ou de visualiser une note.

Page Interne Chemin de navigation

Champ Notation

Afficher des vignettes dimages

Champ Vignette

Afficher des fichiers Flex Champ Flex Intgrer des champs de type SilverLight

Champ SilverLight

Enrouler / Drouler une zone daffichage

Champ Tiroir

Uploader un ou plusieurs fichiers

Champ Upload

Afficher une liste dobjets sous forme de liste horizontale dfilante. Crer un effet visuel dans une page en prsentant une image partiellement recouverte par une autre.

Champ Zone Rpte linaire Champ Page corne

48

Partie 2 : Dveloppement dun site

Les champs en pratique


WebDev propose de nombreux types de champs, facilement intgrables dans vos pages. Ces champs peuvent tre crs soit par la barre doutils "Champ", soit par le menu "Insertion" de lditeur de pages. Tous les champs peuvent bien sr tre manipuls par programmation.

1 Crer un champ
Les champs disponibles sous lditeur de pages de WebDev sont les suivants: Arbre, Libell HTML, Cellule, Libell, Tableau HTML, Bouton, Ligne, Lien, Onglet, Image, Champ Web Camra, Image clicable, Champ daffichage Champ Applet Java, format, Champ Flash, Champ de saisie, Champ IFrame, Interrupteur, Champ page interne, Slecteur, Chemin de navigation, Liste, Plan du site Combo, Superchamp, Table, Graphe, Zone rpte, Calendrier, Rglette, Planning, Captcha, Code-barres Notation, Modle de champs.

1.1Crer un nouveau champ


Pour crer un champ: 1.Slectionnez le type de champ crer: soit par loption "Insertion.. Champ/Forme/Spcial". soit par licne correspondante dans la barre doutils "Champs". 2.La forme du nouveau champ apparat sous le curseur de la souris. 3.Cliquez dans la page la future position de cration du champ. Le champ est automatiquement cr. Remarque: Dautres modes de cration sont disponibles. Pour plus de dtails, consultez laide en ligne.

1.2Crer un champ associ une rubrique


Mis part les types de champs suivants, tous les champs dune page peuvent tre associs une rubrique dun fichier de donnes: champ Flash Bouton, rglette Onglet cellule et tableau HTML Ligne Plan du site Champ HTML Champ applet Java Pour crer un champ associ une rubrique (ou rcuprer une rubrique), plusieurs mthodes sont disponibles: Drag and Drop depuis le volet "Analyse". Utilisation de longlet "Fichier" du champ.

Partie 2 : Dveloppement dun site

49

2 Caractristiques dun champ


Pour tous les champs dune page, il est possible dafficher la fentre de description des champs. Cette fentre est une fentre onglets, regroupant toutes les caractristiques paramtrables dun ou de plusieurs champs. Remarque: Il est galement possible de visualiser et/ou de modifier les caractristiques dun ou de plusieurs champs dans le modifieur. Pour plus de dtails, consultez laide en ligne. Onglet Dtail Longlet "Dtail" permet de dfinir les diffrents paramtres du champ: Etat initial du champ louverture de la page. Visibilit du champ Type du champ Onglet Liaison Cet onglet permet de slectionner la rubrique (dun fichier ou dune rubrique) laquelle le champ est reli. Selon lenregistrement en cours, le contenu de la rubrique relie sera affich dans le champ. La liaison peut tre mono-fichier ou multi-fichier. Onglet Contenu Cet onglet est disponible uniquement pour les champs des pages. Longlet "Contenu" permet de dfinir: soit le contenu initial du champ (pour les champs de saisie uniquement). soit la source de donnes utilise pour remplir le champ (pour les listes, les combos et les tables uniquement). Onglet Note / Aide Longlet "Note/Aide" permet de: dcrire le fonctionnement dtaill du champ. Ces informations seront imprimes dans les dossiers de programmation (dossier du projet, dossier de la page, ...). configurer tous les types daides associs au champ. Un champ peut avoir: Une bulle daide, affiche lors du survol du champ. Un message daide, affich dans la barre de message lors de lentre dans le champ. Onglet Avanc Longlet "Avanc" permet de saisir le code HTML gnr avant et aprs le champ. Onglet Style Longlet "Style" permet de dfinir le style des diffrents lments du champ. Cet cran permet de: Modifier laspect dun champ: il suffit alors de slectionner llment du champ modifier, puis ses caractristiques de style. Seul laspect du champ en cours est modifi. Crer ou modifier un style. Choisir un style.

2.1Affichage des caractristiques


Pour afficher la fentre de description dun champ: soit double-cliquez sur le champ. soit slectionnez loption "Description" du menu contextuel du champ (clic droit de la souris). soit slectionnez le champ et slectionnez loption "Affichage .. Description de la slection". soit slectionnez le champ et utilisez le raccourci clavier [Alt]+[Entre]. soit slectionnez loption "Affichage .. Options .. Modifier les options" (touche [F12]), slectionnez le champ et cliquez sur le bouton "diter". Remarques: Il est possible dafficher la fentre de description pour un ensemble de champs slectionns. Seules les caractristiques communes aux diffrents champs slectionns seront affiches. Plusieurs fentres de description peuvent tre affiches simultanment. Chaque fentre de description affiche alors les caractristiques dun ou de plusieurs champs.

2.2Caractristiques par onglet


Ce paragraphe prsente rapidement les diffrentes catgories de caractristiques affiches par onglet. Pour plus de dtails sur chacune des caractristiques prsentes dans les diffrents onglets, consultez laide contextuelle des fentres de description. Onglet Gnral Longlet "Gnral" permet de spcifier le nom du champ et toutes les caractristiques daffichage du champ (libell, masque de saisie, ...).

50

Partie 2 : Dveloppement dun site

2.3Champ dynamique, champ statique


Pour tous les types de champs, WebDev propose les options suivantes: Automatique: le champ sadaptera automatiquement au type dutilisation qui est effectu. Statique: le champ ne pourra pas tre modifi en programmation : les diffrentes proprits associes au champ seront sans effet.

Dynamique : le champ pourra tre modifi en programmation: toutes les proprits associes au champ pourront tre utilises. Remarque: si un champ est dfini comme tant dynamique, le code HTML de la page contiendra du code spcifique pour grer la programmation du champ en WLangage. Le fichier HTML correspondant la page sera donc plus important que si le champ est dfini en statique.

3 Manipuler les champs sous lditeur


3.1Les poignes des champs
Lorsquun champ vient dtre cr ou lorsquil est slectionn, il saffiche avec des poignes. Les poignes permettent de: visualiser la taille dun champ, modifier la taille dun champ. Les couleurs des poignes permettent de connatre les actions ralisables: Les poignes noires permettent de visualiser et de redimensionner un champ. Les poignes blanches permettent uniquement de visualiser un champ. Par exemple, lors de la slection de plusieurs champs, les poignes blanches indiquent quil est impossible de modifier la taille des champs slectionns. Ce type de poignes est aussi affich lorsquune page est en lecture seulement pour le dveloppeur: les champs ne peuvent pas tre modifis. Les poignes grises indiquent que le premier champ slectionn lors dune slection multiple. Ce champ sera le champ de rfrence.

3.2Manipulations disponibles
Lditeur de pages permet de: Slectionner un ou plusieurs champs (par exemple laide du lasso). Regrouper des champs slectionns. Dplacer un champ. Modifier le libell dun champ. Afficher une bulle daide avance lors du survol dun champ. Cette bulle daide contient: le nom du champ, sa position, sa taille, son tat initial (si le champ est invisible).

4 Alignement des champs


Lalignement des champs permet dobtenir des interfaces "professionnelles" et harmonieuses. Pour vous aider concevoir des interfaces standard, WebDev vous proposent les outils suivants: les rgles. la grille. le correcteur dinterface en temps rel (propos automatiquement lors dun positionnement dun champ). le correcteur dinterface avanc. les options dalignement. le zoom paramtrable. lancrage.

4.1Les rgles
Sous lditeur de pages, il est possible de faire apparatre des rgles dalignement. Dans ces rgles, des guides magntiques sont affichs: tout champ approch dun guide est automatiquement "attir" par celui-ci. Ce magntisme permet dutiliser les guides pour faciliter le positionnement, lalignement ou le redimensionnement des champs de la page.

Partie 2 : Dveloppement dun site

51

Afficher les rgles Les rgles sont affiches par loption "Affichage.. Rgles". Deux types de guides peuvent alors tre utiliss: les guides, permettant daligner et de disposer les champs lintrieur des pages. les guides de bordure, permettant de dterminer une bordure de taille identique de chaque ct de la page. Remarque : Loption "Guide visible" du menu contextuel des rgles permet de visualiser la page avec ou sans ses guides. Visibles ou non, les guides sont toujours actifs: un champ dplac vers un repre est automatiquement accol celui-ci. Manipuler les repres Les repres sont facilement manipulables laide de la souris dans lditeur. Lorsque la souris survole un repre, le curseur se transforme en une double flche.

4.5Les options dalignement


Pour aligner plusieurs champs, WebDev met votre disposition: soit un alignement prdfini (disponible par le menu droulant "Champ.. Alignement.." ou dans la barre doutils dalignement des champs). soit un alignement personnalis ("Champ.. Alignement.. Alignement personnalis"). Lalignement personnalis permet dutiliser des proprits spcifiques dalignement. Lors de lalignement personnalis, il est possible de dfinir: lalignement horizontal ou vertical: les champs peuvent tre aligns gauche en fonction du dbut du champ ou du dbut de la zone de saisie. Ils peuvent aussi tre aligns droite, en fonction de la fin du champ, ou de la fin de la zone de saisie. lespacement uniforme : lespacement entre les champs est adapt pour tre le mme entre chaque champ (horizontalement ou verticalement). la taille: la taille des champs slectionns est automatiquement adapte pour obtenir des champs de mme hauteur et/ou de mme largeur. le champ de rfrence: pour lalignement et la taille des champs, le champ de rfrence est au choix: le premier champ slectionn le dernier champ slectionn le plus grand champ slectionn le champ situ le plus en haut gauche des champs slectionns

4.2Grille magntique
La grille magntique permet de placer des repres (verticaux et horizontaux) dans la page. Les champs crs viennent se placer contre ces repres, comme si les champs et les repres taient magntiss. La grille magntique permet ainsi daligner les champs selon les repres.

4.3Correcteur dinterface en temps rel


Lors du dplacement dun champ dans une page, le correcteur dinterface en temps rel affiche automatiquement des guides. Ces guides sont magntiss et permettent daligner le champ dplac avec les champs prsents dans la page.

4.4Correcteur dinterface avanc


Le correcteur dinterface avanc est un outil permettant dharmoniser la disposition des champs dans les diffrentes pages dun site. Le correcteur dinterface avanc propose pour la page en cours ou uniquement pour les champs slectionns, dappliquer des rgles de prsentation dinterface issues du standard Windows : alignement des champs, normalisation de la taille des boutons,...

4.6Le zoom paramtrable


Il est possible de spcifier un facteur de zoom pour rduire ou agrandir laffichage de la page en cours. Pour spcifier un facteur de zoom: 1re mthode: Soit slectionnez loption "Affichage.. Zoom.." et choisissez le facteur de zoom utiliser. Soit saisissez directement le facteur de zoom dans la barre de message de lditeur (en bas droite). 2me mthode: Appuyez sur la touche [Ctrl]. Modifiez le facteur de zoom avec la roulette de la souris tout en maintenant la touche [Ctrl] enfonce.

52

Partie 2 : Dveloppement dun site

5 Options ddition des champs dans une page


Les options ddition (option "Affichage.. Options.. Modifier les options") permettent de paramtrer: les options daffichage. le magntisme des champs. les oprations de clic et de double-clic sur les champs. les options de slection des champs. Ces options daffichage permettent de personnaliser la manipulation des champs sous lditeur de pages.

6 Ancrage des champs


Les pages dun site WebDev peuvent tre redimensionnables lexcution : le navigateur peut tre redimensionn, le site peut tre affich sur des plates-formes diffrentes (IAD, iPhone, PC, ...). Grce au mcanisme dancrage, la taille et la position des champs sadaptent automatiquement lors dun redimensionnement de la page.

6.1Ancrer un champ sous lditeur


Pour ancrer un champ: 1.Slectionnez un ou plusieurs champs ancrer. 2.Dfinissez lancrage du / des champs: soit dans longlet "IHM" de la fentre de description du champ (option "Affichage .. Description de la slection"). soit grce loption "Ancrage" du menu contextuel (clic droit) du champ. 3.Dans cette fentre, choisissez le type dancrage utiliser. Les options sont prsentes sous forme dicnes. 4.Dans cette fentre, choisissez le type dancrage utiliser. Les options les plus courantes sont prsentes sous forme dicnes: Aucun ancrage: Le champ nest pas modifi lorsque la taille du navigateur est modifie. Aucune option dancrage nest slectionne. Largeur: Le champ stire vers la droite lorsque le navigateur sagrandit. Pour faire varier la vitesse dtirement du champ par rapport au navigateur, utilisez le taux dancrage en largeur. Droite: Le champ se dplace vers la droite lorsque le navigateur sagrandit. Pour que le champ se dplace plus ou moins vite, utilisez le taux dancrage droite. Centr en largeur: Le champ reste centr en largeur dans le navigateur quelle que soit la largeur du navigateur. Hauteur: Le champ stire vers le bas lorsque la hauteur du navigateur sagrandit. Pour faire varier la vitesse dtirement du champ par rapport au navigateur, utilisez le taux dancrage en hauteur. Partie 2 : Dveloppement dun site 53

La gestion de lancrage dun champ est constitue de plusieurs paramtres: lancrage du champ: ce paramtre permet de dfinir la modification appliquer au champ en fonction du changement de la taille de la page. Le champ peut se dplacer vers la gauche ou vers le bas, sagrandir en largeur et/ou en hauteur. la gestion de la largeur et/ou de la hauteur: ce paramtre permet de grer le comportement du champ lors de son tirement. La largeur ou la hauteur peut tre adapte au contenu du champ ou au navigateur. le taux dancrage: ce paramtre permet de grer le pourcentage de dplacement ou dtirement du champ. Ces paramtres peuvent tre configurs sous lditeur de pages.

Largeur et Hauteur: Le champ stire vers la droite et vers le bas lorsque le navigateur sagrandit. Pour faire varier la vitesse dtirement du champ par rapport au navigateur, utilisez le taux dancrage en hauteur et le taux dancrage en largeur. Slectionnez le mode de gestion de la hauteur et de la largeur. Hauteur et Droite: Le champ stire vers le bas et se dplace vers la droite lorsque le navigateur sagrandit. Pour que le champ se dplace plus ou moins vite, utilisez le taux dancrage droite. Pour faire varier la vitesse dtirement du champ par rapport au navigateur, utilisez le taux dancrage en hauteur. Hauteur et centr horizontalement: Le champ stire vers le bas et reste centr horizontalement lorsque le navigateur sagrandit. Bas: Le champ se dplace vers le bas lorsque le navigateur est agrandi vers le bas. Pour que le champ se dplace plus ou moins vite, utilisez le taux dancrage en bas. Largeur et Bas: Le champ stire vers la droite et se dplace vers le bas lorsque le navigateur sagrandit. Pour que le champ se dplace plus ou moins vite, utilisez le taux dancrage en bas. Pour faire varier la vitesse dtirement du champ par rapport au navigateur, utilisez le taux dancrage en largeur. Droite et Bas: Le champ se dplace vers la droite et vers le bas lorsque le navigateur sagrandit. Pour que le champ se dplace plus ou moins vite, utilisez le taux dancrage en bas et le taux dancrage droite.

Centr horizontal en bas: Le champ reste centr en largeur dans le navigateur quelle que soit la largeur du navigateur. Cependant, le champ est ancr en bas, et se dplace vers le bas lorsque le navigateur sagrandit. Pour que le champ se dplace plus ou moins vite, utilisez le taux dancrage en bas. Centr en hauteur: Le champ reste centr en hauteur dans le navigateur quelle que soit la hauteur du navigateur. Largeur et centr verticalement: Le champ stire vers la droite et reste centr verticalement lorsque le navigateur sagrandit. Centr vertical droite: Le champ reste centr en hauteur dans le navigateur quelle que soit la hauteur du navigateur. Cependant, le champ est ancr droite, et se dplace vers la droite lorsque le navigateur est largi. Pour que le champ se dplace plus ou moins vite, utilisez le taux dancrage droite. Centr: Le champ reste centr en hauteur et en largeur dans le navigateur quelle que soit la taille du navigateur. 5.Dfinissez si ncessaire les diffrents taux dancrage. 6.Validez. Si loption "Affichage .. Options .. Voir les ancrages" est active, les signes dancrage apparaissent automatiquement dans le champ (flches rouges). 7.Validez. Les signes dancrage apparaissent automatiquement dans le champ (flches rouges). Remarque: Pour grer lancrage des champs, il est galement possible dutiliser les tables de positionnement. Pour plus de dtails, consultez laide en ligne.

54

Partie 2 : Dveloppement dun site

Rpter un groupe de champs: les zones rptes


Les zones rptes permettent de rpter un ensemble de champs dans une page web. Lors de cette rptition, les champs de la zone rpte peuvent afficher des informations diffrentes dans chaque occurrence. Il est ainsi possible dafficher chaque rptition des enregistrements dune base de donnes.

Cration de la zone rpte sous lditeur de WebDev

Affichage de la zone rpte sous le navigateur

Pour chaque champ de la zone rpte, plusieurs caractristiques peuvent tre modifies lors de la rptition: libell, couleur du texte, ... Les rptitions peuvent tre ralises: sur une colonne, sur plusieurs colonnes. Dans ce cas, on parle de "Zone rpte horizontale". Lors de la cration dune zone rpte, il est possible de lier la zone rpte directement un fichier de donnes ou une requte. Les attributs de la zone rpte sont automatiquement dfinis. Aucune programmation nest ncessaire.
Partie 2 : Dveloppement dun site 55

Les deux types de code


Code serveur ou code navigateur?
Deux sortes dactions peuvent tre programmes dans un site WebDev:

Pour grer ces deux sortes dactions, lditeur de code de WebDev diffrencie deux types de code: Code Serveur (code Jaune ou Rose sous lditeur de code): Ce code est crit en WLangage (code jaune) ou en PHP (code rose, disponible uniquement dans les pages PHP). Ce code est excut sur le serveur. Ce code est disponible uniquement dans les pages dynamiques. Code Navigateur (code Vert ou Bleu): Ce code est crit en WLangage (code vert) ou en Javascript (code bleu). A lenregistrement de la page, ce code est automatiquement traduit en Javascript, et intgr aux pages HTML WebDev. Ce code est excut en local (sur le poste de linternaute) et ne ncessite pas daction du serveur.

56

Partie 2 : Dveloppement dun site

Code serveur dans une page PHP: code WLangage ou code PHP?
Les codes excuts sur le poste serveur sont reprsents sous lditeur de code par un bandeau Jaune ou Rose.

bandeau Jaune = WLangage: le sigle WL prcde lintitul du code. bandeau Rose = PHP: le sigle PHP prcde lintitul du code. Pour passer dun code jaune (WLangage) un code rose (PHP), il suffit de cliquer sur le sigle WL prcdant lintitul du code (ou inversement en cliquant sur PHP). Lors de lenregistrement de la page PHP, le code WLangage est automatiquement converti en code PHP. Nous vous conseillons de dvelopper en WLangage.

Partie 2 : Dveloppement dun site

57

Code navigateur: code WLangage ou code Javascript?


Les codes excuts sur le poste de linternaute (sur le navigateur) sont reprsents sous lditeur de code par un bandeau vert ou bleu.

bandeau vert =WLangage: le sigle WL prcde lintitul du code. bandeau bleu = Javascript: le sigle JS prcde lintitul du code. Pour passer dun code vert (WLangage) un code bleu (Javascript), il suffit de cliquer sur le sigle WL prcdant lintitul du code (ou inversement en cliquant sur JS). A lenregistrement de la page, le code WLangage est automatiquement converti en Javascript. Nous vous conseillons de dvelopper en WLangage.

Evnements supplmentaires
La barre dicnes situe au bas de la fentre de code permet de grer des vnements supplmentaires ceux proposs par dfaut:

Ces vnements sont ajouts aux codes affichs par lditeur de code par simple clic sur licne du code correspondant. Exemples dvnements supplmentaires: double-clic, touche enfonce, touche presse, touche relche, bouton enfonc, souris dplace, ... Rappel : Le code navigateur est disponible dans les pages dynamiques, semi-dynamiques et statiques.

58

Partie 2 : Dveloppement dun site

Le WLangage: un langage simple et trs puissant


Le langage intgr de WebDev est le WLangage. Ce langage permet de programmer simplement tous les traitements web voulus sans avoir connatre le HTML, le Javascript ou le PHP. Disponible en franais et en anglais, le WLangage est compos dordres simples, proches du langage courant. Le franais permet une programmation intuitive. Voici un tout petit exemple illustrant la puissance du WLangage: la vrification de la saisie dune adresse: En WLangage, quelques lignes suffisent:
SI SansEspace(ADRESSE) = "" ALORS Erreur("Veuillez indiquer votre adresse") RepriseSaisie(ADRESSE) FIN

En Javascript, voici le traitement quivalent:


<SCRIPT LANGUAGE=Javascript> function EXE_SansEspace( szChaine , nPartie ) { var nPremier = 0; var nDernier = szChaine.length-1; if (nPartie & 1) while (szChaine.charAt(nPremier)==" ") nPremier++; if (nPartie & 2) while (szChaine.charAt(nDernier)==" ") nDernier--; return szChaine.substring(nPremier,nDernier+1); } // Clic (onclick) de BOUTON_OK function _VALIDCDE_BOUTON_OK_CLI() { if((EXE_SansEspace(ADRESSE,3)=="")) { alert("Veuillez indiquer votre adresse "); return; } } </SCRIPT>

Le code WLangage est plus facile crire, comprendre, maintenir. La fiabilit est amliore. Les volutions sont plus simples. Dans tous vos traitements, utilisez le WLangage.

Partie 2 : Dveloppement dun site

59

Ordre dexcution des codes des boutons/ liens


Deux codes de clic sont associs aux boutons / liens: un code de clic navigateur, saisi en WLangage (ou en Javascript) sous lditeur de code. Ce code est intgr la page HTML et sera excut sur le poste de linternaute. un code de clic serveur saisi en WLangage (uniquement dans les pages dynamiques). Ce code sera excut sur le serveur.

Code de clic navigateur

Code de clic serveur

Le tableau ci-aprs prsente les diffrents codes excuts selon le type de bouton/ lien choisi, et laction associe. Laspect du bouton / lien et sa destination ninfluent pas sur lordre des codes excuts.

60

Partie 2 : Dveloppement dun site

Opration
Envoi au serveur (submit)

Ordre des codes excuts


Action associe: Aucune Excuter le code de clic du bouton / lien Codes excuts: 1.Code de clic navigateur du champ. 2.Code navigateur du submit de la page (sil existe). 3.Envoi des valeurs prsentes dans les champs de la page pour mettre jour le contexte de la page sur le serveur. 4.Code serveur du champ. Action associe: Afficher la page Codes excuts: 1.Code de clic navigateur du champ. 2.Code navigateur du submit de la page (sil existe). 3.Envoi des valeurs prsentes dans les champs de la page pour mettre jour le contexte de la page sur le serveur. 4.Code serveur du champ. 5.Affichage de la page.

Remarques
Mise jour automatique du contexte de page sur le serveur (pages dynamiques uniquement).

Mise jour automatique du contexte de page sur le serveur (pages dynamiques uniquement). Affichage automatique de la page.

Rinitialisation de page (reset)

Action associe: Aucune Codes excuts: 1.Code de clic navigateur du champ. 2.Affichage de la page initiale (page avec tous les champs initialiss vide ou 0 et excution du code dinitialisation de chacun des champs puis de la page). Action associe: Aucune Codes excuts: Code navigateur du champ uniquement. Action associe: Excuter le code de clic du bouton / lien Codes excuts: 1.Code de clic navigateur du champ. 2.Code serveur du champ. Action associe: Afficher la page Codes excuts: 1.Code de clic navigateur du champ. 2.Code serveur du champ. 3.Affichage de la page. Affichage automatique de la page

Aucune

Partie 2 : Dveloppement dun site

61

Upload : Envoi de fichiers vers le serveur


Lupload est lopration qui consiste envoyer sur le poste serveur un ou plusieurs fichiers provenant du poste de linternaute. Un exemple simple: La cration dun contact dans un annuaire. Linternaute veut associer une photographie la fiche du contact. Cette photo est prsente sur le disque dur de son poste. Le champ de type UPLOAD permet linternaute de slectionner limage grce un bouton "Parcourir". Lors de la validation de la fiche, le fichier image slectionn est envoy au serveur et copi sur le disque dur du serveur (fonction UploadCopieFichier). Lors de la consultation du contact, limage apparatra dans la fiche.

Lors de la validation de la page, le fichier "upload" est copi sur le disque dur du serveur.

Serveur Web
Sur le navigateur de linternaute

Poste serveur chez lhbergeur

Note: Laspect du bouton "Parcourir" est dfini par le navigateur et ne peut gnralement pas tre personnalis. Remarque: WebDev propose galement un champ Upload volu ncessitant un lecteur Flash sur le poste de linternaute. Ce champ permet de grer une jauge de progression, la multi-slection des fichiers, ...
62 Partie 2 : Dveloppement dun site

Modles de champs
WebDev permet de crer des modles de champs. Un modle de champs est un ensemble de champs, rutilisables dans plusieurs pages. Les modifications effectues dans un modle de champs sont automatiquement reportes sur toutes les pages utilisant ce modle. Un modle de champs permet de: regrouper un ensemble de champs dans un but prcis. rendre les champs indpendants de la page les accueillant.

Dfinition dun modle de champs: le modle est encadr dun trait jaune sous lditeur.

Utilisation du modle dans une page. Les lments appartenant au modle sont entours en bleu et identifis par un carr jaune. Un modle de champs peut tre cr: directement (menu "Fichier .. Nouveau .. Page .. Modle de champs") partir de champs prsents dans la page (menu "Champ .. Refactoring .. Crer un modle de champs avec la slection"). Pour utiliser un modle de champs dans une page, crez un champ de type "Modle de champs". Remarque: La programmation associe aux lments du modle peut tre directement ralise dans le modle. Les caractristiques des lments peuvent tre dsolidarises du modle. Par exemple, dsolidariser la position dun champ du modle pour positionner le champ ailleurs tout en conservant les autres volutions sur le champ (code, style, ...). On parle alors dhritage de champ. Dans ce cas, les lments sont identifis par un carr bleu.

Partie 2 : Dveloppement dun site

63

Les tats
Un tat permet dobtenir une vue personnalise dinformations: donnes saisies dans la base de donnes, donnes prsentes dans un fichier texte, donnes provenant dun champ Table, ... Un tat est cr selon le principe suivant: les donnes imprimer sont issues dune source de donnes (fichier de donnes dcrit dans une analyse, vue HyperFileSQL, requte, zone mmoire ou fichier texte). ltat regroupe, trie et met en forme les donnes. Ltat cr peut ensuite tre: imprim sur limprimante du serveur (cas dun site Intranet). affich dans le navigateur de linternaute (format HTML, PDF, ...). envoy par mail linternaute (format PDF).

64

Partie 2 : Dveloppement dun site

Modles dtats
Dans une socit, bien souvent, les impressions utilisent un look et une mise en page unifis: date en haut droite dans un format spcifique, bas de page avec heure dimpression et nom du fichier, logo en haut gauche, ... Les modles dtats permettent duniformiser simplement la mise en page de vos tats.

Dfinition dun modle dtats sous lditeur dtats.

Utilisation du modle dans diffrents tats. Les lments appartenant au modle sont identifis par un carr jaune. Les lments du modle surchargs sont identifis par un carr bleu.

Un modle dtats peut tre cr: directement (option "Fichier .. Nouveau.. Etat .. Modle dEtats"). partir de ltat en cours (option "Fichier .. Enregistrer comme un modle"). Pour crer un tat utilisant un modle, slectionnez le modle utiliser lors de la cration de ltat. Remarque: La programmation associe aux lments du modle peut tre directement ralise dans le modle. Les caractristiques des lments peuvent tre dsolidarises du modle. Par exemple, dsolidariser la position dun champ du modle pour positionner le champ ailleurs tout en conservant les autres volutions sur le champ (code, style, ...). On parle alors dhritage. Dans ce cas, les lments sont identifis par un carr bleu.
Partie 2 : Dveloppement dun site 65

Diffrents modes dimpression


Pour imprimer des documents gnrs par votre site (factures, devis, ...), crez des tats grce lditeur dtats. Pour imprimer ces tats quelle que soit la configuration du poste de linternaute, il est conseill de proposer au moins deux modes dimpression: Impression au format HTML: Ltat saffiche dans une nouvelle page du site. Linternaute na qu utiliser le bouton "Imprimer" du navigateur pour imprimer ltat. Aucun logiciel spcifique nest ncessaire. Impression au format PDF: Ce mode dimpression ncessite la prsence dAdobeReader (ou dun logiciel quivalent) sur le poste de linternaute. Limpression se fait directement partir de ce logiciel.

Etat sous lditeur dtats de WebDev

Impression en HTML

Impression en PDF

66

Partie 2 : Dveloppement dun site

Afficher et enchaner les pages


Un site est gnralement constitu dun ensemble de pages. Ces pages sont relies entre elles grce des boutons (ou des liens). Un clic sur un bouton entrane laffichage dune nouvelle page. Pour afficher une nouvelle page, il faut se poser deux questions: 1. o afficher la page (nouveau navigateur, frame, ...) ? 2. quelle page afficher?

Quelle page afficher?


La page afficher peut tre dfinie: soit sous lditeur de pages (aucune programmation nest ncessaire). soit sous lditeur de code dans un traitement du bouton (du lien, de limage clicable, ...). Slection de la page afficher sous lditeur de pages (cas le plus courant) Pour dfinir la page afficher: Affichez la fentre de description du champ (clic droit sur le champ, option "Description"). Dans la liste des actions, slectionnez la page afficher. Slection de la page afficher par programmation Il est ncessaire de slectionner la page afficher par programmation lorsque: plusieurs pages peuvent tre affiches (par exemple soit une page derreur si le mot de passe nest pas saisi, soit la page suivante du site). une action particulire doit tre effectue sur le serveur (calcul, lecture denregistrement, ...).

Partie 2 : Dveloppement dun site

67

O afficher la page?
Laffichage dune page se fait dans une "destination" spcifique: page en cours, nouveau navigateur, ... La destination peut tre dfinie: soit sous lditeur de pages: aucune programmation nest ncessaire. soit sous lditeur de code, dans un traitement du bouton (ou du lien). Plusieurs fonctions du WLangage permettent douvrir une nouvelle page (ou frameset). Les principales fonctions sont: PageAffiche (pour les pages) et FramesetAffiche (pour les framesets). Slection de la destination sous lditeur de pages (cas le plus courant) Dans un bouton, pour dfinir la destination de la page afficher: Affichez la description du bouton ou du lien (clic droit sur le champ, option "Description"). Dans la liste des destinations, slectionnez une destination prdfinie ou une frame (dans le cas dun frameset). Remarque: Les destinations prdfinies sont prsentes dans les pages suivantes de ce manuel. Slection de la destination sous lditeur de code Lorsque la destination dpend dun choix de linternaute, cette destination doit tre slectionne par programmation. Par exemple, si linternaute nindique pas son mot de passe, une page derreur apparat dans un nouveau navigateur; sinon, la page suivante saffiche dans le navigateur en cours. La fonction WLangage ChangeDestination permet de modifier par programmation la destination dune action. Cette fonction doit tre utilise dans un code navigateur.

68

Partie 2 : Dveloppement dun site

Choisir une destination


Lors du choix de la destination pour un bouton, un lien, une image clicable, une option de menu, ... il est possible de choisir: une destination prdfinie: quatre destinations prdfinies sont proposes: - Navigateur en cours (_top pour les habitus) - Frame en cours (_self) - Frame parent (_parent) - Nouveau navigateur (_blank). Dans ce cas, vous pouvez choisir les caractristiques du nouveau navigateur (prsence de la barre de menu, de la barre de message, ...). une frame du frameset en cours. Remarque: dans les schmas ci-dessous, la zone grise reprsente la zone dans laquelle la page est affiche lors du clic sur le bouton. Navigateur en cours (_top)

Clic sur le bouton

Page initiale

Nouvelle page affiche dans la totalit du navigateur

Frame en cours (_self)

Clic sur le bouton

Page initiale

Nouvelle page affiche dans la mme frame

Partie 2 : Dveloppement dun site

69

Frame parent (_parent)

Clic sur le bouton

Page initiale (imbrication de 2 framesets)

Nouvelle page affiche dans la page contenant le second frameset

Nouveau navigateur (_blank)

Clic sur le bouton

Page initiale

Nouvelle page affiche dans une nouvelle fentre du navigateur

Fentre de dfinition des caractristiques du nouveau navigateur

70

Partie 2 : Dveloppement dun site

Affichage dune page dynamique: cration du contexte associ


Nous savons que WebDev permet de crer des pages dynamiques. Le contenu dynamique des pages est dfini " la vole" lexcution de la page (cest--dire lorsque la page est affiche sur le navigateur de linternaute). Pour chaque page dynamique affiche sur le navigateur, un "contexte de page" est cr sur le serveur. Ce contexte contient toutes les informations relatives la page (valeur des variables en cours, contenu des champs, ...).

Poste de linternaute

Poste Serveur

Contexte de page

Chaque page dynamique (affiche sur le poste de chaque internaute) est associe un contexte de page. Si la page permet dafficher des donnes diffrentes (fiche produit avec boutons de parcours par exemple), chaque nouvel enregistrement affich, le contexte est modifi, et la page est uniquement actualise.

Partie 2 : Dveloppement dun site

71

Afficher ou Actualiser une page dynamique: PageAffiche ou PageActualise?


Le WLangage propose deux fonctions pour afficher une page dynamique: PageAffiche et PageActualise. Ces fonctions permettent dafficher ou dactualiser une page dynamique. Ces deux concepts sont totalement diffrents. Affichage dune page = nouvelle page Laffichage dune page dynamique correspond louverture dune "nouvelle page" sur le navigateur. Par exemple, ouverture de la page"Visu_Produit" permettant de visualiser larticle slectionn dans une table. Attention: Si vous "affichez" une page prcdemment ouverte, la page et son contexte sont ferms puis rouverts. Toutes les donnes de la page sont r-initialises. Actualisation dune page = r-affichage de la page (plus rapide) Lactualisation dune page dynamique consiste r-afficher une page dj ouverte sous le navigateur. Laction effectue est identique lutilisation de la touche "Rafrachir" du navigateur. Les donnes dynamiques prsentes dans la page sont mises jour en fonction des contextes prsents sur le serveur. Seules les donnes modifies sont raffiches. Exemple: Dans un site commercial, la page prsentant la liste des produits slectionns est actualise lorsquun nouveau produit est command. Conseil de performances: Pour actualiser les donnes affiches dans une page dynamique, utilisez la fonction "PageActualise". Avec la fonction "PageAffiche", le temps de chargement de la page est plus long.

72

Partie 2 : Dveloppement dun site

Raliser un traitement sur plusieurs pages successives


Dans un site commercial, une prise de commande peut par exemple tre ralise sur diffrentes pages: page1: Slection des produits commander. page2: Visualisation du panier. page3: Validation de la commande et saisie des coordonnes du client.

Page 1: Slection des produits

Page 2: Visualisation du panier

Page 3: Saisie des coordonnes du client

Dans ce cas, lcriture des donnes dans les fichiers de donnes doit seffectuer UNIQUEMENT dans le code du bouton de validation de la commande: tous les lments de la commande doivent tre mmoriss jusqu la validation finale. Ncrivez pas dans les fichiers de donnes en cours de traitement. Remarque: Il est galement possible dutiliser une transaction, mais nous vous recommandons de mmoriser les informations de la commande.

Partie 2 : Dveloppement dun site

73

Feuilles de styles: pour simplifier la mise en page


Les feuilles de styles sont des modles qui permettent duniformiser la prsentation des champs dans les pages. Les feuilles de styles permettent de dfinir: la taille et la forme de vos textes, la police, lalignement de vos paragraphes, les retraits de paragraphe, ... le style de texte (gras ou italique), sa couleur, ... Et bien plus encore. Quand vous modifiez une caractristique du style, tous les champs associs ce style sont mis jour. Il est ainsi possible de modifier la charte graphique dun site en effectuant uniquement quelques modifications dans les styles utiliss. Un exemple dutilisation des feuilles de styles: augmenter la taille de 8 15:

Remarque: Longlet "CSS personnalis" permet de saisir directement du code CSS. Ce code sera ensuite ajout dans la feuille de styles.
74 Partie 2 : Dveloppement dun site

Site centr ou adapt?


La mise en page est un lment fondamental dans la ralisation dun site. Pour optimiser cette mise en page, il est ncessaire de prendre en compte la rsolution de lcran de linternaute. Par exemple, si votre site est cr pour la rsolution 1280 x 1024 pixels, les internautes utilisant une rsolution de 1024 x 768 verront apparatre de nombreux ascenseurs. Dune manire gnrale, la date dimpression de ce manuel, il est conseill de dvelopper des sites optimiss pour une rsolution cran de 1024 x 768. Deux types de mise en page dun site peuvent tre utiliss: site centr: Les pages sont centres dans le navigateur. Si la rsolution de linternaute est suprieure la rsolution optimale du site, des marges blanches apparaissent de part et dautre de la page.

Rsolution: 800 x 600

Rsolution: 1024 x 768 : les marges apparaissent de chaque ct de la page

site adapt: Les pages sont affiches normalement dans le navigateur. Si la rsolution de linternaute est suprieure la rsolution optimale du site, une marge blanche est ajoute droite des pages.

Rsolution: 800 x 600

Rsolution: 1024 x 768 : la page reste "colle" gauche

Remarque: Le type de mise en page (centr ou adapt) configur dans un modle de pages sera automatiquement utilis par les pages associes ce modle.
Partie 2 : Dveloppement dun site 75

Rfrencement dun site


Pour que votre site soit visit, les internautes doivent le trouver. Pour cela, votre site doit tre propos lorsque linternaute saisira les mots-cls caractrisant votre site dans un moteur de recherche. Pour aider au rfrencement de votre site, WebDev propose: un assistant de rfrencement. Cet assistant liste toutes les optimisations pouvant tre ralises pour amliorer le rfrencement de votre site. Pour lancer lassistant, utilisez le menu "Projet .. Rfrencement .. Optimiser le rfrencement").

la possibilit de saisir une description et des mots-cls sur chaque page de votre site. lintgration dune page daccueil. Cette page daccueil permet de saisir la description de votre site et les mots-cls dcrivant votre site. Il est possible dintgrer une page daccueil votre site: soit lors de la cration du projet (dans lassistant de cration du projet). soit lors du dveloppement du projet (option "Fichier .. Nouveau .. Page", option "Page" puis option "Accueil"). Plusieurs modles de pages daccueil sont proposs. Remarque: le rfrencement est une technique dont les rgles sont dictes par les moteurs de recherche (Google, Bing, etc.), ne sont pas toujours explicites et voluent trs vite. Nhsitez pas consulter des ouvrages ou des sites spcialiss sur ce sujet.

76

Partie 2 : Dveloppement dun site

Rfrencement dun site en pratique


1 Principes du rfrencement
Pour que votre site WebDev soit visit, il faut que les internautes puissent le trouver. Pour cela, votre site doit tre propos lorsque linternaute saisira les mots-cls caractrisant votre site dans un moteur de recherche. Pour vous aider, WebDev propose: Un rfrencement de chaque page statique et AWP : pour chaque page il est possible de dfinir une description et un ensemble de motscls. Ces mots-cls permettront aux internautes daccder directement la page. Il est galement possible de ne pas rfrencer une page. Un assistant daide au rfrencement, indiquant pour chaque page les amliorations pouvant tre effectues pour optimiser le rfrencement. La possibilit dintgrer ou dutiliser une page spcifique en tant que page daccueil. Cette solution permet par exemple de rfrencer les pages dynamiques, en associant des mots-cls la page daccueil. Cette page daccueil contient tous les mots-cls qui permettront aux internautes de trouver votre site. Remarque : Pour optimiser le rfrencement de vos pages dans les moteurs de recherche, il est conseill dutiliser des pages AWP. Si vous devez rfrencer un site dynamique, utilisez: une page daccueil. une partie du site en statique. Le site statique permettra deffectuer le rfrencement et de lancer le site dynamique. une partie du site en mode AWP. Le site AWP permettra deffectuer le rfrencement et de lancer le site dynamique.

2 Rfrencer ou non une page statique ou AWP dun site


Pour rfrencer une page statique ou AWP de votre site: 1.Affichez la fentre de description de la page. 2.Dans longlet "Dtail", une zone spcifique permet de grer le rfrencement de la page. Il est possible de: Ne pas rfrencer la page en cours. Rfrencer la page en cours, en lui associant des expressions et des mots-cls (bouton "Editer les expressions et les mots-cls").

3 Rfrencer et saisir les mots-cls dune page


Pour rfrencer une page statique ou AWP de votre site: 1.Affichez la fentre de description de la page. 2.Dans longlet "Dtail", une zone spcifique permet de grer le rfrencement de la page. Dans cette zone, cliquez sur le bouton "Editer les expressions et les mots-cls". 3.Dans longlet "Description" de la fentre de rfrencement, saisissez la description de la page. Cette description apparat le plus souvent dans laffichage du rsultat dune recherche effectue avec un moteur de recherche. Quelques conseils: Utilisez des phrases courtes, limitez le nombre de mots (200 caractres maximum) Cette description doit donner aux internautes envie dafficher la page. Remarque: Cette description peut tre modifie dynamiquement grce la proprit ..Description. 4.Dans longlet "Mots-cls" de la fentre de rfrencement, saisissez les mots-cls associs la page. Ces mots-cls (ou expressions) seront les mots-cls pour lesquels la page sera rfrence: si linternaute saisit un de ces mots-cls, le moteur de recherche proposera la page correspondante. La saisie des mots-cls se fait de la manire suivante: saisissez le premier mot-cl puis appuyez sur la touche [ENTREE] pour saisir le suivant.

Partie 2 : Dveloppement dun site

77

Quelques conseils: Les trois premiers mots-cls sont les plus importants. Utilisez des mots-cls usuels et discriminants. Les mots-cls ne doivent pas tre rpts.

Utilisez des variantes (singulier/pluriel, masculin/fminin, nom/verbe ...). Remarque: Ces mots-cls peuvent tre modifis dynamiquement grce la proprit ..MotsCls. 5.Validez la fentre de rfrencement, puis la fentre de description de la page.

4 Utiliser lassistant daide au rfrencement


Pour vous aider optimiser le rfrencement de vos sites et de vos pages, WebDev propose un assistant daide au rfrencement. Cet assistant peut tre utilis sur une page spcifique, ou sur toutes les pages de votre projet. Cet assistant analyse la composition des pages du site et indique les amliorations apporter pour maximiser le positionnement des pages dans les moteurs de recherche. Quelques exemples doptimisations dtectes par lassistant: Le titre de la page doit tre renseign. Trois mots-cls doivent tre spcifis au minimum dans la page. La description de la page doit tre renseigne. Le texte alternatif doit tre saisi pour tous les champs le proposant (si possible en utilisant les mots-cls dfinis pour la page) ... Pour lancer lassistant daide au rfrencement sur une page: 1.Affichez la page voulue dans lditeur. 2.Slectionnez loption "Page .. Optimiser le rfrencement de la page". 3.Lassistant de rfrencement se lance. Vous pouvez double-cliquer directement sur une proposition pour effectuer loptimisation correspondante. Le bouton "Rafrachir" permet de mettre la liste des propositions jour. Pour lancer lassistant daide au rfrencement sur lensemble des pages du site: 1.Slectionnez loption "Projet .. Performances et Amliorations .. Optimiser le rfrencement". 2.Lassistant de rfrencement se lance. Vous pouvez double-cliquer directement sur une proposition pour effectuer loptimisation correspondante. Le bouton "Rafrachir" permet de mettre la liste des propositions jour. Les rsultats peuvent tre tris par page ou par type de conseils.

5 Intgrer une page daccueil dans votre site


Il est possible dintgrer une page daccueil dans votre site: lors de la cration du projet. Il est alors possible de choisir une page daccueil pr-dfinie. lors de la cration dune nouvelle page (option "Fichier .. Nouveau .. Page", onglet "Vierge / modles", option "Accueil"). Si aucune page daccueil nest associe votre projet, vous pouvez: soit choisir une page daccueil parmi les pages statiques de votre site soit choisir une page daccueil pr-dfinie.

78

Partie 2 : Dveloppement dun site

6 Faire connatre son site auprs des moteurs de recherche


Le rfrencement dun site se fait directement sur les moteurs de recherche. Remarque: Le rfrencement dun site est parfois payant. Il existe deux types de moteurs de recherche: les moteurs de recherche de type "Automatique": Ces moteurs de recherche reposent sur des programmes automatiques danalyse de contenu. Comment se faire rfrencer? Un lien de type "Rfrencer votre site" est trs souvent disponible sur ce type de moteur de recherche. Il suffit alors de spcifier ladresse du site et lemail du Webmaster. Le site sera alors automatiquement analys (analyse base sur les mots-cls et le contenu de votre site) et rfrenc. les moteurs de recherche de type "Annuaire": Ces moteurs de recherche rfrencent des sites au pralable tests par des personnes physiques. Comment se faire rfrencer? Un lien de type "Rfrencer votre site" est trs souvent disponible sur ce type de moteur de recherche. La procdure de rfrencement est gnralement la suivante: 1. Choix dune catgorie dappartenance du site (loisirs, culture, ...). 2. Rpondre un questionnaire sur le site rfrencer: adresse Internet du site, email du WebMaster, description du site, ... 3. Aprs lenvoi du questionnaire, votre site sera valu par une personne de la socit de gestion de lannuaire. Cette personne rfrencera votre site si son contenu lui semble intressant.

Partie 2 : Dveloppement dun site

79

80

Partie 2 : Dveloppement dun site

Partie 3 Environnement de dveloppement

82

Partie 3 : Environnement de dveloppement

Les diteurs de WebDev


Pour manipuler un projet, WebDev propose de nombreux diteurs intgrs: diteur de projet. diteur danalyses. diteur de modles UML. diteur de requtes. diteur de pages. diteur dtats. ... Ces diteurs permettent de manipuler facilement les diffrents lments du projet.

Partie 3 : Environnement de dveloppement

83

Des diteurs conviviaux en pratique


1 Introduction
WebDev est architectur autour dditeurs, adapts chacun des besoins du dveloppeur, unifis dans un environnement unique: diteur de projets. diteur danalyses. diteur de modles UML. diteur de requtes. diteur de pages diteur dtats. diteur de code source, dbogueur et compilateur. diteur de modlisation. diteur de documents. Ces diffrents diteurs vont permettre de crer les diffrents lments (pages, tats, base de donnes, programmes,) manipuls par le site.

2 Les diffrents diteurs


2.1Lditeur de projets
Lditeur de projets a deux fonctionnalits principales: il permet de visualiser rapidement lensemble des lments dun projet (principalement pages, tats et requtes). il permet de visualiser et de crer les enchanements entre les pages et les tats. Voici quelques caractristiques de lditeur de projets: Editeur WYSIWYG ("What You See Is What You Get"). Vous visualisez directement tous les lments de votre projet. Gestion du projet laide dun tableau de bord complet. Cration et visualisation des enchanements entre plusieurs lments (pages, tats,...) de votre projet laide du graphe du projet. Interaction des diffrents volets avec les diffrents lments du projet. description du Modle Conceptuel des Donnes (MCD) puis gnration automatiquement de lanalyse. Voici quelques caractristiques de lditeur danalyses: Editeur WYSIWYG ("What You See Is What You Get"). Vous visualisez directement tous les fichiers et les liaisons de votre projet. Cration et description des fichiers et de leurs rubriques. Utilisation dune analyse au format WinDev 5.5. Mise en forme automatique des liaisons de lanalyse. Informations sur les liaisons par des bulles daide. Rcupration simplifie de la description dune base de donnes externe (SQL Server, Oracle, AS/400,...). Description indpendante des fichiers de donnes. Cryptage des fichiers de donnes. Modification automatique des fichiers de donnes en cas de modification de la structure des fichiers. Vrification de lintgrit rfrentielle. Gnration automatique de lanalyse. Zoom sur lditeur danalyses. Interaction des diffrents volets avec les diffrents lments de lanalyse.

2.2Editeur danalyses
Lditeur danalyses permet de dcrire les caractristiques et la structure des fichiers de donnes. Lditeur danalyses supporte la mthode Merise (MCD et MLD). Lditeur danalyses permet principalement deux types de descriptions dune base de donnes: description directe de lanalyse lie au projet (appele aussi Modle Logique des Donnes (MLD) 84 Partie 3 : Environnement de dveloppement

2.3Editeur UML
Le langage UML est un langage graphique permettant de: reprsenter le systme dinformation tudi sous forme dobjets. gnrer la structure objet du site (squelette de lapplication sous forme de classes objet) correspondant au systme dinformation tudi. Lditeur dUML permet principalement: de dcrire directement un ou plusieurs diagrammes UML. de construire un modle UML par rtro-analyse de votre projet. Pour plus de dtails sur la cration dun modle UML, consultez le chapitre "Le modle UML", page 120. Voici quelques caractristiques de lditeur dUML: Cration et description de diagrammes UML. Mise en forme automatique des liaisons. Gnration automatique dune classe ou dun ensemble de classes partir dun diagramme de classes. Zoom sur lditeur dUML. Insertion de commentaires dans un modle UML. Interaction des diffrents volets avec les diffrents lments du modle UML.

requte. Possibilit de tester immdiatement les requtes. Zoom sur lditeur de requtes.

2.5Editeurs de pages
Lditeur de pages permet de dcrire les caractristiques de linterface utilisateur de votre projet. De nombreux modles, ambiances et types de pages sont proposs. Ils permettent damliorer lergonomie de vos pages et de rendre vos sites conviviaux. Voici quelques caractristiques de lditeur de pages: Editeur WYSIWYG ("What You See Is What You Get"). Vous visualisez directement votre page telle quelle apparatra lutilisateur. Cration et description des pages et de leurs champs. "Drag and Drop" permettant de copier, de coller ou de dplacer des champs dune page une autre. Modles de pages et styles de champ pr-dfinis. Prsence de plusieurs catalogues dicnes permettant dassocier des images aux champs. Correcteur dinterface en temps rel permettant de simplifier le positionnement des champs. Saisie des libells des champs directement dans la zone de travail de lditeur. Gestion de laide contextuelle dans les pages. Zoom sur lditeur de pages. Interaction des diffrents volets avec les diffrents lments de lditeur.

2.4Editeur de requtes
Lditeur de requtes permet de crer automatiquement des requtes sur les fichiers de donnes. La programmation est ainsi simplifie : pages, tables, combos, tats,... pourront sappuyer sur les requtes. Un assistant permet de crer une requte: il suffit de choisir les rubriques intgrer et de saisir les conditions de slection laide de lassistant. La requte est automatiquement gnre (en code SQL optimis) et peut tre teste immdiatement. Vous trouverez toutes les informations concernant les requtes dans le "Guide de lditeur dtats et de requtes". Voici quelques caractristiques de lditeur de requtes: Editeur WYSIWYG ("What You See Is What You Get"). Vous visualisez directement la requte et son rsultat. Cration simplifie dune requte laide dun assistant. Gnration automatique du code SQL de chaque

2.6Editeur dtats
Lditeur dtats permet de crer trs simplement des tats imprimer. Vous trouverez toutes les informations concernant la cration dtats imprims dans le "Guide de lditeur dtats et de requtes". Voici quelques caractristiques de lditeur dtats: Editeur WYSIWYG ("What You See Is What You Get"). Vous visualisez directement les tats tels quils seront limpression. Cration simplifie dun tat sans une seule ligne de code. "Drag and Drop" permettant de copier, de coller ou de dplacer des champs dun tat un autre. Gabarits dtats et styles de champs pr-dfinis. Correcteur dinterface en temps rel permettant de simplifier le positionnement des champs. Partie 3 : Environnement de dveloppement 85

Utilisation dun formulaire en fond dun tat. Cration dtiquettes multi-colonnes. Edition dun tat au format HTML (pour le publier sur Internet par exemple), ou au format RTF (pour lditer avec un traitement de texte par exemple). Zoom sur lditeur dtats.

2.7Editeur de code
Lditeur de code permet de saisir tous les traitements en WLangage (le langage de programmation intgr WebDev). Il permet par exemple de saisir le code source: des champs, des pages, des tats des procdures locales et globales, des classes et des mthodes,...

Voici quelques caractristiques de lditeur de code: Mise en forme automatique des informations saisies. Compltion automatique. Glossaire sur les fonctions. Dtection immdiate des erreurs de frappe et aide la correction. Compilation incrmentale. Visualisation des diffrents traitements dune fentre, dun champ ou dun tat du projet. Insertion de traitements spcifiques lutilisation de la souris ou du clavier. Gestion de lhistorique des modifications du code avec possibilit de revenir en arrire. Ouverture de plusieurs fentres de code (pour effectuer des comparaisons de code par exemple). Zoom sur lditeur de code. Interaction des diffrents volets avec les diffrents lments de lditeur. Pour plus de dtails sur lditeur de code, nous vous recommandons de lire le manuel "WLangage".

86

Partie 3 : Environnement de dveloppement

Tableau de bord du projet


Le tableau de bord du projet est un lment indispensable la gestion de projets WebDev. Le tableau de bord permet davoir une vision globale et synthtique de ltat davancement dun projet. Le tableau de bord propose deux modes de visualisation du projet: Le mode Dveloppeur, Le mode Chef de projet. Le tableau de bord du projet en mode Dveloppeur est compos: de voyants: Si les voyants sont verts, tout va bien. Les voyants rouges signalent un problme potentiel. de listes dlments, permettant un accs rapide aux principales options du projet. de compteurs, permettant de grer les nouveauts, les demandes, ...

Le tableau de bord en mode Chef de Projet permet dobtenir des informations graphiques sur ltat davancement du projet et la qualit du projet. Ce mode est recommand lors de lutilisation du Centre de Suivi de Projets avec une gestion des exigences.

Partie 3 : Environnement de dveloppement

87

WebDev, WinDev, WinDev Mobile: 100% compatibles


Les projets crs actuellement sont souvent multi-cibles. Par exemple, pour un ERP destin fonctionner sous Windows, il est fort probable quen plus de lapplication qui sera le socle de la solution applicative, des commerciaux seront quips de PDA ou de Smartphones, les magasiniers utiliseront des terminaux mobiles pour la gestion des stocks et quun site Intranet et un site Internet seront mis en place. Tous les lments, hormis lIHM (pages et fentres) sont 100% compatibles et partageables entre des projets WinDev, WebDev et WinDev Mobile. Il est ainsi possible de partager des collections de procdures ou des classes par exemple entre plusieurs projets. Quel que soit le produit avec lequel un projet a t cr, il est possible de louvrir avec les autres produits. Lorsque vous ouvrez un projet dans un produit diffrent de celui qui a permis de le crer, un assistant saffiche, permettant de crer une configuration de projet spcifique au produit utilis. Par exemple, si un projet WinDev est ouvert avec WebDev, vous pouvez crer une configuration de projet nomme "Site", permettant de regrouper tous les lments ncessaires au site WebDev. Dans les phases dutilisation de lenvironnement, il est possible de visualiser depuis chaque environnement les lments de chaque cible. Un projet sous WebDev affiche les vignettes des fentres WinDev et WinDev Mobile par exemple. Cliquer sur une fentre WinDev depuis lditeur de projet WebDev ouvre la fentre WinDev (WinDev doit tre install sur le poste).

88

Partie 3 : Environnement de dveloppement

Configuration de projet
Les configurations de projet permettent de crer partir dun mme projet plusieurs "cibles" diffrentes. Vous pouvez ainsi crer partir dun mme projet par exemple: des sites qui ne contiennent pas les mmes lments, qui ont des noms diffrents, diffrents composants, un Webservice. A tout moment, vous pouvez travailler sur une configuration spcifique: les lments nappartenant pas cette configuration apparaissent griss sous lditeur de projet.

Il est possible de gnrer en une seule opration toutes les configurations dun projet (ou uniquement certaines) grce la gnration multiple.

Partie 3 : Environnement de dveloppement

89

Gnration multiple
Les configurations de projets permettent de dfinir simplement les diffrentes "Cibles" de votre projet. Vous pouvez ainsi dfinir pour un mme projet plusieurs sites, plusieurs bibliothques ou plusieurs composants. Pour gnrer le rsultat de chaque configuration, vous pouvez bien entendu slectionner une une chaque configuration, et gnrer llment correspondant. Un autre moyen plus rapide existe: la gnration multiple. Vous slectionnez en une seule opration les configurations gnrer et le rsultat est immdiat.

Pour lancer une gnration multiple, utilisez le menu "Atelier .. Gnration multiple".

90

Partie 3 : Environnement de dveloppement

Gestionnaire de sources (GDS)


Prsentation
Pour simplifier vos dveloppements en quipe, WinDev propose un gestionnaire de sources. Ce gestionnaire de sources permet plusieurs dveloppeurs de travailler simultanment sur le mme projet, et de partager aisment des lments entre diffrents projets.

Il est possible de partager les lments prsents dans le GDS: via un rseau. via Internet. en mode dconnect. Dans ce cas, les lments sur lesquels un travail spcifique devra tre effectu seront extraits du GDS par exemple lors de la connexion du portable au systme gnral.

Partie 3 : Environnement de dveloppement

91

Fonctionnement du Gestionnaire de Sources


Voici un exemple dutilisation du Gestionnaire de Sources:

Si un lment (page, tat, ...) du projet est extrait, ce mme lment ne pourra pas tre extrait une seconde fois. Aprs modification des lments extraits, il est ncessaire de rintgrer ces lments pour que le projet de base prenne en compte ces modifications. En effet, la base de sources conserve un historique de tous les lments du projet depuis leur cration. A chaque rintgration dun lment, le numro de version du projet de base est incrment de 1.
92 Partie 3 : Environnement de dveloppement

Partager un projet en pratique


Un dveloppement informatique important ncessite la participation de plusieurs dveloppeurs. Ces dveloppeurs doivent travailler sur un projet WebDev unique, en partageant les diffrentes ressources (requtes, classes, ...) manipules. Pour partager un projet, vous pouvez utiliser: le gestionnaire de sources. le groupware dveloppeur. Son utilisation est conserve pour compatibilit avec les versions prcdentes. Il ne sera pas dvelopp dans ce chapitre. Pour plus de dtails, consultez laide en ligne (mot-cl: "Groupware dveloppeur").

3 Le Gestionnaire de Sources
3.1Prsentation
WebDev innove dans la gestion du travail en groupe avec le gestionnaire de sources (appel galement GDS). Totalement intgr lenvironnement, le gestionnaire de sources (GDS) permet: un dveloppement performant en quipe, lhistorique des modifications et des versions, lautomatisation de la sauvegarde des sources des membres de lquipe dveloppement. Dimensionn pour des quipes de 1 100 dveloppeurs, le GDS favorise et normalise sans contrainte les changes entre dveloppeurs (mme en dveloppant seul, le GDS est utile car il contient lhistorique de vos applications). Le GDS utilise une base de sources: procdures, classes, pages, tats, composants, analyses, ... Cette base peut tre installe votre choix sur un serveur (en mode HyperFileSQL Classic ou HyperFileSQL Client/Serveur) ou sur un poste du rseau dans un rpertoire partag. Le GDS permet un fonctionnement connect en local et distance, via Internet ou une liaison HTTP ou HTTPS. Il est ainsi possible de travailler sur un projet depuis une agence ou depuis un site client sans crainte de perte des modifications effectues. Le GDS permet galement un fonctionnement dconnect (train, avion, ...).

3.2Principe dutilisation
Installation

Tous les lments du projet sont enregistrs dans la base de sources (sur le serveur). Cette opration est effectue la cration du projet ou lors de limportation dun projet existant dans le gestionnaire de sources. Chaque dveloppeur utilisant le gestionnaire de sources rcupre une copie du projet en local. Utilisation Pour travailler sur un lment du projet (page, tat,), le dveloppeur doit extraire llment de la base de sources, le modifier, puis le r-intgrer. Si llment est dj extrait, le dveloppeur peut demander la personne ayant extrait de r-intgrer llment (par lintermdiaire de la messagerie intgre). Pour profiter des modifications effectues, les autres dveloppeurs doivent synchroniser leur projet local avec le projet de rfrence (prsent dans la base de sources). Partie 3 : Environnement de dveloppement 93

Conseils Les sources de vos applications sont primordiales. Ces sources doivent tre traites avec lattention quelles mritent ! Voici donc une srie de conseils qui sappliquent au serveur qui hbergera vos sources: Utilisez un serveur ddi avec un disque de taille confortable (au moins 200 Go) Utilisez plutt le Gestionnaire de Sources (GDS) en mode Client/Serveur. Les disques durs peuvent avoir des problmes physiques: utilisez si possible un systme RAID I sur votre serveur (plusieurs disques stockant les mmes informations en double) Protgez lalimentation de votre serveur par un onduleur. Faites des sauvegardes rgulires de la base de sources (1 sauvegarde par semaine au minimum) Placez le serveur dans une zone "scurise", en utilisant un firewall.

4 Crer une base de sources pour le GDS


4.1Prsentation
Pour partager un projet grce au gestionnaire de sources, il est ncessaire de crer une base de sources. Cette base de sources doit tre cre une seule fois sur un poste serveur. Le systme dexploitation et le systme de fichiers sur lequel est installe la base du GDS doivent savoir grer les fichiers de plus de 4 Go. Il est possible de crer la base de sources: dans un rpertoire partag sur le rseau : tous les utilisateurs du GDS doivent avoir tous les droits sur ce rpertoire. La base de sources sera au format HyperFileSQL Classic. Il suffit de prciser le rpertoire rseau ou la base de sources doit tre cre. sur un serveur HyperFileSQL Client/Serveur: la base de sources sera au format HyperFileSQL Client/Serveur. Dans ce cas, il est ncessaire de prciser: le serveur la base le port utilis le nom et le mot de passe dun administrateur de la base HyperFileSQL.

4.2Quand crer une base de sources?


La base de sources doit tre cre une seule fois. WebDev permet de crer cette base de sources diffrents moments: lors de linstallation de WebDev. lors de la cration dun projet utilisant le GDS. lors de limportation dun projet dans le gestionnaire de sources. directement dans ladministrateur du GDS. Lorsque la base de sources est cre, il est possible dimporter dans cette base de sources tous les projets WebDev partager.

4.3Sauvegardes
Il est conseill de faire rgulirement des sauvegardes de la base de sources du GDS. Ces sauvegardes peuvent tre effectues grce ladministrateur du GDS.

94

Partie 3 : Environnement de dveloppement

5 Configurer le projet pour travailler avec le GDS


Pour utiliser un projet existant avec le gestionnaire de sources, quelques manipulations sont ncessaires. FileSQL Client/Serveur. La base de sources sera au format HyperFileSQL Client/Serveur. Dans ce cas, il est ncessaire de prciser: le serveur la base le port utilis le nom et le mot de passe dun administrateur de la base HyperFileSQL. 4.Cliquez ensuite sur le bouton "Crer".

5.1Ajouter un projet dans le GDS


Pour ajouter un projet local dans le GDS: 1.Ouvrez votre projet sous WebDev. 2.Sous lditeur de projet, slectionnez loption "GDS .. Ajouter le projet complet". 3.Dans lassistant qui saffiche, slectionnez la base de sources utiliser. Remarque: Si vous navez pas encore cr de base de sources, cliquez sur le bouton "Installer une base". Indiquez si vous voulez utiliser: une base de sources situe sur un partage rseau (base de sources au format HyperFileSQL Classic). Donnez le rpertoire de la base de sources (poste du rseau ou rpertoire partag). une base de sources situe sur un serveur Hyper-

5.2Partage de ressources
Vous avez import dans le gestionnaire de sources un premier projet. Ce projet contient des lments partags avec dautres projets (classes, pages, procdures, feuilles de styles, ...). Le partage est une notion importante du GDS. Diffrentes mthodes sont disponibles pour effectuer le partage. Pour plus de dtails, consultez laide en ligne.

6 Travailler avec le GDS


6.1Options dun projet concernant le GDS
Plusieurs options permettent de configurer un projet manipul avec le Gestionnaire de Sources. Ces options sont regroupes dans longlet "GDS" de la description du projet (option "Projet .. Description du projet"). Ces options sont coches par dfaut. Proposer la rcupration de la dernire version des lments louverture du projet: Cette option permet lors de louverture dun projet prsent dans le GDS, de proposer la rcupration de la dernire version des diffrents lments du projet. Par dfaut, la dernire version des lments est automatiquement rcupre. Proposer la rintgration des lments la fermeture du projet: Cette option permet dafficher lors de la fermeture du projet la liste de tous les lments actuellement extraits, afin de r-intgrer certains ou tous ces lments. Par dfaut, la fermeture du projet, les lments extraits ne sont pas r-intgrs. Proposer la rintgration et la rcupration de la dernire version des lments lors de la gnration dexcutables, de bibliothques, de composants, Cette option permet dafficher lors de la cration dune bibliothque, la liste des lments extraits, afin de r-intgrer et de rcuprer la dernire version des lments. Le composant ou la bibliothque peut ainsi contenir les derniers lments les plus jour. Par dfaut, la gnration de la bibliothque, se fait avec les lments du projet actuellement prsents sur le poste local. Extraire / Rintgrer automatiquement le projet: Cette option permet une gestion automatique du "fichier projet". Si cette option est coche, le fichier projet est extrait uniquement si laction ralise le ncessite. Lorsque laction sur le projet a t effectue, le fichier projet est automatiquement rintgr. Cette option permet de ne plus avoir la gestion "Matre / Invit" sur le projet. Il est galement possible dactiver cette option par loption de menu "GDS .. Grer le projet .. Grer automatiquement lextraction du projet". Partie 3 : Environnement de dveloppement 95

6.2Extraire un lment
Les diffrents modes dextraction Le GDS propose deux modes dextraction des lments du projet: le mode classique: si vous affichez un lment du GDS non extrait, un panneau indique que cet lment doit tre extrait pour tre modifi. Vous pouvez extraire immdiatement llment (bouton dextraction prsent dans le panneau). le mode automatique: si vous tentez de modifier un lment du GDS non extrait, le GDS propose automatiquement dextraire cet lment. Aprs la validation de lextraction, llment peut tre modifi. Remarque: ce mode est dconseill lors dune utilisation du GDS avec une connexion Internet lente. Pour changer le mode dextraction, slectionnez loption "Outils .. Options .. Options gnrales de WebDev", puis slectionnez longlet "Gnral". Loption "Extraction des lments la premire modification" permet de passer tous les projets ouverts depuis le logiciel en cours en mode automatique. Ouvrir un lment du projet pour modifier ses caractristiques Pour modifier les caractristiques dun lment dun projet gr par le GDS: 1.Extrayez llment du Gestionnaire de sources. 2.Slectionnez le mode dextraction de llment. Le mode dextraction peut tre: exclusif : personne ne pourra extraire cet lment jusqu sa rintgration. Llment pourra uniquement tre extrait pour test. pour test: llment pourra tre modifi mais les modifications ne pourront pas tre rintgres. multiple: llment pourra galement tre extrait par dautres utilisateurs. Dans ce cas, lors de la rintgration, il sera possible de visualiser les diffrences entre les diffrentes versions de llment. 3.Validez. Llment est ouvert. La barre de titre indique que llment est extrait.

Lors de la rintgration dun lment, un cran saffiche permettant deffectuer les actions suivantes avant de rintgrer llment: connatre les modifications effectues comparer llment de la base de sources avec llment local (extrait) accder lhistorique de llment dans la base de sources. Il est possible de r-intgrer les modifications effectues dans llment, tout en conservant llment extrait (option "Garder le fichier extrait").

6.4Modes de gestion du projet


Deux modes de gestion du projet sont disponibles avec le GDS: Gestion du projet en mode Matre / Invit Gestion du projet en mode automatique Matre et invit Le Gestionnaire de sources considre 2 types dutilisateurs: le matre: le matre est lutilisateur qui a plac le projet dans le gestionnaire de sources. les invits: les invits sont les dveloppeurs qui manipulent le projet depuis le gestionnaire de sources. Il nest pas obligatoire dtre connect en mode matre sur un projet. Le mode "Matre" est ncessaire uniquement pour: modifier les caractristiques du projet et rintgrer ces modifications dans la base de sources. rintgrer tous les lments pour faire lexcutable et le programme dinstallation de lapplication. Pour passer du mode matre au mode invit, slectionnez loption "GDS .. Gestion du projet .. Devenir invit sur le projet (et tout rintgrer)". Dans ce cas, le gestionnaire de sources propose la rintgration de tous les lments du projet (y compris le fichier .WWP). Pour passer du mode invit au mode matre, slectionnez loption "GDS .. Gestionnaire du projet .. Devenir matre sur le projet". Attention: Modification des options du projet: Tous les utilisateurs du projet (quils soient matres ou invits) peuvent modifier les caractristiques du projet (premire page du projet, animation, charte de programmation, ...). Ces modifications pourront tre rintgres dans le gestionnaire de sources uniquement par le matre du projet.

6.3Rintgrer un lment
Les lments extraits du Gestionnaire de sources apparaissent entours dun trait rouge sous lditeur de projet. Pour rintgrer un lment, il suffit de slectionner loption "Rintgrer" dans le menu contextuel de llment (dans le graphe du projet ou dans le volet "Explorateur de projet"). 96 Partie 3 : Environnement de dveloppement

Les modifications faites par un invit seront perdues lors de la mise jour du projet depuis la base de donnes. Mode automatique Avec le mode automatique, le fichier projet est extrait uniquement si laction ralise le ncessite

(quel que soit lutilisateur). Lorsque laction sur le projet a t effectue, le fichier projet est automatiquement rintgr. Le mode automatique permet de ne plus avoir la gestion "Matre/Invit" sur le projet.

7 Travailler en mode dconnect avec le GDS


Le Gestionnaire de Sources permet trs simplement de travailler en mode dconnect ou nomade. Ce mode permet par exemple un dveloppeur utilisant un portable de continuer travailler sur un projet prsent dans la base de sources tout en tant dconnect de la base de source. Le principe est simple: avant la dconnexion, il suffit dutiliser loption "GDS .. Travail distance .. Se dconnecter pour une utilisation nomade". Il est conseill dextraire avant la dconnexion les diffrents lments qui vont tre modifis (ainsi, ces lments seront "dj extraits" pour les autres utilisateurs). Vous pourrez travailler en local sur votre projet. Les diffrents lments du projet sont manipulables directement. la reconnexion, il suffit dutiliser loption "GDS .. Travail distance .. Se reconnecter et synchroniser". Il suffit alors de rintgrer les lments modifis. Pour plus de dtails, consultez laide en ligne.

8 Administrateur du GDS
Ladministrateur de GDS permet de manipuler directement les diffrents projets inclus dans le gestionnaire de sources. Il permet par exemple de : grer les bases de sources (cration, connexion une base de sources) grer les branches grer les fichiers et les rpertoires prsents dans un projet de la base de sources (Ajouter, supprimer, renommer, des fichiers et des rpertoires) grer les diffrents fichiers de la base de sources (extraction, rintgration, partage, ). lancer certains outils (options, maintenances, ). restaurer une version dun projet. voir les historiques et les diffrences de versions de sources. annuler les extractions (en mode administrateur) purger une base, la sauvegarder, la restaurer ajouter des fichiers de tout type dans la base (.doc, .xls, .pdf, ...)

Partie 3 : Environnement de dveloppement

97

Composant interne
Un composant interne est un regroupement dlments dun projet. Ce regroupement permet de: Organiser un projet: vous pouvez crer des composants internes pour regrouper les lments dun projet, par exemple par fonctionnalit. Partager des lments entre diffrents projets par lintermdiaire du GDS (Gestionnaire de Sources).

Les lments dun composant interne peuvent tre privs ou publics: Les lments privs pourront tre manipuls uniquement par les autres lments du composant. Les lments publics pourront tre manipuls par les lments du projet utilisant le composant interne.

98

Partie 3 : Environnement de dveloppement

Composant interne en pratique


1 Prsentation
Un composant interne est un regroupement dlments dun projet. Ce regroupement permet de: Organiser un projet: vous pouvez crer des composants internes pour regrouper les lments dun projet par exemple par fonctionnalit. Partager des lments entre diffrents projets: Les lments prsents dans un composant interne peuvent tre partags entre plusieurs projets par lintermdiaire du GDS. Pour plus de dtails, consultez "Partager des composants internes (via le GDS)", page 100. Un des avantages du composant interne par rapport au composant classique est de pouvoir dboguer directement le composant interne depuis le projet qui lutilise. Diffrence avec un composant classique: Un composant interne permet dintgrer la totalit des lments du composant dans linterface du projet contenant le composant interne. Il est possible de manipuler tous les lments "publiques" du composant interne directement sous lditeur. Lors de lutilisation dun composant classique, les lments "publics" du composant ne peuvent pas tre manipuls directement. Il est ncessaire pour modifier le composant classique douvrir le projet correspondant.

2 Crer un composant interne


2.1Les diffrentes tapes
Pour crer un composant interne: 1.Slectionnez loption "Atelier .. Composant Interne .. Crer un composant interne". Lassistant de cration dun composant interne se lance. 2.Indiquez les caractristiques du composant interne: son nom. Le nom du composant interne sera utilis pour le fichier WCI correspondant la description du composant interne. Ce nom sera galement utilis pour crer un sous-rpertoire dans votre projet contenant tous les lments du composant interne. son libell. sa description. 3.Indiquez les lments intgrer dans le composant interne. Un composant interne peut contenir tous les types dlments prsents dans un projet: pages, tats, modles, ... Remarque: Si les lments intgrs dans le composant interne contiennent des liens vers les lments prsents par exemple dans le projet ou dans un autre composant interne, une erreur de compilation apparat indiquant quil nest pas possible daccder un lment du projet depuis un composant interne. 4.Indiquez les lments du composant interne qui seront directement accessibles dans le code et dans les actions prdfinies du projet accueillant le composant interne. Remarque : Les lments du composant interne accessibles (ou "public") seront automatiquement proposs par la compltion. Ils pourront tre utiliss par les lments prsents dans le projet ou depuis un autre composant interne. Les lments non accessibles (ou "privs") pourront tre manipuls uniquement par un autre lment du composant interne (la compltion proposera ces lments "privs" uniquement depuis les lments dun composant interne). 5.Indiquez le mode de gestion des donnes et des contextes dexcution. Trois modes de gestion des donnes et des contextes dexcution sont disponibles: Partage complet: Le composant interne accde aux fichiers de donnes du projet. Le composant interne utilise galement les mmes contextes dexcution que le projet. Ce mode correspond au mode par dfaut si le composant interne nutilise pas danalyse. Partage de donnes uniquement (mode avanc): Le composant interne accde aux fichiers de donnes du projet. Le composant interne utilise des contextes dexcution distincts de ceux du projet. Ce mode est utiliser dans des cas trs spciPartie 3 : Environnement de dveloppement 99

fiques. Autonomie totale: Le composant interne accde ses propres fichiers de donnes. Le composant interne utilise des contextes dexcution distincts de ceux du projet. Ce mode correspond au mode par dfaut si le composant utilise une analyse. Dans ce cas, il est ncessaire dindiquer lanalyse utilise par le composant interne. Il est galement possible de crer directement une nouvelle analyse. Cette analyse sera associe au composant interne. 6.Validez la cration du composant interne. A tout moment, il sera possible de: Modifier les caractristiques du composant interne grce la fentre de description du composant interne. Manipuler le composant interne et ses lments. Astuce: Un composant interne na pas de code de dclaration des globales. Il suffit dutiliser une collection de procdures pour effectuer linitialisation du composant interne.

2.2Composant interne et analyse: cas de lautonomie totale


Un composant interne peut tre li sa propre analyse. Dans ce cas, le projet accueillant le composant interne peut avoir plusieurs analyses: lanalyse du projet lanalyse du ou des composants internes. Cette analyse est dfinie lors de la cration du composant interne. Elle peut tre galement slectionne depuis la fentre de description du composant interne. Les lments gnrs par le RAD pour le composant interne seront gnrs dans le rpertoire du composant interne. Bien entendu, si lanalyse du composant interne est modifie, une nouvelle gnration par le RAD proposera automatiquement de gnrer uniquement les lments correspondants aux modifications.

3 Partager des composants internes (via le GDS)


Les composants internes peuvent tre partags entre projets grce au GDS. Pour partager un composant interne via le GDS, il est ncessaire que le projet contenant le composant interne soit dans le GDS. Il est possible: soit de crer le composant interne partir dun projet prsent dans le GDS. Le composant interne sera automatiquement prsent dans le GDS. soit dimporter dans le GDS un projet contenant un ou plusieurs composants internes. Les composants internes seront alors automatiquement intgrs dans le GDS.

100

Partie 3 : Environnement de dveloppement

Composant externe
Un composant externe est un ensemble dlments WebDev: pages, tats, analyse, ... Cet ensemble dlments effectue une fonctionnalit prcise. Par exemple, un composant externe peut correspondre une des fonctionnalits suivantes: Envoi de Fax, Envoi de-mails, ... Un composant externe WebDev peut tre redistribu dautres dveloppeurs WebDev (gratuitement ou non). Ces dveloppeurs pourront ainsi intgrer simplement la fonctionnalit propose par le composant externe dans leur site sans pour autant avoir accs au code source correspondant (sil na pas t lui aussi distribu). Le composant externe sera ensuite intgr au site et distribu avec lui.

Partie 3 : Environnement de dveloppement

101

Composant externe en pratique


1 Prsentation
1.1Dfinition
Un composant externe est un ensemble dlments WebDev: pages, tats, analyse,... Cet ensemble dlments effectue une fonctionnalit prcise. Par exemple, un composant peut correspondre une des fonctionnalits suivantes: Envoi de Fax Envoi demails, ... Remarques: Pour optimiser lorganisation de vos projets, il est possible dutiliser des composants internes. Pour plus de dtails, consultez "Composant interne", page 98. Dans la suite de ce chapitre, le terme "composant" signifie "composant externe". Un composant externe peut tre redistribu dautres dveloppeurs WebDev (gratuitement ou non). Ces dveloppeurs pourront ainsi intgrer simplement la fonctionnalit propose par le composant dans leur site. Le composant sera donc intgr lapplication ou au site, et distribu avec le site. Lors de la cration du composant, lauteur spcifie: la provenance des lments du composant. Le dveloppeur peut construire un composant partir dun projet WinDev li un projet WebDev et / ou un projet WinDev Mobile. les lments du composant visibles ou non par lutilisateur du composant. Les lments visibles seront accessibles dans le graphe du projet ou par programmation. le mode dutilisation du composant (comment utiliser le composant, les paramtres permettant daccder aux fonctionnalits du composant, ...). Une documentation succincte ( complter) est automatiquement gnre et associe au composant. Remarques : Des exemples de composants sont livrs en standard avec WebDev. Ces composants sont accessibles depuis le volet "Assistants, Exemples et Composants" (option "Composants"). 102 Partie 3 : Environnement de dveloppement

1.2De quoi est constitu un composant externe?


Un composant externe est dfini et gnr partir dun projet WebDev existant. Il peut tre ensuite intgr dans dautres projets WebDev. Tous les lments du composant sont totalement indpendants du projet dans lequel le composant est intgr. Le composant peut avoir sa propre analyse, ses pages, ses tats, ses fichiers de donnes,... Lors de la cration de la gnration du composant, il suffit dindiquer si ces lments pourront tre manipuls ou non dans le projet WebDev intgrant ce composant. Le composant est constitu de trois fichiers:
<NomComposant>. Fichier composant. Contient tous WDK les lments du composant. Ce fichier est ncessaire lintgration du composant dans un projet. Ce fichier doit galement tre livr dans la procdure dinstallation du site utilisant le composant. <NomComposant>. Description du composant WDI (uniquement pour le dveloppement de sites). Ce fichier est ncessaire lintgration du composant dans un projet. Ce fichier ne doit pas tre livr dans la procdure dinstallation du site utilisant le composant. <Nom du Fichier optionnel composant>.WDO Fichier au format texte contenant (fichier optionnel) la liste des diffrents lments livrs en plus avec le composant (fichiers de donnes, fichiers .INI, ...). Consultez "Le fichier WDO", page 107.

1.3Que contient un composant externe?


Un composant externe contient: les diffrents lments redistribuer (pages, tats,...). Ces lments peuvent tre accessibles ou non lors de limportation du composant dans un projet WebDev. une brve description du composant. une aide permettant de r-utiliser ce composant.

Cette aide est gnre partir des commentaires de code. Remarque : Par dfaut, si un composant utilise une analyse, des fichiers, ... les fonctions HyperFi-

leSQL manipuleront ces lments dans un contexte indpendant. Ces paramtres peuvent tre modifis dans les options avances du composant. Pour plus de dtails, consultez laide en ligne.

2 Crer et gnrer un composant externe


La cration dun composant externe doit tre effectue partir dun projet contenant tous les lments ncessaires au fonctionnement du composant. Il est donc conseill dutiliser un projet spcifique pour crer chaque composant. La cration dun composant se fait en plusieurs tapes: 1.Dveloppement des lments du composant. 2.Cration du composant 3.Dfinition des options avances du composant. 4.Gnration du composant. Le composant peut alors tre distribu et r-utilis.

3 Distribuer un composant externe


3.1Prsentation
Lorsque le composant a t cr, test et gnr, il peut tre mis disposition des dveloppeurs. Plusieurs mthodes sont possibles: utilisation directe du composant Exemple: le composant est directement utilis sur le poste du dveloppeur qui a cr le composant. distribution simple, en fournissant directement les fichiers ncessaires. Exemple: le composant est destin tre utilis lintrieur dune mme socit, par plusieurs dveloppeurs. Dans ce cas, les fichiers ncessaires peuvent tre copis sur un disque rseau. procdure dinstallation du composant (avec une procdure dinstallation du composant identique celle utilise pour les applications). Exemple: ce mode de distribution est conseill si le composant est destin tre vendu ou tre distribu grande chelle, avec des mises jour rgulires. WDO aprs la gnration du composant. Ce fichier contient la liste des fichiers externes (fichiers de donnes, fichiers texte,...) utiliss par le composant. Ces fichiers rfrencs dans le fichier <NomComposant>.WDO seront automatiquement recopis dans le rpertoire EXE du projet utilisant le composant WebDev.

3.3Distribution simple dun composant externe


La distribution simple dun composant consiste fournir uniquement les fichiers ncessaires au fonctionnement du composant par simple copie. Les fichiers sont copis dans un rpertoire spcifique. Ce rpertoire peut par exemple tre prsent sur un serveur rseau. Lors de limportation du composant dans un projet WebDev, il suffit de slectionner le fichier WDI correspondant au composant dans le rpertoire de distribution. Pour distribuer un composant, il est ncessaire de fournir: Les fichiers automatiquement gnrs par WebDev (fichier <NomComposant>.WDK et fichier <NomComposant>.WDI). Si ncessaire, les fichiers spcifiques manipuls par le composant (fichiers de donnes, fichiers dinitialisation,...) ainsi que le fichier <NomComposant>.WDO. Le fichier texte <NomComposant>.WDO contient la liste des fichiers qui doivent tre fournis avec le composant. Pour plus de dtails sur ce fichier, Partie 3 : Environnement de dveloppement 103

3.2Utilisation directe du composant externe


Le composant est cr et utilis sur le mme poste. Lors de limportation du composant dans un projet WebDev, il suffit de slectionner le fichier WDI correspondant au composant. Ce fichier est disponible dans le rpertoire EXE du projet composant. Attention: Si le composant utilise des fichiers spcifiques (fichiers de donnes, fichiers texte, ...), il est ncessaire de crer un fichier <NomComposant>.

consultez le paragraphe "Le fichier WDO", page 107.

3.4Distribution grce une procdure dinstallation


La diffusion des composants laide dune procdure dinstallation consiste fournir aux utilisateurs du composant WebDev, un programme dinstallation. Ce programme installe tous les fichiers ncessaires lutilisation du composant dans le rpertoire spcifi par lutilisateur. Ce mode dinstallation permet de grer automatiquement: le fichier WDO et linstallation des fichiers spcifiques (fichiers de donnes, ...) utiliss par le composant. linstallation doutils spcifiques (MDAC, driver ODBC pour HyperFileSQL,...). la mise jour automatique des fichiers de donnes utiliss par le composant (si ncessaire). la dsinstallation du composant. Pour proposer une procdure dinstallation pour un composant: 1.Crez la procdure dinstallation du composant: soit directement par loption "Atelier .. Compo-

sant externe.. Crer la procdure dinstallation dun composant". soit depuis la liste des composants gnrs partir du projet (option "Atelier .. Composant Externe .. Liste des composants gnrs partir de ce projet", bouton "Installation"). 2.Dans les diffrents plans de lassistant, spcifiez: le support dinstallation du composant. les langues proposes dans la procdure dinstallation. le rpertoire dinstallation par dfaut du composant. les modules optionnels installer. Il est possible de modifier la liste des fichiers distribuer avec le composant. Le fichier WDO sera automatiquement cr partir de cette liste. ... Par dfaut, les fichiers ncessaires linstallation dun composant sont crs dans le sous-rpertoire INSTALL COMPO du projet. Rappel: Lors de la cration de linstallation dune application, les fichiers ncessaires sont crs dans le rpertoire INSTALL du projet.

4 Utiliser un composant externe dans un site


Un composant externe peut tre r-utilis tout moment dans nimporte quel site WebDev: il suffit de connatre le rpertoire des fichiers du composant. Lorsquune nouvelle version dun composant est disponible, il suffit dinstaller les nouveaux fichiers de cette mise jour dans le rpertoire dinstallation du composant (selon le mode dinstallation utilis). Pour plus de dtails sur les diffrents modes dinstallation dun composant, consultez "Distribuer un composant externe", page 103 Si le composant a t publi et import via le GDS, les mises jour sont proposes louverture du projet utilisant le composant. Si le composant a t distribu avec un site WebDev, il est ncessaire de mettre le composant jour. Pour plus de dtails, consultez le paragraphe "Dploiement dun site utilisant un composant externe".

5 Dploiement dun site utilisant un composant externe


5.1Prsentation
Le dploiement dun site utilisant un ou plusieurs composants se fait de la mme faon que le dploiement dun site classique (option "Atelier .. Crer la procdure dinstallation"). Lors du dploiement dun site utilisant un composant, les fichiers suivants sont automatiquement installs sur le poste serveur: <NomComposant>.WDK, les fichiers ncessaires au fonctionnement du composant et de lapplication.

104

Partie 3 : Environnement de dveloppement

5.2Mise jour des composants et des sites dploys


Lors de la mise jour dun composant et/ou dun site dploy, il est possible dinstaller sur le poste de dploiement du site: soit le site, le composant et les fichiers ncessaires leur fonctionnement. soit uniquement le site et les fichiers ncessaires au fonctionnement du site. soit uniquement le composant et les ventuels fichiers ncessaires son fonctionnement. Pour plus de dtails sur la gestion de la compatibilit entre le site et son composant, consultez laide en ligne. Pour mettre jour un composant en clientle, deux possibilits existent: 1.La recompilation du projet hte Recompilez le projet qui utilise le composant et redistribuez le site avec le composant. Dans ce cas,

aucun problme de version ou de compatibilit ne sera rencontr. La recompilation est ncessaire dans les cas suivants: De nouvelles fonctions ont t ajoutes dans le composant et doivent tre prises en compte. Les paramtres de certaines procdures ont t modifis. Incompatibilit de la nouvelle version avec les anciennes versions du composant. ... 2.Distribution directe du fichier .WDK Fournissez directement une mise jour du composant (fichier .WDK) en clientle sans recompilation du projet. Cette possibilit sapplique en gnral lorsque: La nouvelle version sert corriger un ou des dysfonctionnements dune version antrieure. De nouvelles fonctions ont t ajoutes dans le composant mais ne sont pas ncessaires au bon fonctionnement du site.

6 Modifier un composant externe


6.1Prsentation
A tout moment, un composant cr et gnr peut tre modifi. Cette modification peut correspondre: soit lajout dlments dans le composant. soit la suppression dlment du composant. soit la modification des droits sur les lments du composant. soit la modification dun des lments du composant. Dans tous les cas, aprs cette modification, le composant doit tre re-gnr pour prendre en compte les modifications effectues. des problmes dexcution si elles ne sont pas en phase avec ce composant. La gestion de la compatibilit est une tape importante dans la modification dun composant. Il existe 2 types de compatibilit: la compatibilit descendante : la version du composant utilise (fichier .WDK) pour compiler les sites utilisant ce composant doit tre toujours suprieure ou gale la version actuellement utilise en dploiement. Cette compatibilit est automatiquement gre. Si le composant install avec le site est dune version infrieure celle utilise par le site, le site refusera de fonctionner. la compatibilit ascendante: lutilisation dune nouvelle version dun composant avec les projets compils avec une ancienne version peut tre interdite. Il est donc ncessaire de recompiler les projets pour utiliser correctement la nouvelle version du composant.

6.2Les diffrents types de compatibilit


La gestion de la compatibilit est lie aux versions dun composant. En effet, si des modifications ont t apportes au composant, les sites qui utilisent le composant en dploiement peuvent rencontrer

Partie 3 : Environnement de dveloppement

105

7 Caractristiques avances dun composant externe


7.1Documentation automatique
Un composant doit absolument tre accompagn dune documentation pour permettre sa rutilisation. WebDev simplifie la ralisation de cette documentation en proposant: une prsentation gnrale du composant. Cette prsentation gnrale est saisie lors de la gnration du composant. Lors de lutilisation du composant dans un site WebDev, cette prsentation sera visible lors du survol du composant affich dans le volet "Assistants, Exemples et Composants". Pour plus de dtails, consultez laide en ligne. une gnration automatique de la documentation technique partir des commentaires insrs dans le code des lments du composant. Quels sont les commentaires de code pris en compte? Les commentaires pris en compte automatiquement pour la documentation du composant sont: Les commentaires placs en tte des procdures WLangage liss pour crer la documentation. si aucun commentaire nexiste, WebDev documentera automatiquement les lments accessibles du composant en prcisant les paramtres attendus en entre et en sortie de chaque lment. Les commentaires correspondants sont automatiquement crs dans les diffrents lments. Remarque: A chaque re-gnration du composant, il est possible de re-gnrer la documentation associe au composant (bouton "Regnrer" dans la fentre "Historique du composant"). Attention: Si vous utilisez le bouton "Regnrer", les modifications effectues sous lassistant de gnration seront supprimes. Comment disposer de la documentation dun composant? La prsentation gnrale du composant est automatiquement affiche lors du survol du composant prsent dans le volet "Assistants, Exemples et Composants". La documentation technique du composant est disponible: lors de lintgration dun composant dans un projet (option "Atelier .. Composant Externe .. Importer un composant dans le projet"). tout moment, lors dun double-clic sur licne du composant prsent dans le volet "Assistants, Exemples et Composants" ou par loption "Description" du menu contextuel du composant. tout moment, dans la description des composants intgrs dans le projet (option "Atelier .. Composant Externe .. Liste des composants intgrs dans le projet"). Le bouton "Description" permet dobtenir les informations et la documentation du composant. La documentation spcifique un lment du composant peut tre obtenue: soit en double-cliquant sur cet lment (volet "Explorateur de projet" ou graphe du projet) ou en appuyant sur la touche [F2] depuis le code de cet lment. soit directement dans la liste des composants intgrs au projet (option "Atelier .. Composant Externe .. Liste des composants intgrs dans le projet").

les commentaires placs en tte des traitements suivants: Code dinitialisation des pages Code dinitialisation des tats Code dinitialisation des classes Code dinitialisation des collections de procdures. A quel moment la documentation est-elle gnre? La documentation du composant est gnre lors de la premire gnration du composant (option "Atelier .. Composant Externe .. Gnrer un composant"). Lors de cette gnration de la documentation: les commentaires existants dans le code sont uti 106 Partie 3 : Environnement de dveloppement

7.2Visibilit dun lment dun composant


Lors de la cration dun composant, il est possible de dfinir les lments du composant qui seront accessibles ou non par lutilisateur du composant. Si llment est accessible, lutilisateur du composant verra cet lment dans la liste des lments du projet. Il pourra manipuler ces lments par programmation (comme sil sagissait dun lment cr dans le projet). Remarque: Le code de cet lment nest cependant pas visible. Si llment nest pas accessible, lutilisateur ne saura mme pas que cet lment existe. Attention : Selon le mode de dclaration des lments du projet (classe, Collection de procdures,...) les lments accessibles ou non peuvent varier. Le tableau ci-dessous rcapitule les diffrentes faons daccder un lment en fonction de son mode de dclaration.

7.4Quest-ce que le fichier WDO?


Le fichier <NomComposant>.WDO est un fichier au format TXT, pouvant tre cr et modifi tout moment. Ce fichier peut par exemple tre cr et modifi avec lditeur de texte standard de Windows, NotePad. Ce fichier contient la liste des fichiers externes (fichiers de donnes, fichiers texte,...) utiliss par le composant et devant tre livrs et installs avec le composant. Ces fichiers doivent tre recopis dans le rpertoire EXE des projets utilisant le composant. Ce fichier ".WDO" peut contenir: soit le nom complet du fichier. Par exemple: C:\Composants\ComposantSlecteur\EtatInitial.INI soit le nom du fichier. Ce fichier sera recherch dans le rpertoire en cours du composant. Par exemple: EtatInitial.INI soit un nom de fichier utilisant un chemin relatif. Les syntaxes possibles sont: Rpertoire\NomFichier.xxx pour indiquer un sous rpertoire du rpertoire en cours .\NomFichier.xx pour indiquer le rpertoire en cours ..\NomFichier.xx pour indiquer le rpertoire parent Par exemple: \ComposantSlecteur\EtatInitial.INI Ce fichier sera utilis lors de lintgration du composant dans le projet. Les chemins prciss dans le WDO doivent correspondre aux chemins o les fichiers sont installs sur le poste de dveloppement du composant. Lors de lintgration du composant, larborescence spcifie dans le WDO sera conserve et reproduite dans le rpertoire EXE du projet. Pour plus de dtails, consultez le paragraphe "Utiliser un composant externe dans un site", page 104. Exemple: Le composant "Code Postal" utilise un fichier de donnes "Cedex" (fichiers Cedex.fic et Cedex.ndx). Dans le projet de cration du composant, ce fichier de donnes est prsent dans le rpertoire EXE du projet. Pour que le composant soit livr et install avec le fichier de donnes, il faut crer le fichier WDO dans le rpertoire EXE du projet de cration du composant. Ce fichier doit contenir les lignes suivantes:
.\CEDEX.Fic .\CEDEX.NDX

7.3Le fichier WDO


Lors de la gnration du composant externe, deux fichiers sont automatiquement crs dans le rpertoire EXE du projet en cours: <NomCompo- Contient tous les lments redistribuer (pages, tats, ...) avec sant>.WDK le composant <NomCompo- Interface du composant. Ce fichier contient: sant>.WDI - une aide pour lutilisation du composant lors de sa rintgration - les lments lutilisation du composant dans le projet (information de compilation, ...) Lors de la diffusion du composant, ces deux fichiers doivent tre redistribus. Si le composant utilise des lments supplmentaires (fichiers de donnes,...), il est ncessaire dajouter dans le rpertoire EXE du projet: un fichier <NomComposant>.WDO: ce fichier contient la liste des fichiers externes (fichiers de donnes, fichiers texte,...) utiliss par le composant. Ces fichiers doivent tre livrs et installs avec le composant. les fichiers devant tre redistribus avec le composant. Ces fichiers peuvent tre placs selon une sous-arborescence spcifique. Dans ce cas, le code du composant doit grer laccs ces fichiers selon cette mme arborescence.

Partie 3 : Environnement de dveloppement

107

Diffusion dun composant avec WDO Pour diffuser un composant utilisant un fichier WDO: Si vous nutilisez pas de procdures dinstallation pour le composant, il est ncessaire de fournir: le fichier WDK le fichier WDI le fichier WDO tous les fichiers ncessaires rfrencs dans le fichier WDO.

Si vous utilisez une procdure dinstallation pour le composant, le fichier WDO sera automatiquement cr lors de la cration de la procdure dinstallation du composant. Il suffit pour cela dans lassistant de: 1. Demander la modification des fichiers installer (option "Modifier la liste des fichiers installer" dans les "modules additionnels"). 2. Slectionner les fichiers supplmentaires installer. Le fichier WDO sera automatiquement cr et install avec le composant.

108

Partie 3 : Environnement de dveloppement

Modes de gnration
Au del des sites web, WebDev vous permet galement de gnrer de nombreux autres types de projets.

Sites
Les sites sont le mode de gnration le plus frquemment utilis. WebDev permet de gnrer: des sites statiques, semi-dynamiques, dynamiques des sites PHP

Bibliothques
Une bibliothque est un fichier unique rassemblant plusieurs lments dun projet WebDev: des pages, des tats, etc. Il est possible de gnrer des bibliothques autonomes pouvant tre utilises par dautres sites.

Gadgets Windows Vista/Windows 7


Un gadget est une forme particulire de site web destin tre intgr comme une mini-application sur le bureau de Windows Vista ou Windows 7. WebDev fournit en standard les lments ncessaires pour crer en distribuer facilement de tels gadgets.

Composants externes
Les composants externes sont des briques applicatives permettant de partager une ou plusieurs fonctionnalits spcifiques entre diffrentes applications. Un composant gnr avec WinDev peut galement tre utilis dans un projet WebDev ou WinDev Mobile.

Webservices
A partir dun projet WebDev, il est possible de gnrer un Webservice (galement appel service Web XML). Un Webservice expose un ensemble de fonctions (gnralement une ou plusieurs collections de procdures). Il les rend accessibles travers le web (ou un rseau priv) en utilisant les protocoles standard de communication HTTP et SOAP. Remarque: Un Webservice doit tre dploy sur un Serveur dApplication WebDev pour tre utilisable.

Partie 3 : Environnement de dveloppement

109

Sites spcifiques iPhone


Les sites web destins tre vus sur le tlphone Apple iPhone peuvent bnficier denrichissements particuliers: splash screen au lancement, mode plein cran,... Ces fonctionnalits les font ressembler de vritables applications. WebDev permet de paramtrer aisment toutes ces spcificits tout en prservant la compatibilit avec les autres navigateurs (mobiles ou non) du march.

110

Partie 3 : Environnement de dveloppement

Gnration PHP en pratique


1 Prsentation
WebDev permet de gnrer des sites PHP sans pour autant connatre le langage PHP. Le dveloppement du site peut se faire compltement en WLangage, comme pour un site WebDev classique. Il est toutefois possible de saisir votre propre code PHP (code serveur). PHP sont disponibles sur internet. Il est ncessaire den tlcharger un et de linstaller. Vous avez par exemple EasyPHP (http://www.easyphp.org/). Ce moteur est donn titre indicatif et vous pouvez utiliser tout autre moteur PHP. Remarque: PHP 4.3.2 version minimale est ncessaire. Une base de donnes MySQL est ncessaire. Les sites PHP gnrs avec WebDev peuvent galement tre utiliss avec des serveurs PHP version 5.

1.1Quest-ce quun site PHP?


Un site PHP est compil en PHP. Si ce site manipule une base de donnes, laccs cette base se fera par un driver ODBC (MyODBC, ODBC pour Oracle,...) ou via laccs natif pour MySQL. Concernant le driver ODBC, il est spcifique chaque base de donnes (et peut tre trouv sur le site de lditeur de la base de donnes). Un site PHP est compos de pages ".php" et ncessite un moteur PHP pour tre lanc. Pour compiler (en PHP) un projet PHP avec WebDev, il est ncessaire dinstaller sur le poste de dveloppement un moteur PHP. De nombreux moteurs

1.2Pourquoi dvelopper un site PHP avec WebDev?


Pour certains sites, surtout de petits sites, il peut tre pratique de dsirer raliser ces sites en PHP afin de faciliter leur hbergement gratuit. Vous en avez dsormais la possibilit avec WebDev. Remarque: le nombre de fonctions WLangage utilisables dans un projet PHP est limit dans cette version. Ce nombre de fonctions est amen crotre rgulirement.

2 Fonctionnalits pour un projet PHP


2.1Cration dun projet PHP
Pour crer un projet PHP, il suffit dindiquer dans lassistant de cration dun projet (option "Fichier... Nouveau... Projet") que vous voulez gnrer un site dynamique PHP. Ds que le projet est configur comme un projet PHP, tous les outils WebDev disponibles sont automatiquement paramtrs pour le projet PHP: Le RAD PHP qui gnre du code PHP depuis un projet pour de nombreuses fonctionnalits de WebDev. Le compilateur indique les fonctions ou champs non utilisables en PHP. Un message apparat en violet dans le volet "Erreurs de compilation". Le dploiement du site PHP via loutil WDDploie. Remarque: il est conseill de crer un nouveau projet WebDev pour dvelopper un site PHP plutt que de transformer un site WebDev en PHP.

2.2RAD PHP
Comme sur tout projet associ une analyse, vous pouvez utiliser le RAD pour gnrer les pages de votre site. Le RAD prend en compte toutes les spcificits de la gnration PHP (champs, traitements, fonctions utilisables dans un site PHP gnr depuis WebDev).

2.3Test dun site PHP sous lditeur


Lors du test dun site PHP, le site est compil en PHP et lanc dans votre navigateur. Vous visualisez directement les pages PHP gnres par WebDev. Rappel: Un moteur PHP est ncessaire sur le poste de dveloppement. La compilation dun site PHP permet de: connatre les erreurs de programmation WLangage

Partie 3 : Environnement de dveloppement

111

visualiser les champs, traitements, fonctions WLangage non disponibles en gnration PHP. Ces erreurs apparaissent en violet dans le volet "Erreurs de compilation". Pour plus de dtails sur les lments WebDev non disponibles dans un site PHP, consultez laide en ligne.

2.4Dployer un site PHP


Le dploiement dun site PHP se fait de la mme manire que pour un site statique. Lors de la cration de la procdure dinstallation, WDDploie se lance et vous assiste dans la mise en place de votre site PHP. Pour plus de dtails, consultez laide en ligne.

112

Partie 3 : Environnement de dveloppement

Les Centres de Contrle


Pour grer le cycle de vie de vos projets de dveloppement, WebDev vous propose dutiliser les Centres de Contrle. Les Centres de Contrle forment un ensemble doutils destins prendre en charge: les exigences dun projet (formalisation des besoins) les tches de dveloppement, de test et de documentation le suivi des incidents signals par les utilisateurs les rgles mtier utilises par lentreprise dans ses dveloppements Les Centres de Contrle fonctionnent autour dune base de donnes (HyperFileSQL Classic ou Client/Serveur) partage par de nombreux outils disponibles dans WebDevmais aussi avec WinDev et WinDev Mobile si vous les utilisez:

Lors de linstallation de WebDev, le programme dinstallation propose: soit de crer la base des Centres de Contrle. Cette base sera automatiquement cre au format HyperFileSQL Classic dans le rpertoire spcifi. soit de partager une base de donnes des Centres de Contrle existante.
Partie 3 : Environnement de dveloppement 113

Gestion des exigences


Une exigence est un besoin sur ce quun produit (ou un service) devrait faire. Les Centres de Contrle permettent un chef de projet de grer les exigences dun projet de dveloppement. Il suffit pour cela de: dfinir les diffrents intervenants du projet. dfinir les exigences (avec les diffrents lments qui leur sont associs). Chaque dveloppeur effectue les diffrentes tches qui lui sont affectes. Le chef de projet peut tout moment suivre ltat davancement du projet.

114

Partie 3 : Environnement de dveloppement

Centre de Suivi de Projets


Le Centre de Suivi de Projets permet aux diffrents intervenants dun projet de grer leur planning des tches. Ces tches peuvent tre lies des exigences, et correspondre plusieurs projets.

Fonctionnement du Centre de Suivi de projets


Aprs avoir list lensemble des tches dun projet, le Centre de Suivi de Projets soccupe de tout. La saisie du temps pass est quasi automatique, ne demande aucune action spcifique et ne gnre aucune contrainte particulire. Lors de louverture du projet concern, le Centre de Suivi de Projets demande ou indique la tche en cours. Ds quune tche est ralise, il suffit dindiquer que cette tche est termine et de spcifier la nouvelle tche. Une tche peut tre relie un lment du projet (page, tat, ...). Chaque fois que llment concern est ouvert, le temps pass sur cet lment est dcompt et mmoris dans le Centre de suivi. Inversement, depuis la liste des tches, il est possible douvrir automatiquement llment correspondant la tche que vous voulez raliser. Chaque dveloppeur peut galement visualiser directement sa liste de tches dans le volet "Centre de Suivi de Projets".

Partie 3 : Environnement de dveloppement

115

Gestion des rgles mtier


WebDev permet de grer des rgles mtier. Une rgle mtier permet de dfinir un mode opratoire prcis ou de prciser un traitement particulier. Par exemple: le calcul dun taux de TVA avec ses particularits, les rgles de changement de statut dun client; la formule de calcul dun montant de frais de port, une commission commerciale, un taux de remise, un coefficient de vtust, ... Une rgle mtier peut tre simple ou labore. Les rgles mtier peuvent provenir: du cahier des charges (correspondant aux exigences). de suggestions faites par les utilisateurs de lapplication.

Pendant le dveloppement, les rgles mtier dfinies pour le projet sont affiches directement dans le volet "Rgles mtier" de lenvironnement de dveloppement. Ce volet prsente le nombre dlments du projet auxquels les rgles mtier sappliquent et le pourcentage de rgle actuellement ralis.

116

Partie 3 : Environnement de dveloppement

Partie 4 Dveloppement de sites web : concepts avancs

118

Partie 4 : Concepts avancs

RAD RID
Le RAD (Rapid Application Development) et le RID (Rapid graphical Interface Design) permettent de crer des pages partir: de lanalyse lie au projet, des patterns RAD standard ou personnaliss, des gabarits. En gnration RAD, les pages gnres contiennent tout le code ncessaire leur fonctionnement. Ces pages peuvent tre testes immdiatement, avec les donnes prsentes sur le poste de dveloppement. En gnration RID, les pages gnres contiennent uniquement les champs lis aux rubriques de lanalyse. Tout le code ncessaire au fonctionnement de ces pages reste la charge du dveloppeur. Vous pouvez directement saisir votre code personnalis.

Partie 4 : Concepts avancs 119

Le modle UML
WebDev permet de crer ces neuf types de modle UML: Diagramme de classes: dcrit de manire gnrale la structure dun systme. Diagramme de cas dutilisation: reprsente les fonctionnalits du systme du point de vue de lutilisateur. Diagramme dobjet: reprsente un ensemble dobjets et leurs relations un moment donn. Diagramme de composants: dcrit larchitecture physique et statique dune application informatique. Diagramme dactivit: reprsente le comportement dune mthode ou le droulement dun cas dutilisation. Diagramme de squences: reprsente lordre chronologique des messages envoys et reus par un ensemble dobjets. Diagramme de collaboration: prsente lorganisation structurelle des objets qui envoient et reoivent des messages. Diagramme dtats-transitions: prsente un automate tats finis. Diagramme de dploiement: montre la rpartition des matriels (les nuds) utiliss dans un systme et lassociation des programmes excutables ces matriels.

120

Partie 4 : Concepts avancs

Le modle UML en pratique


1 Prsentation
Lobjectif principal dune quipe de dveloppement est de crer des applications optimises, capables de satisfaire les besoins en constante volution de leurs utilisateurs. La modlisation dune application permet de spcifier la structure et le comportement attendus dun systme, de comprendre son organisation, de dceler les possibilits de simplification et de rutilisation et de grer les risques encourus. Un modle est la simplification de la ralit. Il permet de mieux comprendre le systme dvelopper. Un diagramme est la reprsentation graphique dun ensemble dlments qui constituent un systme. Pour visualiser un systme sous diffrentes perspectives, le langage UML (Unified Modeling Language) propose neuf diagrammes, reprsentant chacun un tat du systme. WinDev permet de crer ces neuf types de modle UML: Diagramme de classes Diagramme de cas dutilisation Diagramme dobjet Diagramme de composants Diagramme dactivit Diagramme de squences Diagramme de collaboration Diagramme dtats-transitions Diagramme de dploiement Ce chapitre ne fait que prsenter de manire globale la modlisation UML. Pour plus de dtails sur le langage UML, nous vous conseillons de consulter des ouvrages spcifiques.

2 Les diffrents diagrammes UML


2.1Diagramme de classes
Un diagramme de classes permet de modliser la structure dun systme grce des classes et des relations entre ces classes. Les diagrammes de classes sont les diagrammes les plus courants dans la modlisation des systmes orients objet. Par exemple, le diagramme suivant prsente la gestion des stocks:

Partie 4 : Concepts avancs 121

Un diagramme de classes est compos des lments suivants: Classe : reprsente les structures de lapplication. Chaque classe est divise en trois compartiments: le nom de la classe indique ce que la classe est et non ce quelle fait. les attributs de la classe donnent les caractristiques de la classe. les oprations de la classe reprsentent les actions possibles sur la classe. Par exemple, la classe Stock contient lattribut ListeProduits. Cette classe regroupe aussi les oprations AjouteProduit et RetireProduit. Ces oprations sont applicables aux instances de la classe. Remarque: Le langage UML dfinit trois niveaux de visibilit pour les attributs et les oprations: - Public: llment est visible par toutes les autres classes. - Protg: llment est visible par la classe elle-mme et par les sous-classes. - Priv: llment est visible uniquement par la classe. Relation : dcrit le comportement des classes entre elles. Trois types de relations existent: Association : Relation structurelle entre classes. Par exemple, la classe Commande est lie aux classes Produit et Client. Un Client peut passer plusieurs Commandes. Une commande est constitue de plusieurs produits. Une commande doit obligatoirement contenir au moins un produit. Dpendance: Relation dutilisation qui tablit que les instances dune classe sont relies aux instances dun autre lment. Par exemple, la classe Commande utilise la classe Stock: avant dajouter un produit dans une commande, il est ncessaire de vrifier que ce produit est en stock. Gnralisation: Relation entre une classe gnrale (parent) et une classe spcifique (enfant) qui en drive. Par exemple, les classes Bateau voile et Bateau moteur sont drives de la classe Bateau.

Paquetages : permettant de diviser et dorganiser la reprsentation du diagramme (de la mme manire que les rpertoires organisent les fichiers). Chaque paquetage peut contenir des classes et des relations. Grce la gnration dun diagramme de classes, il est possible de crer la structure des classes WebDev utilises dans votre application.

2.2Diagramme de cas dutilisation


Un diagramme de cas dutilisation permet de visualiser le comportement dun systme de telle sorte que: lutilisateur puisse comprendre comment utiliser chaque lment. le dveloppeur puisse implmenter ces lments. Par exemple, il est possible de dcrire le comportement dun tlphone portable laide dun diagramme de cas dutilisation.

122

Partie 4 : Concepts avancs

Un diagramme de cas dutilisation est compos des lments suivants: Acteur : reprsente le rle des utilisateurs de lapplication. Par exemple, une personne qui travaille dans une banque sera le Gestionnaire de prts. Si cette personne un compte dans cette banque, elle jouera aussi le rle de Client. Cas dutilisation: dcrit une squence dactions excutes par lapplication. Par exemple, Passer une commande, Saisir une facture, Crer une nouvelle fiche client,... Un cas dutilisation dcrit ce que fait une application mais ne prcise pas comment lapplication le fait. Relation : dcrit le comportement des acteurs par rapport aux cas dutilisation. Trois types de relations existent: Association : Relation structurelle entre deux lments relis. Dpendance: Relation qui tablit quun lment en utilise un autre. Par exemple, le Client dune banque peut retirer de largent dans un distributeur automatique. Dans ce cas, laction Retrait dargent dpend du Client. Pour pouvoir retirer de largent, le Client doit pralablement saisir son code confidentiel. Dans ce cas, laction Retrait dargent dpend de la Saisie du mot de passe.

Paquetage : divise et organise la reprsentation du diagramme (de la mme manire que les rpertoires organisent les fichiers). Chaque paquetage peut contenir des acteurs et des cas dutilisation.

2.3Diagramme dobjets
Un diagramme dobjets reprsente un ensemble dobjets et leurs relations un moment donn. Un diagramme dobjets est utilis pour montrer un contexte (avant ou aprs une interaction entre objets par exemple). Par exemple, le diagramme suivant prsente une partie de la structure gnrale des motos:

Gnralisation : relation permettant dorganiser les lments selon une hirarchie. Par exemple: lacteur Client peut tre de deux types: Client individuel ou Client dentreprise. la vrification de lidentit dun utilisateur peut tre effectue de deux faons: saisie du mot de passe ou vrification de lempreinte digitale.

Un diagramme dobjets est compos des lments suivants: objet : reprsente une instance dune classe. Remarque : Si un diagramme de classes est ouvert, il est possible de crer un objet partir dune classe prsente dans ce diagramme (drag and drop partir du volet "Analyse UML"). objet composite: reprsente de manire visuelle un objet form dautres objets. Par exemple: une fentre qui contient des ascenseurs, des bouPartie 4 : Concepts avancs 123

tons,... lien: reprsente les relations entre les diffrents objets.

2.5Diagramme dactivit
Un diagramme dactivit reprsente le comportement dune mthode ou le droulement dun cas dutilisation. Par exemple, le diagramme suivant prsente le droulement dun barrage:

2.4Diagramme de composants
Un diagramme de composants dcrit larchitecture physique et statique dune application informatique. Par exemple: fichiers sources, librairies, excutables,... Par exemple, le diagramme suivant prsente le fonctionnement dun programme permettant de se loguer en mode texte sous Unix.

Un diagramme de composants est compos des lments suivants: module : reprsente les diffrents lments physiques constituant une application informatique. Par exemple: un fichier, une librairie,... Un module peut tre reprsent: soit par une spcification qui montre linterface du module. Cette spcification peut tre gnrique dans le cas de classes paramtrables. soit par son corps qui prsente limplmentation du module. tche : reprsente un composant ayant son propre flot (thread) de contrle. programmes principaux de lapplication informatique. sous-programmes : regroupent les procdures et les fonctions qui nappartiennent pas des classes.

Un diagramme dactivit est compos des lments suivants: activit: reprsente une tape particulire dans lexcution dun mcanisme. Par exemple: "Etablir un devis", "Ouvrir la fentre", "Vrifier les connaissances",... barre de synchronisation: permet de synchroniser les diffrentes activits: soit en indiquant les activits effectuer avant une certaine activit. Par exemple: "Appuyer sur lembrayage" et "Enclencher une vitesse" avant de "Relcher lembrayage". soit en indiquant les activits effectuer en parallle. objet: permet de rattacher des activits lobjet qui ralise ces activits. Par exemple, les activits "Commander" et "Payer" sont rattaches lobjet "Client"; les activits "Enseigner", "Contrler les connaissances" sont rattaches lobjet "Enseignant". mission de signal: reprsente lenvoi dun signal vers un objet. attente de signal: reprsente lattente dun signal en provenance dun objet. transition: reprsente le passage dune activit termine une autre. Par exemple: "Trop deau", "Assez dargent",...

124

Partie 4 : Concepts avancs

2.6Diagramme de squence
Un diagramme de squence reprsente lordre chronologique des messages envoys et reus par un ensemble dobjets. Par exemple, le diagramme suivant reprsente le dbut dune communication tlphonique:

2.7Diagramme de collaboration
Un diagramme de collaboration prsente lorganisation structurelle des objets qui envoient et reoivent des messages. Par exemple, le diagramme suivant montre lutilisation dun ascenseur par une personne:

Un diagramme de squence est compos des lments suivants: objet : reprsente les diffrents objets utiliss. Chaque objet est reprsent par un carr surmontant une ligne en pointill. Cette ligne reprsente la dure de vie de lobjet. Par exemple: "Appelant", "Appel",... priode dactivation dun objet: Sur la ligne de vie dun objet, il est possible dinsrer des priodes dactivation de lobjet. Ces priodes reprsentent les moments o lobjet est actif. message : reprsente, grce des flches horizontales, les messages changs entre les diffrents objets. Ces flches sont orientes de lmetteur du message vers le destinataire. Lordre denvoi des messages est donn par la position des flches sur laxe vertical. Par exemple: "Dcroche", "Sonnerie",...

Un diagramme de collaboration est compos des lments suivants: objet: reprsente les diffrents objets utiliss. acteur: reprsente un lment externe du systme. Par exemple une personne. message : reprsente les messages changs entre les diffrents objets.

2.8Diagramme dtats-transitions
Un diagramme dtats-transitions prsente un automate tats finis. Il permet ainsi de dcrire les changements dtats dun objet ou dun composant. Un tat se caractrise par sa dure et sa stabilit. Une transition reprsente le passage instantan dun tat vers un autre. Une transition est dclenche: soit par un vnement. soit automatiquement lorsquaucun vnement dclencheur est spcifi.

Partie 4 : Concepts avancs 125

Par exemple, le diagramme suivant prsente les diffrentes tapes dune machine laver les voitures:

2.9Diagramme de dploiement
Un diagramme de dploiement montre la rpartition physique des matriels (les nuds) utiliss dans un systme et lassociation des programmes excutables ces matriels. Par exemple, le diagramme suivant prsente les diffrents matriels utiliss dans une entreprise:

Un diagramme dtats-transitions est compos des lments suivants: tat: reprsente la valeur des attributs dun objet un instant donn. tat initial: reprsente ltat au dmarrage du systme. tat final: reprsente ltat dans lequel se trouve le systme la fin du fonctionnement. super-tat: permet de structurer le diagramme en indiquant plusieurs niveaux de distinction entre les tats. historique: reprsente le dernier tat actif dun super-tat. souche: permet de symboliser les tats contenus dans un super-tat. Il est ainsi possible de relier ces tats dautres tats nappartenant pas au super-tat. transition: reprsente le passage dun tat un autre.

Un diagramme de dploiement est compos des lments suivants: classe de nuds: reprsente une classe de ressource matrielle. Par exemple: un serveur, un PC, une imprimante,... instance dun nud: reprsente une ressource matrielle. Par exemple: le serveur numro 3, limprimante numro 7,... connexion: dcrit le support de communication entre deux nuds. Par exemple: liaison RNIS ou TCP/IP.

126

Partie 4 : Concepts avancs

Groupware utilisateur
Le Groupware Utilisateur permet dinclure simplement une gestion des utilisateurs et de leurs droits dans un site WebDev. Deux types dutilisateurs sont pris en compte: utilisateur simple, utilisant directement le site. superviseur, pouvant configurer les utilisateurs et leurs droits.

Partie 4 : Concepts avancs 127

Le groupware utilisateur en pratique


1 Prsentation
Un site Intranet ou Internet ncessite la dfinition du rle des diffrents intervenants. Il est souvent ncessaire de prvoir diffrents niveaux daccs selon les fonctions de lutilisateur. En effet, tous les utilisateurs nont pas les mmes fonctions, ni les mmes besoins. Leur domaine daction doit donc tre plus ou moins limit. Prenons un exemple simple: lors de la mise en place dune gestion commerciale, lapplication propose les fonctionnalits suivantes: Consultation du tarif, Modification du tarif, Saisie des commandes, Saisie des clients. Selon lutilisateur les accs possibles sont diffrents. Quelques exemples: les secrtaires peuvent consulter le tarif et crer des commandes. les commerciaux peuvent consulter le tarif et tablir les commandes, grer de nouveaux clients. les directeurs commerciaux ont accs toutes les options. Pour grer ces niveaux daccs dans vos sites WebDev, il suffit dintgrer le groupware utilisateur votre site. Quelques clics de souris suffisent transformer une application classique en une application grant de nombreux niveaux daccs. La mise en place est instantane. Lors de lexcution du site, le responsable pourra crer des utilisateurs (identifis par leur login et leur mot de passe) et leur donner accs lune ou lautre des fonctionnalits du site. Remarque: le groupware utilisateur est disponible dans les sites dynamiques WebDev excuts sous Windows ou Linux. Le groupware utilisateur nest pas disponible dans les sites statiques, semi-dynamiques, PHP, AWP ou Ajax.

2 Comment fonctionne le groupware utilisateur?


Un site utilisant le groupware utilisateur a deux niveaux dutilisation: le niveau utilisateur. le niveau superviseur. La configuration du groupware consiste crer des utilisateurs, des groupes, et dassocier des utilisateurs aux groupes, grer les droits de chaque utilisateur (ou groupe) sur chacune des pages du site. Les droits sont dfinissables au niveau des options de menu, des groupes de champs et des champs. Le superviseur peut rendre ces lments griss, inactifs ou invisibles. Ces configurations sont prioritaires sur toute configuration effectue dans le programme. Pour plus de dtails sur la configuration du groupware par le superviseur consultez le paragraphe "Paramtrer le site utilisant le groupware utilisateur", page 130. Remarque : Toutes les informations concernant les utilisateurs et leurs droits sont stockes dans des fichiers de donnes au format HyperFileSQL. Les fichiers de donnes concernant les utilisateurs peuvent tre communs plusieurs sites. Les fichiers de donnes concernant les droits des utilisateurs sur les diffrentes pages du site sont spcifiques au site, et ne peuvent pas tre partags.

2.1Le niveau utilisateur


Lutilisateur se connecte lapplication grce une page de login et accde aux fonctionnalits qui lui sont autorises. Remarque: le groupware utilisateur peut permettre de se connecter en utilisant un annuaire LDAP.

2.2Le niveau superviseur


Le superviseur se connecte lapplication par une page de login et accde un menu avanc lui permettant de configurer les utilisateurs et leurs droits, ou bien de lancer lapplication. La page de configuration permet au superviseur de: lancer lapplication. configurer le groupware. 128 Partie 4 : Concepts avancs

3 Mise en place du groupware utilisateur


3.1Ajouter le groupware utilisateur dans un site
Pour mettre en place le groupware utilisateur dans un site WebDev, une seule option suffit: "Atelier .. Paramtrer le groupware utilisateur". La fentre de paramtrage du groupware utilisateur permet de dfinir: Le mode de gestion du groupware utilisateur. Le type de lancement du groupware utilisateur. Lemplacement des fichiers de donnes du groupware utilisateur. Mode dintgration du Groupware Utilisateur Deux modes dintgration du groupware utilisateur sont disponibles: Intgration par dfaut: toute la programmation du groupware utilisateur est automatiquement intgre votre application. Une nouvelle page est intgre votre projet: la page de login. Elle apparat lors du lancement du site et permet lutilisateur de se connecter au site. Vous pouvez ainsi personnaliser cette page en lui appliquant par exemple le gabarit de votre site. Intgration personnalise: toute la programmation du groupware utilisateur est automatiquement intgre votre site. Toutes les pages ncessaires la gestion du groupware utilisateur (login et gestion des utilisateurs) sont automatiquement ajoutes votre projet. Vous pouvez ainsi personnaliser totalement toutes les pages utilises par le groupware utilisateur. Le dtail des diffrentes pages du Groupware Utilisateur est prsent dans le paragraphe "Les pages WebDev", page 132. Dmarrage du Groupware Utilisateur Deux modes de lancement du groupware utilisateur sont disponibles: Lancement automatique: La page de login du groupware utilisateur est lance avant toute autre page de lapplication. Le code dinitialisation du projet est excut aprs louverture et la validation de la page de login. Lancement manuel: La page de login ne sera ouverte que si la fonction gpwOuvre est utilise. Cette option permet dexcuter le code dinitialisation du projet par exemple, avant douvrir la page de login. Il est ainsi possible par exemple dafficher une page demandant la langue dexcution du site. Login automatique en mode test Vous pouvez indiquer le login et le mot de passe utiliser en mode "Test automatique". Ces informations seront utilises si un test automatique est ralis sur le site. Annuaire LDAP Si votre client utilise un annuaire LDAP au sein de son entreprise, il est possible de brancher le groupware utilisateur sur cet annuaire. Ainsi le compte et le mot de passe prsent dans lannuaire LDAP seront automatiquement demands lutilisateur. Deux modes sont disponibles: Sans gestion des droits : Dans ce cas, aucun fichier de donnes du groupware ne sera cr. Si le lancement est automatique, la page de login demandera lutilisateur de sidentifier. Si lutilisateur est bien enregistr dans lannuaire LDAP, le site se lancera, sinon il se fermera. Il nest pas possible un superviseur de paramtrer les droits sur les pages. Avec gestion des droits : Seuls les utilisateurs prsents dans lannuaire LDAP pourront se connecter. Le paramtrage des droits sur les pages est disponible. Pour plus de dtails, consultez laide en ligne. Remarque : Le groupware utilisateur fonctionne avec Active Directory. Il ne fonctionne pas avec openLDAP. Fichiers de donnes du Groupware Utilisateur Deux catgories de fichiers de donnes sont gres par le groupware utilisateur: les fichiers de donnes permettant didentifier les utilisateurs. Ces fichiers de donnes peuvent tre communs plusieurs applications. les fichiers de donnes permettant de grer les droits des utilisateurs sur les diffrentes pages du site. Ces fichiers de donnes sont propres au site. Le mot de passe des fichiers de donnes Par dfaut, les fichiers de donnes du groupware utilisateur ont un mot de passe spcifique. Ce mot de passe est: "PCSGPW2001". Pour changer ce mot de passe, saisissez le nouPartie 4 : Concepts avancs 129

veau mot de passe. Les caractres saisis apparaissent sous forme dtoiles. Remarque : Ce mot de passe est utilis par exemple lors de la r-indexation ou de louverture des fichiers de donnes avec loutil WDMAP. Pour plus de dtails sur ces fichiers de donnes et leur configuration (rpertoire dinstallation, ...), consultez le paragraphe "Les fichiers de donnes", page 132.

3.2Tester le site
Lors du test dun site grant le groupware utilisateur, la premire page apparaissant est automatiquement la page de login (quelle que soit la premire page dfinie dans votre site). Par dfaut, un seul utilisateur existe: le superviseur. Pour se connecter en tant que superviseur, il suffit de saisir les informations suivantes dans la page de login: Nom: SUPERVISEUR Mot de passe: SUPERVISEUR Vous pouvez alors soit tester votre site, soit configurer le fonctionnement du groupware. Remarques: Pour que la premire page de votre site ne soit pas la page de login, cochez loption "Lancement manuel" dans les options du Groupware Utilisateur. Il suffira dutiliser la fonction du WLangage gpwOuvre pour afficher la page de login. Les pages de gestion du groupware utilisateur sont excutes avant le code dinitialisation du projet.

La premire page de votre site dfinie dans le projet sera lance aprs la page de login (lorsque lutilisateur nest pas le superviseur). Pour ne pas lancer le groupware utilisateur lors des tests du site, il suffit de dcocher loption "Atelier .. Paramtrer le Groupware Utilisateur". Si vous rebranchez le groupware utilisateur par la suite, les fichiers de donnes utiliss prcdemment pour le groupware utilisateur ne seront pas effacs.

3.3Installer un site utilisant le groupware utilisateur


Linstallation dun site utilisant le groupware utilisateur se fait comme pour tout autre site par loption "Atelier .. Crer la procdure dinstallation". Un cran spcifique au groupware utilisateur permet de configurer lemplacement des fichiers de donnes propres au groupware utilisateur. Remarques: Si vous avez paramtr les fichiers de donnes du groupware utilisateur pour votre client, il est ncessaire de les slectionner lors de la prparation de linstallation. Il est donc ncessaire de personnaliser la liste des fichiers de linstallation. Si vous navez pas paramtr les fichiers du groupware, lors du premier lancement de lapplication, seul lutilisateur Superviseur existera dans lapplication. Conseil: si vous ne configurez pas les diffrents niveaux dutilisation du groupware utilisateur pour vos clients, il est conseill de leur fournir un document reprenant tous les champs de vos pages pour obtenir une configuration optimise.

4 Paramtrer le site utilisant le groupware utilisateur


Lorsque le site est dploy, le paramtrage du groupware utilisateur est ralis par le superviseur de lapplication. Ce paramtrage consiste crer des utilisateurs, des groupes dutilisateurs, et leur attribuer pour chaque champ de chaque page de lapplication certains droits. Ces droits consistent rendre visible, invisible ou gris des champs, des groupes de champs, des options de menus. Pour paramtrer le groupware utilisateur, il suffit de: 1.Lancer le site et de se connecter en tant que superviseur: Nom: SUPERVISEUR Mot de passe: SUPERVISEUR 2.Choisir loption "Configurer le groupware".

4.1Grer les utilisateurs


La cration dun nouvel utilisateur consiste donner les informations suivantes: le nom de lutilisateur (obligatoire) le prnom de lutilisateur

130

Partie 4 : Concepts avancs

le login de lutilisateur. Ce login correspond lidentifiant de lutilisateur lors de sa connexion lapplication. le mot de passe de lutilisateur. Ce mot de passe nest pas obligatoire, et peut tre saisi par lutilisateur lui-mme lors de sa premire connexion (cochez loption correspondante). Il est possible de dfinir lutilisateur comme tant un superviseur du site. Il est bien entendu possible de modifier ou de supprimer un utilisateur. La suppression dun utilisateur permet soit de supprimer entirement lutilisateur, soit de supprimer uniquement ses droits. Les utilisateurs peuvent tre rassembls en groupes. Lors de la cration dun groupe, il est possible de copier les droits prcdemment dfinis pour un autre groupe ou utilisateur. Il est possible de crer ou de supprimer un groupe. Lors de la suppression dun groupe, il est possible soit de supprimer le groupe et ses utilisateurs, soit de supprimer uniquement le groupe. Dans ce cas, les utilisateurs ne sont plus associs un groupe. Remarques: Il est conseill de changer le mot de passe du superviseur ds la premire utilisation. Le groupe "Dfaut" est le groupe propos par dfaut dans le groupware utilisateur. Ce groupe a par dfaut tous les droits sur lapplication. Il nest pas possible de supprimer le groupe <Au-

cun> et le groupe DEFAUT. Si vous utilisez un annuaire LDAP, vous avez la possibilit dimporter les utilisateurs prsents dans lannuaire pour grer les droits de ces utilisateurs.

4.2Grer les droits


Pour chaque utilisateur (ou groupe dutilisateurs), le superviseur peut grer leurs droits sur les diffrents lments des pages du projet. Pour chaque association utilisateur / page, il est possible de dfinir un tat spcifique pour tous les lments de la page. Les lments grs dans les pages, les pages internes et les modles de pages sont les suivants: les champs les groupes de champs les options de menu Les tats disponibles pour chaque lment sont les suivants: Dfaut : le comportement de llment correspond au comportement par dfaut, dfini dans lapplication. Inactif: llment est affich mais toute saisie est impossible. Gris: llment est affich mais gris. Toute saisie est impossible. Invisible: llment nest pas affich.

5 Conseils pour un site grant le groupware utilisateur


5.1Utilisation de groupes de champs
Pour simplifier le paramtrage de la gestion du groupware utilisateur en fonction des utilisateurs, il est conseill de regrouper les champs par groupe de champs. Il est par exemple possible de crer dans vos pages des groupes de champs correspondant aux champs afficher pour un type dutilisateur. La possibilit dassocier un champ plusieurs groupes de champs augmente les combinaisons disponibles. Ces groupes de champs peuvent tre crs dans votre site uniquement en vue dune gestion du groupware, sans programmation spcifique de votre part.

5.2Visibilit des champs


Lors du dveloppement de votre application, vous pouvez dfinir les caractristiques de visibilit des diffrents lments de vos pages: soit lors de la description de llment (fentre 7 onglets), soit par programmation (proprits ..Etat ou ..Visible). Lors de la configuration du groupware utilisateur, le superviseur peut dfinir dautres caractristiques de visibilit. Les caractristiques dfinies par le superviseur sont prioritaires. Par exemple, un bouton permet de rendre un champ actif. Or ce champ a t gris par le superviseur. Votre code ne sera pas pris en compte et le champ ne sera pas actif.

Partie 4 : Concepts avancs 131

5.3Dfinition des droits


Pour obtenir une dfinition des droits correspondant aux fonctionnalits de votre site, il est conseill: soit deffectuer la configuration des droits voulue par lutilisateur de votre application avant

de crer la procdure dinstallation. Il suffit alors dajouter les fichiers de donnes du groupware lors de la cration de linstallation du site. soit de livrer un dossier de programmation permettant de donner les noms des champs, des groupes de champs et des options grer selon le niveau dutilisation du site.

6 Les lments du groupware utilisateur


6.1Les pages WebDev
Selon le mode dintgration du groupware utilisateur dans votre application, une ou plusieurs pages peuvent tre intgres dans votre projet. Ces pages sont les suivantes. Remarque: le fonctionnement de ces pages est prsent en dtail dans le paragraphe "Paramtrer le site utilisant le groupware utilisateur", page 130. Page de login (GPWLOGIN_WB.WDW) Cette page permet tous les internautes de se connecter au site. Dans cette page, linternaute doit saisir son nom et son mot de passe (optionnel) qui ont t pralablement dfinis par le superviseur du site. Ds le lancement, il est possible dutiliser le login "SUPERVISEUR" et le mot de passe "SUPERVISEUR". Cette page permet galement: linternaute de changer son mot de passe au superviseur de configurer les droits et de lancer le site. Page Fiche dun utilisateur (GPWFicheUtilisateur_ WB.WDW) Cette page est visualisable dans votre projet uniquement en mode personnalis. Cette page permet au superviseur de saisir un nouvel utilisateur et les renseignements le concernant. Page Association des utilisateurs et des configurations (GPWAssociationConfiguration_WB. WDW) Cette page est visualisable dans votre projet uniquement en mode personnalis. Cette page permet au superviseur de grer les internautes, les groupes et les droits des internautes. Page Dtail dune configuration (GPWDetailConfiguration_WB.WDW) Cette page est visualisable dans votre projet uniquement en mode personnalis. 132 Partie 4 : Concepts avancs Cette page permet au superviseur de paramtrer pour chaque page les droits dun internaute (ou dun groupe) sur tous les champs, les groupes de champs et les options de menu de la page. Page Choix dune configuration (GPWChoixConfiguration_WB. WDW) Cette page est visualisable dans votre projet uniquement en mode personnalis. Cette page permet au superviseur de copier une configuration prcdemment dfinie (pour un groupe ou un internaute). Page Fiche configuration (GPWFicheConfiguration_WB. WDW) Cette page est visualisable dans votre projet uniquement en mode personnalis. Cette page permet au superviseur de crer un groupe ou un utilisateur. Page Fiche Historique des connexions (GPWHistoriqueConnexion_WB. WDW) Cette page est visualisable dans votre projet uniquement en mode personnalis. Cette page permet au superviseur de consulter lhistorique des connexions (et de purger cet historique si ncessaire).

6.2Les fichiers de donnes


Deux catgories de fichiers sont prises en compte: Les fichiers permettant didentifier les utilisateurs. Ces fichiers peuvent tre communs plusieurs applications. Les fichiers permettant de grer les droits des utilisateurs sur les diffrents lments de lapplication. Ces fichiers sont spcifiques lapplication et ne peuvent pas tre partags avec une autre application. Par dfaut, ces fichiers de donnes sont crs au format HyperFileSQL Classic, mais il est possible dutiliser le format HyperFileSQL Client/Serveur. Pour plus de dtails, consultez laide en ligne.

Mot de passe: Par dfaut, les fichiers de donnes du groupware utilisateur ont un mot de passe spcifique. Ce mot de passe est: "PCSGPW2001". Pour changer ce mot de passe: 1.Affichez la fentre de configuration du groupware utilisateur (option "Atelier .. Paramtrer le groupware utilisateur"). 2.Dans longlet "Fichiers", saisissez le nouveau mot de passe. Les caractres saisis apparaissent sous forme dtoiles. Remarque : Ce mot de passe est utilis par exemple lors de la r-indexation ou de louverture des fichiers de donnes avec loutil WDMAP. Fichiers de donnes utilisateur Ces fichiers sont les suivants: GPWUtilisateur Fichier des utilisateurs. Contient toutes les caractristiques des utilisateurs (login, nom, prnom, mot de passe, ...). GPWUtilisateurCon- Fichier des groupes dutilisafiguration teurs GPWLogConnexion Fichier contenant lhistorique des connexions. Ce fichier est prsent uniquement si lhistorique des connexions a t demand. Les rubriques de ces fichiers de donnes sont dtailles dans laide en ligne. O sont crs ces fichiers de donnes? Par dfaut, ces fichiers de donnes (mode HyperFileSQL Classic) sont crs dans un sous-rpertoire de votre projet (rpertoire EXE\GPW_<Nom du projet>). Lors de lintgration du groupware utilisateur, vous pouvez spcifier un rpertoire diffrent pour raliser les tests de votre site. Lors de la prparation de la procdure dinstallation, il est possible de paramtrer lemplacement de ces fichiers de donnes. Il est ainsi possible de slectionner un rpertoire commun plusieurs sites grant le groupware utilisateur. Si loption "Lancement manuel" a t slectionne, la fonction gpwOuvre permet de lancer la page de login du groupware utilisateur, mais aussi de personnaliser le rpertoire des fichiers de donnes du groupware utilisateur. Ce rpertoire, sil est prcis, sera pris en compte.

Remarque: si aucun paramtrage spcifique nest effectu, les fichiers de donnes Utilisateur (mode HyperFileSQL Classic) seront crs dans un sous rpertoire du rpertoire dinstallation de la bibliothque nomm \GPW_<Nom du projet>. Fichiers de donnes des droits Ces fichiers sont les suivants: GPWConfiguration Fichier contenant les descriptions des configurations disponibles. Chaque configuration est associe un groupe dutilisateurs. GPWConfiguratio- Etat de chaque lment du nElment site pour chaque configuration. Par exemple permet de stocker si pour lutilisateur "Secrtaire", loption "Menu statistiques" doit tre gris ou non. GPWElment Fichier contenant les diffrents lments du site configurer (champs des pages, options de menu, ...).

Les rubriques de ces fichiers de donnes sont dtailles dans laide en ligne. O sont crs ces fichiers de donnes? Par dfaut, ces fichiers de donnes (mode HyperFileSQL Classic) sont crs dans un sous-rpertoire de votre projet (rpertoire EXE\GPW_<Nom du projet>). Lors de la prparation de la procdure dinstallation, il est possible de paramtrer lemplacement de ces fichiers de donnes. Il est ainsi possible de slectionner un rpertoire spcifique pour les fichiers des droits du site. Si loption "Lancement manuel" a t slectionne, la fonction gpwOuvre permet de lancer la fentre ou la page de login du groupware utilisateur, mais aussi de personnaliser le rpertoire des fichiers de donnes du groupware utilisateur. Ce rpertoire, sil est prcis, sera pris en compte. Remarque: si aucun paramtrage spcifique nest effectu, les fichiers de donnes des droits seront crs dans un sous rpertoire du rpertoire dinstallation nomm \GPW_<Nom du projet>.

Partie 4 : Concepts avancs 133

7 Modifier le groupware utilisateur


7.1Personnaliser les pages du groupware
La page de login La page de login saffichant pour tout utilisateur lanant votre application, il peut tre ncessaire de la personnaliser. Si vous avez choisi dintgrer cette page votre projet, vous pouvez simplement lui appliquer les ambiances ou les gabarits utiliss pour votre site. Attention: il ne faut pas renommer cette page. Toutes les pages du groupware utilisateur Si vous avez choisi dintgrer toutes les pages du groupware utilisateur, vous pouvez toutes les personnaliser. Cependant, seule la page de login sera visualise par tous les utilisateurs. Les pages de configuration du groupware sont visualises uniquement par le superviseur de lapplication. Attention: la page GPWLogin_WB ne doit pas tre renomme. page spcifique par exemple). Configurer la langue dexcution du site avec la fonction Nation. Ouvrir la premire page de gestion du groupware utilisateur avec la fonction gpwOuvre. Pour plus de dtails sur les applications multilingues, consultez "Sites multilingues", page 136.

7.3Modifier la premire page de lapplication en fonction de lutilisateur


Pour changer la premire page de lapplication en fonction de lutilisateur, il suffit dutiliser la fonction gpwRecupInfoUtilisateur dans le code dinitialisation de votre projet. Cette fonction permet dobtenir des renseignements sur lutilisateur comme par exemple son nom, ou son mot de passe. En fonction de son nom, il est possible par exemple douvrir une page ou une autre. Exemple:
SI gpwRecupInfoUtilisateur(... gpwLogin) = "FP" ALORS PageAffiche("PAGE_Gestion") SINON PageAffiche("Menu") FIN

7.2Groupware utilisateur et application multilingue


Si votre site est multilingue, il est ncessaire de grer cette fonctionnalit galement dans les pages du groupware utilisateur. Par dfaut, les pages du groupware utilisateur grent langlais / amricain et le franais. Pour utiliser le groupware utilisateur dans un site multilingue, il faut: 1.Configurer le groupware utilisateur de la faon suivante: toutes les pages du groupware utilisateur doivent tre intgres dans le projet. loption "Lancement manuel" doit tre slectionne. 2.Traduire les diffrentes pages du groupware utilisateur. Par dfaut, les pages du groupware utilisateur sont disponibles en franais et anglais. Pour traduire ces pages dans dautres langues, il suffit de traduire les diffrents libells, ... (en utilisant loutil WDMSG si ncessaire pour extraire les messages traduire). Rappel: WDMSG est un outil optionnel de WebDev permettant dextraire et de r-intgrer tous les messages traduire. 3.Excuter le site dans la langue souhaite. Pour cela, il est possible par exemple de: Demander si ncessaire lutilisateur la langue dans laquelle le site doit sexcuter (par une 134 Partie 4 : Concepts avancs

7.4Lancer la page de login depuis une page du site


Lors de linsertion du groupware utilisateur dans une application, il est possible de choisir ou non un lancement automatique du groupware. Cette option est ensuite modifiable tout moment. Par dfaut (lancement automatique), la page de login est la premire page de lapplication. Elle est excute avec le code dinitialisation du projet. Dans certains cas, il est ncessaire douvrir une page de configuration avant la page de login. Il suffit pour cela de: 1.Slectionner loption "Lancement manuel". 2.Ouvrir la page de login nimporte quel endroit du code avec la fonction gpwOuvre.

7.5Configurer les fichiers de donnes du groupware utilisateur


Deux types de fichiers de donnes sont utiliss par le groupware utilisateur: fichiers de donnes des utilisateurs. fichiers de donnes des droits.

Lemplacement de ces fichiers de donnes peut tre configur: lors de linsertion du groupware utilisateur pour les tests. lors de la cration de la procdure dinstallation du site. par programmation. Pour plus de dtails, consultez "Les fichiers de donnes", page 132.

supprims (GPWConfigurationElment, GPWConfiguration et GPWElment), tous les utilisateurs auront tous les droits sur tout le site. Pour plus de dtails sur les diffrents types de fichiers de donnes grs par le groupware utilisateur, consultez "Les fichiers de donnes", page 132.

7.7Modifier les fichiers de donnes utiliss par le groupware utilisateur


Il est impossible de modifier la structure des fichiers de donnes spcifiques au groupware utilisateur. Remarque: Ces fichiers de donnes contiennent des informations confidentielles et sont donc crypts.

7.6R-initialiser les fichiers de donnes du groupware utilisateur


Pour r-initialiser les fichiers de donnes du groupware utilisateur, il suffit de supprimer les fichiers de donnes spcifiques au groupware utilisateur (fichier des utilisateurs et fichier des droits). Ces fichiers de donnes sont automatiquement recrs au lancement du site. Remarques: Si seuls les fichiers de donnes utilisateur sont supprims (GPWUtilisateurConfiguration et GPWUtilisateur), seul le superviseur pourra lancer le site. Si seuls les fichiers de donnes des droits sont

7.8Gestion des analyses


Si une analyse spcifique est ouverte lors du paramtrage du groupware utilisateur, il est ncessaire de r-excuter la fonction gpwInitAnalyse (permet louverture de lanalyse du groupware utilisateur). Rappel: En excution, il nest pas possible douvrir simultanment plusieurs analyses.

Partie 4 : Concepts avancs 135

Sites multilingues
WebDev permet de crer trs rapidement des sites multilingues partir dun mme projet.

136

Partie 4 : Concepts avancs

Sites multilingues en pratique


1 Prsentation
Un site multilingue pourra tre diffus dans plusieurs langues. Les diffrentes langues du site seront prises en compte lors des diffrentes tapes du dveloppement. Pour dvelopper un site mutlilingue, les tapes sont les suivantes: 1.Choix des langues gres par le projet et lanalyse. 2.Saisie des diffrents lments du projet (pages, code, ...) dans les diffrentes langues du projet. 3.Dtermination de la langue du projet par programmation. 4.Gestion des alphabets spcifiques dans les fichiers de donnes. 5.Cration de la bibliothque et du programme dinstallation. Remarques: Si le systme dexploitation du poste en cours gre plusieurs langues (Hbreux, Arabe, Grec,...), lors de la saisie des traductions dans ces langues, lalphabet correspondant sera automatiquement utilis. Si votre site est multilingue, il est ncessaire de grer cette fonctionnalit dans les pages du groupware utilisateur, et les pages de gestion automatiques des erreurs HyperFileSQL. Pour plus de dtails, consultez laide en ligne. La gestion de lUnicode est disponible dans les fichiers de donnes HyperFileSQL, et dans les champs des pages.

2 Choix des langues gres par le projet et lanalyse


2.1Langues gres par le projet
Les diffrentes langues gres par le projet sont dfinies dans la description du projet (option "Projet.. Description du projet.. Langues"). Les diffrentes langues slectionnes seront proposes pour toutes les informations des diffrents lments ou objets pouvant tre traduites (libells des champs, options de menus, messages daide associs un champ, ...). Lors de la modification des diffrentes langues du projet, les modifications seront automatiquement prises en compte: pour tout nouvel lment ou objet cr sous lditeur de WebDev, pour tout lment ou objet ouvert sous lditeur de WebDev. La langue principale correspond la langue utilise par dfaut en excution. Options linguistiques Il est possible de paramtrer laffichage des diffrentes donnes numriques du projet (nombre, montaire, date, ...) dans chaque langue gre par le projet. Par dfaut, les paramtres utiliss sont ceux dfinis dans les options linguistiques de Windows (accessible depuis le panneau de configuration de Windows). Ce paramtrage seffectue dans longlet "Langues" de la description du projet (option "Projet .. Description du projet"). Lors de la cration dun champ de saisie ou dune colonne de table affichant des donnes de type numrique (nombre, montaire, date, heure, dure,...) le masque de saisie utilis sera automatiquement le masque dfini dans les options de langue du projet. Cette option est disponible dans les pages. En excution, lorsquun champ de saisie ou une colonne de table a pour masque "Dfini par le projet", le masque de saisie / daffichage sadaptera automatiquement selon les options choisies dans le projet pour la langue affiche en excution. Remarque : Les options linguistiques permettent galement de dfinir le sens dcriture et lalphabet utilis (option "divers").

Partie 4 : Concepts avancs 137

2.2Langues gres par lanalyse


Si votre projet utilise une analyse, le choix des diffrentes langues gres par lanalyse se fait directement sous lditeur danalyses. En effet, une mme analyse peut tre partage entre diffrents projets ne proposant pas tous les mmes langues. Ainsi, le nombre de langues dfini pour lanalyse peut tre suprieur celui dfini pour le projet. La configuration des diffrentes langues gres par lanalyse est effectue par loption "Analyse .. Description de lanalyse .. International". Les diffrentes langues configures dans lanalyse seront proposes: lors de la configuration des informations partages des rubriques. Vous pouvez saisir la description des champs lis aux rubriques (options, libells, ...) dans les diffrentes langues gres par lanalyse. Lors de la gnration dun "RAD application complte" ou dun RAD page, ces informa-

tions seront automatiquement prises en compte pour toutes les langues communes lanalyse et au projet. pour les informations imprimes dans le dossier de lanalyse (notes du fichier de donnes ou de la rubrique). pour les informations gres par "Etats et Requtes".

2.3Langues gres par les diffrents lments du projet


Par dfaut, les diffrents lments du projet (pages, tats, code, classes, collections de procdures, ...) grent les mmes langues que le projet dans lequel ils ont t crs. Il est possible quun lment gre plus de langues que le projet (cas par exemple ou llment est partag entre plusieurs projets grant des langues diffrentes).

3 Saisie de linterface dans les diffrentes langues


Lorsque les diffrentes langues gres par le projet ont t slectionnes, il est ncessaire de saisir toutes les informations affiches par le site dans ces diffrentes langues. Pour saisir linterface dans diffrentes langues, plusieurs lments doivent tre pris en compte: Le mode de traduction choisi. Les langues gres (langues utilisant un alphabet spcifique ou non) Lutilisation de pages spcifiques (groupware utilisateur, Gestion automatique des erreurs HyperFileSQL) Les messages affichs par programmation. sir les informations dans les diffrentes langues gres par le projet. Pour traduire ces informations depuis WebDev: 1.Configurez les options de traduction du logiciel utilis (option "Outils .. Options gnrales de WebDev .. Traduction"). Ces options permettent de dfinir: loutil de traduction par dfaut (et les modalits de transmission du texte traduire et du texte traduit). les langues source et destination de la traduction. 2.Si un outil de traduction est prcis, dans chaque lment contenant des informations traduire, un bouton "Traduire" sera affich. Ce bouton permettra de traduire le texte slectionn en utilisant loutil de traduction spcifi. 3.Pour effectuer la traduction, il suffit de slectionner le texte traduire et cliquer sur le bouton "Traduire". Export et rintgration des informations traduire Loutil WDMSG, disponible sparment, permet dextraire tous les messages dun projet (libell des champs, ...), puis de les rintgrer aprs traduction. Contactez le service commercial de PC SOFT pour plus de dtails sur les conditions dutilisation de ce produit.

3.1Mode de traduction choisi


WebDev propose plusieurs modes de traduction: Traduction automatique des interfaces laide dun outil de traduction spcifique, prsent sur le poste de dveloppement. Cette traduction est ralise directement sous lditeur de WebDev. Export de tous les messages traduire laide de WDMSG et rintgration aprs traduction. Traduction automatique des interfaces Pour chaque objet, diffrentes zones multilingues sont affiches dans les fentres de description de lobjet. Ces zones multilingues permettent de sai 138 Partie 4 : Concepts avancs

3.2Langues utilisant un alphabet spcifique


Si votre site gre des langues utilisant des alphabets spcifiques (Grec, Russe, ...), il est ncessaire de saisir la traduction des diffrents messages multilingues en utilisant ces alphabets spcifiques. WebDev permet de grer automatiquement lutilisation des alphabets spcifiques sous lditeur. En effet, ds que le caret (curseur de saisie de la souris) est positionn dans une zone de saisie dune langue utilisant un alphabet spcifique, la langue dentre (alphabet utilis par le clavier) correspondante est automatiquement active. Ainsi, si vous saisissez un libell dans la zone Russe de la description du libell, lalphabet utilis par le clavier sera automatiquement le russe. Rappel : Pour utiliser des alphabets spcifiques, il est ncessaire dInstaller les fichiers correspondants aux alphabets voulus dans les options rgionales de Windows (panneau de configuration).

teur, il est ncessaire de choisir le mode "Personnalis" lors de lintgration du groupware utilisateur dans votre site (option "Atelier .. Paramtrer le groupware utilisateur"). Les diffrentes pages du groupware utilisateur seront intgres dans votre projet. Il ne restera plus qu traduire ces pages. Remarque: Si ncessaire, dcochez loption "Lancement automatique": vous pourrez ainsi afficher une page de slection de langue avant de lancer la page de login.

3.4Traduction des messages prsents dans le code WLangage


Dans votre code, diverses fonctions du WLangage vous permettent de communiquer avec linternaute au moyen de chanes de caractres. Ces messages doivent tre eux aussi traduits dans les diffrentes langues de votre site. Pour traduire une chane de caractres saisie dans lditeur de code: 1.Slectionnez la chane de caractres traduire. 2.Dans le menu contextuel de la slection, choisissez loption "Traduire". La fentre de traduction des messages saffiche. 3.Saisissez la traduction et validez. La ligne de code apparat sous lditeur de code:

3.3Traductions des pages spcifiques


Gestion des erreurs HyperFileSQL Par dfaut, les pages de gestion des erreurs HyperFileSQL sont fournies en anglais et en franais. Pour les traduire dans une autre langue, il est ncessaire de: 1.Intgrer les pages derreur par dfaut dans votre projet. Les pages sont fournies (avec leur code WLangage) titre dexemple dans le rpertoire \ Programmes\Donnes\Pages prdfinies\HyperFileSQL - Pages assistance automatique. 2.Personnaliser la gestion des erreurs pour utiliser les pages HyperFileSQL de gestion des erreurs (fonction HSurErreur). 3.Traduire les diffrents messages (voir paragraphe prcdent). Groupware utilisateur Par dfaut, le groupware utilisateur est livr en anglais et en franais. Pour traduire un site utilisant le groupware utilisa-

Le drapeau indique que des traductions existent pour cette chane de caractres. Pour afficher la fentre de traduction, il suffit de cliquer sur ce drapeau. Le chiffre (2 dans notre exemple) indique le nombre de traductions saisies pour cette chane de caractres. Remarque: Pour transformer tous les messages de votre code en messages multilingues, slectionnez loption "Code .. Messages multilingues .. Convertir les chanes simples en messages multilingues".

4 Choix de la langue par programmation


Un site multilingue est une application qui pourra tre diffuse dans plusieurs langues. Lutilisateur pourra choisir la langue dexcution de lapplication. Il est possible par exemple: de demander la langue dexcution au premier lancement de lapplication de prvoir une option (option de menu par exemple, ou bouton) permettant lutilisateur de changer de langue en cours dexcution de lapplication

Partie 4 : Concepts avancs 139

10 conseils dergonomie ...


Soignez laccueil dans votre site. La page daccueil est un lment capital dun site. Dans certains sites, elle se rsume un formulaire de connexion mais dans la majorit des sites Internet, cest vritablement la page daccroche avec le visiteur (et futur client du site). Son contenu et sa prsentation doivent tre spcialement tudis. Nhsitez pas lire des ouvrages spcialiss sur lergonomie des sites web pour vous y aider. Prsentez-vous. Lorsque linternaute arrive sur un site, il doit facilement identifier la personne ou la socit responsable du site par un choix de la page daccueil: il suffit dindiquer un nom, une adresse postale et une adresse internet, ...

Dautres informations sont utiles: ladministrateur physique de la socit, numro RCS de la socit... les informations de dclaration la CNIL pour les sites collectant des informations personnelles sur leurs utilisateurs. la date de ralisation du site ou de dernire mise jour. le thme du site, son contenu et sa finalit.
140 Partie 4 : Concepts avancs

Vos pages sont trs longues? Permettez linternaute de retourner directement en haut de page.

Lorsque vos pages sont trs longues (plus de 2 crans), utilisez des boutons ou des liens pour retourner rapidement en haut de la page (et viter lutilisation de lascenseur).

Dbut de la page

Fin de la page avec un lien permettant de revenir en haut de page

Harmonisez le style et lalignement de vos boutons.

Vrifiez que vos boutons utilisent tous le mme "look", et vrifiez lalignement de vos boutons. Lditeur de page dispose dun systme de magntisme et dalignement automatique pour faciliter cette tche.

Boutons non aligns, utilisant diffrents styles

Boutons aligns et harmoniss

Evitez lutilisation de framesets.

Les framesets, mme sils semblent tre une approche efficace au premier abord souffrent de problmes particuliers: ils sont composs en fait de plusieurs pages. Leur rfrencement auprs des moteurs de recherche est plus difficile. La navigation (notamment lemploi de la touche "Back" du navigateur) est difficile comprendre pour les utilisateurs. Il est aujourdhui recommand dviter de dvelopper des sites en utilisant des framesets.
Partie 4 : Concepts avancs 141

Vous affichez des listes de plus de 20 lments? Utilisez plusieurs pages pour lister les lments. Le champ rglette vous permettra de passer dune page lautre sans avoir de code crire et linterface globale de votre site sera moins charge. Le site sera de ce fait plus agrable et plus rapide consulter.

Utilisez des images 100% ou Homothtiques centres.

Pour conserver les proportions de vos images, il est conseill de choisir: soit des images 100% (pour les images statiques ou dynamiques ou si limage est de taille identique celle du champ). soit des images homothtiques centres (pour les images gnres ou les images de taille varie provenant dune base de donnes): la taille de limage sadaptera homothtiquement la zone dfinie pour limage. Les proportions seront respectes.

Image 100 % si la dimension du champ correspond celle de limage, sinon image Homothtique

Image tire (dconseill)

Slection du mode daffichage sous lditeur (description de limage, onglet "Gnral")

142

Partie 4 : Concepts avancs

8 Vous utilisez des images? Testez leur bon affichage dans vos pages.

Image sous lditeur

Image sous le navigateur. Problme daffichage des images

En cas de problme daffichage, vrifiez principalement que: limage existe, limage est enregistre dans un format reconnu par le navigateur (GIF ou JPG par exemple), limage est prsente dans le sous-rpertoire du projet <NomProjet>_WEB.

Linternaute doit saisir une quantit? Utilisez une combo pour simplifier la saisie des quantits.

10 Vous proposez un catalogue de produits avec possibilit de commander?


Indiquez toutes les informations sur le produit (nom, rfrence, prix, ...) chaque fois, y compris le bouton ou le lien permettant de commander le produit.

Partie 4 : Concepts avancs 143

Superposer les champs


Pour obtenir des effets de transparence ou de profondeur, superposez vos champs. Chaque champ possde une option "Le champ peut tre superpos" (onglet "Dtail" de la fentre de description du champ). En cochant cette option, le champ nest plus li aux tables de positionnement de la page. Vous pouvez dplacer et positionner un champ "au-dessus" de chacun des champs de votre page. Attention: Le champ avec loption "Ce champ peut tre superpos" passera au-dessus des autres champs. Si plusieurs champs ont cette option active, leur ordre dempilement peut tre dfini grce aux options "Monter", "Descendre", "Premier plan" et "Arrire plan" du menu "Champ". Par exemple, pour superposer un libell sur une image, il faut rendre le libell superposable et positionner le libell sur limage.

Sous lditeur

Sous le navigateur

Remarque: La superposition ne fonctionne pas sur les navigateurs trs anciens (antrieurs Internet Explorer version 4 ou Netscape 4.7).

144

Partie 4 : Concepts avancs

Type dimage: dynamique, statique, gnre, ... ?


Les images sont souvent utilises pour illustrer les pages des sites.

Diffrents types dimages peuvent tre utiliss avec WebDev. Chaque type correspond une utilisation spcifique de limage.

Voici un rcapitulatif des caractristiques de ces images et de leur mode dutilisation. Conseil: Privilgiez toujours un affichage homothtique pour les images provenant dune base de donnes.

Partie 4 : Concepts avancs 145

Type de limage
Statique

Caractristiques
Limage associe une image statique doit tre slectionne sous lditeur WebDev. Cette image pourra tre change en programmation uniquement dans un code navigateur. Les formats dimage reconnus par WebDev sont autoriss. Lors de lenregistrement de la page, limage est automatiquement convertie au format GIF, JPEG ou PNG, et enregistre dans le rpertoire <NomProjet>_WEB (sauf si limage est dj au format GIF ou JPEG). Lors du dploiement du site WebDev: le fichier associ limage doit tre prsent sur le serveur. si limage est change dans un code navigateur, la nouvelle image doit tre accessible et dans un format reconnu par le navigateur. Une image dynamique peut tre change par programmation dans un code serveur ou dans un code navigateur. Limage associe au champ par programmation doit tre: prsente dans le rpertoire <NomProjet>_WEB. dans un format reconnu par le navigateur (GIF, JPEG ou autre) Attention: lutilisation de mmos binaires nest pas possible.

Image non modifie pendant lutilisation du site (logo de la socit,...) Image modifie uniquement dans un code navigateur (image slectionne par un champ Upload).

Dynamique

Image modifie pendant lutilisation du site (image du produit dans une fiche, photo dans un annuaire, ...) Cest le type dimage le plus souvent utilis.

Gnre

Image dessine pendant lutilisation du site: - graphes (fonctions grXXX) - dessins (fonctions dXXX) Il est possible dutiliser une image de fond.

Une image gnre est construite au cours de lutilisation du site dynamique WebDev. Il est dconseill dutiliser ce type dimage pour afficher des fichiers de type "image" existants: les performances de votre site risquent dtre rduites. Quand le navigateur demande laffichage de limage (lors de laffichage ou de la ractualisation de la page par exemple), une image temporaire du dessin en cours est ralise sur le serveur et enregistre au format JPG. Cette image est affiche sur le navigateur.

Depuis une base de donnes


Images de produits affiches dans une zone rpte

Ces images sont enregistres dans des mmos binaires (mmo) ou dans des champs texte (chemin). Il est conseill dutiliser une image Homothtique centre: toutes les images affiches seront redimensionnes proportionnellement afin dtre affiches dans le champ image.

146

Partie 4 : Concepts avancs

Personnaliser laspect dun site: lments dambiance


Laspect graphique dun site web est un lment primordial. Avec WebDev, il est trs facile dobtenir du premier coup un site graphiquement abouti avec un aspect professionnel. Pour cela, diffrents outils sont votre disposition: les ambiances, les palettes et les modles de pages prdfinis.

Ambiance
Lambiance dun site peut tre slectionne dans la fentre des proprits du projet (option "Projet .. Description du projet"). Les ambiances sont configures dans longlet "Ambiance, Styles". De nombreuses ambiances sont livres en standard avec WebDev.

Une ambiance est compose de: une feuille de styles contenant des styles WebDev. un rpertoire dimages. une palette de couleurs par dfaut. un ensemble dtats utilis comme base pour construire les nouveaux tats du projet. Les ambiances peuvent tre interchanges volont pour modifier laspect graphique dun site. Lorsque vous changez lambiance, WebDev adapte automatiquement laspect visuel de tous les champs du site.
Partie 4 : Concepts avancs 147

Lambiance dune page peut tre dfinie trois niveaux diffrents (par ordre dcroissant de priorit): Dans le projet. Dans le modle de pages dont la page hrite des proprits. Dans la page elle-mme. Il faut dfinir lambiance gnrale au niveau du projet. Si un ensemble de pages doit utiliser une ambiance particulire (par exemple les pages de "Promotion" dun site de vente), il est possible de remplacer lambiance du projet en la redfinissant au niveau dun modle de pages. Si une page particulire doit avoir une ambiance diffrente, celleci peut tre choisie au niveau de la page elle-mme.

Les palettes de couleur


Les palettes de couleurs dfinissent un jeu de couleurs qui sont proposes dans tous les slecteurs de couleurs du projet. Les palettes de couleurs sont un moyen simple de personnaliser laspect visuel dun site. Ces couleurs sont galement appliques sur les styles dfinis dans lambiance du projet afin de permettre de changer rapidement et facilement laspect visuel dun projet. La palette de couleurs dune page peut tre dfinie trois niveaux diffrents (par ordre dcroissant de priorit): Dans le projet. Dans le modle de page dont la page hrite des proprits. Dans la page elle-mme. Il faut dfinir la palette gnrale au niveau du projet. Si un ensemble de pages doit utiliser une palette particulire (par exemple les pages de la partie "Administration" dun site), il est possible de remplacer la palette du projet en la redfinissant au niveau dun modle de pages. Enfin, si une page particulire doit avoir une palette diffrente, la palette peut tre choisie au niveau de la page elle-mme.

Les modles de pages prdfinis


Les modles de pages prdfinis fournissent des structures de pages correspondant une grande varit de sites et favorisent la r-utilisabilit et lharmonie graphique entre les projets. De nombreux modles sont livrs avec WebDev et de nouveaux modles sont livrs rgulirement avec la LST. Il est possible dajouter plusieurs fois le mme modle prdfini dans un projet pour lutiliser avec plusieurs ambiances ou plusieurs palettes de couleurs par exemple. Aprs avoir t ajout au projet, le modle prdfini peut tre ouvert dans lditeur et modifi comme nimporte quel autre modle de pages. Un modle de pages prdfini peut galement tre utilis comme base de cration dun autre modle de pages.

148

Partie 4 : Concepts avancs

Choisir un type de bouton/ lien


Selon lopration effectuer sur les champs de la page, plusieurs types de bouton / lien sont disponibles. Le choix du type de bouton / lien se fait dans la description du champ (onglet "Gnral"). Voici quelques exemples dutilisation "classique" de boutons / liens dans une page: Envoi des donnes de la page en cours au serveur pour traitement Exemple: Formulaire denregistrement: le lien permet de vrifier la validit des informations saisies et dafficher une page de confirmation. Pour effectuer ce type de traitement, utilisez un lien de type "Envoyer la valeur des champs au serveur". Les donnes de la page sont envoyes au serveur pour tre traites. Effectuer un traitement sur le serveur, sans rcuprer les donnes de la page en cours Exemple: Page de menu constitue de boutons: chaque bouton permet de lancer une page du site. Pour effectuer ce type de traitement, utilisez un bouton de type "Aucune". Effectuer un traitement en code navigateur Exemple: Excuter un calcul simple en local, un contrle de saisie, ... Pour effectuer ce type de traitement, utilisez un bouton de type "Aucune". Affichage dune page extrieure au site WebDev Exemple: Lancer un site de moteur de recherche laide dun bouton. Pour effectuer ce type de traitement, utilisez un bouton de type "Aucune".

Rinitialiser les champs de la page Exemple: Lien permettant de vider les champs de la page en cours. Pour effectuer ce type de traitement, utilisez un lien de type "R-initialiser les champs de la page".
Partie 4 : Concepts avancs 149

Empcher le retour sur une page


Le bouton "Prcdent" du navigateur permet linternaute de revenir sur une page dj consulte. Cependant, le retour sur une page nest pas toujours souhaitable. Par exemple, dans un site commercial, si linternaute revient sur la page de validation de commande, il pourrait valider sa commande 2 fois, et donc passer 2 commandes.

Pour empcher le retour sur une page par le bouton "Prcdent" du navigateur: 1. Affichez la page sous lditeur de pages de WebDev. 2. Slectionnez loption "Affichage .. Description de la slection". La fentre de description de la page saffiche. 3. Affichez longlet "Dtail". 4. Cochez loption "Empcher le retour sur cette page par le bouton "Prcdent" du navigateur". 5. Validez.

150

Partie 4 : Concepts avancs

Avantage scuritaire: la gestion du "Back"


Un navigateur permet de parcourir les diffrentes pages dun site laide des boutons "Suivant"( ) et "Prcdent" ( ) de son menu. A chaque nouvelle page dynamique affiche sur le navigateur, un contexte de page spcifique son traitement est cr sur le serveur. Lorsquune mme page dynamique est utilise pour afficher des donnes diffrentes (page avec table fichier, zones rptes ou page de type "Fiche avec parcours",...), le contexte de page prsent sur le serveur varie en fonction des donnes affiches. Lorsque linternaute appuie sur le bouton "Prcdent" (ou "Back"), le navigateur ne prvient ni le site ni le serveur. Le navigateur revient la page prcdente sans le contexte correspondant. Aucune gestion particulire nest ncessaire lorsquon fait un "Back" entre des pages diffrentes. Une gestion spcifique est ncessaire pour une mme page dynamique affichant des donnes diffrentes.

Pourquoi grer le "Back"? Un exemple simple ...


Pour comprendre la ncessit de la gestion du "Back", tudions un exemple simple: une page dynamique qui permet dafficher la liste des lecteurs DVD-ROM disponibles. Etape 1: Affichage de la liste des DVD-ROM

Le contexte contient la liste des lments affichs dans cette table: lecteurs de DVD ROM de la marque CREATIVE.

Partie 4 : Concepts avancs 151

Etape 2: Clic sur le lien "Priphriques suivants".

Les priphriques de la marque "NEC" sont affichs. Le contexte de la page sur le serveur est mis jour: le contexte contient la liste des lments affichs dans cette table (lecteurs de DVD-ROM de la marque NEC). Etape 3: Clic sur le bouton "Back" du navigateur.

La page dynamique affiche sur le navigateur correspond la page affiche ltape1. Cependant le serveur nest pas inform par le navigateur que linternaute a utilis la touche Back. Le contexte de page sur le serveur est toujours celui correspondant aux enregistrements "NEC". Si linternaute slectionne dans la table un lment (DVD ROM de la marque "CREATIVE"), llment slectionn sera llment correspondant dans le contexte: un lment NEC. Il y a dsynchronisation entre la page dynamique visualise et le contexte de page prsent sur le serveur. Le moteur WebDev dtecte cette dsynchronisation.

Une gestion du bouton Back est ncessaire.


152 Partie 4 : Concepts avancs

Comment grer le "Back"?


Pour grer le "Back", vous pouvez utiliser: le code de synchronisation de la page dynamique. Ce code est appel en cas de dsynchronisation. un champ de saisie cach (champ de saisie invisible) pour identifier lenregistrement affich sur le navigateur. loption "Dsactiver le mcanisme de synchronisation des pages pour ce champ" sur vos boutons et/ou vos liens (onglet "Avanc" de la description du bouton). Selon le type daction pouvant tre effectu dans la page dynamique, il est possible de choisir et de combiner lune ou lautre de ces options.

Exemple dtaill de gestion du Back


Une page dynamique permet de parcourir les diffrents produits dun site. Les boutons prsents dans la page sont les suivants: Retour au menu principal Cette action ne ncessite pas de gestion particulire du "Back". Ce bouton ne manipule pas les fichiers de donnes: une dsynchronisation entre le contexte et la page affiche na pas dinfluence. Supprimer le produit en cours Laction "Supprimer le produit en cours" manipule un fichier de donnes. Il est important que lenregistrement supprim corresponde lenregistrement visualis par linternaute. Pour grer le "Back" dans ce cas, il est conseill dutiliser: - un champ cach (invisible) dans la page dynamique: ce champ contiendra lidentifiant de lenregistrement rellement en cours sur le navigateur. - le code de synchronisation: ce code permet de mettre jour le contexte (recherche de lenregistrement visualis par linternaute). Les actions effectues dans le code de synchronisation seront: 1. Relecture de lenregistrement correspondant lidentifiant stock dans le champ cach. 2. Si lenregistrement nest pas trouv: une page derreur est affiche, et le code du bouton "Supprimer" nest pas excut. 3. Si lenregistrement est trouv, le contexte de page est alors automatiquement modifi sur le serveur: le code du bouton "Supprimer" est excut. La scurit totale! Lexemple "Annuaire" livr avec WebDev illustre le cas prsent dans cette page.

Partie 4 : Concepts avancs 153

Grer le bouton Prcdent en pratique


1 Prsentation
Le bouton "Prcdent" ou "Back" du navigateur permet linternaute dafficher les pages prcdentes dj consultes. Dans un site WebDev, chaque page HTML affiche sur le navigateur est associe un contexte de page, prsent sur le serveur. Chaque action effectue dans une page affiche par le navigateur doit entraner une action identique sur le contexte de page correspondant prsent sur le serveur. Or lutilisation du bouton "Prcdent" du navigateur permet de raliser une action uniquement sur le navigateur: la page affiche sur le navigateur et son contexte prsent sur le serveur peuvent donc tre dsynchroniss en cas dutilisation du bouton "Prcdent" du navigateur.

1.2Exemple de dsynchronisation
Voici un exemple de site: Une page du navigateur contient une table fichier reli au fichier ITEM et un lien "Suivant". Le fichier ITEM ne contient quune rubrique, chaque enregistrement est constitu dune lettre de lalphabet. La page permet dafficher 6 lignes de la table, le lien "Suivant" permet dafficher les 6 suivantes. A louverture de la page, la table affiche les 6 premiers enregistrements du fichier (de A F). Voici un enchanement dactions faites par lutilisateur: 1.Clic sur le lien "Suivant" Rsultat: le serveur se positionne sur les 6 enregistrements suivants de ITEM et renvoie au navigateur leurs contenus. Le navigateur affiche la page suivante de la table avec les 6 nouveaux contenus (G L). 2.Clic sur "Prcdent" du navigateur Rsultat: le navigateur affiche la page prcdant la premire action. La table affiche contient les lettres A F. Le serveur na pas t sollicit, il est donc toujours positionn sur les enregistrements G L. 3.Clic sur "Suivant" Rsultat: le serveur se positionne sur les 6 enregistrements suivants de ITEM (donc de M R). Le navigateur se synchronise avec le serveur et affiche les mmes lments: linternaute a limpression que certaines informations ne sont pas affiches. Ce dysfonctionnement peut avoir des consquences inattendues lors dune modification dun enregistrement de fichier (modification de lenregistrement qui nest pas celui visualis par linternaute par exemple). Rappel: chaque action sur le navigateur doit entraner une action du serveur: le serveur envoie alors une rponse au navigateur. Or le clic sur le bouton "Prcdent" du navigateur tant une action navigateur indpendante de votre site WebDev, la deuxime condition peut ne pas tre ralise.

1.1Deux mthodes de gestion du bouton "Prcdent" du navigateur


Pour viter tout problme li la dsynchronisation entre les pages affiches sur le navigateur et les contextes correspondants prsents sur le serveur, WebDev met votre disposition deux modes de gestion du bouton "Prcdent" du navigateur: Solution 1: Empcher le retour sur cette page depuis le bouton "prcdent" du navigateur. Si le bouton "Prcdent" du navigateur est utilis pour afficher la page, cette action naura aucun effet. Solution 2: Gestion de la synchronisation (solution par dfaut) Pour chaque action effectue dans une page depuis le navigateur, un test de synchronisation entre la page HTML et son contexte est automatiquement ralis. Deux modes de gestion de la synchronisation sont possibles: synchronisation par dfaut (mode utilis par dfaut lors de la cration dune nouvelle page). synchronisation programme.

154

Partie 4 : Concepts avancs

2 Empcher lutilisation du bouton "Prcdent"


Si le bouton "Prcdent" du navigateur est utilis pour afficher la page, cette action naura aucun effet.

2.2Mise en place
Pour dsactiver le bouton "Prcdent" du navigateur pour une page prcise: 1.Affichez longlet "Dtail" de la fentre de description de la page (option "Description" du menu contextuel de la page). 2.Cochez loption "Empcher le retour sur cette page depuis le bouton "Prcdent" du navigateur". 3.Validez. Pour dsactiver le bouton "Prcdent" du navigateur pour un frameset: 1.Affichez longlet "Dtail" de la fentre de description du frameset (option "Description" du menu contextuel de la frame). 2.Cochez loption "Empcher le retour sur ce frameset depuis le bouton "Prcdent" du navigateur". 3.Validez. Pour dsactiver le bouton "Prcdent" du navigateur pour toutes les pages du projet: 1.Affichez la description du projet (option "Projet .. Description du projet"). 2.Cliquez sur longlet "Options". 3.Cochez loption "Empcher le retour sur la page depuis le bouton "Prcdent" du navigateur". 4.Validez. Cette option sera automatiquement prise en compte pour toutes les nouvelles pages du site.

2.1Fonctionnement
La dsactivation de la fonction "Page prcdente" du navigateur entrane linsertion du code Javascript suivant dans la page HTML gnre:
<SCRIPT LANGUAGE="JavaScript"> history.forward() </SCRIPT>

Lors de lexcution de la page sous un navigateur, il sera impossible de revenir sur cette page par la touche "Prcdent" du navigateur. Remarques: Lutilisation du bouton "Prcdent" du navigateur peut entraner un clignotement de la page. Ce mcanisme peut tre mis en chec si un clic sur le bouton [STOP] du navigateur intervient avant lexcution de linstruction forward() par le navigateur.

3 Gestion de la synchronisation
3.1Prsentation
Grce au mcanisme de synchronisation des pages, lors de chaque action effectue dans une page une vrification de synchronisation est automatiquement ralise. Cette vrification consiste vrifier si la page affiche sur le navigateur correspond bien au contexte de page prsent sur le serveur. Deux modes de gestion de la synchronisation sont disponibles: 1.Gestion de la synchronisation par dfaut. 2.Gestion de la synchronisation par programmation, dans le code de synchronisation de la page.

3.2Synchronisation par dfaut


Le mcanisme de synchronisation par dfaut est dclench uniquement si loption "Utiliser le mcanisme de synchronisation des pages" est slectionne pour la page. En cas de dsynchronisation, un message davertissement informe linternaute que laction demande na pu tre effectue. La page correspondant au contexte prsent sur le serveur est raffiche. Le site peut continuer fonctionner. Pour mettre en place la gestion de la synchronisation dans une page: 1.Dans longlet "Dtail" de la description de la page (option "Description" du menu contextuel), cochez loption "Utiliser le mcanisme de synchronisation des pages". Partie 4 : Concepts avancs 155

2.Validez. Cette page sera automatiquement incluse dans lhistorique des pages du navigateur: il sera possible de revenir sur cette page par la touche "Prcdent" du navigateur. Pour mettre en place la gestion de la synchronisation dans toutes les pages du projet: 1.Dans la description du projet (option "Projet .. Description du projet", onglet "Options"), cochez loption "Utiliser le mcanisme de synchronisation des pages". 2.Validez. Les pages du projet seront automatiquement incluses dans lhistorique des pages du navigateur: il sera possible de revenir sur ces pages par la touche "Prcdent" du navigateur.

Remarques: Ce mode de gestion ne ncessite aucun code WLangage particulier. Pour les champs de la page ne ncessitant pas une gestion de la synchronisation (bouton "Fermer" par exemple) il est possible de dbrancher le mcanisme de synchronisation: il suffit de cocher loption "Dsactiver le mcanisme de synchronisation des pages pour ce champ" dans longlet "Avance" de la description du champ. Le message davertissement peut tre personnalis (voir le paragraphe suivant).

4 Synchronisation par programmation


Pour grer la synchronisation par programmation: 1.Dans longlet "Dtail" de la description de la page (option "Description" du menu contextuel), cochez loption "Utiliser le mcanisme de synchronisation des pages". 2.Configurez si ncessaire les champs de la page pour lesquels la synchronisation ne doit pas tre gre. Pour chaque champ dclenchant une action sur le serveur, il est possible de paramtrer si la gestion de la synchronisation de la page doit tre effectue (option par dfaut) ou ignore lors de cette action. Pour ignorer la gestion de la synchronisation, il suffit de cocher loption "Dsactiver le mcanisme de synchronisation des pages pour ce champ" dans longlet "Avance" de la description du champ. 3.Saisissez le code ncessaire la gestion personnalise de la synchronisation dans le code de synchronisation de la page. Utilisez la fonction ChangeAction dans le code de synchronisation de la page. Cette fonction permet de dterminer laction qui sera faite en cas de dsynchronisation de la page. Remarques: La fonction ChangeAction est initialise avec laction "Ne rien faire" si une fonction du WLangage permettant dafficher ou de rafficher une page est utilise dans le code de synchronisation de la page. Pour personnaliser le message de dsynchronisation, il suffit de saisir dans le code de synchronisation de la page: 1.le message personnalis. 2.le raffichage de la page en cours sur le serveur (avec la fonction PageActualise par exemple). Pour raliser une synchronisation partir des informations prsentes sur le poste de linternaute, il est conseill de: 1.Utiliser un champ cach contenant lidentifiant de lenregistrement affich et slectionn. 2.Rechercher dans le code de synchronisation lenregistrement en cours sur le navigateur. Cette recherche est ralise partir de son identifiant contenu dans le champ cach. 3.Ractualiser la page.

156

Partie 4 : Concepts avancs

Cookies: des informations conserves chez linternaute


Un cookie est un fichier enregistr par le site WebDev sur le poste de linternaute. Ce fichier peut tre relu tout moment depuis le serveur ou par le navigateur. Les cookies permettent de stocker des informations persistantes sur le poste de linternaute. Par exemple, lors de la premire connexion de linternaute, des informations lui sont demandes: son nom dutilisateur, son login, ... et sont stockes sur sa machine. Lors des connexions suivantes, le site WebDev ira directement lire ces informations dans le cookie cr lors de la premire connexion et pourra saluer linternaute par son prnom ds la premire page.

1re connexion
Le site WebDev enregistre des informations donnes par linternaute sur son poste.

Le nouvel internaute doit ici saisir son nom et son mot de passe

Connexions suivantes
Le site WebDev lit des donnes prcdemment enregistres sur le poste de linternaute.

Le site WebDev affiche par dfaut les informations lues dans le cookie

Pour crer des cookies dans un site WebDev, utilisez la fonction du WLangage CookieEcrit. Pour lire les cookies dans un site WebDev, utilisez la fonction du WLangage CookieLit.

Partie 4 : Concepts avancs 157

Protger laccs au site: mots de passe


Une gestion daccs un site par mot de passe est ncessaire dans deux cas: 1. Protger des informations personnelles 2. Limiter laccs un site

Protger des informations personnelles


Pour accder de nouveau des donnes personnelles, linternaute peut spcifier un mot de passe. Ainsi, dans un site commercial, un mot de passe dfini par linternaute lui permet daccder au dtail de ses prcdentes commandes. Dans ce cas, la gestion de laccs un site ncessite: une identification: A la premire connexion, linternaute sidentifie et saisit son mot de passe. Aux connexions suivantes, linternaute sidentifie et accde aux fonctionnalits qui lui sont rserves (son historique, ...). la possibilit pour linternaute de retrouver un mot de passe oubli. WebDev est livr avec toutes les ressources ncessaires la gestion de mots de passe personnels.

Limiter laccs un site


Par dfaut, un site internet est accessible nimporte quel internaute. Mais un site nest pas toujours destin au grand public: certaines fonctionnalits peuvent tre rserves certains types dinternautes (administrateur de site, ...). Dans ce cas, le gestionnaire du site attribue un mot de passe chaque internaute. Ce mot de passe ne pourra pas tre modifi. Ce mot de passe permet un accs des fonctionnalits plus ou moins limites. Par exemple, dans un site commercial: un mot de passe spcifique sera attribu aux commerciaux: ils accderont aux statistiques de ventes, ... un mot de passe spcifique sera attribu lquipe marketing: ils pourront mettre en ligne de nouveaux produits. WebDev permet de grer simplement ces diffrents types daccs un site.

158

Partie 4 : Concepts avancs

TLS/SSL: Crypter les informations sur le Web


Par dfaut, les donnes circulant entre le poste de linternaute et le serveur Web ne sont pas cryptes. Lauthenticit de lidentit du serveur, la confidentialit, et lintgrit des donnes changes ne sont pas certifies. Pour assurer la confidentialit, le mcanisme le plus employ est lutilisation du protocole TLS/SSL (Transport Layer Security, anciennement Secure Socket Layer). Ce protocole permet de garantir lidentit du serveur auquel linternet accde et crypte les donnes changes entre le serveur et le navigateur.

Mise en place des transactions scurises par protocole TLS/SSL


Pour mettre en place des transactions scurises par TLS/SSL, il est ncessaire deffectuer les formalits lies ce protocole (certification payante dune cl SSL par un organisme spcialis ou gnration dune cl auto-signe pour une utilisation prive ou des fins de test). Pour plus de dtails, consultez laide en ligne de WebDev.

Transactions scurises par TLS/SSL dans un site WebDev


Gnralement, seul le transfert de donnes sensibles doit tre scuris: transfert du numro de carte bancaire par exemple. En effet, le mode scuris est plus lent. Toutefois, un nombre croissant de sites fonctionne entirement en TLS/SSL grce laugmentation de la puissance des machines ce qui assure une plus grande confidentialit des oprations des utilisateurs. La mise en place dune transaction scurise est effectue lors de louverture dune nouvelle page par un bouton (ou un lien). Il suffit dutiliser la fonction SSLActive dans le code navigateur du bouton (ou du lien). Ds louverture de la page scurise, toutes les actions effectues seront en mode scuris (cest-dire crypt). Pour revenir en mode non scuris, il suffit dutiliser la fonction SSLActive(Faux) dans le code navigateur dun bouton (ou dun lien) permettant douvrir une nouvelle page.

Partie 4 : Concepts avancs 159

Paiement scuris avec prestataire


Diffrents prestataires permettent de proposer un paiement scuris pour tous les sites commerciaux. Tout paiement ralis avec une carte bancaire est valid par le prestataire auprs du centre de carte bancaire. Les diffrentes tapes du paiement sont les suivantes:

1. Le client valide sa commande. 2. Le site WebDev demande un dbit au prestataire. 3. Le prestataire demande la saisie du numro de carte. 4. Le client saisit son numro de carte. 5. Aprs vrification, le prestataire envoie un numro daccord. 6. La commande est accepte.
160 Partie 4 : Concepts avancs

Envoyer des emails


Dans un site web, les emails permettent: aux internautes de communiquer entre eux: envoi demails au responsable du site, site de mailing-list, ... de valider une prise de commande: dans un site commercial, un email est envoy aux internautes pour valider leur commande. de transfrer des donnes dun poste un autre: les nouvelles commandes saisies sur un site commercial sont transfres par email au sige de la socit pour traitement, ... WebDev permet denvoyer des emails depuis un site par 2 mthodes.

Envoi de lemail depuis le poste de linternaute

Utilisez cette mthode lorsque linternaute doit envoyer un email une adresse dfinie: auteur du site, support technique, service commercial, ... La fonction navigateur EmailOuvreMessagerie permet douvrir le logiciel de messagerie de linternaute. Certains paramtres peuvent tre remplis par dfaut: adresse email du destinataire, ...

Cette mthode permet dutiliser directement la messagerie de linternaute: aucun traitement spcifique nest effectuer dans le site WebDev.
Partie 4 : Concepts avancs 161

Dans ce cas, cest le serveur qui gre lenvoi des emails. Lenvoi des emails peut tre ralis: directement dans le site dynamique WebDev (par exemple pour un transfert de donnes par email, ou pour un email de validation de commande); par le spooler demail (livr avec WebDev).

Envoi de lemail depuis le serveur (pages dynamiques uniquement)

Utilisez cette mthode pour une gestion personnalise des emails: un contrle sur le contenu des emails envoys par les internautes (cas dun site de type "liste de diffusion"), la vrification de la validit de ladresse du destinataire, le cryptage des informations envoyes par emails, la validation dun traitement, ...

162

Partie 4 : Concepts avancs

Partie 5 Bases de donnes

164

Partie 5 : Bases de donnes

Analyse: Structure de la base de donnes


Lorsquun projet WebDev, WinDev ou WinDev Mobile utilise des fichiers de donnes, ce projet doit tre associ une analyse. Une analyse permet de dcrire les structures de donnes (fichiers de donnes, rubriques, ...) utilises dans votre projet. Lditeur danalyses permet de crer trs simplement une analyse.

Lanalyse dun projet WinDev correspond au MLD (Modle Logique des Donnes). Toute la structure et lorganisation des donnes sont dcrites: les donnes sont regroupes par fichier. Chaque fichier contient plusieurs donnes appeles rubrique. Dans lanalyse, il est possible de lier la description dun fichier de donnes un type de fichier (HyperFileSQL, Oracle, ...).

Partie 5 : Bases de donnes

165

Lanalyse en pratique
1 Prsentation
Lorsquun projet utilise des fichiers de donnes, ce projet doit tre associ une analyse. Une analyse permet de dcrire les structures de donnes (fichiers, rubriques,...) utilises dans votre projet. Pour dcrire une analyse, deux mthodes sont possibles: 1re mthode : Cration directe de lanalyse (cest-dire un Modle Logique des Donnes (MLD)). Cette opration est dtaille dans le paragraphe "Cration dun MLD (Modle Logique des Donnes)", page 166. 2me mthode : Cration du Modle Conceptuel des Donnes (MCD), puis cration automatique de lanalyse partir du MCD. Ces oprations sont dtailles dans les paragraphes "Cration dun MCD (Modle Conceptuel des Donnes)", page 172 et "Gnration du MCD en MLD", page 173. Ce chapitre prsente chacune de ces mthodes.

2 Cration dun MLD (Modle Logique des Donnes)


Dans WebDev, les termes "MLD" et "Analyse" sont utiliss indiffremment pour dfinir la structure de la base de donnes associe un projet.

2.2Ajouter un fichier de donnes dans une analyse


Lanalyse permet de dcrire la structure des fichiers de donnes utiliss par le projet. Un fichier de donnes prsent dans lanalyse peut tre: Un nouveau fichier de donnes. Un fichier de donnes pr-dfini, livr avec WebDev. Un fichier de donnes import depuis une base existante (utilisant par exemple un format de fichiers spcifique). Les paragraphes suivants dtaillent comment crer un fichier de donnes. Pour crer un nouveau fichier de donnes: 1.Slectionnez loption "Insertion .. Fichier de donnes". Lassistant se lance. 2.Cochez loption "Crer une nouvelle description dun fichier de donnes". 3.Spcifiez: le nom logique du fichier de donnes. Ce nom sera utilis pour manipuler le fichier. le libell du fichier de donnes rsumant succinctement le sujet du fichier de donnes. la reprsentation dun enregistrement dans le fichier de donnes. Cette reprsentation permet damliorer la lisibilit des questions poses lors de la description des liaisons. Cette option doit tre prcde dun article indfini (UN ou UNE).

2.1Crer une analyse (ou MLD)


Pour crer un MLD: 1.Slectionnez loption "Fichier .. Nouveau .. Analyse". Lassistant de cration de lanalyse est lanc. 2.Spcifiez: le nom et le rpertoire de lanalyse. Lanalyse correspond un fichier ".WDA". Par dfaut, ce fichier sera cr dans le rpertoire de lanalyse du projet (rpertoire <Nom du projet>.ANA). Ce rpertoire doit tre accessible en lecture et en criture. le libell de lanalyse dcrivant succinctement le sujet de lanalyse. si lanalyse doit tre associe au projet en cours. le ou les type(s) de bases de donnes manipules par le projet. 3.La cration du premier fichier de donnes est automatiquement propose. 4.Crez lensemble des lments (fichiers de donnes, rubriques et liaisons) de votre analyse.

166

Partie 5 : Bases de donnes

si le fichier de donnes possde une rubrique de type "Identifiant automatique". La valeur de cette rubrique est unique pour chaque enregistrement et est automatiquement calcule par WebDev. le type de la base de donnes pour laquelle le fichier de donnes va tre cr. Selon le type choisi, ce fichier de donnes sera manipul par le moteur HyperFileSQL, par un pilote OLE DB ou par un des accs natifs de WebDev (SQL Server, Oracle,...). si la taille du fichier peut dpasser 2 Go. Cette option est utilisable uniquement si le systme des fichiers du poste serveur et des postes sur lequel les fichiers de donnes sont installs pour WebDev est au format NTFS (Windows 2000, NT ou XP). Attention: Si cette option est coche, il ne sera pas possible douvrir ce fichier de donnes sous Windows 95, 98 ou Me. si le fichier de donnes doit grer la rplication. Cette option permet de grer les mises jour automatiques de bases de donnes identiques et distantes. Pour plus de dtails sur la rplication, consultez laide en ligne. 4.Le fichier de donnes cr devient le fichier de donnes en cours. La fentre de description des rubriques du fichier de donnes souvre automatiquement. Vous pouvez dcrire les rubriques du fichier de donnes. Pour importer une description pr-dfinie dun fichier de donnes: 1.Slectionnez loption "Insertion .. Fichier de donnes". 2.Cochez loption "Slectionner une description parmi des fichiers de donnes pr-dfinis". 3.Choisissez le fichier de donnes pr-dfini. Ce fichier de donnes sera import dans lanalyse en cours. Ce fichier de donnes pourra tre modifi par la suite. 4.Slectionnez les rubriques conserver. Ces rubriques pourront tre modifies par la suite. 5.Spcifiez si les liaisons doivent tre automatiquement recherches. Si cette option est coche, les rubriques de mme nom seront relies. 6.Le fichier de donnes import est automatiquement insr dans lanalyse en cours.

Remarque: Pour modifier un fichier de donnes ou les rubriques dun fichier de donnes, slectionnez le fichier de donnes et activez loption "Structure de fichiers .. Description des fichiers de donnes" ou "Structure de fichiers .. Rubriques". Pour importer la description existante dun fichier de donnes, deux solutions sont possibles: Solution 1: depuis lditeur danalyses 1.Slectionnez loption "Insertion .. Fichier de donnes". 2.Cochez loption "Utiliser des fichiers de donnes dune base existante", puis slectionnez le type de la base de donnes. 3.Prcisez le format des donnes utilis par votre projet. Il est possible de conserver le format actuel ou de migrer les fichiers de donnes au format HyperFileSQL. 4.Si ncessaire, slectionnez lanalyse WebDev dans laquelle la description doit tre importe (analyse existante ou nouvelle analyse). 5.Spcifiez la base de donnes source contenant les descriptions importer et le type de cette base de donnes source. Selon le type choisi, renseignez les informations demandes. 6.Slectionnez les tables ou fichiers dont la description doit tre importe et validez. 7.Le fichier de donnes import est automatiquement insr dans lanalyse en cours. Solution 2: Depuis lexplorateur de Windows "Droppez" directement la description du fichier de donnes de lexplorateur Windows vers lditeur danalyses. Par exemple:

Ici: une base de donnes Oracle, sur le serveur. Il suffit de faire glisser le nom de la base ...

Partie 5 : Bases de donnes

167

Remarque: il est galement possible de crer une rubrique partir des mta-types proposs par WebDev. Pour cela, il suffit de cliquer sur le bouton "+M" droite du tableau. La liste des mta-types disponibles apparat.

2.4Crer une liaison


Il est possible de crer diffrents types de liaison entre les fichiers de donnes. Pour plus de dtails sur les liaisons, consultez le paragraphe "Caractristiques des liaisons dfinies dans une analyse", page 168. ...pour en transfrer la description sous lditeur danalyses. Pour crer une liaison: 1.Slectionnez loption "Insertion .. Liaison". Le curseur de la souris se transforme en crayon. 2.Slectionnez les deux fichiers de donnes relier. La fentre de description de liaison souvre automatiquement. 3.Pour dfinir les cardinalits: soit slectionnez directement les cardinalits parmi celles proposes (0,1 ; 1,1 ; 0,N ; 1,N). soit rpondez aux questions poses. Les cardinalits seront mises jour automatiquement. 4.Pour dcrire des cardinalits avances, cochez loption "Afficher les cardinalits avances" et rpondez aux questions poses. 5.Saisissez le libell de la liaison en dcrivant succinctement le sujet de la liaison. 6.Spcifiez les cls relier. 7.Prcisez les rgles dintgrit. Ces rgles permettent dassurer la cohrence des donnes lors de la modification ou lors de la suppression dune des cls de la relation. 8.Validez. La liaison est automatiquement cre.

2.3Crer une rubrique


Pour crer une rubrique: 1.Double-cliquez sur le fichier de donnes dans lequel la rubrique doit tre cre. La fentre de description des rubriques du fichier de donnes souvre. 2.Cliquez sur la premire ligne vide du tableau des rubriques. 3.Spcifiez le nom, le libell et le type de la rubrique directement dans le tableau. 4.Indiquez dans la partie droite de lcran les dtails concernant la nouvelle rubrique (type, taille, valeur par dfaut, sens de parcours,...). 5.Indiquez dans la partie basse de lcran les dtails concernant les informations partages. 6.Validez la description de la rubrique.

3 Caractristiques des liaisons dfinies dans une analyse


3.1Fichier propritaire et fichier membre
Dans le cas de liaison entre deux fichiers de donnes, il existe un fichier propritaire et un fichier membre: le fichier propritaire est propritaire de la cl. le fichier membre est un membre des fichiers de lanalyse contenant une copie de la cl. Pour grer la liaison entre deux fichiers de donnes, la cl du fichier propritaire est copie dans le fichier membre. Par exemple, la cl du fichier Fournisseur est copie dans chaque enregistrement du fichier Produit. Plusieurs enregistrements du fichier Produit peuvent avoir la mme cl du fichier Fournisseur: le fichier propritaire est Fournisseur, le fichier membre est Produit. La reprsentation dune telle liaison est la suivante:

168

Partie 5 : Bases de donnes

3.2Les cardinalits
Les cardinalits permettent de dnombrer les liens entre les fichiers de donnes. La cardinalit est dfinie en fonction des rponses aux deux questions suivantes: 1.Pour chaque enregistrement du fichier de donnes, combien denregistrements de lautre fichier de donnes au minimum cet enregistrement est-il reli? La rponse fournit la premire partie de la cardinalit (cardinalit minimale): si la rponse est "aucun", la cardinalit est du type 0,X. si la rponse est "un seul", la cardinalit est du type 1,X. 2.Pour chaque enregistrement du fichier de donnes, combien denregistrements de lautre fichier de donnes au maximum cet enregistrement est-il reli? La rponse fournit la deuxime partie de la cardinalit (cardinalit maximale): si la rponse est "un seul", la cardinalit est du type X,1. si la rponse est "plusieurs", la cardinalit est du type X,N. La rponse ces deux questions dfinit la cardinalit qui peut tre de type: 0,1 ; 0,N ; 1,1 ; 1,N La description des cardinalits est fondamentale: elle est la base du respect de lintgrit rfrentielle de la base de donnes. Pour plus de clart, ces deux questions peuvent tre dcomposes en quatre questions. Par exemple, pour dcrire une liaison entre le fichier Fournisseur et le fichier Produit:

Oui/Non? chaque "produit" peut avoir plusieurs "fournisseurs": Oui/Non? Exemple de cardinalits: Cet exemple prsente deux cardinalits diffrentes:

Cardinalit 0,1: Une personne peut tre inscrite un seul club de sport. Cette personne nest pas oblige dtre inscrite un club de sport. Cardinalit 0,N: Un club peut avoir aucune ou plusieurs personnes inscrites.

3.3Les cardinalits avances


Il est possible de dfinir avec plus de prcision les cardinalits. On parle alors de cardinalits avances. Ces cardinalits permettent de prciser exactement la cardinalit minimale et la cardinalit maximale. Pour dfinir les cardinalits avances, cochez loption "Affichez les cardinalits avances" dans la description de la liaison (option "Insertion.. Liaison"). Exemple de cardinalits avances: Cet exemple prsente deux cardinalits diffrentes:

Cardinalit 0,1: Une personne peut tre inscrite un seul club de sport. Cette personne nest pas oblige dtre inscrite un club de sport. Cardinalit 0,10: Un club peut avoir de 0 10 personnes inscrites.

3.4Lintgrit rfrentielle
Lintgrit rfrentielle dune base de donnes correspond au respect des contraintes impliques par les liaisons entre les fichiers de donnes. Lintgrit rfrentielle consiste vrifier par exemple que: si un enregistrement est supprim dans le propritaire, les enregistrements correspondants dans les membres sont galement supprims, Partie 5 : Bases de donnes 169

chaque "fournisseur" a au moins un "produit": Oui/Non? chaque "fournisseur" peut avoir plusieurs "produits": Oui/Non? chaque "produit" a au moins un "fournisseur":

si un enregistrement est ajout dans un membre, il existe un enregistrement correspondant dans le propritaire, si un enregistrement est modifi dans un propritaire, la cl unique nest pas modifie, ... La vrification de lintgrit rfrentielle dpend de la nature de la liaison entre les fichiers de donnes. Pour plus de dtails sur le contrle de lintgrit rfrentielle, consultez laide en ligne.

chier de donnes (Catgorie).

Une liaison facultative est ralise en copiant lidentifiant de chacun des fichiers de donnes dans lautre fichier de donnes. Liaison de complment Dans le cas dune liaison de complment: Chaque enregistrement dun fichier de donnes (Produit) na aucun enregistrement ou un seul enregistrement associ dans un autre fichier de donnes (Dtail). Chaque enregistrement de lautre fichier de donnes (Dtail) a ncessairement un enregistrement associ dans le premier fichier de donnes (Produit).

3.5Les diffrents types de liaisons


Les liaisons entre les fichiers de donnes peuvent tre de plusieurs types: parallle facultative de complment partage complexe Liaison parallle Dans le cas dune liaison parallle, chaque enregistrement dun fichier de donnes (Produit) est reli un enregistrement dans un autre fichier de donnes (Information), et rciproquement.

Pour grer une liaison parallle, lidentifiant du fichier Produit est copi dans le fichier Information. Cet identifiant est galement cl unique dans le fichier Information. Le fichier propritaire est alors Produit, et Information est le fichier membre. Remarque: Ce type de liaison est rare car les deux fichiers peuvent tre regroups en un seul. Le paralllisme des enregistrements dans le fichier est respect si les oprations suivantes sont excutes simultanment sur les deux fichiers: cration dun enregistrement suppression dun enregistrement rindexation avec compactage Liaison facultative Dans le cas dune liaison facultative: Chaque enregistrement dun fichier de donnes (Catgorie) na aucun enregistrement ou un seul enregistrement associ dans un autre fichier de donnes (Groupe). Chaque enregistrement de lautre fichier de donnes (Groupe) na aucun enregistrement ou un seul enregistrement associ dans le premier fi 170 Partie 5 : Bases de donnes

Les liaisons de complment sont assez frquentes. Elles sont notamment utilises lorsquun enregistrement peut avoir des complments dinformations optionnels. Pour grer une liaison de complment, la cl du fichier Produit est copie dans le fichier Dtail. Pour assurer la cardinalit maximale de 1, elle reste cl unique. Lunicit de cette cl interdit linsertion de plus dun enregistrement dans le fichier Dtail pour un enregistrement du fichier Produit. Le fichier propritaire est Produit, le fichier membre est Dtail. Liaison partage Dans le cas dune liaison partage, un mme enregistrement dans un fichier de donnes (Fournisseur) peut tre partag par plusieurs enregistrements dans un autre fichier de donnes (Produit). Pour grer une liaison partage, la cl du fichier Fournisseur est copie dans le fichier Produit. Elle devient cl multiple pour acclrer la vrification de lintgrit. Le fichier propritaire est Fournisseur, le fichier membre est Produit. Selon la cardinalit, il est possible de distinguer quatre types de liaisons partages: Liaison partage de cardinalit 0,n - 0,1 Liaison partage de cardinalit 0,n - 1,1 Liaison partage de cardinalit 1,n - 0,1 Liaison partage de cardinalit 1, n - 1,1

Liaison partage de cardinalit 0,N - 0,1

Avec ce type de liaison: un propritaire peut ne pas avoir de membre (un fournisseur na pas obligatoirement de produit). un membre peut ne pas avoir de propritaire (un produit na pas obligatoirement de fournisseur). Liaison partage de cardinalit 0,N - 1,1

Liaison partage de cardinalit 1,N - 1,1 Avec ce type de liaison: chaque propritaire a au moins un membre (chaque fournisseur a au moins un produit). chaque membre a un seul propritaire (chaque produit a un seul fournisseur).

Avec ce type de liaison: un propritaire peut ne pas avoir de membre (un fournisseur peut navoir aucun produit). chaque membre a un seul propritaire (chaque produit a un seul fournisseur). Remarque: Ce type de liaison est frquent. WebDev permet de crer automatiquement les pages permettant de grer les fichiers de donnes lis par une liaison de type 0,N-1,1. Liaison partage de cardinalit 1,N - 0,1 Avec ce type de liaison: chaque propritaire a au moins un membre (un fournisseur a au moins un produit). un membre peut ne pas avoir de propritaire (un produit peut navoir aucun fournisseur).

Liaison complexe Dans le cas dune liaison "complexe", il est ncessaire de grer un fichier de liaison, appel fichier de relation. Le fichier de relation sera automatiquement cr. Il contiendra une cl unique compose des deux cls des fichiers relis. Le fichier de relation peut galement contenir des informations spcifiques la liaison. Une liaison complexe se dcompose alors en deux liaisons de type partag. Exemple de liaison complexe Une commande (fichier Commande) peut contenir un ou plusieurs produits. Un produit (fichier Produit) peut tre utilis dans plusieurs commandes. Dans ce cas, il faut avoir un fichier de liaison (fichier LigneCommande). Le fichier LigneCommande contient: une cl unique compose des cls de Produit et de Commande. le nombre de produits commands. Les liaisons entre les fichiers de donnes sont les suivantes:

4 Manipulations possibles sur une analyse


WebDev permet de raliser les manipulations suivantes sur une analyse: Dupliquer / Copier un MLD: La duplication dun MLD permet de disposer de deux MLD identiques de nom diffrent. Supprimer un MLD. Renommer un MLD. Associer un MLD un projet. Agrandir ou rduire laffichage dun MLD sous lditeur. Dplacer laffichage du MLD sous lditeur. WebDev permet de raliser les manipulations suivantes sur un fichier de donnes prsent dans lditeur danalyses: Dupliquer / Copier un fichier de donnes. Supprimer un fichier de donnes. Renommer un fichier de donnes. Partie 5 : Bases de donnes 171

WebDev permet de raliser les manipulations suivantes sur une rubrique dun fichier de donnes prsent dans lditeur danalyses: Dupliquer / Copier une rubrique.

Supprimer une rubrique. Renommer une rubrique. Pour plus de dtails, consultez laide en ligne.

5 Cration dun MCD (Modle Conceptuel des Donnes)


Selon la mthodologie MERISE, le modle conceptuel de donnes dfinit les objets et les actions devant tre pris en compte dans la base de donnes. Ce modle reprsente uniquement les structures dinformation et les changes dinformation du systme tudi, indpendamment des contraintes physiques lies la nature de la base de donnes utilise. WebDev. les notes dtaillant le fonctionnement de lentit (onglet "Divers"). 3.Lentit devient lentit en cours. WebDev propose automatiquement de dcrire les proprits de cette entit.

5.3Crer une association


Pour crer une association: 1.Slectionnez loption "Association .. Nouvelle association". La description de lassociation souvre. 2.Spcifiez: le nom de lassociation. Lors de la gnration du MCD en MLD, ce nom sera le nom logique du fichier cr si cette association comporte au moins une proprit ou fait parti dune liaison complexe. le libell de lassociation rsumant succinctement le sujet de lassociation. les notes dtaillant le fonctionnement de lassociation. 3.Lassociation devient lassociation en cours. WebDev propose automatiquement de dcrire les proprits de cette association.

5.1Crer un MCD
Pour crer un MCD: 1.Slectionnez loption "Fichier .. Nouveau .. MCD". Lassistant de cration du MCD se lance. 2.Spcifiez: le nom et le rpertoire du MCD. Le MCD correspond un fichier ".MCD". Par dfaut, ce fichier sera cr dans le rpertoire de lanalyse du projet (rpertoire <Nom du projet>.ANA). Ce rpertoire doit tre accessible en lecture et en criture. le libell du MCD dcrivant succinctement le sujet du MCD. si le MCD doit tre directement associ lanalyse en cours. Cette analyse peut tre une analyse existante ou une analyse crer. 3.Le MCD cr devient le MCD en cours. WebDev propose automatiquement de crer la premire entit. 4.Crez lensemble des lments (entits, associations, proprits et relations) de votre MCD.

5.4Crer une proprit


Pour dcrire une proprit: 1.Double-cliquez sur lentit ou sur lassociation dans laquelle la proprit doit tre cre. La fentre de description des proprits souvre. 2.Cliquez sur la premire ligne vide du tableau des proprits ou cliquez sur licne "+". 3.Spcifiez le nom, le libell, le type, la taille et les notes de la proprit. 4.Dans le cas dune proprit dentit, cochez loption "Identifiant" si la proprit est lidentifiant de lentit. 5.Validez la description de la proprit.

5.2Crer une entit


Pour crer une entit: 1.Slectionnez loption "Entit .. Nouvelle entit". La description de lentit saffiche. 2.Spcifiez: le nom de lentit. Ce nom sera le nom logique du fichier cr lors de la gnration du MCD en MLD. le libell de lentit rsumant succinctement le sujet de lentit. si une proprit de type "Identifiant automatique" doit tre dfinie dans lentit. La valeur de cette proprit est unique pour chaque enregistrement et est automatiquement calcule par 172 Partie 5 : Bases de donnes

5.5Crer une relation


Pour crer une relation: 1.Slectionnez loption "Entit .. Tracer une relation". Le curseur de la souris se transforme en crayon.

2.Slectionnez soit les deux entits relier, soit lentit et lassociation relier. 3.Dfinissez les cardinalits de la relation.

5.6Dfinir les cardinalits


Pour dfinir les cardinalits: 1.Slectionnez la relation dont les cardinalits doivent tre dfinies. 2.Slectionnez loption "Entit .. Informations sur la relation". 3.Choisissez la cardinalit parmi celles proposes. 4.Validez la description des cardinalits.

6 Principales manipulations dun MCD


WebDev permet de raliser les manipulations suivantes sur un MCD: Supprimer un MCD. Renommer un MCD. Spcifier un facteur de zoom pour rduire ou agrandir laffichage du MCD en cours. Dplacer laffichage du MCD. WebDev permet de raliser les manipulations suivantes sur une entit dun MCD: Dupliquer / Copier une entit. Supprimer une entit. Renommer une entit. WebDev permet de raliser les manipulations suivantes sur une association dun MCD: Dupliquer / Copier une association. Supprimer une association. Renommer une association. WebDev permet de raliser les manipulations suivantes sur une proprit dun MCD: Supprimer une proprit. Renommer une proprit. Pour plus de dtails, consultez laide en ligne.

7 Gnration du MCD en MLD


Pour associer un MCD un projet, il est ncessaire de gnrer le MLD associ. Rappel: Cest le MLD qui est associ au projet et non le MCD. La gnration du MCD permet de crer automatiquement le MLD correspondant aprs avoir vrifi la validit du MCD. Pour gnrer le MCD en MLD: 1.Slectionnez loption "Analyse .. Gnrer le modle logique". 2.Dfinissez les paramtres de la gnration du MCD en MLD: le nom et le chemin du MLD gnr. Le MLD correspond un fichier ".WDA". Par dfaut, ce fichier sera cr dans le rpertoire de lanalyse du projet (rpertoire <Nom du projet>.ANA). Ce rpertoire doit tre accessible en lecture et en criture. si les libells des associations sans proprits (du MCD) sont conservs pour identifier les liaisons (du MLD). le type daccs aux fichiers de donnes. Selon le type choisi, les fichiers de donnes seront mani puls par le moteur de WebDev, par un pilote OLEDB ou par un des accs natifs de WinDev (SQL Server, Oracle,...). le type de la base de donnes utilise. le format des caractres utiliss dans lanalyse. 3.Validez la gnration. Le MLD correspondant au MCD est automatiquement cr. Cas particulier: Mise jour dun MLD existant Si le nom et le chemin du MLD spcifis lors de la gnration du MCD correspondent un MLD existant, le MLD existant va tre mis jour avec la nouvelle description du MCD. Lors de la mise jour dun MLD existant, la gnration vrifie: 1.Lexistence de lentit dans le MLD: si lentit est nouvelle, le fichier de donnes correspondant est cr. si lentit existe dj, ses proprits sont mises jour. 2.Lexistence des proprits dans le MLD: si la proprit est nouvelle, la rubrique corresponPartie 5 : Bases de donnes 173

dante est cre. si la proprit existe dj, avec la mme description, aucune action nest ralise. si la proprit existe dj, avec une description diffrente, il y a un conflit. Lditeur danalyses propose: soit dignorer la nouvelle description de la proprit et de ne faire aucune modification. soit de mettre jour la rubrique existante avec la nouvelle description de la proprit. soit de crer une nouvelle description synonyme avec la nouvelle description de la proprit. 3.Lexistence des relations et associations. Lorsque lassociation ncessite la cration dun ou de plusieurs fichiers de relation, les fichiers de donnes et les rubriques du MLD sont mis jour de la manire dcrite ci-dessus. Lorsquune relation a t modifie, la liaison du MLD est recre ou mise

jour: si les proprits identifiantes dune des entits ont t modifies, les cardinalits des liaisons existantes sont mises jour et les nouvelles liaisons sont cres. si aucune proprit identifiante dune des entits na t modifie, les cardinalits sont simplement mises jour. Remarques: La suppression dentits, de relations ou dassociations nest pas prise en compte lors de la gnration du MCD en MLD. La suppression de proprits dune entit peut tre prise en compte en dcochant "Conserver les modifications du MLD" des options de la gnration du MCD en MLD. Dans ce cas, les fichiers du MLD contiennent uniquement les rubriques de lentit correspondante du MCD aprs la conversion.

8 Gnration de lanalyse (MLD)


La gnration de lanalyse intervient avant la phase de programmation et aprs la phase de description des fichiers de donnes. Cette gnration permet de: valider les modifications effectues sur lanalyse (MLD). crer les modules ncessaires la programmation. mettre jour automatiquement les fichiers de donnes si ncessaire. Tant que lanalyse (le MLD) na pas t gnre, la description de lanalyse (les fichiers de donnes) ne pourra pas tre utilise dans le projet. La gnration (option "Analyse .. Gnration") comporte trois tapes: vrification des modifications effectues et gnration des fichiers de donnes de la description de lanalyse. modification automatique des fichiers de donnes accessibles (fichiers prsents dans le rpertoire "EXE" du projet). Synchronisation du projet.

9 Gestion des versions de lanalyse


WebDev permet de grer les diffrentes versions de lanalyse (option "Analyse.. Gestion des versions"). Il est alors possible de travailler sur lanalyse en cours ou sur une analyse spcifique. Remarque: lorsquune analyse est endommage, il est possible de slectionner directement lanalyse endommage pour restaurer par exemple une des versions prcdentes. Toutes les versions de lanalyse sont visualises sous forme dun graphique. Le carr jaune indique le numro de version de lanalyse; le libell droite rappelle la date de la gnration. 174 Partie 5 : Bases de donnes Entre deux versions figurent des "petits rectangles" qui signifient: un rectangle: il y a eu peu de modifications effectues entre les deux versions. plusieurs rectangles: il y a eu plusieurs modifications effectues entre les deux versions. Pour visualiser le dtail des modifications effectues entre deux versions: Double-cliquez sur la ligne contenant les "petits rectangles" ou cliquez sur le bouton [Modifications].

Les options disponibles dans le gestionnaire de versions sont: Restauration dune analyse. Annulation de la dernire gnration. Remettre 1 le numro de version.

9.1Restauration dune analyse


Pour restaurer une analyse partir du gestionnaire de versions: 1.Slectionnez la version restaurer. 2.Il est possible de: soit de restaurer la version dans le rpertoire spcifi. Une analyse indpendante est cre correspondant la version choisie. Cette option est slectionne par dfaut. soit dcraser lanalyse en cours. 3.Validez. La restauration est effectue.

Attention: Les fichiers de donnes correspondant une analyse de numro de version suprieur la version restaure ne pourront plus tre ouverts. Il faut alors galement restaurer des fichiers correspondant la version de lanalyse restaure ou supprimer les fichiers existants pour quils soient recrs.

9.2Annulation de la dernire gnration


Lannulation de la dernire gnration de lanalyse permet de restaurer lanalyse dans son tat avant la dernire gnration. Les modifications effectues depuis ne sont pas appliques.

9.3Remettre 1 le numro de la version


Il est possible de remettre le numro de gnration de lanalyse "1" (option "Analyse .. Remettre 1 la version de lanalyse"). Dans ce cas le numro de version de lanalyse est remis un. Aucune action spcifique nest ralise sur les fichiers de donnes.

Partie 5 : Bases de donnes

175

Les diffrents types de fichiers accessibles


WebDev, WinDev et WinDev Mobile proposent un accs simple la majorit des bases de donnes du march.

176

Partie 5 : Bases de donnes

Partie 5 : Bases de donnes

177

HyperFileSQL Classic
Une application WebDev HyperFileSQL peut fonctionner en mode Classic (appel HyperFileSQL Classic) ou en mode Client/Serveur. Les caractristiques du mode Classic sont les suivantes: Un site utilisant HyperFileSQL Classic est excut sur diffrents navigateurs. Pour chaque site excut, une session est lance sur le serveur. Les fichiers de donnes sont prsents dans un rpertoire accessible par les sessions des sites WebDev (sur le serveur Web ou sur un autre poste). Chaque session accde physiquement aux fichiers de donnes. Les traitements (requte, lecture / ajout dans un fichier de donnes, ...) sont raliss par chaque session.

178

Partie 5 : Bases de donnes

HyperFileSQL Client/Serveur
HyperFileSQL Client/Serveur est un puissant systme de gestion de bases de donnes relationnelles (SGBD/R) en mode Client/Serveur. Les caractristiques du mode Client/Serveur sont les suivantes: Un site HyperFileSQL Client/Serveur est excut sur diffrents postes utilisateur. Pour chaque site lanc, une session est prsente sur le serveur Web. Les fichiers de donnes sont prsents sur un poste serveur (Serveur HyperFileSQL). Seul le poste serveur accde physiquement aux fichiers de donnes. Lensemble des traitements (requte, lecture/ajout dans un fichier de donnes, ...) est ralis sur le serveur.

Partie 5 : Bases de donnes

179

Clusters HyperFileSQL Client/Serveur


HyperFileSQL Cluster est une extension du modle de base de donnes de HyperFileSQLClient/Serveur. Dans un cluster de bases de donnes, les diffrents serveurs HyperFileSQL contiennent tous une copie des bases de donnes et sont synchroniss en temps rel. La charge en lecture peut tre quilibre entre diffrents serveurs. La configuration physique peut voluer sans interruption pour les postes clients. En cas de crash dun des serveurs, le client est automatiquement redirig vers un serveur oprationnel.

180

Partie 5 : Bases de donnes

HyperFileSQL: les fichiers crs physiquement


Lditeur danalyses permet de dcrire la structure des fichiers de donnes. Selon les informations saisies sous lditeur danalyses, diffrents fichiers sont crs physiquement.

Remarque: Ce schma prsente uniquement les principaux fichiers crs. Dautres fichiers spcifiques peuvent tre crs si le fichier de donnes utilise la journalisation, les transactions ou encore la rplication.

Partie 5 : Bases de donnes

181

Associer les champs et les donnes


Une page peut afficher des informations provenant: dune base de donnes: les champs sont directement lis aux rubriques des fichiers ou des requtes disponibles dans la base de donnes. de variables prsentes dans le code de lapplication (variables globales la page ou au projet ou paramtres passs la page). Pour afficher ces informations dans une page, il est ncessaire de lier les champs de cette page avec: les diffrentes rubriques de la base de donnes. les diffrentes variables WLangage disponibles. La mthode daffichage et de rcupration des informations est trs simple: La liaison dun champ avec une rubrique ou une variable est dfinie sous lditeur de pages, lors de la description du champ (onglet "Liaison"). La fonction PageVersFichier permet de mettre jour soit lenregistrement, soit la variable avec les donnes prsentes dans la page. La fonction FichierVersPage permet de mettre jour les donnes affiches dans la page avec soit les informations enregistres dans le fichier de donnes, soit les informations enregistres dans la variable.

Liaison champ / rubrique

182

Partie 5 : Bases de donnes

Liaison champ / variable

Partie 5 : Bases de donnes

183

Les requtes
Une requte sert interroger une base de donnes pour visualiser, insrer, modifier ou supprimer des donnes. La structure de la requte dfinit les donnes manipules. Une requte peut interroger un ou plusieurs fichiers de donnes. Lditeur de requtes permet de crer trs simplement des requtes, sans avoir programmer.

Remarque: En programmation, une requte peut tre manipule de la mme faon quun fichier de donnes. En particulier, elle peut tre associe un champ daffichage (une table par exemple) qui prsentera les donnes retournes par la requte.

184

Partie 5 : Bases de donnes

Les requtes intgres


Les champs dune page peuvent tre lis un fichier de donnes ou une requte existante, ... Il est galement possible de lier ces champs une requte cre lors de la conception du champ.

Zone rpte lie une requte intgre

Requte intgre: MaPage_1$Requte

Dans ce cas, la requte est intgre la page. Elle est prsente dans le fichier WWH correspondant la page. Si le fichier WWH est copi (dans un autre projet par exemple), les requtes intgres utilises par cette page seront galement copies.

Partie 5 : Bases de donnes

185

Le champ Table/ Zone Rpte


Les champs Table/Zone rpte peuvent tre utiliss pour afficher un ensemble dinformations (par exemple, le contenu dun fichier de donnes). Le contenu de ces champs peut tre issu de trois sources diffrentes: Table/Zone Rpte "Fichier accs direct" Table/Zone Rpte "Mmoire" Table/Zone Rpte "Fichier charge en mmoire" Remarque: Ces trois modes de remplissage vont tre dtaills ici pour le champ Table. Les mmes concepts sappliquent au champ Zone Rpte.

Table "Fichier accs direct"


Une table fichier de type accs direct permet dafficher directement les donnes provenant dun fichier de donnes ou dune requte. La structure du fichier de donnes a t dcrite sous lditeur danalyses et les donnes ont t saisies par exemple dans le site. Un parcours du fichier de donnes permet dafficher les donnes dans la table. Pour chaque ligne affiche, le fichier de donnes est lu: lenregistrement lu est affich dans une ligne de la table.

Il est possible de limiter les enregistrements affichs dans le champ en utilisant un filtre (fonction HFiltre utilise dans le code dinitialisation du champ). Plusieurs fonctions du WLangage permettent de manipuler les tables fichier. Ces fonctions commencent toutes par "Table". Pour ajouter un enregistrement dans la table, ajoutez lenregistrement dans le fichier de donnes HyperFileSQL correspondant (fonction HAjoute), puis r-affichez la table avec la fonction TableAffiche. Pour supprimer un enregistrement dans la table, supprimez lenregistrement dans le fichier de donnes HyperFileSQL correspondant (fonction HSupprime), puis r-affichez la table avec la fonction TableAffiche.

186

Partie 5 : Bases de donnes

Table Mmoire
Une table mmoire permet dafficher directement des donnes charges en mmoire. Les donnes sont ajoutes dans la table par programmation (par exemple avec la fonction TableAjouteLigne).

Table Fichier charge en mmoire


Les tables fichier charges en mmoire combinent les avantages des tables fichier et ceux des tables mmoire. La table est lie au fichier de donnes, mais le contenu du fichier de donnes est totalement charg en mmoire. Le tri et la recherche sont disponibles sur toutes les colonnes. Les donnes non lies au fichier de donnes sont conserves lors de la manipulation de lascenseur (colonne de type Interrupteur par exemple). Les enregistrements du fichier de donnes tant chargs en mmoire, ce type de table est conseill pour les fichiers de donnes de moins de 10 000 enregistrements (pour viter une saturation mmoire).

Remarque: Les diffrents modes de remplissage (mmoire, fichier, fichier charg en mmoire) sont disponibles pour les listes, les combos, les tables, les zones rptes, ...

Partie 5 : Bases de donnes

187

Rcuprer des donnes sur un site


Un site commercial permet aux internautes deffectuer des commandes, des rservations,... Pour rcuprer ces informations, vous pouvez utiliser plusieurs mthodes. Conseil: Traitez les donnes rcupres dans une application de "Back Office" ralise avec WinDev.

Partager les donnes Les donnes dun site WebDev peuvent tre directement partages avec les donnes de lapplication Back Office permettant de traiter les oprations effectues sur le site, en toute scurit. Il suffit dutiliser une base de donnes HyperFileSQL Client/Serveur. Le principe est le suivant:

Avantage: Les donnes du site sont accessibles en temps rel. Inconvnient: Ncessit de grer la scurit de manire optimise: utilisation dune connexion scurise pour accder aux donnes, ouverture dun port spcifique pour accder aux donnes (port 4900 par dfaut), configuration du firewall, ... Cette solution est conseille pour un site install sur un serveur ddi.
188 Partie 5 : Bases de donnes

Rcuprer les donnes dun site 2.1 Grce une page AWP dinterrogation WebDev permet de crer des pages AWP. Les pages AWP sont des pages indpendantes, pouvant excuter des traitements partir de paramtres passs en ligne de commande la page. Les pages AWP peuvent tre utilises simplement pour rcuprer les donnes saisies sur le site.

Les pages AWP prsentes sur le serveur Web sont interroges rgulirement par des requtes HTTP excutes par lapplication Back Office. Les donnes sont renvoyes sous forme de chanes et traites par lapplication WinDev. Avantages: Solution simple mettre en place. Equivalent un service Web personnalis. Ne ncessite aucun excutable supplmentaire sur le serveur. Aucune session supplmentaire nest excute sur le serveur. Inconvnient: Rcupration monodirectionnelle des donnes: pas de mise jour des donnes vers le serveur. Cette solution peut tre utilise avec un serveur mutualis.

Partie 5 : Bases de donnes

189

2.2 Grce un Webservice WebDev permet de crer des Webservices. Le Webservice est install sur le serveur Web et le serveur dapplication WebDev permet de lutiliser. Le Webservice peut tre utilis simplement pour rcuprer les donnes saisies sur le site.

Le Webservice prsent sur le serveur Web est interrog rgulirement par des requtes HTTP excutes par lapplication Back Office. Les donnes sont renvoyes sous forme XML, sous forme de chanes (ou autres) et traites par lapplication WinDev. Avantages: Solution simple mettre en place. Ne ncessite aucun excutable supplmentaire sur le serveur. Aucune session supplmentaire nest excute sur le serveur. Inconvnient: Rcupration monodirectionnelle des donnes: pas de mise jour des donnes vers le serveur. Cette solution peut tre utilise avec un serveur mutualis. 2.3 Par FTP: WebDev permet deffectuer rgulirement une sauvegarde des fichiers de donnes du site WebDev. Cette sauvegarde peut tre ensuite transfre par FTP au sige de la socit. Il suffit alors de: rcuprer la sauvegarde compresse des fichiers de donnes dcompresser les fichiers ( laide dune application WinDev) traiter les donnes prsentes dans les fichiers. Avantages: Solution simple mettre en place. Ne ncessite aucun excutable supplmentaire chez lhbergeur. Inconvnient: Tous les fichiers de donnes de lapplication sont rcuprs. Cette solution peut tre utilise avec un serveur mutualis.
190 Partie 5 : Bases de donnes

2.4 Par emails: Le principe:

1. Linternaute effectue une commande sur le site. 2. Le site WebDev indique linternaute que la commande a bien t enregistre. Linternaute est inform quil recevra un email de confirmation. 3. Le site WebDev envoie un email au sige de la socit. Cet email contient la commande effectue par linternaute. 4. Un email est envoy linternaute par la socit pour lui indiquer que sa commande a bien t prise en compte. Avantages: Solution simple mettre en place. Ne ncessite aucun excutable supplmentaire sur le serveur. Inconvnient: Rcupration monodirectionnelle des donnes: pas de mise jour des donnes vers le serveur. Cette solution peut tre utilise avec un serveur mutualis.

Partie 5 : Bases de donnes

191

Effectuer une rplication La rplication permet de maintenir jour des bases de donnes distantes de mme structure. Il est ainsi possible de faire une rplication entre la base de donnes dun site WebDev et la base de donnes de lapplication WinDev au sige de la socit. Par exemple, une base de donnes de saisie de commandes et de gestion de stocks est utilise la fois sur un site WebDev (prise de commandes en ligne) et au sige de la socit (prise de commandes tlphonique ou par courrier). La rplication permet de: transmettre les commandes saisies en ligne au sige de la socit (rplication monodirectionnelle) transmettre les commandes saisies en ligne au sige de la socit, et de transmettre la mise jour des stocks au site Internet (rplication bi-directionnelle) Attention: Il est ncessaire de prendre en compte les contraintes de la rplication ds la cration du projet. En effet, plusieurs rgles doivent tre respectes lors de la description de lanalyse et des rubriques des fichiers de donnes. La rplication peut tre ralise par email ou laide de la rplication universelle assiste. Pour plus de dtails sur la rplication, consultez laide en ligne.

192

Partie 5 : Bases de donnes

Rplication universelle
La rplication universelle permet de maintenir jour des bases de donnes de format identique ou diffrent (HyperFileSQL Classic, Oracle, SQL Server, ...). Il est par exemple possible de raliser une synchronisation entre une base de donnes HyperFileSQL Classic et une base de donnes Oracle. La rplication universelle utilise un modle centralis: toutes les bases de donnes se synchronisent avec une base de donnes matre. La base de donnes matre rpercute ensuite les modifications vers les autres bases de donnes.

Il est possible dadapter la synchronisation des cas particuliers. Par exemple, il est possible de rcuprer uniquement les enregistrements concernant un produit spcifi ou les enregistrements raliss une certaine date, de grer les conflits, ... Ces adaptations doivent tre effectues par programmation grce la fonction HRplProcdureFiltre.

Partie 5 : Bases de donnes

193

Architecture 3-tiers
Le but du 3-Tiers est de sparer les 3 "couches" habituelles dune application: IHM, traitements et donnes. Une application sera donc compose de 3 couches indpendantes: une couche prsentation, une couche application, une couche daccs aux donnes. Cette sparation a pour but de rendre indpendante chacune des couches afin de faciliter la maintenance et les volutions futures de lapplication. Elle assure une scurit plus importante car laccs la base de donnes nest autoris que par la couche de traitements. Elle a galement lavantage doptimiser le travail en quipe et le dveloppement multi-cibles.

194

Partie 5 : Bases de donnes

Partie 6 Tester un site web

196

Partie 6 : Tester un site web

Tester un site: Les lments tester


Le test dun site est une tape fondamentale dans le dveloppement dun site. Le test permet de vrifier le bon fonctionnement du site et son utilisabilit. Voici quelques exemples des principaux points tester dans un site WebDev: le fonctionnement du site: enchanement des pages, excution du code saisi, ... le "look" du site: utilisez diffrents navigateurs (principalement Internet Explorer et Netscape Navigator), utilisez diffrentes rsolutions cran, redimensionnez le navigateur, ... les fonctionnalits spcifiques au Web: impression, cookies, touche "Prcdent" du navigateur, ... laccs au site par diffrents internautes: gestion des logins et des mots de passe, gestion des accs concurrentiels aux fichiers de donnes, ... la non-rgression dun site lors dune mise jour: validation des modifications effectues dans un site et vrification que les fonctionnalits non modifies sont toujours accessibles. la monte en charge (pour un site install sur le serveur): validation du nombre maximum dinternautes pouvant accder au site.

Partie 6 : Tester un site web

197

Comment tester un site ?


Plusieurs outils sont disponibles pour tester un site WebDev: lditeur principal de WebDev. ladministrateur WebDev. Ce module est indispensable lexcution dun site dynamique WebDev. Sur le poste de dveloppement, il est possible de tester les sites dynamiques depuis une page de test cre par ladministrateur. WDTestSite, loutil de test de monte en charge. Le tableau ci-dessous prsente quand et comment utiliser ces diffrents modes de test.

Mode de test
Editeur

Type de test
Le lancement du test depuis lditeur permet par exemple de tester: les fonctionnalits du site, le code utilis dans les diffrents traitements. Un puissant dbogueur permet de suivre pas pas lexcution des diffrents traitements. lutilisation du site avec diffrents navigateurs (installs sur le poste de dveloppement). Ce type de test permet lutilisation du dbogueur. Le lancement du test depuis ladministrateur permet par exemple de tester: les fonctionnalits du site, les fonctions spcifiques au Web (cookies,...), lutilisation du site dans des conditions relles.

Lancement du test
Option "Projet .. Mode test .. Tracer le projet" ou "Projet .. Mode test .. Dboguer le projet depuis la page daccueil" depuis lditeur. Remarque: Les droits de linternaute (droits daccs, dcriture et de lecture) correspondent aux droits du dveloppeur.

Adminis trateur WebDev (site dynamique WebDev uniquement)

Lancez ladministrateur WebDev (menu "Dmarrer") puis cliquez sur le bouton "Page de test" (onglet "Avanc"). Ce test permet dutiliser le site WebDev dans des conditions identiques celles dun internaute. Les droits de linternaute (accs, criture et lecture) correspondent aux droits de lutilisateur par dfaut dfini dans le serveur Web utilis.

198

Partie 6 : Tester un site web

WDTestSite (site dynamique WebDev uniquement)

WDTestSite permet de raliser des tests de monte en charge. WDTestSite permet de lancer plusieurs connexions simultanes un site WebDev. Chaque connexion effectue une succession dactions dans le site WebDev (scnario prdfini) Ce test doit tre effectu sur un site WebDev install sur un poste de dploiement, prt tre mis en service.

1.Crez un scnario de test (avec WDTestSite). 2. Installez WDTestSite et le scnario sur diffrents postes pour simuler un grand nombre daccs. 3. Spcifiez le nombre de connexions effectuer. 4. Lancez le scnario de test sur chaque poste. Remarque: Chaque poste effectue un nombre de connexions dfini. Chaque connexion effectue le scnario slectionn. 1.Affichez la procdure ou la classe sous lditeur de code. 2. Slectionnez loption "Tests automatiques .. Enregistrer un nouveau test".

Tests tiques

automa-

Les tests automatiques permettent de tester les procdures et les classes dun site diffrents niveaux de dveloppement. Les scnarios de test sont automatiquement gnrs en WLangage partir du test de la procdure ou de la classe. Les scnarios peuvent tre modifis sous lditeur de code.

Partie 6 : Tester un site web

199

Le dbogueur
Pour mettre au point votre code, un dbogueur est livr en standard avec WebDev. Le dbogueur permet une excution pas pas de vos sites dynamiques, en visualisant le code WLangage excut, le contenu des variables, ...

Pour lancer le dbogueur, utilisez: soit un point darrt directement plac dans lditeur de code: lorsque la ligne prcde dun point darrt sera excute, le dbogueur sera automatiquement lanc. Pour poser un point darrt, il suffit de cliquer devant la ligne de code: une puce rouge apparat.

soit le mot-cl serveur STOP du WLangage directement dans votre code WLangage: le dbogueur sera automatiquement lanc ds que cette ligne de code sera excute. soit loption "Projet .. Mode Test .. Tracer le projet": le dbogueur est lanc en mme temps que le test du site dynamique.
200 Partie 6 : Tester un site web

Quand peut-on utiliser le dbogueur ?


Lorsquun test est ralis depuis lditeur, le dbogueur peut toujours tre utilis. Il suffit de placer les points darrt aux endroits voulus, pour pouvoir dbogueur pas pas le site. Les diffrents types de tests disponibles depuis lditeur sont les suivants: Le "Go" de page: Le test de la page en cours sous lditeur peut tre lanc par loption "Code .. Tester la page". Le "Go" de projet: Le test du projet sur le poste de dveloppement peut tre lanc par loption "Projet .. Mode test .. Tracer le projet". Le projet dploy: Il est possible de dbogueur le projet dploy. Cette fonctionnalit est trs utile pour reproduire un problme survenant uniquement dans des conditions spcifiques. Pour lancer le projet dploy, il faut utiliser loption "Projet .. Mode test .. Se connecter un site et dboguer la connexion". Remarque: Cette option est utilisable avec un serveur de dveloppement ou de dploiement. Le serveur doit tre configur pour autoriser le dbogage distance. Le projet dploy en cours dutilisation: Il est possible de dbogueur le projet dploy, en cours dutilisation. Cette fonctionnalit est trs utile pour reproduire un problme survenant uniquement dans des conditions spcifiques. Le cas le plus courant: vous utilisez le site, et vous rencontrez le problme: vous pouvez lancer le dbogueur immdiatement en mettant un point darrt dans le code de votre projet. Pour utiliser une session du projet dploy, il faut utiliser loption "Projet .. Mode test .. Dboguer une connexion existante". Remarque: Cette option est utilisable avec un serveur de dveloppement ou de dploiement. Le serveur doit tre configur pour autoriser le dbogage distance.

Partie 6 : Tester un site web

201

Test dun site en pratique


1 Prsentation
WebDev propose plusieurs mthodes pour tester vos sites: test de lensemble du projet, test dune page seule, test dune requte seule (consultez le livre "Etats et Requtes" pour plus de dtails), test dun tat seul (consultez le livre "Etats et Requtes" pour plus de dtails), excution du projet pas pas, test des performances de votre site, test de non rgression/ test automatique, test de monte en charge. Le test de lensemble du projet permet de simuler le lancement du site. Il est ainsi possible de tester le site dans son ensemble, mme si son dveloppement nest pas termin. Ds quun problme apparat, vous pouvez lancer le dbogueur pour connatre et solutionner le problme rencontr. Le test dune page seule permet dexcuter uniquement la page en cours. Vous pouvez ainsi choisir de tester votre projet partir dune page donne, ou de tester le fonctionnement dune page ds que son dveloppement est termin. Comme pour le test du projet, il est possible de lancer le dbogueur ds quun problme est rencontr. Le test dune requte seule permet dexcuter uniquement la requte en cours. Vous pouvez ainsi choisir de tester le fonctionnement dune requte ds que son dveloppement est termin. Le test dun tat seul permet dexcuter uniquement ltat en cours. Vous pouvez ainsi choisir de tester le fonctionnement dun tat ds que son dveloppement est termin. Comme pour le test du projet, il est possible de lancer le dbogueur ds quun problme est rencontr. Lexcution du projet pas pas permet de lancer le dbogueur au lancement du site. Cette solution permet de suivre mticuleusement le droulement du site. Le test des performances de votre site permet de vrifier et doptimiser le temps dexcution de votre site. Le test de non rgression (ou test automatique) est bas sur lexcution de scripts. Il permet de vrifier que lors de lexcution de votre site, ... les fonctionnalits existantes sont toujours supportes. Le test de monte en charge permet de lancer plusieurs connexions simultanes un mme site dynamique WebDev.

2 Tester un projet WebDev


2.1Tester le projet depuis lditeur
Le lancement du test depuis lditeur permet par exemple de tester: les fonctionnalits du site, lutilisation du site avec diffrents navigateurs. Le test dun projet peut tre lanc quel que soit llment en cours sous lditeur. Diffrents types de test Pour tester un site statique depuis lditeur, slectionnez loption "Projet .. Mode Test .. Dboguer le projet depuis la page daccueil" (ou licne ). Lditeur est automatiquement rduit en icne, le navigateur prcis dans les options de WebDev 202 Partie 6 : Tester un site web souvre (option "Outils .. Options .. Options gnrales de WebDev .. Web") et la page daccueil du site saffiche. Il est galement possible de se connecter un site pour dboguer la connexion, ou de dboguer la connexion en cours un site. Pour tester un site dynamique depuis lditeur, slectionnez loption "Projet .. Mode test .. Dboguer le projet" (ou licne , ou [Ctrl] + [F9]). Lditeur est automatiquement rduit en icne, le navigateur prcis dans les options de WebDev souvre (option "Outils .. Options .. Options gnrales de WebDev .. Web") et la premire page du site saffiche.

Pour tester un site statique + dynamique depuis lditeur: pour tester la partie statique du site: effectuez les manipulations correspondant au test dun site statique. pour tester la partie dynamique du site: effectuez les manipulations correspondant au test dun site dynamique. Remarque: Pour tester un site avec un navigateur spcifique, slectionnez loption "Projet .. Navigateur de test" et slectionnez le navigateur voulu. Le navigateur par dfaut est dfini dans les options de WebDev (option "Outils .. Options .. Options gnrales de WebDev" onglet "Web"). Site dynamique: Lancement Les modules suivants sont automatiquement lancs lors dun test dun site dynamique WebDev: Le serveur Web install sur le poste et configur pour WebDev lors de linstallation de WebDev. Si le serveur Web nest pas lanc, le test ne peut pas se faire. Ladministrateur WebDev (WD170ADMIN.EXE). Ladministrateur permet de grer les connexions au serveur Web et de paramtrer les sites WebDev. Remarque: un test de projet peut tre lanc depuis la page de test de ladministrateur (Onglet "Avanc" de WD170ADMIN, bouton "Page de test"). Le moteur WebDev (WD170AWP.EXE). Le moteur WebDev permet de grer les requtes effectues par les internautes depuis leur navigateur et de leur renvoyer la page HTML dynamique correspondante. Remarque: Le moteur WebDev est lanc uniquement si le projet contient des pages dynamiques. Le navigateur Internet. Le navigateur Internet permet dafficher les pages HTML du site WebDev.

2.2Tester le projet depuis ladministrateur WebDev


Le lancement du test depuis ladministrateur WebDev (WD170Admin) permet par exemple de tester: les fonctionnalits du site. les fonctions spcifiques au Web (utilisation des cookies,...). Remarque: Ladministrateur WebDev permet uniquement de tester les sites dynamiques ou la partie dynamique des sites statique + dynamique. Le lancement du test depuis ladministrateur WebDev est quivalent au lancement du site depuis un poste distant. Avant de dployer un site WebDev, il est conseill de tester au moins une fois ce site depuis ladministrateur WebDev. Pour lancer le test depuis ladministrateur WebDev: 1.Lancez ladministrateur WebDev (option "Outils .. WDAdmin - Administrateur WebDev"). 2.Cliquez sur le bouton "Page de test" (onglet "Avanc"). Pour arrter le test, affichez ladministrateur WebDev (en cliquant sur licne 17 prsente dans la barre des tches) et cliquez sur le bouton "Dconnecter" (onglet "Connexions"). Remarque: Ladministrateur WebDev permet galement deffectuer un test du projet quivalent au test du projet depuis lditeur: 1.Lancez ladministrateur WebDev (option "Outils .. WDAdmin - Administrateur WebDev"). 2.Cliquez sur le bouton "Tester" (onglet "Connexions").

2.3Test de monte en charge / Test de nonrgression


Loutil WDTestSite permet de raliser des tests de monte en charge: WDTestSite permet de lancer plusieurs connexions simultanes un site dynamique WebDev. Chaque connexion effectue une succession dactions dans le site WebDev (scnario pr-dfini). Pour plus de dtails sur WDTestSite, consultez laide en ligne.

Partie 6 : Tester un site web

203

3 Tester un site WebDev distant


WebDev offre plusieurs possibilits pour tester et dboguer un site directement sur le poste de dveloppement. Mais dans certains cas, il est ncessaire de dboguer directement le site en exploitation. Il est ainsi possible de dboguer depuis votre bureau de Paris, un site lanc sur un serveur WEB prsent Tawan. Le dbogage est effectu sans se dplacer, directement sur la configuration finale. Deux fonctionnalits sont disponibles: Lancement et dbogage du site sur un serveur dapplication distant. Dbogage dun site en cours dexcution sur un serveur dapplication distant. Pour ces deux fonctionnalits, une configuration spcifique de la machine distante est ncessaire.

4 Tester une page


4.1Tester la page depuis lditeur
Pour tester une page depuis lditeur: 1.Ouvrez la page tester. 2.Slectionnez loption "Code.. Tester la page" , ou [F9]). (icne 3.Lditeur est automatiquement rduit en icne et la page sexcute. Lors du test, lensemble des fonctionnalits de la page pourront tre excutes. Il sera possible par exemple de lancer dautres pages.

4.2Arrter le test dune page


Pour arrter le test, plusieurs mthodes sont possibles: 1re mthode: Fermez la page en cours de test. WebDev affiche lditeur en cours au moment du lancement du test. 2me mthode: Revenez dans lditeur avec la barre des tches ou avec [Alt] + [Tab]. Confirmez larrt du test. WebDev affiche lditeur en cours au moment du lancement du test.

5 Tracer un projet
5.1Principes du dbogage
Le dbogage dune application consiste : vrifier le bon fonctionnement dun traitement, comprendre le fonctionnement dun programme existant, vrifier la valeur des variables, vrifier le bon fonctionnement de cas particuliers dans une application ou un site. Le dbogueur permet de raliser ces oprations. Remarque: WebDev met galement votre disposition divers outils de trace (fentre de trace, bote dinformation,...). Pour plus de dtails, consultez le paragraphe "Dboguer sans le dbogueur", page 205.

5.2Prsentation du dbogueur
Le dbogueur permet de tracer les programmes en WLangage afin de faciliter la mise au point de programmes. Le code source excut est visualis lcran. Les diffrents traitements excuts sont hirarchiss dans le volet "Dbogueur". La valeur des variables peut tre visualise: individuellement dans la bulle daide de survol de chaque variable. dans le volet "Dbogueur".

5.3Fonctionnalits du dbogueur
Le dbogueur permet de: connatre la pile des appels visualiser le contenu des variables ou des expressions

204

Partie 6 : Tester un site web

excuter pas pas avec possibilit de sauter des blocs. utiliser des points darrt conditionnels modifier le code tout en continuant lexcution, ...

Par exemple:
PROCEDURE MaTrace(ChaneATracer) SI EnModeTest() ALORS Trace(ChaneATracer) FIN

5.4Dboguer sans le dbogueur


Dans certains cas, lexcution dun programme avec ou sans le dbogueur peut tre diffrente. En effet, le dbogueur introduit des pauses dans lexcution du traitement, durant lesquelles Windows effectue certaines tches. Ainsi, le dbogueur ne peut pas tre utilis dans une procdure appele par timer ou dans le code de lascenseur. Remarque: Pour connatre lensemble des limites du dbogueur, consultez laide en ligne. Pour dboguer ces applications, il peut tre ncessaire par exemple de suivre lvolution dune valeur, le passage dans diffrentes procdures,... Ces informations peuvent tre: affiches lcran stockes dans un fichier de trace. Attention : Si les informations sont affiches lcran, elles doivent tre affiches uniquement lors des tests de lapplication. Afficher des informations Deux outils permettent dafficher des informations: les botes dinformations: fonction Info du WLangage. Attention: Laffichage dune bote dinformation est blocante. la fentre de trace: fonction Trace du WLangage. La fentre de trace saffiche en haut gauche de lcran, sans interrompre le droulement du programme. Grer laffichage des informations de dbogage Laffichage lcran des informations de dbogage est utile uniquement en mode test. Avant de diffuser une application, il est donc ncessaire de supprimer tout affichage superflu. Pour viter tout oubli, il est conseill de grer laffichage des informations de dbogage laide dune procdure globale.

Dans ce code, selon le rsultat de la fonction EnModeTest, la fentre de trace apparat uniquement lors dun test de lapplication. Une telle procdure permet de laisser lappel aux fentres de trace dans le code de lapplication, sans risque dapparition en clientle. Lappel cette procdure de trace est identique lutilisation de la fonction Trace:
MaTrace("Client : "+... Client.NumClient)

Crer un fichier de trace Lors de traitements longs (traitements Batchs,...), pour contrler le bon droulement du programme, il est ncessaire de conserver une trace physique des traitements effectus (un fichier texte par exemple). La procdure suivante permet de grer par exemple laffichage de la trace: soit lcran (paramtre /DEBUG en ligne de commande). soit dans un fichier texte (mode par dfaut).
PROCEDURE MaTrace(ChaneATracer) CheminFichier est un entier CheminFichier = ... fRepDonnesUtilisateur()+... ProjetInfo(piNomProjet)+".txt" NumFichier est un entier ModeDebug est un boolen = Faux SI Position(LigneCommande(),... "/DEBUG") > 0 ALORS ModeDebug = Vrai FIN SI ModeDebug ALORS Trace(ChaneATracer) SINON NumFichier = fOuvre(... CheminFichier, ... foCrationSiInexistant+... foEcriture + foAjout) SI NumFichier <> -1 ALORS DateHeureTrace est un DateHeure DateHeureTrace = DateHeureSys() DateTrace est une Date DateTrace = Madate..PartieDate HeureTrace est une Heure HeureTrace = Madate..PartieHeure fEcritLigne(NumFichier, ... DateVersChane(DateTrace)+... " - "+HeureVersChane(HeureTrace))

Partie 6 : Tester un site web

205

fEcritLigne(NumFichier, ... ChaneATracer) fEcritLigne(NumFichier, " ") fFerme(NumFichier) FIN FIN

Remarques: Le fichier de trace est cr par dfaut dans le rpertoire des donnes de lutilisateur. Ce fichier a

pour nom le nom du projet. Ce fichier contient les informations tracer durant lexcution du programme. Les informations sont compltes par la date et lheure de chaque "Trace". Il est ainsi possible de dterminer un ventuel dysfonctionnement durant le traitement. Exemple de contenu du fichier de trace:
01/12/2001 - 10:53:25:20 Nom de client : Martin

6 Test de performances
6.1Prsentation
Lanalyseur de performances est un outil permettant de vrifier et doptimiser le temps dexcution de votre site. Son principe est simple: Vous testez votre site. Pendant ce test, lanalyseur de performances rpertorie toutes les actions effectues et les traitements correspondants excuts. A la fin du test, lanalyseur de performances vous prsente: les 10 manipulations qui ont pris le plus de temps. toutes les actions effectues dans le site test, tries par dure (de laction la plus longue laction la moins longue). Il est alors possible de slectionner un traitement afin danalyser les causes de son temps de traitement pour loptimiser.

6.3Lire le rsultat de lanalyseur de performances


Lanalyseur de performances prsente le rsultat de lanalyse dans deux onglets: longlet "Synthse" prsente les 20 traitements qui ont pris le plus de temps. longlet "Dtails" prsente tous les traitements lancs lors du test de lapplication (classs du plus long au plus rapide). Pour chaque traitement, les informations suivantes sont affiches: Fonction Fonction, traitement ou procdure excute. Nombre dappels effectus la fonction (procdure ou traitement). 1 Temps dexcution dun appel la fonction (procdure ou traitement). Pourcentage de code excut hors appel une fonction WLangage ou un appel dune fonction ou une procdure personnelle. Traitement qui a appel la fonction.

Temps Total Temps dexcution de la fonction. Nb appels Temps appel % code

6.2Lancer lanalyseur de performances


Pour lancer lanalyseur de performances, slectionnez loption "Projet .. Analyseur de performances .. Analyser les performances". Le projet est alors automatiquement excut en mode test. Vous pouvez excuter le traitement optimiser dans votre site. Pour revenir sous lditeur, il suffit de fermer votre application ou votre site. Lanalyseur de performances affiche alors le rsultat de lanalyse. Remarque: Il est conseill dutiliser lanalyseur de performances pour optimiser votre site (avant sa diffusion par exemple).

Parent

Remarque: Le libell "Excution complte" reprsente le temps complet de lexcution du test du site ralis avec lanalyseur de performances. Le libell "Total Page XXX" reprsente le temps complet de lexcution de la page XXX (de son ouverture sa fermeture).

206

Partie 6 : Tester un site web

6.4Choisir un traitement optimiser


Le choix du traitement optimiser se fait en fonction de plusieurs critres: le temps dexcution du traitement. Les traitements les plus longs doivent bien entendu tre optimiss.

le pourcentage de temps pass dans le traitement de la fonction ou de la procdure. Plus ce pourcentage est important, plus le code peut contenir des traitements pouvant tre optimiss. Remarque: Si le traitement correspond une fonction WLangage, il est relativement difficile de loptimiser.

7 Tests de non-rgression
7.1Prsentation
Soucieux de la qualit des applications, plusieurs outils de tests sont votre disposition: Le mode test (Go de projet ou Go de page) qui permet de tester immdiatement une modification dans votre site. Lutilitaire WDTestSite qui permet de raliser diffrents tests sur un site WebDev. Pour automatiser ces tests, et augmenter la qualit de vos applications, vous pouvez galement faire des tests unitaires automatiques. Grce ces tests, il est encore plus simple de contrler toutes les fonctionnalits proposes par vos applications.

7.3Lutilitaire WDTestSite
WDTestSite est un utilitaire permettant de raliser diffrents tests sur un site WebDev. Les diffrents tests possibles avec WDTestSite sont les suivants: Test de monte en charge: Le test de monte en charge consiste simuler la connexion de plusieurs internautes un site WebDev. Chacun internaute excute une suite doprations (scnario) simultanment. Test de non-rgression: Le test de non-rgression consiste vrifier le fonctionnement dun site WebDev entre deux mises jour. Le test de non-rgression consiste vrifier quun scnario ralis avec une prcdente version du site fonctionne correctement avec la mise jour du site. Test dun site en mode multi-utilisateurs: Le test dun site en mode multi-utilisateurs permet de vrifier que les accs concurrentiels aux fichiers de donnes sont correctement grs. Ce test consiste simuler la connexion simultane de plusieurs internautes un site WebDev. Chacun internaute excute une suite doprations (scnario) simultanment. Comparaison de diffrents serveurs: WDTestSite permet de comparer la vitesse de diffrents serveurs. Il suffit de lancer un scnario sur diffrents serveurs et de comparer le temps dexcution de ce scnario. Optimisation de traitements raliss en WLangage: WDTestSite permet de comparer le temps dexcution dun scnario avant et aprs une optimisation du code WLangage. Pour plus de dtails, consultez laide en ligne (motcl: "WDTestSite").

7.2Tests automatiques
Chaque test est compos dun scnario directement ditable dans linterface du produit. Ce scnario est crit en WLangage et peut tre modifi nimporte quel moment. Ces tests peuvent tre lancs par exemple avant chaque dploiement pour vrifier le bon fonctionnement dun site aprs diverses modifications. Les lments suivants peuvent tre tests: les collections de procdures les classes Chaque test est associ un code WLangage: le scnario du test. Ce scnario est visible sous lditeur de code. Le code des tests peut tre modifi. Les tests et le code associ ne sont pas livrs en clientle. Le nombre de tests dun site na donc aucune incidence sur la taille du site livr en clientle. Pour plus de dtails, consultez laide en ligne (motcl: "Test automatique").

Partie 6 : Tester un site web

207

208

Partie 6 : Tester un site web

Partie 7 Dployer un site web

210

Partie 7 : Dployer un site web

Dploiement dun site statique


Principe
Le dploiement dun site statique est ralis par FTP:

Informations ncessaires pour le dploiement


Si vous navez pas ces informations, inutile de tenter dinstaller. Contactez votre hbergeur pour obtenir ces informations. Avant deffectuer un dploiement par FTP, lhbergeur doit communiquer au dveloppeur les informations suivantes: Nom du serveur Web o linstallation doit tre ralise (ou son adresse IP). Nom dutilisateur et mot de passe dfinis dans le serveur FTP. Lors du dploiement par FTP, le dveloppeur doit prciser dans WDDploie: les informations fournies par lhbergeur. les fichiers installer.

Partie 7 : Dployer un site web

211

Dploiement dun site statique, semidynamique ou PHP en pratique


1 Prsentation
Lors du dveloppement dun site statique, semidynamique ou PHP, une des phases importantes consiste dployer ce site sur un serveur Web (chez un hbergeur ou en Intranet). Deux mthodes de dploiement sont possibles: dploiement distant (par FTP): conseill lorsque le serveur nest pas directement disponible. dploiement par rseau : conseill lorsque le serveur est facilement accessible. Loutil WDDploie permet de simplifier le dploiement de vos sites statiques. Remarque : Pour dployer un site dynamique, consultez "Dploiement dun site dynamique en pratique", page 218.

2 Cration de linstallation
Pour dployer votre site statique: 1.Slectionnez loption "Atelier.. Crer la procdure dinstallation". Loutil WDDploie se lance. 2.Crez le profil correspondant votre site. Ce profil contient les informations suivantes: Emplacement des fichiers locaux (sous-rpertoire "<NomProjet>_WEB" de votre site). Adresse du site WebDev. Emplacement des fichiers du site dploy (rseau ou serveur FTP). Caractristiques du serveur FTP utilis pour la mise jour du site. Ces caractristiques vous sont fournies par lhbergeur du site, ... 3.Cliquez sur le bouton "Prparer". WDDploie prpare la liste des fichiers installer. En cas de mise jour, WDDploie compare les fichiers prsents sur le poste de dveloppement et les fichiers dj installs. 4.Cliquez sur le bouton "Synchroniser". Les fichiers de votre site sont copis lemplacement spcifi dans le profil. Pour plus de dtails sur lutilisation de WDDploie, consultez laide en ligne.

212

Partie 7 : Dployer un site web

Dploiement dun site dynamique WebDev


Les diffrents types de dploiement
WebDev propose trois mthodes de dploiement dun site dynamique: dploiement par mdia physique (CD-ROM, ...) du site WebDev, avec cration dune version dinstallation livrable sur CD-ROM lhbergeur

Remarque: un serveur dapplication WebDev peut tre intgr linstallation fournie par mdia physique. dploiement distance directement depuis le poste de dveloppement (par transfert de fichiers par Internet, FTP)

Partie 7 : Dployer un site web

213

dploiement distance depuis un poste dadministration (par transfert de fichiers par Internet, FTP)

Choisir une mthode de dploiement


Le choix de la mthode de dploiement dpend surtout des contraintes imposes par lhbergeur et de la localisation du serveur de dploiement (distant ou prsent dans les locaux). Linstallation par mdia physique est conseille si le serveur Web est facilement accessible (par exemple, le serveur Web se situe dans les mmes locaux que lquipe de dveloppement). Linstallation distance (par FTP) directement depuis le poste de dveloppement est conseille si le poste de dploiement nest pas facilement accessible. Un serveur FTP standard doit tre prsent sur le poste de dploiement. Avant deffectuer une installation distance, lhbergeur doit configurer le serveur FTP et le gestionnaire de comptes WebDev.
214 Partie 7 : Dployer un site web

Linstallation distance (par FTP) directement depuis un poste de dadministration est conseille si les caractristiques du serveur ne sont pas connues par le dveloppeur lors de la cration du programme dinstallation. Le programme dinstallation est appel dans ce cas un "Package". Si un site est destin plusieurs clients, il est ainsi possible de crer un seul package et de le fournir tous les clients voulus. Les paramtres du serveur (Adresse, compte FTP, ...) ne seront renseigns que lors de lexcution du package sur le poste dadministration.

Dploiement sur mdia physique: informations ncessaires


Lors dun dploiement par mdia physique, les informations concernant linstallation et le paramtrage du site sont donnes la fois dans lassistant de prparation de linstallation et dans lassistant dinstallation. Lors de la prparation de linstallation, il est ncessaire de fournir: le rpertoire dinstallation, les fichiers installer, le rpertoire de gnration de linstallation. Lors de linstallation, il est ncessaire de fournir: le rpertoire des fichiers de donnes, le rpertoire des fichiers du site. Aprs linstallation, il est ncessaire de paramtrer les caractristiques du site (temps de connexion, nombre de connexions, ...) dans ladministrateur WebDev (version de dploiement).

Dploiement par FTP directement depuis le poste de dveloppement: informations ncessaires


Si vous navez pas ces informations, inutile de tenter dinstaller. Appelez le prestataire pour obtenir ces informations. Avant deffectuer un dploiement par FTP directement depuis le poste de dveloppement, lhbergeur doit communiquer au dveloppeur les informations suivantes: Nom du serveur Web o linstallation doit tre ralise (ou son adresse IP) Nom dutilisateur et mot de passe associ dfinis dans le gestionnaire de compte WebDev Nom dutilisateur et mot de passe dfinis dans le serveur FTP Lors du dploiement par FTP, le dveloppeur doit prciser dans lassistant: les informations fournies par lhbergeur les fichiers installer le nom du sous-rpertoire des fichiers de donnes
Partie 7 : Dployer un site web 215

les diffrents paramtres de connexions au site Remarques: Il est possible de raliser une installation diffre, la date et lheure choisies. Linstallation et la mise jour par FTP sont scurises par mot de passe et cryptage des donnes transmises.

Dploiement par FTP directement depuis un poste dadministration: informations ncessaires


Lors de la cration du programme dinstallation, aucune information spcifique nest ncessaire. Lors de lexcution du programme dinstallation du site (depuis un poste dadministration), lhbergeur devra indiquer: Nom du serveur Web o linstallation doit tre ralise (ou son adresse IP) Nom dutilisateur et mot de passe associ dfinis dans le gestionnaire de compte WebDev Nom dutilisateur et mot de passe dfinis dans le serveur FTP Remarques: Il est possible de raliser une installation diffre, la date et lheure choisies. Linstallation et la mise jour par FTP sont scurises par mot de passe et cryptage des donnes transmises.

216

Partie 7 : Dployer un site web

Mise en service dun site dynamique WebDev


Votre site dynamique WebDev sera accessible par les internautes ds quil aura t mis en service. La mise en service dun site dynamique WebDev consiste activer le site. Lactivation dun site dynamique WebDev peut se faire par plusieurs mthodes: soit lors de linstallation par FTP: une case cocher permet dactiver automatiquement le site aprs son installation.

soit avec ladministrateur distance. soit avec ladministrateur WebDev prsent sur le poste de dploiement (option "Site WebDev bloqu", dans longlet "Sites").

Partie 7 : Dployer un site web

217

Dploiement dun site dynamique en pratique


Lors du dveloppement dun site dynamique, une des phases importantes consiste dployer ce site sur un serveur Web (chez un hbergeur ou en Intranet). Deux mthodes de dploiement sont possibles: dploiement distant (par FTP): conseill lorsque le serveur nest pas directement disponible. dploiement par mdia physique : CD,...: conseill lorsque le serveur est facilement accessible. dploiement par package: conseill lorsque le serveur nest pas directement disponible et si vous ne connaissez pas les caractristiques du serveur. Remarques: Pour chaque serveur Web accueillant des sites WebDev, lhbergeur doit possder une licence du serveur dapplication WebDev. La cration de linstallation est ralise par loption "Atelier .. Crer la procdure dinstallation". Pour dployer un site statique, consultez "Dploiement dun site statiques, semidynamique ou PHP en pratique", page 212.

1 Mise en bibliothque
Avant de procder une installation, il faut mettre en bibliothque tous les objets de votre site dynamique. Une bibliothque est un fichier qui regroupe tous les objets crs lors du dveloppement (description de la base de donnes, description des pages, codes sources compils, ). Les pages HTML et les images ne sont pas incluses dans la bibliothque. La mise en bibliothque est automatique lors de la cration de la procdure dinstallation. Une fois la bibliothque cre, lassistant de cration de linstallation se lance. Vous pouvez choisir de raliser: soit une installation par FTP (installation distance) Avant de raliser une installation distance, lhbergeur doit avoir: 1. Cr et configur votre compte FTP sur le serveur. 2. Cr et configur votre compte WebDev sur le serveur Lhbergeur doit vous fournir vos logins et mots de passe pour ces diffrents comptes. soit un dploiement dans le Cloud PC SOFT: PC SOFT propose une plate-forme dhbergement sur le modle du Cloud Computing : vous dployez sans vous soucier des contraintes matrielles et vous tes facturs selon lusage rel de vos applications. 218 Partie 7 : Dployer un site web Pour raliser ce type dinstallation, il est ncessaire de possder un compte Cloud PC SOFT. Si ncessaire, lassistant propose de crer ce compte. soit une installation par FTP via le service dhbergement de test de PC SOFT: PC SOFT propose dhberger vos sites de test. Linstallation seffectue simplement, directement depuis lenvironnement. Ainsi, une fois votre site termin, il est possible de le tester "en rel" directement. Pour raliser ce type dinstallation, il est ncessaire de possder un compte dveloppeur PC SOFT. Si ncessaire, lassistant propose de crer ce compte. soit un package de dploiement: Un package de dploiement est un excutable contenant tous les lments ncessaires au dploiement dun site WebDev. Ce package pourra ensuite tre excut depuis un poste quelconque pour installer le site Web sur le poste serveur par FTP. Pour crer ce type dinstallation, il nest pas ncessaire de connatre les caractristiques du compte FTP et du compte WebDev prsent sur le serveur Web. soit une installation par mdia physique: Lassistant vous permet de crer un programme

dinstallation de votre site. Ce programme sera ensuite fourni lhbergeur, et permettra dinstaller votre site WebDev sur le serveur Web. Pour installer votre site WebDev, lhbergeur doit: 1.Installer le serveur dapplication WebDev sur le serveur Web (si cela na pas dj t fait). 2.Installer votre site WebDev en lanant le programme excutable Installe fourni avec votre

installation. Remarque: Il est galement possible de crer une installation par mdia physique autonome, contenant linstallation dun serveur dapplication WebDev limit 10 connexions. Cette solution est idale pour les maquettes prsentes sur un portable.

2 Dploiement distant (par FTP)


2.1Les tapes
Les tapes du dploiement sont les suivantes: 1.Installation du serveur dapplication WebDev chez lhbergeur (tape optionnelle). Pour plus de dtails, consultez la documentation du serveur dapplication WebDev. 2.Cration par lhbergeur dun compte WebDev (dans ladministrateur) et dun compte FTP (dans le serveur FTP). 3.Lhbergeur transmet les noms et mots de passe associs ainsi que le nom (adresse IP) du serveur. 4.Cration de linstallation distance depuis lditeur (option "Atelier .. Crer la procdure dinstallation"). Les fichiers ncessaires sont copis dans le rpertoire de transfert. 5.Mise en service du site WebDev. 3.Paramtrage de linstallation : Choisissez le type dinstallation distance effectuer: Mise jour immdiate: Les fichiers du site sont compacts et transfrs immdiatement sur le serveur WEB (laccs au serveur Web doit tre possible depuis le poste dinstallation). Le site WebDev est ensuite install automatiquement sur le serveur WEB. Mise jour diffre: Les fichiers du site sont compacts et transfrs immdiatement sur le serveur WEB (laccs au serveur Web doit tre possible depuis le poste dinstallation). Le site WebDev sera install sur le serveur la date et lheure indique. Il est ainsi possible de faire la mise jour du site dans la nuit (entre minuit et 3h du matin par exemple), lorsque le nombre dinternautes est moins important. Attention: la date et lheure spcifies sont celles du serveur. Assurez-vous de leur validit. Activer le site immdiatement aprs installation: Le site sera disponible directement aprs son installation: il sera possible de sy connecter soit en utilisant ladresse adquate, soit par une page statique contenant un lien sur le site. Si cette option nest pas coche, il sera possible dactiver le site grce ladministrateur distance. 4.Paramtrage du site. Ces options permettent de configurer les options de connexions au site ds son installation. Ces paramtres pourront tre modifis si ncessaire: soit par ladministrateur de dploiement prsent sur le serveur. soit par ladministrateur distance, utilisable par le gestionnaire du site.

2.2Cration de linstallation
Il faut dfinir dans lassistant: 1.Les informations concernant le poste distant. Ces informations doivent tre fournies par lhbergeur: Adresse du serveur (un nom de machine accessible par le rseau, une adresse IP, ou une adresse internet) Caractristiques du compte WebDev (le nom dutilisateur et le mot de passe). Caractristiques du compte FTP (le nom dutilisateur et le mot de passe). Pour identifier simplement les caractristiques du serveur pour une prochaine mise jour, donnez un nom ce serveur. Ce nom apparatra (suivi de ladresse du serveur) dans la fentre de choix du type dinstallation. 2.Les fichiers installer. Par dfaut, lassistant slectionne la bibliothque, les fichiers de donnes, les images et les pages HTML.

Partie 7 : Dployer un site web

219

5.Si une mise jour de lanalyse a t ralise, slectionnez la modification automatique des fichiers de donnes lors de linstallation. Remarque: si cette option est choisie, la mise jour sera propose lors de linstallation. Cas particulier: Si les fichiers de donnes prsents sur le serveur sont au format Hyper File 5.5, il est ncessaire de les migrer au format HyperFileSQL Classic. Cette migration doit tre effectue uniquement lors de la premire mise jour du site.

6.Spcifiez si votre site utilise lAccs Natif AS/400. Rappel: si votre site utilise lAccs Natif AS/400, il est ncessaire dinstaller les DLL AS/400 sur le serveur Web. Si vous utilisez une licence pour un nombre de postes limit, il est ncessaire de grer dans le site WebDev le nombre de connexions en cours (fichier INI ou base de registres, ...).

Rcapitulatif des lments installs et de leur localisation: Serveur de sites Rpertoire des sites WebDev de lutilisateur N Rpertoire dfini par lhbergeur. Dans ce rpertoire, un sous-rpertoire sera cr pour chaque site de lutilisateur N. Dans ce sous-rpertoire de sites sont installs les pages HTML, la bibliothque (".WDL"), le rpertoire des images. Exemple: Le rpertoire des sites de lutilisateur N est "C:\UtilN\Sites WebDev". Lutilisateur N installe son site "Bateau". Ce site sera install dans le rpertoire "C:\UtilN\Sites WebDev\Bateau". Serveur de donnes Rpertoire des donnes de lutilisateur N Rpertoire dfini par lhbergeur. Dans ce rpertoire, un sous-rpertoire sera cr pour les fichiers de donnes de chaque site de lutilisateur N. Dans ce sous-rpertoire de donnes sont installs les fichiers ".FIC", les fichiers ".NDX", les fichiers ".MMO". Exemple: Le rpertoire des donnes de lutilisateur N est "D:\UtilN\Donnes WebDev". Lutilisateur N installe son site "Bateau". Par dfaut, les fichiers de donnes seront installs dans le rpertoire "D:\UtilN\Donnes WebDev\Bateau".

3 Dploiement par package de dploiement


3.1Les tapes
Les tapes du dploiement sont les suivantes: 1.Cration du package de dploiement depuis lditeur (option "Atelier .. Crer la procdure dinstallation"). Un fichier dinstallation est cr. 2.Transmission du package de dploiement (par internet, CD, ...) ladministrateur du serveur Web (hbergeur par exemple) 3.Installation du serveur dapplication WebDev chez lhbergeur (tape optionnelle). Pour plus de dtails, consultez la documentation du serveur dapplication WebDev. 4.Cration par lhbergeur dun compte WebDev (dans ladministrateur) et dun compte FTP (dans le 220 Partie 7 : Dployer un site web serveur FTP). 5.Excution du package de dploiement sur un poste et installation du site WebDev. 6.Mise en service du site WebDev.

3.2Cration de linstallation
Il faut dfinir dans lassistant: 1.Les fichiers installer. Par dfaut, lassistant slectionne la bibliothque, les fichiers de donnes, les images et les pages HTML. 2.Si une mise jour de lanalyse a t ralise, slectionnez la modification automatique des fichiers de donnes lors de linstallation. Remarque: si cette option est choisie, la mise

jour sera propose lors de linstallation. Cas particulier: Si les fichiers de donnes prsents sur le serveur sont au format Hyper File 5.5, il est ncessaire de les migrer au format HyperFileSQL Classic. Cette migration doit tre effectue uniquement lors de la premire mise jour du site. 3.Paramtrage du site. Ces options permettent de configurer les options de connexions au site ds son installation. Ces paramtres pourront tre modifis si ncessaire: soit par ladministrateur de dploiement prsent sur le serveur. soit par ladministrateur distance, utilisable par le gestionnaire du site. 4.Spcifiez si votre site utilise lAccs Natif AS/400. Rappel: si votre site utilise lAccs Natif AS/400, il est ncessaire dinstaller les DLL AS/400 sur le serveur Web. Si vous utilisez une licence pour un nombre de postes limit, il est ncessaire de grer dans le site WebDev le nombre de connexions en cours (fichier INI ou base de registres, ...). 5.Le profil par dfaut du serveur Web utiliser. Ces paramtres pourront tre saisis ou modifis par la personne qui installera le package de dploiement. 6.Paramtrage de linstallation : Choisissez le

type dinstallation distance effectuer: Mise jour diffre: Les fichiers du site sont compacts et transfrs immdiatement sur le serveur WEB (laccs au serveur Web doit tre possible depuis le poste dinstallation du package). Le site WebDev sera install sur le serveur la date et lheure indique. Il est ainsi possible de faire la mise jour du site dans la nuit (entre minuit et 3h du matin par exemple), lorsque le nombre dinternautes est moins important. Attention: la date et lheure spcifies sont celles du serveur. Assurez-vous de leur validit. Activer le site immdiatement aprs installation: Le site sera disponible directement aprs son installation: il sera possible de sy connecter soit en utilisant ladresse adquate, soit par une page statique contenant un lien sur le site. Si cette option nest pas coche, il sera possible dactiver le site grce ladministrateur distance.

3.3Installation du site dynamique


Pour installer le site, il suffit de: 1.Excuter le package de dploiement. 2.Indiquer les caractristiques du serveur WEB sur lequel le site WebDev doit tre install (caractristiques du compte FTP du serveur, et caractristiques du compte WebDev du serveur). 3.Valider linstallation du site.

4 Dploiement par mdia physique


Ce dploiement est ralis en trois tapes: 1.Cration de la version dinstallation. 2.Installation si ncessaire du serveur dapplication WebDev sur le serveur Web. Pour plus de dtails, consultez documentation du serveur dapplication WebDev. 3.Installation du site chez lhbergeur. sonnaliser". 4.Les fichiers de votre site. Remarque: les fichiers bibliothques, HTML, Java, JavaScript et les fichiers images sont slectionns par dfaut. 5.Les fichiers annexes: La licence (fichier au format txt) saffichera au lancement de linstallation. Remarque: si la licence nest pas valide par la personne charge de linstallation, linstallation sera abandonne. Le "Lisez-moi": ce fichier peut correspondre diffrents formats (txt, htm, doc, hlp, pdf). Quel que soit le format choisi, lutilisateur doit possder un logiciel permettant de visualiser ce fichier. Un excutable lancer la fin de linstallation. Attention: Pensez joindre les fichiers lis cet Partie 7 : Dployer un site web 221

4.1Cration de linstallation
Il faut dfinir dans lassistant: 1.Un titre et un intitul de version pour votre installation. Un titre peut tre donn dans chacune des langues susceptibles dtre choisies au moment de linstallation. 2.Un rpertoire par dfaut. 3.Un dcor pour la fentre dinstallation. Vous pouvez personnaliser le dcor laide du bouton "Per

excutable (DLL, fichiers de paramtres, autres fichiers excutables). Remarque: il est possible de slectionner un fichier de licence et un fichier "Lisez-moi" pour chaque langue de linstallation. 6.Si une mise jour de lanalyse a t ralise, slectionnez la modification automatique des fichiers de donnes lors de linstallation. Remarque: si cette option est choisie, la mise jour sera propose lors de linstallation. 7.Si des programmes non raliss avec WebDev doivent accder aux fichiers HyperFileSQL de votre site, choisissez linstallation dun pilote ODBC. Remarque: si cette option est choisie, linstallation du pilote sera propose lors de linstallation. 8.Spcifiez si votre site utilise lAccs Natif AS/400. Rappel: si votre site utilise lAccs Natif AS/400, il est ncessaire dinstaller les DLL AS/400 sur le serveur Web. Si vous utilisez une licence pour un nombre de postes limit, il est ncessaire de grer dans le site WebDev le nombre de connexions en cours (fichier INI ou base de registres, ...). 9.Imprimez le dossier de dploiement: Le dossier de dploiement prcise la licence WebDev ainsi que tous les modules installs lors du dploiement. Il prcise galement les cls de la base de registres gnres pour le site WebDev. Lors de linstallation du site sur le serveur, ces cls pourront tre mises jour directement dans la base de registres ou enregistres dans un fichier pour un examen ultrieur. Le dossier de dploiement doit tre fourni la personne charge dinstaller votre site WebDev (hbergeur ou responsable rseau Intranet). 10.Modifiez ventuellement le rpertoire de gnration de linstallation. Par dfaut linstallation est gnre dans le sousrpertoire "INST" de votre projet. 11.Gnrez linstallation: Une fentre dinformation signale la prsence ventuelle de noms longs de fichiers. En effet, en cas dinstallation sur un lecteur rseau, vrifiez que: le lecteur rseau supporte correctement les noms longs, le lecteur rseau ne modifie pas les majuscules/ minuscules dans les noms de fichiers. 12.Lorsque la cration de linstallation est termine, WebDev propose de: tester directement linstallation cre. 222 Partie 7 : Dployer un site web

ouvrir lexplorateur Windows sur le rpertoire de gnration de linstallation. 13.Ralisez une sauvegarde de votre site. Il est recommand de conserver une sauvegarde des sources de votre site correspondant une version installe.

4.2Installation du site dynamique sur un serveur Web (mdia physique)


Si vous installez votre site chez un hbergeur, celuici peut vous proposer deux possibilits: Installez votre site sur un serveur "mutualis". Ce serveur gre les sites de plusieurs clients. Ce serveur est configur lors de linstallation du serveur dapplication WebDev. Ladministrateur WebDev (WD170ADMIN.EXE) permet de configurer individuellement chaque site WebDev install sur ce serveur. Attention: Les ressources mmoires du serveur sont partages par tous les sites. Installez votre site sur un serveur "ddi" (solution conseille). Vous tes propritaire de ce serveur. Dans ce cas vous devez: configurer le serveur Web, grer les ressources mmoires ncessaires pour votre site. Pour installer le site WebDev sur un serveur Web (chez un hbergeur ou en Intranet): 1.Installez si ncessaire le serveur dapplication WebDev sur le serveur Web. Attention: si le serveur dapplication WebDev nest pas install sur le serveur Web, le site dynamique WebDev ne pourra pas fonctionner correctement. Remarque: Pour chaque serveur Web hbergeant des sites WebDev, lhbergeur doit possder une licence du serveur dapplication WebDev. 2.Pour installer le site WebDev, excutez sur le serveur Web, le programme INSTALLE.EXE fourni avec linstallation du site WebDev. Important: Sil sagit dune mise jour dun site existant, vous devez au pralable bloquer le site laide de ladministrateur WebDev (cochez "Site WebDev bloqu" dans longlet "Sites"). 3.Choisissez la langue dinstallation: un assistant dinstallation se lance. Passez au plan suivant. 4.Linstallation dtecte automatiquement si un ou plusieurs des serveurs Internet suivants sont installs sur le poste: IIS Version 2 7 (Microsoft Internet Information Server): serveur Microsoft.

Apache Version 1.3.x et 2.x: serveur Web gratuit fourni par lApache Group. Trois cas peuvent se prsenter: Cas 1: votre serveur Web napparat pas dans cette liste : slectionnez "Autre serveur". Pour plus de dtails sur la configuration de votre serveur, consultez laide en ligne. Cas 2: votre serveur Web apparat dans la liste mais en gris: votre serveur Web na pas t dtect. Vous pouvez toutefois le slectionner en cochant "Afficher tous les serveurs". Vous devez alors demander la gnration dun fichier de configuration afin de pouvoir excuter la configuration ultrieurement (si vous avez prvu dinstaller votre serveur plus tard par exemple). Cas 3: votre serveur Web peut tre slectionn directement: slectionnez votre serveur. Vous pouvez demander la gnration dun fichier de configuration afin de pouvoir excuter la configuration ultrieurement. Vous pourrez modifier le fichier de configuration avant de lexcuter. Selon le serveur choisi, le fichier de configuration a une extension ".reg", ".conf" ou autre. 5.Slectionnez le rpertoire dinstallation: <webroot> dsigne le rpertoire racine du serveur Web de la machine. En fonction du serveur Web choisi, le rpertoire racine est dtect et affich. Si le rpertoire racine du serveur Web nest pas affich, vous pouvez le saisir dans la zone grise ou le rechercher laide du bouton "". Attention: si la zone est renseigne, vitez de la modifier. 6.Mise jour des fichiers de donnes (tape optionnelle, uniquement dans le cas dune mise jour du site). Pour mettre jour les fichiers de donnes associs au site WebDev, choisissez lexcution de la modification automatique des fichiers de donns. En cas de doute sur la ncessit doprer cette mise jour, contactez le fournisseur du site. Attention: Les fichiers de donnes du site ne doivent pas tre en cours dutilisation. Utilisez ladministrateur WebDev pour vrifier quaucune connexion nest en cours et arrtez les sites (cochez "Site bloqu" dans longlet "Sites"). 7.Choisissez linstallation dun pilote ODBC pour HyperFileSQL si des programmes non raliss avec WebDev doivent accder aux fichiers HyperFileSQL du site qui va tre install (tape optionnelle). 8.Le rsum de linstallation est affich: Pour lancer linstallation, passez au plan suivant.

Pour modifier certains paramtres des fentres prcdentes, cliquez sur "Prcdent". 9.Linstallation est termine: Cliquez sur ladresse propose pour tester votre site en local. Cette option nest utilisable que si le serveur Web a t configur automatiquement. Cliquez sur "Copier" pour rcuprer ladresse propose. Pour plus de dtails, consultez le paragraphe "Mise en service du site dynamique", page 224. Cliquez sur "Terminer" pour terminer linstallation. 10.Configuration du serveur Web: Si la configuration du serveur Web na pas t faite automatiquement, deux cas peuvent se prsenter: Cas 1: votre serveur a t dtect et un fichier de configuration a t gnr: vous pouvez visualiser, ventuellement modifier puis excuter ce fichier. Cas 2: votre serveur na pas t dtect: pour plus de dtails, consultez laide en ligne. 11.A laide de ladministrateur WebDev, dbloquez les sites ventuellement bloqus et configurez les paramtres de votre site dynamique. Ces paramtres correspondent: au nombre total de connexions autorises sur le site, au nombre de connexions autorises pour un internaute, la dure dinactivit autorise. Testez le site WebDev depuis ladministrateur partir de loption [page de test] (onglet "Avanc"). Remarques: Ladministrateur WebDev (WD170ADMIN.EXE) doit tre lanc et tourner en permanence en tche de fond. Il est possible de linstaller en tant que service sous WindowsNT. Pour plus de dtails sur ladministrateur WebDev, consultez le chapitre "Ladministrateur WebDev en pratique", page 228. Important: La ressource ncessaire par internaute connect Pour chaque internaute connect, il est ncessaire de prvoir une consommation: denviron 400 Ko de mmoire centrale par connexion, en plus de la mmoire ncessaire au serveur. denviron 1 Mo despace disque (mmoire virtuelle) par connexion, en plus de lespace ncesPartie 7 : Dployer un site web 223

saire au site. Par exemple, pour 20 connexions parallles, il est ncessaire de prvoir environ:

Mmoire vive: 67,8 Mo (7,8 Mo de mmoire centrale pour ce site, 60 pour le serveur NT). Mmoire virtuelle : 84 Mo (20 Mo pour les connexions, 64 Mo pour le serveur NT).

5 Mise en service du site dynamique


Pour permettre aux internautes laccs votre site install chez un hbergeur, crez un lien dans votre page daccueil permettant de lancer votre site dynamique WebDev. Si vous avez ralis une installation par mdia physique, ladresse utiliser a t fournie la fin de linstallation. Remplacez <localhost> par ladresse de votre site. Exemple permettant de lancer un site "NOTRAPPLI" partir du site de PC SOFT:
http://www.pcsoft.fr/WD170AWP/ WD170AWP.EXE/ CONNECT/NOTRAPPLI

redirection vers le site WebDev cest--dire, par exemple, vers ladresse:


"http://195.51.231.57/WD170AWP/ WD170AWP.EXE/CONNECT/ jaidebeauxyeux"

Exemple de balise META placer dans la partie <HEAD> dune page HTML:
<meta http-equiv="refresh content="0 ;URL=http://195.51.231.57/ WD170AWP/ WD170AWP.EXE.EXE/ CONNECT/ jaidebeauxyeux>

Pour lancer le site en utilisant directement son adresse (jaidebeauxyeux.com par exemple), il suffit de: 1.Crer une page daccueil de type "index.html". 2.Dans len-tte de cette page, utiliser les commandes html (META REFRESH) pour raliser une

Cas particulier: Si une page daccueil a t dfinie dans votre site dynamique, ladresse de lancement de cette page daccueil est la suivante:
http://<AdresseServeur>/ <NomSite>_WEB/

224

Partie 7 : Dployer un site web

Partie 8 Hbergement de sites WebDev

226

Partie 8 : Hbergement de sites WebDev

A quoi sert ladministrateur WebDev ?


En dveloppement (pour le test) comme en dploiement, ladministrateur WebDev est ncessaire lexcution des sites dynamiques WebDev. Lors du dveloppement dun site dynamique WebDev, ladministrateur permet principalement de: tester les sites dynamiques grce la page de test (onglet "Avanc", bouton "Page de test") grer les webservices (onglet "Webservices") rgler les paramtres de connexion aux sites dynamiques pour vos tests: temps de dconnexion, ... (onglet "Configuration") supprimer directement les connexions de test en cours (onglet "Connexions") changer le serveur Web utilis pour vos tests (onglet "Avanc", option "Serveur") effectuer un diagnostic en cas de problme lors du lancement dun site dynamique WebDev (onglet "Avanc", bouton "Diagnostic") autoriser le dbogage distance (onglet "Configuration"). ...

En dploiement, ladministrateur WebDev permet de: grer les comptes WebDev (onglet "Administration") grer la configuration des diffrents sites dynamiques installs sur le serveur: nombre de connexions autorises, ... (onglet "Sites") personnaliser les messages derreurs des diffrents sites dynamiques installs sur le serveur (onglet "Administration") ...
Partie 8 : Hbergement de sites WebDev 227

Ladministrateur WebDev en pratique


1 Prsentation
Ladministrateur WebDev est un module permettant de grer les sites WebDev dynamiques. Lors du dveloppement dun site WebDev dynamique, ladministrateur permet principalement de: tester le site grce la page de test (onglet "Avanc", option "Page de test"). rgler les paramtres de connexion au site pour vos tests : temps de dconnexion,... (onglet "Configuration"). supprimer directement les connexions de test en cours (onglet "Connexions"). changer le serveur Web utilis pour vos tests (onglet "Avanc", option "Serveur"). effectuer un diagnostic en cas de problme lors du lancement dun site WebDev (onglet "Avanc", option "Diagnostic"). ... En dploiement, deux types dadministrateur WebDev existent: ladministrateur WebDev Dploiement qui permet lhbergeur de grer les sites WebDev dynamiques installs sur un serveur Web. ladministrateur WebDev Distant qui permet au gestionnaire de site de grer ses sites WebDev dynamiques distance depuis nimporte quel poste. Cette aide prsente uniquement ladministrateur WebDev Dveloppement. Pour plus de dtails sur les outils de dploiement, consultez leur aide. Lancement de ladministrateur WebDev Pour lancer ladministrateur WebDev Dveloppement, slectionnez: soit loption "Outils.. WDAdmin- Administrateur WebDev" depuis WebDev Dveloppement. soit loption "Programmes.. WebDev17.. Administrateur WebDev" depuis le menu "Dmarrer". Ladministrateur WebDev est lanc automatiquement au premier test du site. Ladministrateur peut ensuite tre laiss en tche de fond. Par dfaut, ladministrateur WebDev autorise dix connexions simultanes un mme site WebDev dynamique (icne GO).

2 Interface de ladministrateur WebDev


Ladministrateur WebDev se prsente sous la forme dune fentre comportant plusieurs onglets: Onglet "Connexions". Onglet "Sites". Onglet "Webservices". Onglet "Configuration". Onglet "Administration". Onglet "Avanc". nombre de connexions totales aux sites WebDev dynamiques grs par ladministrateur. Le Tableau des connexions en cours indique pour chaque connexion: lidentifiant de la connexion, le site concern par la connexion, lidentit du client connect. En utilisation relle, le client est identifi par son adresse IP ou son adresse Internet, le temps actuel de connexion, le temps dinactivit de la connexion. La cadence de rafrachissement : ce paramtre correspond la vitesse avec laquelle est ractualise la table prsentant les diffrentes connexions en cours.

2.1Caractristiques des connexions en cours


Longlet "Connexions" fournit diverses informations propos des connexions en cours. Ces informations peuvent tre consultes tout moment sur le serveur: Le Nombre de connexions en cours indique le 228 Partie 8 : Hbergement de sites WebDev

Longlet "Connexions" permet galement de: Tester directement les sites installs sur le poste (uniquement en version de dveloppement): Slectionnez le site dans la combo puis cliquez sur "Tester". Ce mode de test permet de tester sur le poste de dveloppement des options spcifiques la gestion des cookies par exemple. Arrter une connexion en cours: Slectionnez une des connexions et cliquez sur "Dconnecter". Stopper toutes les connexions en cours et fermer ladministrateur: cliquez sur "Dconnecter Tous".

2.3Webservices installs
Longlet "Webservices" fournit des informations concernant les webservices WebDev dynamiques installs sur le poste. Longlet "Webservices" liste les diffrents webservices WebDev dynamiques installs sur le poste et grs par ladministrateur WebDev. Pour chaque webservice, les informations suivantes sont affiches dans un tableau: le nom du webservice, le rpertoire complet dinstallation du webservice sur le poste, le nom du fichier "projet" correspondant. Longlet "Webservices" permet aussi de: Supprimer le webservice slectionn dans le tableau. Il sagit uniquement de supprimer le webservice de ladministrateur: le webservice WebDev sera toujours prsent sur le disque. Rafrachir laffichage des webservices prsents dans le tableau. Ce rafrachissement permet de vrifier la prsence dun webservice dans ladministrateur aprs son installation. Ajouter un webservice dans le tableau. Paramtrer individuellement les webservices prsents sur le poste. Par dfaut, la configuration prise en compte est celle de longlet "Configuration". Il est galement possible de crer une configuration spcifique pour le site slectionn. Cette configuration concerne le nombre maximal de connexions autoris et le blocage ventuel du webservice pour une mise jour. Pour plus de dtails sur ces paramtres, consultez longlet "Configuration". Pour valider immdiatement le nouveau paramtrage, appuyez sur le bouton "Appliquer".

2.2Sites installs
Longlet "Sites" fournit des informations concernant les sites WebDev dynamiques installs sur le poste. Longlet "Sites" liste les diffrents sites WebDev dynamiques installs sur le poste et grs par ladministrateur WebDev. Pour chaque site, les informations suivantes sont affiches dans un tableau: le nom du site, le rpertoire complet dinstallation du site sur le poste, le nom du fichier "projet" correspondant. Longlet "Sites" permet aussi de: Supprimer le site slectionn dans le tableau. Il sagit uniquement de supprimer le site de ladministrateur: le site WebDev sera toujours prsent sur le disque. Rafrachir laffichage des sites prsents dans le tableau. Ce rafrachissement permet de vrifier la prsence dun site dans ladministrateur aprs son installation. Ajouter un site dans le tableau. Paramtrer individuellement les sites prsents sur le poste. Par dfaut, la configuration prise en compte est celle de longlet "Configuration". Il est galement possible de crer une configuration spcifique pour le site slectionn. Cette configuration concerne le nombre de connexions autoris, la dure dinactivit autorise et le blocage ventuel du site pour une mise jour. Pour plus de dtails sur ces paramtres, consultez longlet "Configuration". Pour valider immdiatement le nouveau paramtrage, appuyez sur le bouton "Appliquer".

2.4Configuration gnrale
La configuration gnrale correspond aux diffrentes options de connexion par dfaut pour les sites WebDev prsents sur le serveur et grs par ladministrateur. Longlet "Configuration" permet de: Paramtrer les connexions. Paramtrer les sessions et les requtes. Grer le fichier journal pour obtenir les statistiques de frquentation. Grer le dbogage distance. Partie 8 : Hbergement de sites WebDev 229

Le paramtrage des connexions est ralis par les options suivantes: Nombre maximum de connexions sur le serveur: Nombre maximum de connexions simultanes autorises pour lensemble des sites grs par ladministrateur (une connexion = un internaute). Nombre maximum de connexions sur un site: Nombre maximum de connexions simultanes autorises pour chaque site gr par ladministrateur. Ce nombre peut tre modifi pour chaque site dans longlet "Sites". Nombre maximum de connexions dun utilisateur sur un site: Nombre maximum de connexions simultanes autorises pour un mme internaute sur chaque site gr par ladministrateur. Si ce paramtre est gal zro, linternaute essayant de se connecter simultanment un mme site, sera automatiquement dconnect puis reconnect. Si ce paramtre est suprieur zro, un message derreur apparatra automatiquement au bout des x connexions simultanes. Ce nombre peut tre modifi pour chaque site (onglet "Sites"). Le paramtrage des sessions et des requtes est ralis par les options suivantes: Dconnecter les utilisateurs inactifs depuis: Il sagit du temps maximum de connexion autoris sans action de la part de linternaute. Si ce temps est dpass, linternaute est automatiquement dconnect, et un message derreur est affich. Ce nombre peut tre modifi pour chaque site dans longlet "Sites". Dure des contextes AWP: Dure de validit des contextes AWP. Ds que la dure indique est coule et si aucune nouvelle requte na t effectue, le fichier des contextes est supprim. Dure maximale dune requte: Temps maximum dattente autoris entre le dclenchement dune action par linternaute (par un bouton ou un lien) et laffichage de la rponse. Si ce temps est dpass, une page derreur est affiche, mais linternaute nest pas dconnect. Ladministrateur WebDev permet de gnrer un fichier journal spcifique permettant de suivre les statistiques de frquentation. Gnrer un fichier journal pour les statistiques de frquentation (.log): Cette option permet de gnrer un fichier journal 230 Partie 8 : Hbergement de sites WebDev

(extension ".LOG") pour visualiser les statistiques de frquentation des sites WebDev laide de WDStatistiques. Pour plus de dtails sur WDStatistiques, consultez laide de WDStatistiques. La localisation du ficher journal peut tre spcifie dans le champ "Rpertoire". Cette option peut tre modifie pour chaque site dans longlet "Sites". Enregistrer dans le fichier global et dans le fichier de chaque application: Cette option permet denregistrer les statistiques la fois dans le fichier journal de lapplication et dans le fichier journal du serveur. En effet, si le fichier journal est dfini la fois au niveau du serveur et au niveau des applications (onglet "Sites"), des informations peuvent tre "perdues". Grer le dbogage distance Ladministrateur WebDev permet dautoriser ou non le dbogage distance des sites WebDev dynamiques. Si le dbogage distance est autoris, les paramtres suivants doivent tre spcifis: Port principal (27 271 par dfaut). Plage des ports des sessions (entre 27 282 et 27289 par dfaut). Le bouton "Par dfaut" permet de rtablir les valeurs par dfaut.

2.5Administration
Longlet "Administration" permet de: Configurer le serveur pour les installations et les mises jour de site. Paramtrer les messages derreur affichs dans le navigateur. Grer les comptes WebDev. Installation / mise jour Ces options sont accessibles en version dploiement. Elles permettent lhbergeur de permettre et de paramtrer les installations et mises jour de sites distance. Loption "Bloquer le serveur (pour une mise jour)" permet de simplifier la mise jour dun site, en interdisant toute connexion dun nouvel utilisateur. A chaque essai dune nouvelle connexion un des sites prsent sur le serveur, linternaute reoit un message linformant de lindisponibilit momentane du site, et lui demandant de ressayer plus tard. Les utilisateurs dj connects peuvent continuer dutiliser le site WebDev en cours.

Messages derreur Le bouton "Erreurs" affiche les diffrentes erreurs pouvant tre affiches dans le navigateur de linternaute. Il est possible de personnaliser le message derreur ou encore la page HTML o lerreur est affiche.

2.6Options avances
Longlet "Avanc" permet de: Choisir un des serveurs WEB installs sur le poste en cours pour excuter les sites WebDev. Effectuer un diagnostic de configuration du poste en cours. Spcifier le nom ou ladresse IP du poste en cours. Afficher sous le navigateur une page permettant de lancer tous les sites WebDev installs sur le poste en cours. Grer les emails en mode asynchrone. Grer les sockets serveur. Grer les impressions. Serveur utilis Le bouton "Serveur" permet de choisir un des serveurs WEB installs sur le poste en cours pour excuter les sites WebDev. Attention: Ce serveur sera utilis pour tous les sites dynamiques WebDev installs sur ce poste. Si le serveur utilis nest pas prsent dans cette liste, choisissez "Autre". Il faudra alors configurer manuellement le serveur Web utilis. Pour plus de dtails sur la configuration de serveurs spcifiques, consultez laide en ligne. Diagnostic Le bouton "Diagnostic" permet deffectuer une vrification de la configuration du poste en cours. Ce diagnostic permet de vrifier: si le protocole TCP/IP est install si un serveur WEB (serveur HTTP) est lanc si le gestionnaire de protocole AWP est correctement configur si les excutables WebDev ncessaires sont prsents. Si une de ces conditions nest pas remplie, les sites WebDev dynamiques ne pourront pas fonctionner. Pour plus de dtails sur la configuration du poste de dveloppement ou du serveur de dploiement, consultez laide en ligne.

Nom ou adresse IP du poste en cours Ladministrateur WebDev permet de spcifier un nom ou une adresse IP pour dsigner un poste spcifique. Il est galement possible de spcifier le numro de port. Par exemple: localhost:8080. Ce poste sera utilis: lors de lutilisation du bouton "Diagnostic". lors de lutilisation du bouton "Page de test". lors du test dun site, dune page, dun tat, ... depuis lditeur WebDev (icne "GO"). Test Le bouton "Page de test" permet dafficher sous le navigateur une page permettant de lancer chacun des sites WebDev dynamiques et des webservices WebDev dynamiques installs sur ce poste. Pour plus de dtails sur les tests dun site WebDev, consultez le chapitre "Test dun site en pratique", page 202. Spooler de mails Si cette option est coche, vos sites pourront envoyer des emails sans bloquer lexcution des diffrents traitements. Il est galement ncessaire dactiver le mode asynchrone louverture de la session demails ( laide de la fonction EmailOuvreSessionSMTP). Si le mode asynchrone est activ, tous les emails envoyer seront transmis un "Spooler". Les emails sont ainsi mis en file dattente avant dtre envoys. Remarque: si ladministrateur WebDev est ferm, le spooler demails est vid: les emails en attente ne sont pas envoys et sont enlevs du spooler. Si vous cochez loption "Dsactiver le spooler de mail" alors que des emails sont en attente, ces emails ne seront pas perdus: ladministrateur continue de les envoyer, mais aucun nouveau mail ne sera accept par le spooler. Sockets Si loption "Autoriser les sockets serveur" est coche, vos sites pourront manipuler les sockets du serveur ( laide des fonctions Socketxxx du WLangage).

Partie 8 : Hbergement de sites WebDev 231

Imprimante utilise par dfaut (site intranet uniquement) Le bouton "Configurer les impressions" permet de slectionner limprimante utilise par dfaut lors dune impression directe sur une imprimante locale ou rseau du serveur Web.

Remarque: Si une imprimante rseau est slectionne, il est ncessaire de dfinir les droits dimpression de cette imprimante. Recherche des pages primes Cette option permet dactiver et de paramtrer la recherche des pages primes sur les sites WebDev grs par le serveur dapplication WebDev.

232

Partie 8 : Hbergement de sites WebDev

Configuration du serveur
Pour un site dynamique WebDev:

Pour un site statique ou semi-dynamique:

Partie 8 : Hbergement de sites WebDev 233

Serveur ddi ou mutualis ?


Les hbergeurs proposent deux types de serveurs pour installer vos sites WebDev: serveur mutualis: serveur dont les ressources sont partages par diffrents clients (client = socit faisant hberger son site chez un hbergeur)

Caractristiques: Lhbergeur fournit un poste serveur diffrents clients. Lhbergeur: -configure le serveur FTP. -dtermine le nombre maximum de connexions sur lensemble des sites dynamiques dun mme client ( laide du gestionnaire de comptes WebDev). Linstallation et les mises jour dun site dynamique ou statique peuvent tre ralises par FTP.

234

Partie 8 : Hbergement de sites WebDev

serveur ddi: le serveur est rserv au client. Lhbergeur fournit uniquement laccs Internet (adresse IP, cble, ...). La machine est soit loue par lhbergeur, soit fournie par le client.

Caractristiques: Lhbergeur fournit uniquement laccs Internet (adresse IP, cble, ...). Le client doit: -fournir ventuellement le poste serveur (location possible) -configurer le poste (systme, ...) -installer le serveur Web -installer et configurer les sites WebDev (par FTP ou par CD-ROM)

Partie 8 : Hbergement de sites WebDev 235

Quel type de serveur choisir ?


Le tableau ci-dessous prsente les avantages et inconvnients des diffrents types de serveurs. Quel que soit le type de serveur choisi, il est ncessaire de possder une licence de dploiement pour chaque serveur. Chaque serveur hberge un ou plusieurs sites dynamiques WebDev.

Serveur
Mutualis

Avantages / inconvnients
Principaux avantages: - Cot moindre - Administration du serveur ralise par lhbergeur Principaux inconvnients: - Ressources mmoire partages entre les sites prsents sur le serveur. - En cas de blocage dun site, tous les sites sur le serveur sont bloqus. - Utilisation dexcutables autonomes rarement possible. - Accs non scuris aux donnes: Des personnes non autorises peuvent avoir accs aux donnes: lhbergeur, et potentiellement, dautres clients, si le serveur nest pas correctement configur. Conseil: cryptez les fichiers de donnes pour viter toute utilisation non autorise.

Quand utiliser ce serveur ?


Un serveur mutualis est conseill pour: - les sites peu visits (jusqu 20 ou 30 connexions simultanes), - les sites ncessitant peu de mmoire (pas de calculs trs importants effectus sur le serveur), - les sites en phase de dmarrage.

Ddi

Principaux avantages: - Ressources du poste serveur disponibles pour le(s) site(s) install(s) sur ce poste. - Gestion du rapatriement des donnes totalement personnalisable: - rplication par e-mails, - utilitaire WDREPLIC, - copie des fichiers par FTP. Principaux inconvnients: - Cot important - Administration du poste serveur entirement ralise par le client, la plupart du temps.

Un serveur ddi est conseill pour: - les sites trs visits, - les sites ncessitant une place disque et mmoire importante, - les sites grant des donnes sensibles, - les sites dynamiques.

236

Partie 8 : Hbergement de sites WebDev

Centre de Contrle dhbergement


Destin principalement aux hbergeurs et aux Webmasters, le Centre de Contrle dhbergement permet daider hberger plus facilement les sites WebDev. Le Centre de Contrle gre bien sr les comptes WebDev, mais galement, le compte au niveau du serveur web et les droits au niveau du systme dexploitation. Un choix par dfaut est propos: il permet dinstaller un serveur par simple clic, sans comptences spcifiques. Le paramtrage des lments suivants est centralis: Comptes Windows, Groupes des utilisateurs FTP, Groupes des clients WebDev, Home Directory, Alias FTP, Comptes WebDev, Rpertoires des donnes, Sites Web virtuels, ... Le Centre de Contrle dhbergement fonctionne sous environnement Windows avec le serveur web IIS (Internet Information Server, toutes versions partir de la 5).

Partie 8 : Hbergement de sites WebDev 237

Site dynamique sur des configurations spcifiques


1. Installation sur un serveur Web sous Windows (2000 ou suprieur) ou un serveur Linux

238

Partie 8 : Hbergement de sites WebDev

2. Installation sur un serveur Windows, avec un accs Internet par UNIX

1. Ouverture dune page statique. La page statique est prsente sur le serveur UNIX. 2. Lancement du site dynamique WebDev (prsent sur le serveur Windows) par un lien prsent dans la page HTML statique. 3. Fonctionnement normal du site WebDev. Remarque: la mme configuration peut tre adopte avec un serveur Linux.

Partie 8 : Hbergement de sites WebDev 239

3. Installation sur un serveur Windows ou Linux, avec Load Balancer


Le systme Load Balancer permet de rpartir la charge de connexion sur un site dynamique WebDev sur diffrents postes.

Solution 1: Installation du site dynamique WebDev uniquement sur le serveur de donnes. Cette solution consiste installer: sur chaque serveur Web, le serveur dapplication WebDev, sur le serveur de donnes, les sites dynamiques WebDev et les fichiers de donnes. Solution 2: Installation du site dynamique WebDev sur tous les serveurs Web. Cette solution consiste installer: sur chaque serveur Web, le serveur dapplication WebDev, et les sites dynamiques WebDev. sur le serveur de donnes, les fichiers de donnes des sites dynamiques WebDev.

240

Partie 8 : Hbergement de sites WebDev

Statistiques de frquentation des sites dynamiques


Il est souvent important de disposer de statistiques prcises sur les visites des sites. Comment savoir qui est venu sur votre site, les pages qui ont t consultes, les applications qui ont t utilises, de quel site vient linternaute? WebDev est fourni avec un outil complet de statistiques pour les pages dynamiques: WDStatistique. Cet outil peut tre install sur nimporte quel poste. Quelques exemples de statistiques fournies par WDStatistique: nombre de connexions par jour, pages consultes, systmes dexploitation et navigateurs des internautes, ... Exemples de statistiques de sites dynamiques:

Partie 8 : Hbergement de sites WebDev 241

Surveillez vos sites, serveurs, ...


Un site dpend souvent de nombreux paramtres extrieurs: site Web, Serveur HyperFileSQL, rseau, ... Pour optimiser la gestion des incidents, WebDev propose dutiliser un robot de surveillance. Compos de trois excutables lancs sur diffrents postes, le robot de surveillance permet dexcuter diffrents tests: tests Internet, tests rseau, ... En cas de problmes lors du passage dun test, le robot de surveillance peut vous avertir de diffrentes faons: Message envoy dans la messagerie PC SOFT (WDBAL). Email Excution dun programme tiers. De plus, une alerte sonore peut tre mise en place sur le moniteur.

242

Partie 8 : Hbergement de sites WebDev

Partie 9 Annexes

244

Partie 9 : Annexes

Fonctions du WLangage spcifiques WebDev 17


(Dtail dans laide en ligne du WLangage)

AJAXAnnuleAppelAsynchrone AJAXAppelAsynchroneEnCours AJAXDisponible AJAXExcute AJAXExcuteAsynchrone AjouteFavori AnnuleContexteAWP ASPAffiche ASPExcute CaptchaAffiche CaptchaVrifie CelluleAfficheDialogue CelluleFermeDialogue CertificatClientInfo ChaneAffiche ChangeAction ChangeDestination CheminNavigationAjouteLien CheminNavigationInsreLien CheminNavigationModifieLien CheminNavigationSupprimeLien CheminNavigationSupprimeTout ConfigureContexteAWP ConnexionOccurrence ContexteExiste ContexteFerme ContexteOuvre CookieEcrit

Annule lexcution automatique de la procdure navigateur appele par la fonction AJAXExcuteAsynchrone. Permet de savoir si une procdure serveur appele par la fonction AJAXExcuteAsynchrone est en cours dexcution. Permet de savoir si la technologie AJAX est utilisable dans le navigateur en cours. Excute une procdure serveur sans rafrachir la page. Excute une procdure serveur sans rafrachir la page. Ajoute une adresse Internet dans la liste des favoris de linternaute. Supprime du contexte AWP une variable ajoute par la fonction DclareContexteAWP. Appelle un script ASP externe et renvoie la page rsultat dans la fentre en cours du navigateur. Appelle un script externe .asp et renvoie le rsultat dans une chane. Affiche un nouveau captcha dans un champ captcha. Vrifie si la valeur saisie par lutilisateur correspond la chane affiche dans un champ captcha. Affiche une cellule dans la page avec un effet de GFI (Grisage des Fentres Inaccessibles). Masque une cellule affiche via la fonction CelluleAfficheDialogue. Renvoie des informations sur le certificat utilis par le poste client. Renvoie une chane spcifique (ou un buffer) sur le navigateur du client en rponse la requte reue. Permet de spcifier laction effectue en cas de dsynchronisation entre la page HTML affiche dans le navigateur et le contexte de page sur le serveur. Change la frame de destination de la page. Ajoute un lien dans un chemin de navigation. Insre un lien dans un chemin de navigation. Modifie un lien dans un chemin de navigation. Supprime un lien dans un chemin de navigation. Supprime tous les liens dans un chemin de navigation. Dfinit le fonctionnement des contextes AWP. Renvoie le nombre dinstances du site WebDev en cours dexcution sur le serveur. Permet de savoir si un contexte de page existe sur le serveur. Ferme un contexte de page. Ouvre un nouveau contexte de page sans renvoyer les informations vers le navigateur. Ecrit un cookie sur le poste de linternaute lors du prochain affichage dune page WebDev dans le navigateur. Partie 9 : Annexes 245

CookieLit CouleurPalette DclareContexteAWP EmailEtat EmailOuvreMessagerie FichierAffiche FichierVersPage FramesetActualise FramesetAffiche FramesetUtilise fRepWeb GadgetAfficheFlyout GadgetChargeParamtre GadgetFermeFlyout GadgetSauveParamtre gpwOuvreConfiguration GPSDernirePosition GPSEtat GPSRcuprePosition GPSSuitDplacement grTailleImage IdentifiantContexteAWP ImageArrteDfilement ImageDernier ImageLanceDfilement ImageOccurrence ImagePositionDfilement ImagePosX ImagePosY ImagePrcdent ImagePremier ImageSuivant ImageZone iRepImageHTML

Rcupre la valeur dun cookie enregistr sur le poste de linternaute. Lit une couleur de la palette courante. Dclare une liste de variables dont la valeur sera persistante entre les affichages successifs des pages AWP. Renvoie ltat dun email envoy par une session SMTP ouverte en mode asynchrone. Ouvre le logiciel de messagerie par dfaut de linternaute. Renvoie un fichier spcifique sur le navigateur. Initialise automatiquement les champs dune page avec les valeurs des rubriques associes dans lenregistrement en cours (charg en mmoire) du fichier HyperFileSQL. Actualise un frameset affich dans le navigateur de linternaute partir du contexte prsent sur le serveur. Affiche un frameset WebDev dans le navigateur de linternaute. Affiche un frameset WebDev dans le navigateur de linternaute et ferme tous les contextes de pages et de frameset en cours. Renvoie le nom physique complet du rpertoire contenant les images, les fichiers Javascript et Java du site WebDev. Affiche dans une zone popup une page du gadget Vista. Charge une valeur persistante dans un gadget Vista. Ferme la zone popup dun gadget Vista. Sauve une valeur persistante dans un gadget Vista. Ouvre la page de configuration du groupware utilisateur. Rcupre les informations sur la dernire position connue de lappareil. Rcupre ltat dactivation du fournisseur de golocalisation ou demande tre notifi lors du changement dtat. Rcupre les informations sur la position actuelle du priphrique. Demande tre notifi priodiquement de la position courante du priphrique. Dfinit la taille de limage contenant le graphe. Renvoie lidentifiant du contexte AWP. Arrte le dfilement automatique des images. Affiche la dernire image. Lance le dfilement automatique des images. Permet de connatre le nombre total dimages. Retourne limage affiche. Renvoie la position horizontale du curseur de souris par rapport au champ image considr. Renvoie la position verticale du curseur de souris par rapport au champ image considr. Affiche limage prcdente. Affiche la premire image. Affiche limage suivante. Renvoie le numro de la zone de limage clique par linternaute (image clicable uniquement). Permet de slectionner le rpertoire des images gnres lors dune limpression au format HTML.

246

Partie 9 : Annexes

JaugeActive JaugeDsactive JaugeExcute JSEvnement JSFinEvnement JSInfoEvnement JSInterruptionEvnement JSMthode JSONExcute JSONExcuteExterne

JSProprit MenuAjouteOptionURL NavigateurAdresseIP NavigateurEstConnect NavigateurFerme NavigateurLanceAppli NavigateurNom NavigateurOuvre PageActiveGFI PageActualise PageAdresse PageAffiche PageAfficheDialogue PageCourante PageExiste PageFermeDialogue PageInitialisation PageParamtre

Active le rafrachissement dune jauge Ajax. Stoppe le rafrachissement priodique dune jauge Ajax. Lance un traitement navigateur relativement long et fait avancer une jauge Ajax selon lavancement de ce traitement. Associe une procdure navigateur un vnement sur un objet en code navigateur. Supprime lassociation dune fonction WLangage navigateur un vnement. Permet de manipuler les proprits JavaScript de lvnement navigateur qui a dclench lexcution du code. Interrompt le traitement de lvnement en cours. Permet dexcuter une mthode Javascript sur un lment de la page en cours. Appelle une URL serveur du mme domaine qui retourne des donnes au format JSON (JavaScript Object Notation). Appelle une URL serveur externe qui retourne des donnes au format JSON (JavaScript Object Notation). Les donnes sont traites dans une procdure spcifique. Permet de manipuler des fonctionnalits spcifiques sur des objets de la page en cours. Ajoute une nouvelle option de menu la fin dun menu. Cette option de menu permet dafficher la page correspondant lURL indique. Renvoie ladresse IP du poste de lInternaute connect au site WebDev. Indique si le navigateur est connect au rseau. Ferme la fentre en cours du navigateur et stoppe lexcution du code en cours. Lance le navigateur web natif de lapplication Renvoie le nom du navigateur de linternaute. Ouvre une nouvelle fentre du navigateur. Active ou dsactive leffet appliqu par WebDev sur les pages inactives lors de laffichage dune page modale. Actualise une page affiche dans le navigateur de linternaute partir du contexte prsent sur le serveur. Permet dobtenir ladresse Internet dune page WebDev. Affiche une page dans le navigateur de linternaute. Affiche une page de manire modale. Permet de crer un dialogue avec lutilisateur. Renvoie le nom de la page contenant le code WLangage en cours dexcution. Vrifie si la page spcifie est actuellement affiche dans le navigateur de linternaute. Ferme la page courante. Cette page a t ouverte avec la fonction PageAfficheDialogue. Remet zro (ou non) les champs de la page en cours et lance les traitements dinitialisation des champs. Renvoie la valeur dun paramtre pass la page en cours.

Partie 9 : Annexes

247

PagePosition PagePrcdente PageTauxGFI PageUtilise PageValide PageVersASP PageVersEmail PageVersFichier PageVersJSP PageVersPHP PageVersSource

Fait dfiler une page pour positionner un champ dans la partie visible de la page (le plus haut) dans le navigateur. Renvoie le nom de la page prcdente. Permet de dfinir le taux de grisage des pages inactives. Affiche une page WebDev dans le navigateur de linternaute et ferme tous les contextes de pages en cours. Valide la page spcifie et lance lexcution dun bouton. Envoie les donnes dune page actuellement affiche sous le navigateur vers un serveur ASP. Envoie les donnes dune page actuellement affiche sous le navigateur par un email. Initialise automatiquement la valeur mmoire des rubriques dun fichier avec la valeur des champs de la page. Envoie les donnes dune page actuellement affiche sous le navigateur vers un serveur JSP. Envoie les donnes dune page actuellement affiche sous le navigateur vers un serveur PHP. Initialise automatiquement la valeur mmoire des rubriques dun fichier de donnes avec la valeur des champs de la page et / ou la valeur des variables WLangage avec la valeur des champs de la page. Appelle un script PHP externe et renvoie la page rsultat dans la fentre en cours du navigateur. Appelle un script externe .php et renvoie le rsultat dans une chane. Une requte http est effectue. Affiche une page popup. Ferme une page popup. Initialise automatiquement la valeur mmoire des rubriques dun fichier de donnes avec la valeur des champs de la page et / ou la valeur des variables WLangage avec la valeur des champs de la page. Renvoie le chemin du rpertoire contenant les images, les fichiers Javascript, les fichiers applet Java, les autres fichiers accessibles depuis le navigateur,... Construit un flux RSS et renvoie le contenu du flux RSS au client. Le rsultat est affich sur le navigateur de linternaute. Authentifie un utilisateur dun site SaaS auprs du webservice SaaS gestionnaire du site. Renvoie les caractristiques de la connexion la base de donnes du client. . Dconnecte lutilisateur dun site SaaS auprs du webservice SaaS gestionnaire du site. Enregistre une information spcifique pour un site SaaS dans la configuration dun compte client. Dtermine si la connexion au webservice SaaS est toujours en cours. Lit une information spcifique au client pour le site SaaS en cours. Vrifie les droits daccs de lutilisateur un service du site SaaS. Appelle un script externe (par exemple .php, .asp, .mhtml ou .mht) et renvoie la page rsultat dans la fentre en cours du navigateur.

PHPAffiche PHPExcute PopupAffiche PopupFerme RpertoireDonnes

RpertoireWeb rssAffiche SaaSConnecte SaaSConnexionClient SaaSDconnecte SaaSEcritParamtreSite SaaSEstConnect SaaSLitParamtreSite SaaSVrifieService ScriptAffiche

248

Partie 9 : Annexes

ScriptExcute SiteAdresse SourceVersPage SiteDynamiqueAffiche SSLActive StockageLocalAjoute StockageLocalDisponible StockageLocalNomValeur StockageLocalOccurrence StockageLocalRcupre StockageLocalSupprime StockageLocalSupprimeTout SupprimeContexteAWP SysVersion UploadCopieFichier UploadFichierEnCours UploadLance UploadNomFichier UploadSupprime

Appelle un script externe (par exemple .php ou .asp) et renvoie le rsultat dans une chane. Une requte http est effectue: il est possible dutiliser soit une mthode POST, soit une mthode GET. Renvoie ladresse Internet de connexion un site dynamique WebDev situ sur le mme serveur. Initialise automatiquement les champs dune page avec: - les valeurs des rubriques associes dans lenregistrement en cours, - les valeurs des variables WLangage associes. Affiche un site dynamique (cr avec WebDev) dans le navigateur de linternaute partir dune page WebDev dynamique ou statique. Permet dactiver ou de dsactiver le mode scuris SSL. Ajoute une valeur au stockage local. Indique si le stockage local est disponible. Donne le nom dune valeur du stockage local. Donne le nombre de valeurs du stockage local. Rcupre une valeur du stockage local. Supprime une valeur du stockage local. Supprime toutes les valeurs du stockage local. Supprime du contexte AWP une variable ajoute par DclareContexteAWP Renvoie des renseignements sur la version de PHP utilise sur le poste serveur en cours. Enregistre sur le serveur un fichier "upload" par linternaute. Indique le fichier en cours dupload via le champ upload. Cette fonction est utile notamment pour les champs Upload multi-fichiers. Lance lenvoi des fichiers slectionns dans un champ upload. A la fin de lenvoi, la liste des fichiers envoyer est vide sur le navigateur. Renvoie le nom dun fichier "upload" par linternaute.

Supprime un fichier de la liste des fichiers uploader: le fichier ne sera pas upload sur le serveur. UploadSupprimeTout Vide la liste des fichiers uploader: aucun fichier ne sera upload sur le serveur. UploadTaille Renvoie la taille totale (en octets) des fichiers dj envoys par lupload en cours via un champ Upload. UploadTailleEnvoye Renvoie la taille totale (en octets) des fichiers dj envoys par lupload en cours via un champ Upload. UploadTailleEnvoyeFichierEnCours Renvoie la taille (en octets) dj envoye du fichier en cours dupload via un champ Upload. UploadTailleFichier UploadTailleFichierEnCours Renvoie la taille totale (en octets) dun fichier prsent dans un champ Upload. Renvoie la taille (en octets) dj envoye du fichier en cours dupload via un champ Upload.

Partie 9 : Annexes

249

Composants livrs avec WebDev


WebDev est livr en standard avec de nombreux composants. Ces composants sont livrs avec leurs sources et avec un exemple dutilisation. Voici la liste des principaux composants livrs avec WebDev: Nom du composant Demande de documentation Diagramme de Gantt Login Moteur de Recherche Description Permet de grer une demande de documentation (brochure, catalogue, ...) dans un site WebDev. Permet dafficher un diagramme de GANTT dans une table mmoire ou dans une page intgre au composant. Centralise la gestion des utilisateurs et de leurs mots de passe. Permet dindexer des documents (texte, vidos, sons,) selon un identifiant gr par lutilisateur (pouvant provenir dun fichier de donnes HyperFileSQL, ) et des mots-cls (texte contenu dans un document, nom de fichier, etc). Permet galement deffectuer des recherches sur les documents ainsi indexs et de gnrer des statistiques dindexation (mots-cls inutiliss, nombre de documents par mots-cls, etc). Permet de grer facilement un panier de commandes dans un site WebDev. Permet de mettre en place un systme de paiement scuris en utilisant la solution de la socit PayBox. Attention: ceci nest pas une recommandation de PC SOFT pour lutilisation de la solution de paiement scuris de la socit PayBox.

Panier PayBox

Deux sous-rpertoires sont spcifiques chacun de ces exemples: - le sous-rpertoire "<NomDuComposant>-Exemple" contient un exemple de projet utilisant le composant. - le sous-rpertoire "<NomDuComposant>-Source" contient le projet du composant. Des composants supplmentaires seront livrs avec la Lettre du Support Technique (LST) ou disponibles sur notre site (www.pcsoft.fr).

250

Partie 9 : Annexes

Exemples livrs avec WebDev


Les exemples livrs avec WebDev prsentent de manire didactique les diffrentes fonctionnalits de WebDev. Leur code source est comment et dtaill. Ces exemples sont prsents dans le sous-rpertoire "Exemples" du rpertoire dinstallation de WebDev et peuvent tre ouverts directement depuis le volet "Assistants, Exemples et Composants". Diffrents types dexemples sont livrs avec WebDev: - exemples complets: ces exemples correspondent des sites complets, qui peuvent tre utiliss sans adaptation. - exemples didactiques: ces exemples illustrent une fonctionnalit spcifique.

Exemples complets
Nom de lexemple Catalogue_Internet Description
Propose un site catalogue en AWP et un site dadministration: - Gestion dun panier - Gestion des promotions - Gestion des nouveauts - Recherche de produit Gestion de supermarch en ligne. Les produits peuvent tre achets et stocks dans un panier virtuel jusquau paiement. Portail intranet gratuit : messagerie, forum, blogs, Gestion de petites annonces. Permet des recherches multicritres, ajout, modification et suppression dannonces, ainsi quune gestion dutilisateurs. Achat de voyages en ligne. Gestion de dysfonctionnements. Permet de crer, modifier ou supprimer des suggestions ou des dysfonctionnements. Gestion de dysfonctionnements en PHP. Permet de crer, modifier ou supprimer des suggestions ou des dysfonctionnements. Gestion Electronique de Documents (GED). Utilise le composant Moteur de recherche pour effectuer des recherches par mot-cl.

Hawaii Honolulu NetAnnonces

Rewali SAV SAV_Php

WebDoc

Partie 9 : Annexes

251

WebDVD WebImmo WebMillion WebParc WW_Blog_AWP

Site de location de DVD en ligne. Site de vente et de location de biens immobiliers. Utilise un fichier de donnes de plus d1 million denregistrements. Simule une gestion de parc informatique. Cet exemple est un site de gestion de blogs, bas sur une gnration AWP, ce qui permet entre autre de pouvoir rfrencer le site dans tous les moteurs de recherche. De plus, chaque blog peut tre export en RSS. Cet exemple est un site PHP de gestion de blogs. Cet exemple prsente comment utiliser le grapheur et associer des actions au clic sur des parties du graphe. Cet exemple est un CMS (Content Management System) ou site de gestion de contenu, typiquement un site daffichage darticles. Cet exemple est dvelopp pour Microsoft Internet Explorer 5.5 (ou version ultrieure). Il utilise les fonctionnalits ddition HTML dInternet Explorer. Cet exemple permet de simuler des emprunts. Les tableaux damortissement peuvent tre dits dans un fichier au format PDF. Cet exemple propose les fonctionnalits principales dun forum utilisateur (cration de forums, de sujets (ou topics) et de messages, modration par un administrateur, ...). Cet exemple propose les fonctionnalits principales dun forum utilisateur (cration de forums, de sujets (ou topics) et de messages, modration par un administrateur, ...). Cet exemple propose les fonctionnalits principales dun forum utilisateur (cration de forums, de sujets (ou topics) et de messages, modration par un administrateur, ...). Cet exemple est une galerie dimages et de photographies simplifie. Cet exemple est un site PHP. Il sagit dune galerie dimages et de photographies simplifies.

WW_Blog_PHP WW_Camembert WW_CMS

WW_Editeur_HTML

WW_Emprunt

WW_Forum_AWP

WW_Forum_Classic

WW_Forum_PHP

WW_Images WW_Images_php

252

Partie 9 : Annexes

WW_Planning

Cet exemple permet dafficher de faon dynamique les tches des diffrents collaborateurs. Il est possible dajouter, de modifier ou de supprimer des tches dans le planning, simplement en cliquant sur les lments du planning. Toutes les manipulations sont effectues en AJAX. Cet exemple de site marchand simplifi est un site Php ralis avec WebDev. Cet exemple permet de dessiner des graphes. Prsente le mixage entre un site dynamique WebDev classique et un site AWP WebDev. Cet exemple explique comment utiliser le grapheur pour tracer des graphes boursiers. Site de discussion en ligne et en direct. Tous les traitements (envoi de messages, etc.) sont grs en AJAX. Il ny a donc aucun effet de rafrachissement dans les pages. Cet exemple explique comment manipuler les images en code navigateur: zoomer, se dplacer, grer le clic sur une carte (ici une carte Michelin).

WW_SiteMarchand_php WW_TraceCourbe WW_VitrineAWP WW_WebBourse WW_WebChat

WW_Zoom

Exemples didactiques
Nom de lexemple WW_Agenda WW_Animated WW_Assistant Description
Cet exemple utilise le champ Planning en mode Agenda. Prsente quelques fonctionnalits danimations et deffets proposs en standard dans WebDev et le WLangage. Cet exemple met disposition une classe et un modle de page rutilisables, qui permettent de crer et de grer un assistant Web. Permet lInternaute de lancer un traitement serveur, tout en ayant son interface modifie afin dtre notifi de la fin du traitement serveur Cet exemple montre comment crer des "cellules furtives" dans vos sites WebDev Exemple dutilisation de tous les types de champs disponibles avec WebDev lors dune gnration PHP.

WW_Attente_Serveur

WW_CellulesFurtives WW_Champs_PHP

Partie 9 : Annexes

253

WW_ChangementCSS

Cet exemple explique comment modifier la feuille de styles dune page WebDev par programmation. Ce principe peut tre utile par exemple pour changer linterface dun site en fonction des prfrences de linternaute. Permet dexcentrer les parts dun graphe de type secteur par un simple clic utilisateur. Fonctions de dessin en code navigateur, pour les navigateurs supportant HTML5. Cet exemple montre comment raliser un effet de fondu entre 2 images. Cet exemple fournit sous forme de superchamps des bandeaux Flash personnalisables. Cet exemple prsente les interactions possibles en code navigateur entre une application Flex et un site WebDev. Cet exemple montre comment lire et afficher un flux RSS dans une page WebDev grce au type RSS. Cet exemple montre comment modifier deux frames diffrentes, sans rafficher tout le frameset. Montre comment intgrer dans une page WebDev dynamique des effets spciaux crs avec du javascript et du CSS. Cet exemple montre comment raliser un mini-site WebDev pour iPhone. Cet exemple a pour but de prsenter lutilisation des map area en programmation ou par action prdfinie. Illustre linteraction entre une page WebDev et le service Google Maps API, afin dafficher une carte gographique, politique ou routire dun endroit donn sur la plante. Cet exemple montre comment utiliser le CSS pour encadrer et mettre en vidence des mots dans un libell HTML (ou un champ HTML). Cet exemple montre comment afficher un nuage de tags dans une application WebDev dynamique. Prsente comment proposer dans vos sites WebDev PHP un paiement scuris avec la solution PayPal. Permet de grer des commandes, modifier les quantits commandes, valider et enregistrer des commandes au format XML.

WW_Clic_sur_Graphe WW_Dessin_HTML5 WW_DiapoFondu WW_FlashParametrable WW_Flex WW_Flux_RSS WW_Frames WW_IntegrationCSS WW_iPhone WW_MapArea WW_MapStatique

WW_MiseEnEvidence

WW_NuageTags WW_Paypal_PHP WW_ReassortXML

254

Partie 9 : Annexes

WW_RegletteAWP WW_Silvertlight WW_SiteClientSAAS WW_TexteDefilant

Cet exemple montre comment grer une rglette dans une page AWP. Illustre les possibilits de dialogue entre un site dynamique WebDev et des champs Silverlight.

Cet exemple montre lutilisation des fonctions dadministration SaaS de WEBDEV.


Cet exemple propose lutilisation du superchamp TexteDefilant. Ce superchamp permet de faire dfiler du texte dans un cadre de votre page. Montre comment utiliser le champ upload pour effectuer : - le transfert dun ou plusieurs fichiers simultanment, - laffichage dune jauge pendant le transfert, - rcuprer des informations sur les fichiers transfrs. Cet exemple montre comment utiliser un systme de dragn drop de champs dans une page Web. Il sagit ici de dplacer un produit en provenance dune zone rpte vers un panier (ici, une page interne). Cet exemple est un gestionnaire de documents WIKI. Un document WIKI est un document modifiable par toutes les personnes ayant accs ce document. Montre comment rcuprer les paramtres passs, laide de la fonction PageParamtre(). Cet exemple est un site Php Ajax ralis avec WebDev. Il prsente notamment les tables et les zones rptes Ajax. Prsente lutilisation du champ Onglet. Ce site permet de dtecter la fermeture dun navigateur client afin denregistrer, par exemple, sa dconnexion ou deffectuer des oprations spcifiques. Cet exemple prsente les botes de dialogue automatiques et galement les botes de dialogue personnalises. Cet exemple montre un dialogue entre deux navigateurs distincts. Ce site est un diaporama de photographies du Cantal (15). Ce site permet de proposer des fichiers en tlchargement aux utilisateurs en fonction du groupe auquel ils appartiennent. Ce site permet dutiliser les variables denvironnement afin de rcuprer certaines informations sur les internautes.

WW_Upload

WW_WEB2

WW_WIKI

WWAgenda WWAjaxPHP WWChampOnglet WWConnect

WWDialogue WWDialogueNavigateur WWDiapo WWDload WWEnvironnement

Partie 9 : Annexes

255

WWFlash

Ce site permet dintgrer un menu droulant Flash qui interagit avec WebDev. Ce site permet donc dutiliser des animations Flash dans un site WebDev. Ce site montre aussi linteraction avec une animation Flash. Cet exemple permet de montrer comment changer dynamiquement lapparence dun formulaire contenu dans une page Web. Cet exemple prsente un menu ralis avec WebDev. Cet exemple montre comment passer et rcuprer des paramtres un site. Cet exemple est un site pouvant tre visualis sur un Pocket PC. Le site dtecte la rsolution du client et affiche les pages en consquence. Ce site permet dintercepter lappui sur la touche [TABULATION] pour insrer une tabulation dans un champ de saisie. Ce programme permet de dtecter la touche frappe au clavier (vnement OnKeyDown) sous Internet Explorer. Cette fonctionnalit est mise en place dans un jeu de mots-croiss. Cet exemple prsente les cas les plus frquents dutilisation de zones rptes.

WWForm

WWMenu WWParam WWPocket

WWTabulation

WWTouche

WWZone

Des exemples supplmentaires sont livrs avec la Lettre du Support Technique (LST) ou sont disponibles sur notre site (www.pcsoft.fr).

256

Partie 9 : Annexes

Вам также может понравиться