Créé par © 2009 Luc De Droogh

TriMeL-Générateur est un script développé en HTML, CSS et JavaScript qui vous permet de créer, sans rien connaître en programmation, des exercices de classement/tri. Vous devez toutefois être capable de "copier, coller, ouvrir le Bloc-notes, enregistrer un fichier dans un dossier".

Editer un tel exercice, abstraction faite du temps nécessaire pour entrer les questions et les textes et commentaires éventuels, ne prend qu'une minute ou deux, grand maximum !!


Le programme génère un exercice en 3 étapes très simples :

Etape 1 - Introduction des paramètres, du texte, des questions et des éventuels commentaires
Etape 2 - Configuration de la page Web
Etape 3 - Création du code-source et enregistrement du(des) fichier(s) Web


Etape 1 - Introduction des paramètres, du texte, des questions et des éventuels commentaires

A l'ouverture du programme, il vous est demandé d'introduire 6 paramètres:
a. si vous désirez chronométrer l'exercice,
b. si vous désirez joindre un texte à lire,
c. si vous désirez afficher un commentaire en cas de mauvaise réponse,
d. si vous désirez que la bonne réponse soit affichée lors de la correction,
e. si vous désirez donner la possibilité de recommencer l'exercice,
f. si vous désirez que le script (.js) en JavaScript soit séparé du fichier .html, ce qui empêche de consulter les réponses en affichant le code-source.

Pour répondre affirmativement aux questions, cochez tout simplement la case correspondante.
  • Si vous avez demandé un chronomètre, vous pourrez introduire votre délai lors de la 2me étape.
  • Si vous avez demandé de pouvoir ajouter un texte à lire, vous pourrez entrer ce texte et le mettre en forme avant de commencer à entrer vos questions.
  • Si vous avez demandé la séparation du script JavaScript de votre page HTML, vous devrez préciser le nom de ce fichier (extension .js) lors de la 2me étape. Recopiez-le, car vous devrez le réutiliser à l'étape 3 !

Vous entrez vos questions dans la zone de saisie. Par 'question', il faut entendre une suite d'éléments qui constitueront une liste. Vous entrez les éléments dans l'ordre correct en commençant par celui qui devra se trouver en haut de la liste, et ainsi de suite.
Vous pouvez, bien entendu, introduire des éléments de liste bien plus longs qu'un seul mot !

Ensuite (ou simultanément), vous indiquez au programme il faut séparer les éléments . Pour cela, vous entrez le caractère | (alt gr + | ) juste avant chaque élément à partir du 2e élément et sans laisser d'espace !

Ajoutez votre commentaire en cas de réponse fausse, si vous avez coché cette option dans les "Paramètres".

Terminez la question en cliquant sur . Cliquez sur pour passer à la question suivante.

Aussi longtemps que vous êtes dans l'étape 1, vous pouvez revenir en arrière dans votre questionnaire et modifier des données. Il vous est également possible de consulter la liste des questions déjà entrées en cliquant sur le bouton  et aussi de modifier le texte en cliquant sur le bouton .

Lorsque vous aurez introduit toutes vos questions, cliquez sur , pas avant , car vous ne pourrez plus faire marche arrière !

Si vous avez oublié certaines choses, le script vous le signale.



Etape 2 - Configuration de la page Web

Cette deuxième étape vous permet de créer le "design" de votre exercice, son aspect final tel que l'utilisateur le verra sur son écran.

Vous devez entrer un certain nombre de paramètres, si vous désirez modifier la configuration par défaut.
Le paramètre "nom de l'auteur" est facultatif. Le paramètre "date" est également facultatif et est généré automatiquement à la date réelle, mais vous pouvez la modifier si vous le désirez.

Les paramètres à modifier absolument sont :
  1. le titre de votre exercice,
  2. la consigne (que doit faire l'utilisateur final ?),
  3. le temps imparti pour effectuer l'exercice, si vous avez demandé le chronomètre,
  4. le nom du fichier JavaScript, si vous avez demandé qu'il soit séparé de la page HTML.
Si vous oubliez d'entrer un de ces 4 paramètres, le programme vous le signale.

Le bouton ouvre une fenêtre popup qui permet de voir à quoi ressemblera l'exercice dans un navigateur tel que  Internet Explorer  ou  Firefox  par exemple.
La fenêtre "Prévisualisation" n'est pas active, car elle ne contient pas le code JavaScript !! Si vous cliquez dedans, elle se ferme.
Si l'aspect de votre exercice ne vous convient pas, vous pouvez introduire d'autres données dans le cadre "Configuration", aussi longtemps que vous n'appuyez pas sur .



Etape 3 - Création du code-source et enregistrement du(des) fichier(s) Web

Le code-source de votre exercice est généré lors de cette étape. Il tient en une seule page, si vous n'avez pas demandé à ce que le script JavaScript soit séparé du code HTML.
Par contre, si vous l'avez demandé, un second cadre succède au premier. Ce dernier cadre contient le code JavaScript qu'il faut sauver à part.

Au-dessus de chaque cadre, se trouve un bouton . Cliquez dessus pour sélectionner tout le contenu du cadre.

Copiez ce contenu, soit en utilisant la souris comme expliqué à l'écran, soit en utilisant les touches du clavier (ctrl + C).

Ouvrez le "Bloc-notes" de Windows et collez-y le code que vous avez copié.

Cela fait, toujours dans le Bloc-notes, cliquez sur 'Fichier', puis 'Enregistrer sous...'. Choisissez un emplacement dans la boîte de dialogue qui s'est affichée, donnez un nom à votre exercice, ajoutez l'extension .html et cliquez sur 'Enregistrer'. Votre exercice est terminé ! Du moins, si vous n'avez pas demandé à séparer le code JavaScript, car, dans ce cas, il faut effectuer la même démarche que celle décrite plus haut, sauf que l'extension sera .js et non plus .html !

IMPORTANT : le nom du fichier .js doit être le même que celui que vous avez renseigné lors de la deuxième étape (configuration) et doit être enregistré dans le même répertoire (ou dossier) que le fichier .html  !!

Une fois cela terminé, cliquez sur le fichier HTML pour admirer le résultat de votre travail dans votre navigateur !!

©2009-2010, LDD-Soft
Cette page a reçu  visites.
1758631 visites à ce jour