Valid XHTML    Valid CSS2    

Listing du fichier sen_tps.php

 

00001     <?php
00002     
# # (gH) -_- sen_tps.php ; TimeStamp (unix) : 07 Octobre 2019 vers 12:56
00003     
include("../std.php") ;
00004     
debutPage
("L3SEN TP ENONCES","strict") ;
00005     
debutSection() ;
00006     
h1
("ENONCES DES TPS INFORMATIQUE WEB") ;
00007     
h1
("pour la licence DSCS") ;
00008     
h1
("(Diffusion du savoir et Culture scientifique)") ;
00009     
00010     
$HTML
= ghBleu("HTML") ;
00011     
$Javascript
= ghVert("Javascript") ;
00012     
$MySQL
= ghBleu("MySQL") ;
00013     
00014     
p
("grouge droite") ;
00015     echo
"gilles.hunault@univ-angers.fr" ;
00016     
finp() ;
00017     
00018     
#########################################################
00019     
00020     
function
tpDscs($num,$nom="") {
00021     
h2
("TP ".aname("DSCS","tp$num")." numéro $num ".ancre("sen_tps_cor.php#tp$num","(corrigé)").$nom) ;
00022     }
# fin de fonction tpDscs
00023     
00024     #########################################################
00025     #########################################################
00026     
00027     
$nomTp = array() ;
00028     
$nomTp
[1] = " Pages Web ".em(ghvert("locales")) ;
00029     
$nomTp
[2] = " Pages Web sur ".em(ghRouge("distantes"))." sur ".em("devel")." et tableaux " ;
00030     
$nomTp
[3] = " Tableaux, listes et CSS " ;
00031     
$nomTp
[4] = " CSS, formulaires et $Javascript" ;
00032     
$nomTp
[5] = " $Javascript" ;
00033     
$nomTp
[6] = " Php " ;
00034     
$nomTp
[7] = " Php et Mysql " ;
00035     
00036     
h2
("Table des matières") ;
00037     
$nb_tp
= 7 ;
00038     
blockquote() ;
00039      for (
$itp
=1;$itp<=$nb_tp;$itp++) {
00040      echo
h3
(ancre("#tp$itp","TP numéro $itp").$nomTp[$itp]) ;
00041      } ;
# fin pour
00042     
finblockquote() ;
00043     
00044     
$jtp
= 0 ;
00045     
00046     
#########################################################
00047     
00048     
$jtp
++ ; tpDscs($jtp,$nomTp[$jtp]) ; # TP1
00049     
00050     #########################################################
00051     
00052     
p
("texte") ;
00053     echo
b
("Remarque ")." : tout le TP se passe en local, sous Windows ou Linux." ;
00054     
finp() ;
00055     
00056     
ol() ;
00057     
debutli
() ; # 1
00058     
p
("texte") ;
00059     echo
"Quels sont les navigateurs Web disponibles en général&nbsp;? Lequel ou lesquels sont les meilleurs et pourquoi&nbsp;?" ;
00060     
finp() ;
00061     
finli() ;
00062     
00063     
debutli
() ; # 2
00064     
p
("texte") ;
00065     echo
"Ecrire juste "
.ghBleu("ESSAI : &lt;H1&gt;BONJOUR")." dans le fichier ".b("bonjour.htm")." " ;
00066     echo
" à l'aide de Geany ou Notepad++ (mais pas le bloc-notes standard de Windows) pour Windows, "
; # sous Xp, avec gedit sous Linux." ;
00067     
echo
" avec Geany sous Linux (ou un autre éditeur de texte avec coloration syntaxique des mots-clés de XHTML)." ;
00068     
finp() ;
00069     
ul() ;
00070     
li
("Est-ce que le texte s'affiche avec un navigateur via Fichier/Ouvrir&nbsp;?") ;
00071     
li
("ESSAI et BONJOUR sont-ils écrits pareils&nbsp;? Pourquoi&nbsp;? ") ;
00072     
li
("Est ce que le texte s'affiche de façon identique quelque soit le navigateur&nbsp;?") ;
00073     
li
("Le fichier est-il bien formé&nbsp;? valide&nbsp;? ") ;
00074     
li
("Complétez le fichier pour qu'il soit valide au sens de la grammaire XHTML Strict et vérifiez-le sur le site du W3C.") ;
00075     
li
("Ecrire un fichier ".b("sq.htm")." (\"squelette\") qui servira de modèle pour les exercices suivants.") ;
00076     
finul() ;
00077     
finli() ;
00078     
00079     
debutli
() ; # 3
00080     
p
("texte") ;
00081     echo
"Essayez de trouver plusieurs façons d'écrire "
.ghBleu("BONJOUR BONSOIR")." sur deux lignes différentes à l'affichage. " ;
00082     echo
" "
.em("Remarque")." : il y en a au moins 6." ;
00083     
finp() ;
00084     
finli() ;
00085     
00086     
debutli
() ; # 4
00087     
p
("texte") ;
00088     echo
"Mézalors, quelle grammaire (DOCTYPE) faut-il utiliser&nbsp;?" ;
00089     echo
" Et comment utiliser les styles&nbsp;?" ;
00090     
finp() ;
00091     
/*
00092     p("texte") ;
00093     echo "Installez HTML validator pour Firefox. Si on vous demande une méthode de validation " ;
00094     echo " à l'installation, privilégiez le mode &laquo;les deux&raquo;." ;
00095     finp() ;
00096     */
00097     
finli() ;
00098     
00099     
debutli() ;
00100     
p
("texte") ;
00101     echo
em
("Do you need to speak english to write Web pages&nbsp;?")."" ;
00102     
finp() ;
00103     
finli() ;
00104     
00105     
debutli() ;
00106     
p
("texte") ;
00107     echo
"Ecrire une page Web qui correspond à l'adresse Jean DUPONT 3 route de Rome 49100 ANGERS pour une grande enveloppe A4. " ;
00108     echo
"Comment mettre en bleu le nom et le prénom&nbsp;? Et la ville en gras&nbsp;? " ;
00109     
finp() ;
00110     
p
("cadre unTiers center") ;
00111     echo
img
("a4.png","",600) ;
00112     
finp() ;
00113     
p() ;
00114     echo
b
("Attention")." : résoudre complètement cet exercice en transitionnel et en strict est technique. On réfléchira à la solution " ;
00115     echo
" mais on n'essaiera pas d'écrire exactement le code source HTML et CSS." ;
00116     
finp() ;
00117     
finli() ;
00118     
00119     
debutli() ;
00120     
p
("texte") ;
00121     echo
"Construire une liste numérotée puis non numérotée des courses : oeufs, pain, viande, fruits, légumes." ;
00122     echo
" Reprendre avec une liste à définition (faire un petit commentaire pour chaque ingrédient)." ;
00123     echo
" Cherchez le mot oeuf avec "
.b("Google").". Comment faire un lien vers la page correspondante&nbsp;? " ;
00124     echo
" Cherchez une image d'oeuf avec "
.b("Google Images").". Comment afficher cette image&nbsp;? " ;
00125     
finp() ;
00126     
00127     
p
("texte") ;
00128     echo
" Faire un tableau (avec bordure) des courses oeufs, pain, viande fruits, légumes sous forme de tableau. La colonne 1 contiendra le mot avec son lien, " ;
00129     echo
" la colonne 2 l'image (normalisée), la colonne 3 le petit commentaire. " ;
00130     echo
" Comment mettre un lien sur le bas de la page de la liste de courses&nbsp;? " ;
00131     
finp() ;
00132     
00133     
p
("texte") ;
00134     echo
"S'il reste du temps : (à faire dans le tableau)" ;
00135     
finp() ;
00136     
ul() ;
00137     
li
(" Quelle est la \"bonne\" syntaxe de l'URL ".b("http://www.google.fr/search?q=légumes")."&nbsp;? ") ;
00138     
li
(" Mettre toutes les images avec une m&ecirc;me taille. ") ;
00139     
li
(" Mettre une couleur bleu clair en fond de tableau.") ;
00140     
li
(" Mettre le texte de commentaire en vert sur fond rose pour le pain et la viande.") ;
00141     
li
(" Faire un roll-over (qu'est-ce&nbsp;?) sur deux images en cru/cuit.") ;
00142     
finul() ;
00143     
finli() ;
00144     
00145     
00146     
finol() ;
00147     
00148     
#########################################################
00149     
00150     
$jtp
++ ; tpDscs($jtp,$nomTp[$jtp]) ; # TP2
00151     
00152     #########################################################
00153     
00154     
p
("texte") ;
00155     echo
b
("Remarque ")." : sauf pour l'exercice 1, tout le TP se passe en local, sous Windows ou Linux, " ;
00156     echo
" mais les pages doivent ensuite &ecirc;tre transférées vers les comptes Linux étudiant(e)s du départment informatique de l'UFR." ;
00157     
finp() ;
00158     
00159     
ol() ;
00160     
00161     
debutli() ;
00162     
p
("texte") ;
00163     echo
" Utiliser le PC sous Linux et réaliser une connection vers la machine "
.em("devel")." dans un terminal. " ;
00164     echo
" On utilisera la commande "
.b("ssh -YC -p 4920 VOTRE_LOGIN@devel.info.univ-angers.fr")." pour se connecter où ".b("VOTRE_LOGIN")." est l'identifiant " ;
00165     echo
" associé à votre compte d'étudiant(e). " ;
00166     
#echo " Au pire, demandez à un(e) voisin(e) connecté(e) de taper ".b("liste licsen")." " ;
00167     #echo " afin de voir votre login." ;
00168     
finp() ;
00169     
00170     
p
("texte") ;
00171     
#echo " Changer le mot de passe provisoire de votre compte en un \"vrai\" mot de passe avec la commande ".em("yppasswd").". " ;
00172     
echo
" Est-ce que le répertoire ".ghRouge("forge_html")." existe&nbsp;?" ;
00173     echo
" Si non, le créer. Vérifier ensuite que les droits sont bien ceux correspondant à la commande "
.b("chmod -R 711 ~/forge_html")."." ;
00174     
finp() ;
00175     
00176     
p
("texte") ;
00177     echo
" Reprendre l'exercice 3 (Bonjour/Bonsoir) et recopier les fichiers sur votre compte Unix et votre \"site étudiant\". " ;
00178     echo
" On utilisera un éditeur comme "
.b("gedit").", ".b("kate").", ".b("geany")." ou ".b("kwrite").". " ;
00179     echo
" On fournira une version transitionnelle ou une version stricte, mais il est possible de se contenter de recopier la solution et " ;
00180     echo
" de tester qu'elle fonctionnne après avoir recopié tous les fichiers nécessaires dont les feuilles de style. " ;
00181     echo
" On viendra tester que le validateur du W3C est capable de tester les pages étudiantes via leur URL." ;
00182     
finp() ;
00183     
00184     
00185     
00186     
finli() ;
00187     
00188     
00189     
debutli() ;
00190     
p
("texte") ;
00191     echo
"Peut-on écrire des pages Web chez soi, sur son Pc sous Windows et les mettre sur son compte étudiant Unix&nbsp;?" ;
00192     
finp() ;
00193     
p
("texte") ;
00194     echo
em
("Mézalors").", sous quel environnement (Windows, Linux) écrire ses pages, et avec quel éditeur&nbsp;?" ;
00195     
finp() ;
00196     
p
("texte") ;
00197     echo
" Vérifier que vous savez transférer un fichier local sur "
.em("janus")." à l'aide de ".b("FileZilla") ;
00198     echo
" ou d'un outil logiciel équivalent qui utilise le protocole "
.b("SFTP")."&nbsp;:" ; # , port 4920&nbsp;: " ;
00199     
finp() ;
00200     
00201     
p
("texte") ;
00202     echo
"Il faut mettre "
.b("sftp://devel.info.univ-angers.fr")." comme nom d'".em(ghVert("h&ocirc;te")).", " ;
00203     echo
" puis entrer son identifiant "
.b("et")." son mot de passe puis appuyer sur Enter (pas sur Connexion rapide). ";
00204     echo
" Il n'y a pas besoin d'entrer le numéro du port." ;
00205     
finp() ;
00206     
00207     
00208     
p() ;
00209     
$url
= "filezilla.png" ;
00210     echo
href
($url,img($url,"",600)) ;
00211     
finp() ;
00212     
00213     
p
("texte") ;
00214     echo
" Vérifier aussi qu'on peut alors consulter la page Web sur son téléphone portable, ou avec une tablette." ;
00215     
finp() ;
00216     
p
("texte") ;
00217     echo
em
("Remarque")." : " ;
00218     echo
" à la faculté, on peut aussi mettre comme nom d'h&ocirc;te "
.ghvert("sftp://devel.info-ua")." pour ". b("FileZilla");
00219     echo
" alors que depuis l'extérieur, il "
.ghrouge("faut")." mettre comme nom d'h&ocirc;te ".ghvert("sftp://devel.info.univ-angers.fr").". " ;
00220     
finp() ;
00221     
finli() ;
00222     
00223     
debutli() ;
00224     
p
("texte") ;
00225     echo
"Reprendre sous Unix l'exercice de la liste des courses du TP 1 (version tableau) avec les images et les liens. " ;
00226     echo
" On mettra des liens vers Google, les images en petit avec un lien pour avoir l'image en grand. " ;
00227     echo
" De plus on mettra une nappe (ou une couleur de fond) pour le tableau et une serviette (ou une couleur de cellule) " ;
00228     echo
" pour la première case de chaqe ligne. On pourra aussi tester les "
.b("divisions")." (&lt;div&gt;)." ;
00229     
finp() ;
00230     
p
("texte") ;
00231     echo
" Pour ceux et celles qui l'ont oublié, vérifier que la page est valide avec la grammaire transitionnelle puis en faire " ;
00232     echo
" une copie avec la grammaire stricte (page valide) avec tous les styles en externe dans un fichier CSS." ;
00233     echo
" Essayer aussi de regarder comment on "
.href("http://www.albionresearch.com/misc/urlencode.php","urlencode")." la référence pour les légumes à cause du e-accent aigu." ;
00234     
finp() ;
00235     
finli() ;
00236     
00237     
finol() ;
00238     
00239     
#########################################################
00240     
00241     
$jtp
++ ; tpDscs($jtp,$nomTp[$jtp]) ; # TP3
00242     
00243     #########################################################
00244     
00245     
00246     
p
("texte") ;
00247     echo
b
("Remarque ")." : tous les TPs sont désormais aux choix des étudiant(e)s sous Windows ou sous Linux." ;
00248     
finp() ;
00249     
00250     
ol() ;
00251     
/*
00252     debutli() ;
00253     p("texte") ;
00254     echo "Démarrer le PC sous Windows et vérifier que vous savez utiliser WinScp " ;
00255     echo " pour transférer un fichier de n'importe quelle machine connectée à Internet sous Windows vers votre compte Unix ; " ;
00256     echo " recopier, par exemple sur votre compte les deux fichiers " ;
00257     echo href("modele_transitionnel.htm","modele_transitionnel")." et " ;
00258     echo href("modele_strict.htm","modele_strict")." puis " ;
00259     echo href("std.css")." qui servira pour tous les TP." ;
00260     finp() ;
00261     
00262     p("texte") ;
00263     echo "Installer en local sous Windows l'extension ".ancre("https://addons.mozilla.org/fr/firefox/addon/249","Html Validator")." et " ;
00264     echo " vérifier que le code-source est testé en fonction de la grammaire. Choisir le mode \"les deux\" pour la vérification." ;
00265     echo " Installer aussi le validateur sous Linux." ;
00266     finp() ;
00267     
00268     finli() ;
00269     */
00270     
00271     
debutli() ;
00272     
p
("texte") ;
00273     echo
"Reproduire le tableau de la page " ;
00274     echo
ancre
("botablo.htm") ;
00275     echo
" puis celui de la page " ;
00276     echo
ancre
("botablo2.htm").". On essaiera de comprendre la différence entre " ;
00277     echo
b
("&lt;table bgcolor='yellow'&gt;...")."," ;
00278     echo
b
("&lt;td bgcolor='yellow'&gt;...")." et " ;
00279     echo
b
("&lt;td&gt;&lt;p bgcolor='yellow'&gt;...")."" ;
00280     echo
" Tester également "
.b("border='100'")." puis les couples ".b("cellpadding='20' cellspacing='100'")." et ".b("cellpadding='20' cellspacing='100'")."." ;
00281     
finp() ;
00282     
finli() ;
00283     
00284     
debutli() ;
00285     
p
("texte") ;
00286     echo
"On veut s'affranchir du souligné sous un lien. Comment faire&nbsp;? On essaiera de mettre un petit texte en bleu foncé dans " ;
00287     echo
" un paragraphe sur fond gris (paragraphe justifié à droite et à gauche et encadré) avec un lien en rouge sans souligné. " ;
00288     echo
" Dupliquer le paragraphe et inventer un \"bouton rectangulaire\" en jouant sur les dimensions du style associé au lien." ;
00289     echo
" On ne commencera pas avec une page web vide mais avec le squelette "
.ancre("sq.htm")."." ;
00290     
finp() ;
00291     
finli() ;
00292     
00293     
debutli() ;
00294     
p
("texte") ;
00295     echo
" Inventer la couleur bleu_tendre ou bleu_intense à l'aide d'un code RGB issu de "
.ancre("http://www.pagetutor.com/colorpicker/index.html","ColorPicker"). "." ;
00296     echo
" Copier-coller le texte suivant (tiré de "
.ancre("http://fr.wikipedia.org/wiki/Jules_C%C3%A9sar","wiki").")." ;
00297     
finp() ;
00298     
00299     
pre_fichier
("jules.txt","cadrejaune") ;
00300     
00301     
p
("texte") ;
00302     echo
" On utilisera pour cette première partie la grammaire "
.em("transitionnelle")."." ;
00303     echo
" Mettez un titre de niveau 1 autour de "
.b("Jules César")." puis écrivez à nouveau ".b("Jules César")." " ;
00304     echo
" en taille 7 et encore une troisième fois en \"font-size\" "
.b("300pt").". Qui est le plus gros&nbsp;? " ;
00305     echo
" Délimiter le paragraphe de biographie via l'élément "
.b("p").". " ;
00306     echo
" Dupliquer le paragraphe et essayer de mettre la copie en retrait. " ;
00307     echo
" On essaiera de trouver plusieurs solutions pour ce retrait. Mettre ensuite le titre en bleu_intense à l'aide d'un " ;
00308     echo
" style en ligne puis avec un style nommé "
.b("jc")." pris dans une feuille de style externe nommée ".b("cesar.css")." ;" ;
00309     echo
" peut-on utiliser le style "
.b("jc")." pour faire ressortir les mots ".b("Rome")." et ".b("République romaine")."&nbsp;? " ;
00310     echo
" Pourquoi est-ce \"stupide\" d'utiliser une feuille nommée "
.b("cesar.css")."&nbsp;?" ;
00311     echo
" On ne commencera pas avec une page web vide mais avec le squelette "
.ancre("sq.htm")."." ;
00312     
finp() ;
00313     
p
("texte") ;
00314     echo
" Reprendre l'exercice avec la grammaire "
.em("stricte")."." ;
00315     
finp() ;
00316     
finli() ;
00317     
00318     
debutli() ;
00319     
p
("texte") ;
00320     echo
"Ecrire un petit texte dans un paragraphe et dupliquer le paragraphe. Appliquer ensuite " ;
00321     echo
" le style "
.b("cadre")." de la feuille de styles ".href("../std.css","std.css") ;
00322     echo
" au deuxième paragraphe. " ;
00323     
finp() ;
00324     
finli() ;
00325     
00326     
finol() ;
00327     
00328     
#########################################################
00329     
00330     
$jtp
++ ; tpDscs($jtp,$nomTp[$jtp]) ; # TP4
00331     
00332     #########################################################
00333     
00334     
ol() ;
00335     
00336     
debutli() ;
00337     
p
("texte") ;
00338     echo
"Recopier en local la page "
.ancre("sen_ts.htm").", les styles ".ancre("sen_demo1.css")." et ".ancre("sen_demo2.css")."." ;
00339     echo
" Testez ces 3 fichiers pour savoir s'ils sont valides et corrigez-les le cas échéant." ;
00340     echo
" Tester l'affichage si on met "
.b("sen_demo1.css")." comme feuille de style pour ".b("sen_ts.htm")." puis quand on utilise ".b("sen_demo2.css")."." ;
00341     
finp() ;
00342     
finli() ;
00343     
00344     
debutli() ;
00345     
p
("texte") ;
00346     echo
"Ecrire un formulaire minimal pour remplacer le formulaire de base de Google. " ;
00347     echo
" Qu'y a-t-il de plus dans le formulaire original de Google&nbsp;? " ;
00348     
finp() ;
00349     
p
("texte") ;
00350     echo
" "
.em("Pour les experts")." : écrire dans la m&ecirc;me page un autre formulaire dont la recherche est restreinte à la France," ;
00351     echo
" un troisième restreint aux images et enfin un quatrième qui filtre les recherches pour protéger les enfants. " ;
00352     echo
" Pourquoi dans ce cas certaines pages de "
.b("Gilles Hunault")." sont-elles filtrées&nbsp;? " ;
00353     
finp() ;
00354     
finli() ;
00355     
00356     
00357     
debutli() ;
00358     
p
("texte") ;
00359     echo
"Que peut-on faire avec l'URL "
.b("http://forge.info.univ-angers.fr/~gh/internet/ndjpm.php")."&nbsp;? Essayer de voir comment cette adresse " ;
00360     echo
" permet de connaitre le nombre de jours d'un mois donné. Pourquoi est-ce que ce script (programme) se nomme "
.b("ndjpm")."&nbsp;? " ;
00361     echo
" Peut-on 'coincer' ce programme&nbsp;? Lui faire afficher une erreur&nbsp;? " ;
00362     
finp() ;
00363     
finli() ;
00364     
00365     
debutli() ;
00366     
p
("texte") ;
00367     echo
"Faire une liste numérotée avec les mois Septembre, Octobre... ; peut-on commencer les numéros à 9&nbsp;? et mettre les nombres en latin&nbsp;? " ;
00368     echo
" Mettre un lien sous le nom du mois avec comme URL :" ;
00369     
finp() ;
00370     
00371     
div
('center') ;
00372     echo
b
("http://forge.info.univ-angers.fr/~gh/internet/ndjpm.php?m=")." " ;
00373     
findiv() ;
00374     
00375     
p
("texte") ;
00376     echo
" suivi du numéro du mois ( "
.b("?m=9")." pour Septembre, ".b("?m=10")." pour Octobre etc.). " ;
00377     
finp() ;
00378     
p
("texte") ;
00379     echo
" Si on commence à 1957, quelle est la première valeur avec "
.b("type='I'")."&nbsp;? Pourquoi&nbsp;? " ;
00380     
finp() ;
00381     
p
("texte") ;
00382     echo
" Si on commence à 2019, quelle est la deuxième valeur avec "
.b("type='A'")."&nbsp;? Pourquoi&nbsp;? " ;
00383     
finp() ;
00384     
finli() ;
00385     
00386     
debutli() ;
00387     
p
("texte") ;
00388     echo
"Ecrire un formulaire qui demande un numéro de mois et qui renvoie le nombre de jours dans ce mois. " ;
00389     echo
" On utilisera l'URL de l'exercice précédent." ;
00390     echo
" Ecrire dans la m&ecirc;me page un second formulaire qui utilise une liste de sélection non multiple qui affiche les noms de mois " ;
00391     echo
" et qui renvoie le nombre de jours dans ce mois. " ;
00392     echo
" Ecrire (toujours dans la m&ecirc;me page) un troisième formulaire qui utilise une liste de boutons radio pour sélectionner le mois " ;
00393     echo
" et qui renvoie le nombre de jours dans ce mois. " ;
00394     
finp() ;
00395     
00396     
p
("texte") ;
00397     echo
em
("Question sans réponse")." : pédagogiquement, quel est le meilleur formulaire et pourquoi&nbsp;?" ;
00398     
finp() ;
00399     
finli() ;
00400     
00401     
debutli() ;
00402     
p
("texte") ;
00403     echo
" Ecrire un formulaire qui demande une longueur et une largeur en mètres et qui utilise comme action " ;
00404     echo
" l'URL "
.href("http://forge.info.univ-angers.fr/~gh/internet/longlarg.php") ;
00405     echo
" pour afficher le périmètre et l'aire du champ rectangulaire correspondant à ces dimensions " ;
00406     echo
" (pas de
$Javascript ici)." ;
00407     
finp() ;
00408     
finli() ;
00409     
00410     
debutli() ;
00411     
p
("texte") ;
00412     echo
" Puisque l'attribut "
.b("start")." pour l'élément ".b("ol")." est interdit dans la grammaire stricte (voir la validation de la page " ;
00413     echo
href
("http://forge.info.univ-angers.fr/~gh/internet/olstart1.php","olstart1")."), " ;
00414     echo
" comment faire pour commencer une liste ordonnée à 9 pour le mois de septembre avec la grammaire stricte&nbsp;?" ;
00415     
finp() ;
00416     
finli() ;
00417     
00418     
debutli() ;
00419     
p
("texte") ;
00420     echo
" Ecrire un formulaire qui demande un nombre et en affiche le double sur la m&ecirc;me page. " ;
00421     echo
" On utilisera
$Javascript avec une grammaire stricte et on fera la multiplication par 2 'à la volée' dans un \"onsubmit\" ; " ;
00422     echo
" on utilisera deux champs textes nommés respectivement "
.b("nombre")." et ".b("double").". " ;
00423     echo
" L'action sera l'URL : " ;
00424     
finp() ;
00425     
00426     
p
("centre") ;
00427     echo
b
(href("http://forge.info.univ-angers.fr/~gh/internet/non.php"))."" ;
00428     
finp() ;
00429     
00430     
p
("texte") ;
00431     echo
" et ne devra pas s'exécuter..." ;
00432     
finp() ;
00433     
00434     
p
("texte") ;
00435     echo
" Pour mémoire, en
$Javascript, à l'intérieur d'un formulaire, on accède à la valeur liée à un élement de type input " ;
00436     echo
" par "
.b("this.NOM.value")." si NOM est le nom de l'élément. En dehors du formulaire, par exemple dans la console ou par fonction, " ;
00437     echo
" on y accède par "
.b("window.document.getElementById(\"IDELT\").value")." si IDELT est l'id de l'élément." ;
00438     
finp() ;
00439     
00440     
p
("texte") ;
00441     echo
" Ajouter un autre formulaire qui demande un nombre et en affiche le double et la moitié sur la m&ecirc;me page avec un seul bouton d'envoi. " ;
00442     echo
" On utilisera
$Javascript avec une grammaire stricte et on fera la division par 2 'à la volée' dans un \"onsubmit\" ; " ;
00443     echo
" on utilisera trois champs textes nommés respectivement "
.b("Xnombre").", ".b("Xdouble")." et ".b("Xdemi")." (pourquoi&nbsp;?). " ;
00444     
finp() ;
00445     
00446     
p
("texte") ;
00447     echo
" Ecrire enfin un troisième formulaire qui affiche le tiers d'un nombre. Comment gérer les décimales&nbsp;? " ;
00448     
finp() ;
00449     
00450     
p
("texte") ;
00451     echo
" Peut-on faire la m&ecirc;me chose sans formulaire&nbsp;?" ;
00452     
finp() ;
00453     
00454     
p
("texte") ;
00455     echo
" On pourra consulter "
.href("sen_nombres4.php","sen_nombres4")." comme modèle de page ) produire, comme ci-dessous&nbsp;:" ;
00456     
finp() ;
00457     
00458     
p() ;
00459     
nbsp
(8) ;
00460     
$url
= "sen_nombres4.png" ;
00461     echo
href
($url,img($url,"",600)) ;
00462     
finp() ;
00463     
finli() ;
00464     
00465     
finol() ;
00466     
00467     
#########################################################
00468     
00469     
$jtp
++ ; tpDscs($jtp,$nomTp[$jtp]) ; # TP5
00470     
00471     #########################################################
00472     
00473     
ol() ;
00474     
00475     
debutli() ;
00476     
p
("texte") ;
00477     echo
" Ecrire un formulaire qui demande une longueur et une largeur en mètres et qui utilise comme action " ;
00478     echo
" l'URL "
.href("http://forge.info.univ-angers.fr/~gh/internet/longlarg.php") ;
00479     echo
" pour afficher le périmètre et l'aire du champ rectangulaire correspondant à ces dimensions " ;
00480     echo
" (pas de
$Javascript ici)." ;
00481     
finp() ;
00482     
p
("texte") ;
00483     echo
"Remplacer ensuite l'action par la mise à jour des réponses dans la page via
$Javascript. On pourra afficher des étoiles à la place " ;
00484     echo
" du résultat tant qu'on a pas cliqué sur le bouton d'envoi nommé "
.b("calculer&nbsp;!")."." ;
00485     
finp() ;
00486     
p
("texte") ;
00487     echo
"Pour les plus rapides, masquer la zone des résultats au chargement de la page et la montrer seulement " ;
00488     echo
" quand on utilise le bouton d'envoi nommé "
.b("calculer")." (utiliser la propriété ".b("visibility")." ou les styles " ;
00489     echo
b
("visible")." et ".b("invisible")." de ".href("std.css").")." ;
00490     
finp() ;
00491     
finli() ;
00492     
00493     
00494     
debutli
() ; p("texte") ;
00495     echo
"J'ai malheureusement écrit le texte html suivant nommé "
.href("malchance.htm")." : \n" ;
00496     
finp() ;
00497     
00498     
pre() ;
00499     echo
" &lt;h2&gt;Bonjour&lt;/h2&gt; \n" ;
00500     echo
" \n" ;
00501     echo
" &lt;script language=\"javascript\"&gt; \n" ;
00502     echo
" window.document.write(' Qui le dit&nbsp;? C'est moi ! ') ; \n" ;
00503     echo
" &lt;/script&gt; \n" ;
00504     echo
" \n" ;
00505     echo
" &lt;h2&gt;Bonsoir&lt;/h2&gt; \n" ;
00506     
00507     
finpre() ;
00508     
00509     
p() ;
00510     echo
"...mais je ne vois rien entre Bonjour et Bonsoir. Pourquoi&nbsp;? Corriger le script puis \n" ;
00511     echo
"indiquer comment on peut voir les erreurs des scripts. Est-ce que cela a de l'influence sur la validation&nbsp;?\n" ;
00512     
finp() ;
00513     
finli() ;
00514     
00515     
debutli() ;
00516     
p
("texte") ;
00517     echo
" Ecrire un formulaire qui demande un nombre de kilos et qui affiche son équivalent en grammes. " ;
00518     echo
" On utilisera
$Javascript avec une grammaire stricte. Une première solution fera la conversion à la volée dans un \"onsubmit\", " ;
00519     echo
" la deuxième solution utilisera une fonction de conversion mise dans un fichier externe (chargé dans "
.b("head")."). On utilisera une action non vide " ;
00520     echo
" qui ne devra pas &ecirc;tre déclenchée. La fonction utilisée, soit "
.b("conversionKilos(x)")." recevra tout le formulaire " ;
00521     echo
" et non pas juste la valeur à convertir. On fera juste la conversion, mais aucune vérification sur le type, la valeur... " ;
00522     
finp() ;
00523     
00524     
p
("texte") ;
00525     echo
" "
.em("Pour les experts")." : dans le deuxième formulaire, arrangez-vous pour rendre le champ de réponse invisible " ;
00526     echo
" (propriété CSS nommée "
.b("visible").") et rendez-la visible quand on soumet le formulaire. Attention : ce n'est pas le " ;
00527     echo
" m&ecirc;me code avec Firefox et Internet Explorer." ;
00528     
finp() ;
00529     
finli() ;
00530     
00531     
debutli() ;
00532     
p
("texte") ;
00533     echo
" Ecrire une page Web qui met, via "
.em("Javascript").", " ;
00534     echo
" la valeur "
.b("8")." dans la variable ".b("a").", la valeur ".b("2")." dans la variable ".b("b")." " ;
00535     echo
" et qui ensuite calcule et affiche leur addition, soustraction, multiplication et division." ;
00536     echo
" Comment demander à
$Javascript d'écrire dans la page&nbsp;? " ;
00537     echo
" Utilisez une grammaire stricte. Attention : cet exercice n'utilise aucun formulaire." ;
00538     
finp() ;
00539     
00540     
p
("texte") ;
00541     echo
" Ecrire dans la m&ecirc;me page un formulaire qui demande deux nombres entiers et qui affiche leur addition, soustraction, multiplication et division." ;
00542     echo
" On utilisera
$Javascript avec une grammaire stricte et on soignera le cas de la division." ;
00543     echo
" On pourra ajouter la comparaison des deux nombres (à tester avec 13 et 2). " ;
00544     
# echo " A quoi sert l'url ".b("javascript:")." sous Firefox&nbsp;? " ;
00545     
echo
" Comment demander à $Javascript d'écrire dans la page qui contient le formulaire&nbsp;? " ;
00546     echo
" Utilisez une grammaire stricte." ;
00547     
finp() ;
00548     
finli() ;
00549     
00550     
debutli() ;
00551     
p
("texte") ;
00552     echo
" Ecrire une page Web qui met via "
.em("Javascript")." " ;
00553     echo
" la valeur "
.b("8")." dans la variable ".b("a").", la valeur ".b("2")." dans la variable ".b("b")." " ;
00554     echo
" et la valeur "
.b("6")." dans la variable ".b("c").". Comment afficher ces variables par ordre croissant&nbsp;? " ;
00555     echo
" On utilisera impérativement une fonction "
.b("afficheCroiss(a,b,c)")." et on réfléchira à l'ensemble des cas possibles." ;
00556     echo
" Comment devrait-on faire si on avait 4, 5, 6... valeurs&nbsp;? On pourra utiliser la liste de nombres 1 5 8 2 8 3 6 8 2 pour vérifier." ;
00557     echo
" Utilisez une grammaire stricte. Attention : cet exercice n'utilise aucun formulaire." ;
00558     
finp() ;
00559     
00560     
#########################################################
00561     #########################################################
00562     ######################################################### CONFINEMENT
00563     #########################################################
00564     #########################################################
00565     
00566     
div
("cadre") ;
00567     
blockquote
("1") ;
00568     
h1
("TP ".aname("confinement","confinement")." novembre 2020","grouge") ;
00569     
blockquote
(2) ;
00570     
00571     
#########################################################################
00572     
00573     
h2
("TP du 03 novembre : fonctions $Javascript liées à onClick ") ;
00574     
00575     
#########################################################################
00576     
00577     
blockquote
(21) ;
00578     
div
("cadreblanc") ;
00579     
blockquote
(210) ;
00580     
p
("texte") ;
00581      echo
" Essayer de réaliser les exercices "
.ghVert(6)." et ".ghVert(7)." ci-dessous (".ghBleu("TP 5")."), le panneau d'affichage Eux/Nous et l'horloge numérique. " ;
00582     
finp() ;
00583     
00584     
p
("texte") ;
00585      echo
" N'oublez pas d'afficher la console
$Javascript via les outils de développement pour voir les messages d'erreur." ;
00586     
finp() ;
00587     
00588     
p
("texte") ;
00589      echo
em
(s_span(" Pour mémoire","vert")).", l'éditeur de texte conseillé pour écrire du HTML et du $Javascript est ".b("Geany").". " ;
00590      echo
" C'est un logiciel gratuit, facile à installer depuis son téléchargement " ;
00591      echo
href
("https://www.geany.org/","ici").". " ;
00592     
finp() ;
00593     
00594     
finblockquote
(210) ;
00595     
findiv() ;
00596     
finblockquote
(21) ;
00597     
00598     
#########################################################################
00599     
00600     
h2
("TP du 10 novembre : tableaux en $Javascript ") ;
00601     
00602     
#########################################################################
00603     
00604     
blockquote
(22) ;
00605     
div
("cadreblanc") ;
00606     
00607     
blockquote
(220) ;
00608     
00609     
p
("texte") ;
00610      echo
" Essayer de réaliser les exercices "
.ghVert(8)." et ".ghVert(11)." ci-dessous (".ghBleu("TP 5")."), calcul du maximum d'un tableau et la réponse " ;
00611      echo
b
("rr?o?uge")." dans &laquo;".em("le petit chaperon rouge")."&raquo;." ;
00612     
finp() ;
00613     
p
("texte") ;
00614      echo
em
("Facultatif")."&nbsp;: " ;
00615      echo
" réaliser le test de compréhension des tableaux disponible " ;
00616      echo
href
("https://wiki.developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Test_your_skills:_Arrays","ici").". " ;
00617     
# echo " puis l'exercice ".ghVert(9)." du ".ghBleu("TP 5")." (le nombre mystérieux). Quelle est la meilleure stratégie pour trouver ce nombre&nbsp;?" ;
00618     
finp() ;
00619     
00620     
finblockquote
(220) ;
00621     
findiv() ;
00622     
finblockquote
(22) ;
00623     
00624     
#########################################################################
00625     
00626     
h2
("TP du 17 novembre : nombres au hasard, le jeu du nombre mystérieux ($Javascript)") ;
00627     
00628     
#########################################################################
00629     
00630     
blockquote
(22) ;
00631     
div
("cadreblanc") ;
00632     
blockquote
(221) ;
00633     
00634     
pvide() ;
00635     
00636     
ul
("class='disque'") ;
00637     
00638     
debutli() ;
00639     
00640     
p
("texte") ;
00641      echo
" Pour vérifier que vous savez générer un nombre au hasard, lisez et étudiez la page "
.href("nbAuHasard.php","nombreAuHasard","bleu").". " ;
00642      echo
" Modifiez le code
$Javascript pour que, quand le nombre d'enregistrements est plus ou grand ou égal au nombre de tirages, les nombres tirés soient distincts " ;
00643      echo
" (au bout d'un moment, ils ne sont donc plus vraiment au hasard). " ;
00644      echo
ghRouge
(" Attention&nbsp;:")." si vous programmez mal vos calculs, il est possible que votre script entre dans une boucle infinie, " ;
00645      echo
" alors, prudence dans ce que vous écrivez. " ;
00646     
finp() ;
00647     
00648     
p
("texte") ;
00649     
nbsp
(5) ;
00650      echo
ghBleu
(" Solution&nbsp;: ") ;
00651      echo
href
("nombresAuHasardDistincts.php","nombresAuHasardDistincts") ;
00652      echo
". " ;
00653     
finp() ;
00654     
00655     
finli() ;
00656     
00657     
debutli() ;
00658     
00659     
p
("texte") ;
00660      echo
" Programmer ensuite en
$Javascript dans une page Web le jeu du nombre mystérieux, selon les consignes suivantes. " ;
00661      echo
" L'ordinateur choisit un nombre entier au hasard entre 1 et 100. L'utilisateur doit trouver ce nombre. " ;
00662      echo
" A chaque réponse utilisateur incorrecte, l'ordinateur répond " ;
00663      echo
em
("&laquo;plus petit&raquo;") ;
00664      echo
" ou " ;
00665      echo
em
("&laquo;plus grand&raquo;") ;
00666      echo
" pour guider l'utilisateur. " ;
00667      echo
" Si le nombre n'est pas trouvé au bout de 9 essais, l'ordinateur affiche la réponse. " ;
00668     
finp() ;
00669     
00670     
p
("texte") ;
00671      echo
" Il faut bien s&ucirc;r commencer par réfléchir au "
.b("design")." de la page. " ;
00672      echo
" Vous trouverez " ;
00673      echo
href
("leNombreInconnu.php","ici")." un exemple de page possible (mais sans $Javascript) pour cet exercice. " ;
00674      echo
" La division qui contient le nombre inconnu et le nombre d'essais ne doivent pas apparaitre et " ;
00675      echo
" il serait \"sympathique\" de masquer la zone jaune tant que l'utilisateur n'a pas effectué son premier essai. " ;
00676     
finp() ;
00677     
00678     
p
("texte") ;
00679     
nbsp
(5) ;
00680      echo
ghBleu
(" Solution&nbsp;: ") ;
00681      echo
href
("leNombreInconnuVersion1.php","leNombreInconnuVersion1") ;
00682      echo
". " ;
00683     
finp() ;
00684     
00685     
finli() ;
00686     
00687     
debutli() ;
00688     
00689     
p
("texte") ;
00690      echo
" Rien n'interdit à l'utilisateur de saisir plusieurs fois la m&ecirc;me valeur. Ecrivez une version 2 du jeu du nombre mystérieux " ;
00691      echo
" où on n'autorise pas deux fois la m&ecirc;me valeur de la part de l'utilisateur. " ;
00692     
finp() ;
00693     
00694     
p
("texte") ;
00695     
nbsp
(5) ;
00696      echo
ghBleu
(" Solution&nbsp;: ") ;
00697      echo
href
("leNombreInconnuVersion2.php","leNombreInconnuVersion2") ;
00698      echo
". " ;
00699     
finp() ;
00700     
00701     
finli() ;
00702     
00703     
finul() ;
00704     
00705     
pvide() ;
00706     
00707     
finblockquote
(221) ;
00708     
findiv() ;
00709     
finblockquote
(22) ;
00710     
00711     
#########################################################################
00712     
00713     
h2
("TP du 24 novembre : requ&ecirc;tes $MySQL") ;
00714     
00715     
#########################################################################
00716     
00717     
blockquote
(22) ;
00718     
div
("cadreblanc") ;
00719     
blockquote
(222) ;
00720     
00721     
pvide() ;
00722     
00723     
p
("texte") ;
00724      echo
" Le but de ce TP est de vérifier que vous avez compris la seule chose importante dans ce cours par rapport " ;
00725      echo
" à
$MySQL, à savoir&nbsp;: ".em("écrire une requ&ecirc;te ".b("SELECT")).". " ;
00726     
finp() ;
00727     
00728     
p
("texte") ;
00729      echo
" Donc "
.ghRouge("pas de panique")."&nbsp;! Si vous avez l'impression d'&ecirc;tre perdue entre $HTML et $Javascript, bonne nouvelle&nbsp;:" ;
00730      echo
" dans ce TP, il n'y en a pas, il n'y a que du
$MySQL." ;
00731     
finp() ;
00732     
00733     
ul
("class='disque'") ;
00734     
00735     
debutli() ;
00736     
00737     
p
("texte") ;
00738      echo
" Répondez aux questions du " ;
00739      echo
href
("../tuteurs/tutmysql.htm#tth_sEc6.","tuteur $MySQL") ;
00740      echo
" section 6, exercices 1 ("
.ghVert("titanic").") et 2 (".ghVert("elf")."). " ;
00741     
finp() ;
00742     
00743     
p
("texte");
00744      echo
" Vous utiliserez bien s&ucirc;r la page " ;
00745     
finp() ;
00746     
00747     
p
("texte");
00748     
nbsp
(8) ;
00749      echo
href
("http://forge.info.univ-angers.fr/~gh/Pluripass/Db/executeMysql.php","&nbsp;executeMysql&nbsp;","bouton_fin nou jaune_pastel") ;
00750     
finp() ;
00751     
00752     
p
("texte");
00753      echo
" pour tester vos réponses. " ;
00754     
finp() ;
00755     
00756     
p
("texte") ;
00757      echo
" Essayez ensuite de répondre aux questions de la partie 2 de l'examen " ;
00758      echo
href
("sen2017_3.pdf","sen2017_3").". " ; ;
00759     
finp() ;
00760     
00761     
finli() ;
00762     
00763     
debutli() ;
00764     
00765     
p
("texte") ;
00766      echo
" Répondez aux questions du " ;
00767      echo
href
("../tuteurs/tutmysql.htm#tth_sEc6.","tuteur MySQL") ;
00768      echo
" section 6, exercices 3 ("
.ghVert("ronfle").") et 4 (".ghVert("2tables")."). " ;
00769     
finp() ;
00770     
00771     
p
("texte") ;
00772      echo
" Essayez ensuite de répondre aux questions de la partie 3 de l'examen " ;
00773      echo
href
("sen2016_3.pdf","sen2016_3").". " ; ;
00774     
finp() ;
00775     
00776     
finli() ;
00777     
00778     
debutli() ;
00779     
00780     
p
("texte") ;
00781      echo
" Répondez aux questions du " ;
00782      echo
href
("../tuteurs/tutmysql.htm#tth_sEc6.","tuteur $MySQL") ;
00783      echo
" section 6, exercice 5 ("
.ghVert("4tables")."). " ;
00784     
finp() ;
00785     
00786     
finli() ;
00787     
00788     
debutli() ;
00789     
00790     
p
("texte") ;
00791      echo
" Sur la base du " ;
00792      echo
href
("miniQuizzHistoire.php","mini quizz d'histoire") ;
00793      echo
" présenté hier, comment feriez pour avoir trois dates aléatoires à proposer dans l'exercice " ;
00794      echo
" plut&ocirc;t que les trois premières dates&nbsp;? " ;
00795      echo
" Peut-on le faire avec
$MySQL&nbsp;?" ;
00796     
finp() ;
00797     
00798     
finli() ;
00799     
00800     
finul() ;
00801     
00802     
pvide() ;
00803     
00804     
finblockquote
(222) ;
00805     
findiv() ;
00806     
finblockquote
(22) ;
00807     
00808     
#########################################################################
00809     
00810     
h2
("TP du 1".sup("er")." décembre : révision, suite et fin") ;
00811     
00812     
#########################################################################
00813     
00814     
blockquote
(33) ;
00815     
div
("cadreblanc") ;
00816     
blockquote
(330) ;
00817     
00818     
pvide() ;
00819     
00820     
p
("texte") ;
00821      echo
" Si vous n'aviez fini pas le cours d'hier avec ses huit étapes, reprenez là où vous étiez rendues. " ;
00822      echo
" Si vous avez l'impression de passer trop de temps sur l'étape 2, lisez et recopiez le corrigé dans " ;
00823      echo
href
("mots2.html")." et dans ".href("mots2.js")." puis passez à l'étape 3 qui est plus simple. " ;
00824     
finp() ;
00825     
00826     
p
("texte") ;
00827      echo
" Si vous aviez tout fini, refaites tout mais sans utiliser les maquettes de fonction fournies. " ;
00828      echo
" Si vous préférez, refaites une page similaire pour des exercices de géographie avec la m&ecirc;me démarche&nbsp;:" ;
00829      echo
"
$HTML puis $Javascript pour un exercice, une boucle pour plusieurs exercices, intégration de la base de données, évaluation... " ;
00830     
finp() ;
00831     
00832     
pvide() ;
00833     
00834     
finblockquote
(330) ;
00835     
findiv() ;
00836     
finblockquote
(33) ;
00837     
00838     
##########################################################################################
00839     ##########################################################################################
00840     ##########################################################################################
00841     ##########################################################################################
00842     ##########################################################################################
00843     
00844     
finblockquote
(2) ;
00845     
finblockquote
("1") ;
00846     
findiv() ;
00847     
00848     
finli() ;
00849     
00850     
##########################################################################################
00851     ##########################################################################################
00852     ##########################################################################################
00853     ##########################################################################################
00854     ##########################################################################################
00855     
00856     
debutli() ;
00857     
p
("texte") ;
00858     echo
" Ecrire un panneau d'affichage Eux/Nous avec des \"gros\" boutons + et - pour modifier les scores, comme dans une salle de sports. " ;
00859     echo
" On utilisera
$Javascript avec une grammaire stricte et on mettra un bouton pour remettre à zéro." ;
00860     
finp() ;
00861     
finli() ;
00862     
00863     
debutli() ;
00864     
p
("texte") ;
00865     echo
" Ecrire un affichage d'horloge numérique pour apprendre à lire l'heure, avec avec des \"gros\" boutons + et - " ;
00866     echo
" pour modifier les heures et les minutes. On initalisera à 23 h 58." ;
00867     echo
" On utilisera
$Javascript avec une grammaire stricte. Exemple de rendu via ".href("sen_horloge.php","sen_horloge")."&nbsp;:" ;
00868     
finp() ;
00869     
00870     
p() ;
00871     
nbsp
(8) ;
00872     
$url
= "sen_horloge.png" ;
00873     echo
href
($url,img($url,"",600)) ;
00874     
finp() ;
00875     
00876     
p
("texte") ;
00877     echo
" Beaucoup plus difficile ("
.b("mais plus pédagogique")."). Ajouter un panneau qui dit l'heure : " ;
00878     echo
" "
.em("neuf heures moins le quart ")." pour 8 h 45, " ;
00879     echo
" "
.em("10 heures moins dix")." pour 9 h 50 etc." ;
00880     
finp() ;
00881     
finli() ;
00882     
00883     
debutli() ;
00884     
p
("texte") ;
00885     echo
"Ecrire une fonction
$Javascript qui détermine le max d'un tableau (la plus grande valeur présente dans le tableau) et le nombre de fois où ce max apparait " ;
00886     echo
" avec la contrainte qu'on doit utiliser une seule boucle POUR qui fait à la fois la détermination du max " ;
00887     echo
" et le calcul du nombres d'occurences." ;
00888     
finp() ;
00889     
finli() ;
00890     
00891     
debutli() ;
00892     
p
("texte") ;
00893     echo
"Ecrire tout en
$Javascript le jeu du nombre mystérieux avec initialisation à un entier entre 1 et 100, " ;
00894     echo
" un nombre maximum d'essais et un affichage de l'historique des réponses." ;
00895     
finp() ;
00896     
finli() ;
00897     
00898     
debutli() ;
00899     
p
("texte") ;
00900     echo
"Ecrire une fonction
$Javascript qui trie un tableau HTML à plusieurs colonnes." ;
00901     echo
" On distinguera le tri alphabétique (comme pour les mois) du tri numérique (pour les prix)." ;
00902     
finp() ;
00903     
finli() ;
00904     
00905     
debutli() ;
00906     
p
("texte") ;
00907     echo
" Ecrire une page Web qui pose la question "
.em("Quelle est la couleur du petit chaperon dans le conte de Charles PERRAULT&nbsp;?").". " ;
00908     echo
" Sans utiliser de formulaire, utiliser
$Javascript pour accepter silencieusement une chaine avec des espaces en début ou en fin de chaine. " ;
00909     echo
" On acceptera la réponse "
.b("rouge")." comme seule bonne réponse exacte. " ;
00910     echo
" On acceptera les réponses "
.b("roug").", ".b("ruge").", ".b("rrouge")." comme réponses correctes approchées. " ;
00911     echo
" Le code
$Javascript devra convertir en minuscules tout le texte entré et remplacer les espaces multiples par un seul espace." ;
00912     
finp() ;
00913     
00914     
p
("texte") ;
00915     echo
" Demander ensuite à l'apprenant son mois de naissance au format "
.b("MM").". On refusera tout autre format." ;
00916     
finp() ;
00917     
00918     
finli() ;
00919     
00920     
finol() ;
00921     
00922     
#########################################################
00923     
00924     
$jtp
++ ; tpDscs($jtp,$nomTp[$jtp]) ; # TP6
00925     
00926     #########################################################
00927     
00928     
p
("texte") ;
00929     echo
b
("Remarque ")." : que le TP se passe sous Windows ou sous Unix, toutes les pages écrites doivent " ;
00930     echo
" &ecirc;tre enregistrées dans des fichiers de type "
.b(".php")." (et non pas ".b(".html").") et il faut les " ;
00931     echo
" ouvrir avec le protocole "
.b("http://").", c'est à dire qu'on ne peut plus faire ".em("Fichier/Ouvrir")." " ;
00932     echo
" pour charger la page." ;
00933     echo
" L'URL du fichier "
.b("demo.php")." pour l'utilisateur ".b("login")." est :" ;
00934     
finp() ;
00935     
00936     
p
("centre") ;
00937     echo
b
("http://devel.info.univ-angers.fr/~login/demo.php")."" ;
00938     
finp() ;
00939     
00940     
p
("texte") ;
00941     echo
" ce qui signifie donc que vous devez mettre vos fichiers "
.b(".php")." dans votre répertoire " ;
00942     echo
" "
.b("forge_html/").". " ;
00943     
finp() ;
00944     
00945     
p
("texte") ;
00946     echo
ghRouge
("Attention&nbsp;:")." contrairement aux pages Web précédentes, une erreur dans le code PHP peut aboutir à une page toute blanche " ;
00947     echo
" ou au message "
.b("Erreur 404: not found")." ou à l'affichage d'un code d'erreur. " ;
00948     
finp() ;
00949     
00950     
p
("texte") ;
00951     echo
" Pour tester les erreurs de syntaxe élémentaire, il est conseille d'utiliser "
.ghVert("php -l monProgramme.php")." comme ci-dessous " ;
00952     echo
" où il manque un point-virgule sur la ligne qui précède "
.ghvert("if").". " ;
00953     
finp() ;
00954     
00955     
pre_fichier
("err_demo.txt","cadrebleu") ;
00956     
00957     
p
("texte") ;
00958     echo
" Lorque votre page est \"propre\" et \"correcte\", vous pouvez l'utiliser sur forge, soit, pour l'exemple précédent, avec l'URL" ;
00959     
finp() ;
00960     
00961     
p
("centre") ;
00962     echo
b
("http://forge.info.univ-angers.fr/~login/demo.php")."" ;
00963     
finp() ;
00964     
00965     
p
("texte") ;
00966     echo
" Il est conseillé d'utiliser "
.ghVert("php -a")." dans un terminal pour tester un bout de code, découvrir comment marche une fonction, etc. " ;
00967     
finp() ;
00968     
00969     
ol() ;
00970     
00971     
debutli() ;
00972     
p
("texte") ;
00973     echo
"Testez ce qu'affiche le code PHP suivant :" ;
00974     
finp() ;
00975     
00976     
pre
("cadre") ;
00977     echo
"\n";
00978     echo
" &lt;?php\n" ;
00979     echo
" echo \"&lt;h1&gt;\\nET VOILA LE TRAVAIL\\n&lt;/h1&gt;\\n\" ;\n" ;
00980     echo
" &nbsp;?&gt;\n" ;
00981     echo
"\n";
00982     
finpre() ;
00983     
00984     
p
("texte") ;
00985     echo
"Si on affiche le code HTML de la page, combien trouve-t-on de lignes&nbsp;? " ;
00986     echo
" Que se passe-t-il en cas d'erreur, pas exemple si on oublie un guillemet&nbsp;?" ;
00987     
finp() ;
00988     
00989     
p
("texte") ;
00990     echo
"Ecrire un programme en ligne de commandes qui affiche, au dizième de milliard près, le nombre de secondes écoulées " ;
00991     echo
" depuis l'an 0." ;
00992     echo
" On ne tiendra pas compte de la nuit du " ;
00993     echo
href
("https://fr.wikipedia.org/wiki/Calendrier_gr%C3%A9gorien","4 au 15 octobre 1582").". " ;
00994     echo
" Faut-il tenir compte des annnées bissextiles&nbsp;?" ;
00995     
finp() ;
00996     
00997     
p
("texte") ;
00998     echo
"Ecrire ensuite un programme PHP qui à partir des variables \$a et \$b met respectivement dans " ;
00999     echo
" \$p et \$g la plus petite et la plus grande des deux valeurs. " ;
01000     echo
" Combien y a-t-il de cas à envisager&nbsp;?" ;
01001     echo
b
(" Attention :")." votre code doit fonctionner aussi bien avec des nombres qu'avec des chaines de caractères. " ;
01002     
finp() ;
01003     
01004     
p
("texte") ;
01005     echo
"Ecrire ensuite un programme PHP qui à partir des trois variables \$a, \$b et \$c met respectivement dans " ;
01006     echo
" \$p, \$g et \$m la plus petite, la plus grande et la valeur du milieu. " ;
01007     echo
" Combien y a-t-il de cas à envisager&nbsp;?" ;
01008     echo
b
(" Attention :")." votre code doit fonctionner aussi bien avec des nombres qu'avec des chaines de caractères. " ;
01009     
finp() ;
01010     
01011     
finli() ;
01012     
01013     
debutli() ;
01014     
p
("texte") ;
01015     echo
" Ecrire une fonction "
.em("debutPage()")." qui écrit toutes les balises jusqu'à ".b("body")." compris " ;
01016     echo
" et écrire dans la foulée la fonction "
.em("finPage()")."." ;
01017     echo
" Combien faut-il de temps désormais pour écrire une page \"propre et valide\" qui affiche "
.b("Bonjour")."&nbsp;? " ;
01018     
finp() ;
01019     
01020     
p
("texte") ;
01021     echo
"Une fois que les fonctions "
.em("debutPage()")." et ".em("finPage()")." seront au point, on les mettra dans " ;
01022     echo
"le fichier "
.b("mesfonctions.php")." et on utilisera un ".em("include")."... " ;
01023     
finp() ;
01024     
01025     
p
("texte") ;
01026     echo
" "
.em("Pour les experts")." : ajouter un paramètre à la fonction ".em("debutPage()")." pour que le programmeur " ;
01027     echo
" puisse facilement choisir la grammaire stricte ou transitionnelle. Par défaut, ce sera la grammaire transitionnelle ";
01028     echo
" qui sera utilisée." ;
01029     
finp() ;
01030     
01031     
finli() ;
01032     
01033     
debutli() ;
01034     
p
("texte") ;
01035     echo
" Ecrire en PHP la fonction "
.em("h1").", la fonction ".em("h2")." et la fonction ".em("h3")." puis implémenter " ;
01036     echo
" la fonction "
.em("tnh(x,i)")." telle que ".em("h1(x)")." corresponde à ".em("tnh(x,1)")." et " ;
01037     echo
" "
.em("h2(x)")." corresponde à ".em("tnh(x,2)")." etc. " ;
01038     echo
" Quel est l'intéret de "
.em("tnh")."&nbsp;? " ;
01039     
finp() ;
01040     
finli() ;
01041     
01042     
debutli() ;
01043     
p
("texte") ;
01044     echo
"Ecrire le programme PHP qui correspond à l'action du formulaire "
.ancre("sen_age.php") ;
01045     echo
" (dont le code-source est "
.ancre("montresource.php?nomfic=sen_age.php","ici")."), " ;
01046     echo
" et qui répond " ;
01047     echo
b
("Vous &ecirc;tes mineur")." si l'age est strictement inférieur à 18 et " ;
01048     echo
b
("Vous &ecirc;tes majeur")." si l'age est supérieur ou égal à 18." ;
01049     echo
" Pourquoi n'est-on pas obligé(e) de recopier le formulaire&nbsp;? " ;
01050     
finp() ;
01051     
p
("texte") ;
01052     echo
" "
.em("Pour les experts")." : tester s'il s'agit bien d'un nombre entier et positif ou nul." ;
01053     
finp() ;
01054     
finli() ;
01055     
01056     
debutli() ;
01057     
p
("texte") ;
01058     echo
"Répondez à la question 1 de l'examen de décembre 2014 ("
.href("php_conceptuel.php","PHP conceptuel","grouge")."), " ;
01059     echo
" le PDF est "
.href("sen2014_2.pdf","ici").". " ;
01060     echo
" Afin de disposer de "
.b("std.php")." et de ".b("strfun.php").", le plus simple est de copier/coller " ;
01061     echo
" les deux commandes suivantes dans un terminal, une fois la connexion établie sur forge/janus. " ;
01062     echo
" Vous devez &ecirc;tre dans votre répertoire "
.b("forge_html")." pour exécuter ces commandes&nbsp;:" ;
01063     
finp() ;
01064     
01065     
pre
("cadre") ;
01066     echo
"\n" ;
01067     echo
" wget http://forge.info.univ-angers.fr/~gh/internet/std.php.zip\n" ;
01068     echo
"\n" ;
01069     echo
" unzip -o std.php.zip \n" ;
01070     echo
"\n" ;
01071     
finpre() ;
01072     
01073     
p
("texte") ;
01074     echo
"La première commande vient rapatrier l'archive et la deuxième décompresse les fichiers de l'archive " ;
01075     echo
href
("std.php.zip").". " ;
01076     echo
" Facile, non&nbsp;?" ;
01077     echo
" Une autre solution consiste à rapatrier l'archive " ;
01078     echo
href
("std.php.zip").", " ;
01079     echo
" à la décompresser sous Windows puis à retransférer les fichiers présents dans l'archive..." ;
01080     
finp() ;
01081     
01082     
p
("texte") ;
01083     echo
"Vous viendrez bien s&ucirc;r tester votre code en ligne de commandes (pas dans Firefox)." ;
01084     
finp() ;
01085     
01086     
p
("texte") ;
01087     echo
"Répondez ensuite à la question 1 de l'examen de juin 2017 ("
.href("php_conceptuel.php","PHP conceptuel","grouge")."), " ;
01088     echo
" le PDF est "
.href("sen2017_1.pdf","ici").". " ;
01089     
finp() ;
01090     
finli() ;
01091     
01092     
debutli() ;
01093     
p
("texte") ;
01094     echo
"A partir de la chaine de caractères "
.em("\"pain oeuf viande lait vin fromage\"")." construire en PHP un tableau qui reprend " ;
01095     echo
" les éléments de l'exercice de la liste des courses : lien vers google, image en taille normalisée et en grand... " ;
01096     echo
" Comparer le nombre de lignes du fichier PHP (qui utilisera "
.em("debutPage()")." et ".em("finPage()")." via un " ;
01097     echo
" "
.em("include").") et le nombre de lignes du fichier-source HTML." ;
01098     
finp() ;
01099     
01100     
p
("texte") ;
01101     echo
"En faire ensuite une fonction et l'appliquer à la chaine "
.em("\"tomates saucisson eau bananes\"")." ; " ;
01102     echo
b
("pour les plus fort(e)s")." ajouter le mot ".b("légumes")."." ;
01103     
finp() ;
01104     
finli() ;
01105     
01106     
debutli() ;
01107     
p
("texte") ;
01108     echo
" Ecrire en PHP un formulaire qui utilise la fonction "
.em("hist()")." dont le code-source est " ;
01109     echo
ancre
("montresource.php?nomfic=sen_hist.php","ici") ;
01110     echo
" pour préparer un questionnaire d'histoire "
.em("sen_hist_form.php")." sur des dates ; " ;
01111     echo
" écrire en PHP la page "
.em("sen_hist_rep.php")." qui utilise le m&ecirc;me texte ".em("sen_hist.php")." " ;
01112     echo
" et qui évalue les réponses de l'apprenant. On pourra supposer que l'exercice affiche les évènements " ;
01113     echo
" et demande les dates correspondantes." ;
01114     
finp() ;
01115     
01116     
p
("texte") ;
01117     echo
" On pourra consulter la référence PHP sur la boucle "
.em("foreach")." (pour chaque) liée aux \"tableaux associatifs\" " ;
01118     echo
ancre
("http://www.manuelphp.com/php/control-structures.foreach.php","ici")."." ;
01119     
finp() ;
01120     
finli() ;
01121     
01122     
debutli() ;
01123     
p
("texte") ;
01124     echo
" Expliquer comment les titres des énoncés et corrigés des TP sont produits sachant que le code-source des énoncés " ;
01125     echo
" est "
.ancre("montresource.php?nomfic=sen_tps.php","ici")." et celui des solutions" ;
01126     echo
" est "
.ancre("montresource.php?nomfic=sen_tps_cor.php","là")."." ;
01127     
finp() ;
01128     
finli() ;
01129     
01130     
debutli() ;
01131     
01132     
p
("texte") ;
01133     echo
" Après avoir lu la page " ;
01134     echo
ancre
("http://fr.php.net/manual/fr/function.rand.php","rand()") ;
01135     echo
" écrire un programme PHP qui tire au hasard un nombre entre 1 et 3, l'affiche puis propose un lien pour recommencer." ;
01136     
finp() ;
01137     
01138     
p
("texte") ;
01139     echo
"Modifier la page précédente pour qu'elle ait le m&ecirc;me comportement que la page " ;
01140     echo
href
("sen_quests1.php") ;
01141     echo
" avec 1=Calculs, 2=Histoire et 3=Géographie." ;
01142     
finp() ;
01143     
01144     
finli() ;
01145     
01146     
finol() ;
01147     
01148     
#########################################################
01149     
01150     
$jtp
++ ; tpDscs($jtp,$nomTp[$jtp]) ; # TP7
01151     
01152     #########################################################
01153     
01154     
p
("texte") ;
01155     echo
em
("On relira les ".href('phpmysql.htm',"exemples")." MYSQL et PHP avant de faire les exercices du TP.") ;
01156     
finp() ;
01157     
01158     
ol() ;
01159     
01160     
debutli() ;
01161     
p
("texte") ;
01162     echo
"Ecrire un programme PHP qui compte combien il y a d'hommes dans la table " ;
01163     echo
ancre
("../Datasets/ronfle.htm","ronfle"). " (la base de données est statdata, sur forge). " ;
01164     echo
" Modifier le programme pour qu'il compte combien d'hommes fument et ronflent." ;
01165     echo
" Modifier encore le programme pour qu'il indique le pourcentage d'hommes qui fument et ronflent par rapport " ;
01166     echo
" au nombre d'hommes en tout. On fournira un pourcentage entier arrondi." ;
01167     
finp() ;
01168     
p
("texte") ;
01169     echo
" Lister ensuite via PHP les 10 plus jeunes femmes qui ronflent par age croissant. Où est le problème&nbsp;?" ;
01170     
finp() ;
01171     
p
("texte") ;
01172     echo
" On mettra les requ&ecirc;tes SQL dans des variables PHP. Pour le pourcentage entier, on pourra au choix " ;
01173     echo
" faire l'arrondi en SQL ou en PHP. Quelle est la meilleure solution, à votre avis&nbsp;? " ;
01174     
finp() ;
01175     
01176     
p
("texte") ;
01177     echo
" Lorsqu'on fournit des comptages, des pourcentages, il est souvent agréable de fournir une représentation " ;
01178     echo
" graphique nommée "
.b("histogramme des fréquences").". Est-ce possible de réaliser un tel graphique en PHP&nbsp;?" ;
01179     
finp() ;
01180     
01181     
table
(0,20) ;
01182     
tr() ;
01183     
td
() ;nbsp(8) ;fintd() ;
01184     
td() ;
01185     
$i
= "ronfle.png" ;
01186     echo
img
($i) ;
01187     
fintd() ;
01188     
td
() ;nbsp(8) ;fintd() ;
01189     
td() ;
01190     
$i
= "titanic.png" ;
01191     echo
img
($i) ;
01192     
fintd() ;
01193     
fintr() ;
01194     
fintable() ;
01195     
01196     
01197     
finli() ;
01198     
01199     
debutli() ;
01200     
p
("texte") ;
01201     echo
" Après avoir lu la page " ;
01202     echo
ancre
("http://fr.php.net/manual/fr/function.rand.php","rand") ;
01203     echo
" écrire un programme PHP qui tire au hasard un nombre entre 1 et 3, l'affiche puis propose un lien pour recommencer." ;
01204     
finp() ;
01205     
01206     
p
("texte") ;
01207     echo
"Ecrire un programme PHP qui tire au hasard un nombre entre 1 et 3 et qui utilise la table de données " ;
01208     echo
" correspondante dans la base statad sur forge : " ;
01209     
finp() ;
01210     
blockquote() ;
01211     
ol() ;
01212     
debutli
() ; echo "sen_CALC" ; finli() ;
01213     
debutli
() ; echo "sen_HIST" ; finli() ;
01214     
debutli
() ; echo "sen_GEOG" ; finli() ;
01215     
finol() ;
01216     
finblockquote() ;
01217     
01218     
# consulter sen_bd.mysql pour le détail des tables
01219     
01220     
p
("texte") ;
01221     echo
" La table sen_CALC (Calcul) comporte deux champs par exercice : EXPR et RES ; EXPR est l'expression à afficher et RES son résultat. " ;
01222     echo
" On fera faire à l'élève tous les exercices de la table (il y en a 5). " ;
01223     
finp() ;
01224     
01225     
p
("texte") ;
01226     echo
" La table sen_HIST (Histoire) comporte deux champs par exercice : EVENEMENT et DATE ; l'exercice correspondant consiste à demander " ;
01227     echo
" la date associée à l'évènement." ;
01228     echo
" On fera faire à l'élève la moitié des exercices de la table (il y en a 6) par tirage au sort. " ;
01229     
finp() ;
01230     
01231     
p
("texte") ;
01232     echo
" La table sen_GEOG (Géographie) comporte trois champs par exercice : PAYS, CAPI et DIFF ; l'exercice correspondant consiste à demander " ;
01233     echo
" la captiale du pays ; diff donne la difficulté de l'exercice (1=facile, 2=difficile). " ;
01234     echo
" On fera faire à l'élève un tiers des exercices de la table (il y en a 9) avec au moins un exercice difficile. " ;
01235     
finp() ;
01236     
01237     
p
("texte") ;
01238     echo
"Voici des liens pour voir le contenu des tables : " ;
01239     echo
href
("sen_CALC.dsc.txt","sen_CALC").", " ;
01240     echo
href
("sen_HIST.dsc.txt","sen_HIST").", " ;
01241     echo
href
("sen_GEOG.dsc.txt","sen_GEOG")."." ;
01242     
finp() ;
01243     
01244     
01245     
p
("texte") ;
01246     echo
em
("Pour les experts")."&nbsp;: demander au tout début un prénom, puis boucler sur 5 séries d'exercices et afficher les résultats." ;
01247     
finp() ;
01248     
01249     
finli() ;
01250     
01251     
finol() ;
01252     
01253     
#########################################################
01254     
01255     
pvide() ;
01256     
01257     
p() ;
01258     echo
href
("montresource.php?nomfic=sen_tps.php","Code-source de cette page","orange_stim nou")."." ;
01259     
finp() ;
01260     
01261     
#########################################################
01262     
01263     
finSection() ;
01264     
finPage() ;
01265     
?>

Pour ne pas voir les numéros de ligne, ajoutez &nl=non à la suite du nom du fichier.

 

 

retour gH    Retour à la page principale de   (gH)