Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision		Révision précédente
cours:jpc:stic:trx13:entrelesmurs [07/02/2013 16:55] – mhainecours:jpc:stic:trx13:entrelesmurs [24/11/2022 05:34] (Version actuelle) – modification externe 127.0.0.1
Ligne 1: Ligne 1:
 +====== Entre Les Murs ======
 +
 +Sur cette page, vous trouverez de quoi travailler sur l'oeuvre de François Bégaudeau adaptée au cinéma par Laurent Cantet. Il y aura sur cette page différentes activités, d'autres activités proposées qui seront à rendre au professeur, les liens utiles pour répondre aux diverses questions, ainsi que d'autres liens sur des activités complémentaires/supplémentaires.
 +
 +
 +<fc #008000>__Activité 1: les différentes affiches__</fc>
 +
 +
 +Regardez l'affiche française du film et répondez aux questions suivantes:
 +
 +{{:cours:jpc:stic:trx13:elm_france.jpg?200|}}
 +
 +
 +Qui sont ces jeunes gens? Où sont-ils? Quelle est selon vous l'ambiance qui se dégage de la scène?
 +
 +Décrivez l'affiche de manière générale (couleurs, disposition...) puis décrivez ensuite, au choix:
 +le personnage de gauche,
 +le personnage de droite,
 +les deux personnages du milieu.
 +
 +
 +
 +Voici 2 autres affiches:
 +
 +
 +{{:cours:jpc:stic:trx13:elm_allemagne.jpg?200|}}           {{:cours:jpc:stic:trx13:elm_eu.jpg?200|}}
 +
 +
 +De quels pays viennent les deux autres?
 +
 +
 +Après avoir trouvé les points communs et les différences entre les affiches, dites laquelle vous préférez et pourquoi.
 +
 +
 +
 +<fc #008000>__Activité 2: la bande annonce__</fc>
 +
 +Répondez au quiz suivant. Regardez la bande annonce SANS le son pour les questions 1, 2 et 3. Répondez à la question 4 en ayant regardé la bande annonce AVEC le son:
 +
 +-Bande-annonce: {{youtube>5ftLgbUXqNU?medium}}
 +
 +{{:cours:jpc:stic:trx13:quizelm2.htm|}}
 +
 +Après avoir vu les affiches et la bande-annonce, pouvez-vous expliquer le titre? Que signifie "Palme d'Or"? Connaissez-vous d'autres événements comme celui-ci?
 +
 +<fc #008000>__Activité 3: extrait du livre__</fc>
 +
 +Lisez l'extrait du livre proposé entre crochets et répondez ensuite aux questions suivantes:
 +
 +[[https://www.dropbox.com/home/ELM/extrait%20du%20livre]]
 +
 +Quelles sont les caractéristiques d’un texte comme celui-ci? Relevez les ressemblances.
 +
 +Complétez le tableau en reliant chaque personnage au trait de caractère qui lui correspond:
 +
 +<html> <?xml version="1.0"?>
 +       <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
 +       <html xmlns="http://www.w3.org/1999/xhtml"
 +             xml:lang="en"><head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Matthieu."></meta><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"></meta>
 +
 +<link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" />
 +<meta name="DC:Creator" content="Matthieu" />
 +<meta name="DC:Title" content="Les personnages et leur personnalit&#x00E9;" />
 +
 +
 +<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
 +
 +<title>
 +Les personnages et leur personnalit&#x00E9;
 +</title>
 +
 +<!-- Made with executable version 6.3 Release 0 Build 5 -->
 +
 +<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
 +
 +
 +
 +<style type="text/css">
 +
 +
 +/* This is the CSS stylesheet used in the exercise. */
 +/* Elements in square brackets are replaced by data based on configuration settings when the exercise is built. */
 +
 +/* BeginCorePageCSS */
 +
 +/* Made with executable version 6.3 Release 0 Build 5 */
 +
 +
 +/* Hack to hide a nested Quicktime player from IE, which can't handle it. */
 +* html object.MediaPlayerNotForIE {
 + display: none;
 +}
 +
 +body{
 + font-family: Geneva,Arial,sans-serif;
 + background-color: #C0C0C0;
 + color: #000000;
 + 
 + margin-right: 5%;
 + margin-left: 5%;
 + font-size: small;
 +}
 +
 +p{
 + text-align: left;
 + margin: 0px;
 + font-size: 100%;
 +}
 +
 +table,div,span,td{
 + font-size: 100%;
 + color: #000000;
 +}
 +
 +div.Titles{
 + padding: 0.5em;;
 + text-align: center;
 + color: #000000;
 +}
 +
 +button{
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 100%;
 + display: inline;
 +}
 +
 +.ExerciseTitle{
 + font-size: 140%;
 + color: #000000;
 +}
 +
 +.ExerciseSubtitle{
 + font-size: 120%;
 + color: #000000;
 +}
 +
 +div.StdDiv{
 + background-color: #FFFFFF;
 + text-align: center;
 + font-size: 100%;
 + color: #000000;
 + padding: 0.5em;
 + border-style: solid;
 + border-width: 1px 1px 1px 1px;
 + border-color: #000000;
 + margin-bottom: 1px;
 +}
 +
 +/* EndCorePageCSS */
 +
 +.RTLText{
 + text-align: right;
 + font-size: 150%;
 + direction: rtl;
 + font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", Geneva,Arial,sans-serif; 
 +}
 +
 +.CentredRTLText{
 + text-align: center;
 + font-size: 150%;
 + direction: rtl;
 + font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", Geneva,Arial,sans-serif; 
 +}
 +
 +button p.RTLText{
 + text-align: center;
 +}
 +
 +.RTLGapBox{
 + text-align: right;
 + font-size: 150%;
 + direction: rtl;
 + font-family: "Times New Roman", Geneva,Arial,sans-serif;
 +}
 +
 +.Guess{
 + font-weight: bold;
 +}
 +
 +.CorrectAnswer{
 + font-weight: bold;
 +}
 +
 +div#Timer{
 + padding: 0.25em;
 + margin-left: auto;
 + margin-right: auto;
 + text-align: center;
 + color: #000000;
 +}
 +
 +span#TimerText{
 + padding: 0.25em;
 + border-width: 1px;
 + border-style: solid;
 + font-weight: bold;
 + display: none;
 + color: #000000;
 +}
 +
 +span.Instructions{
 +
 +}
 +
 +div.ExerciseText{
 +
 +}
 +
 +.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
 + color: #000000;
 +}
 +
 +.LeftItem{
 + font-size: 100%;
 + color: #000000;
 + text-align: left;
 +}
 +
 +.RightItem{
 + font-weight: bold;
 + font-size: 100%;
 + color: #000000;
 +}
 +
 +span.CorrectMark{
 +
 +}
 +
 +input, textarea{
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 120%;
 +}
 +
 +select{
 + font-size: 100%;
 +}
 +
 +div.Feedback {
 + background-color: #C0C0C0;
 + left: 33%;
 + width: 34%;
 + top: 33%;
 + z-index: 1;
 + border-style: solid;
 + border-width: 1px;
 + padding: 5px;
 + text-align: center;
 + color: #000000;
 + position: absolute;
 + display: none;
 + font-size: 100%;
 +}
 +
 +
 +
 +
 +div.ExerciseDiv{
 + color: #000000;
 +}
 +
 +/* JMatch flashcard styles */
 +table.FlashcardTable{
 + background-color: transparent;
 + color: #000000;
 + border-color: #000000;
 + margin-left: 5%;
 + margin-right: 5%;
 + margin-top: 2em;
 + margin-bottom: 2em;
 + width: 90%;
 + position: relative;
 + text-align: center;
 + padding: 0px;
 +}
 +
 +table.FlashcardTable tr{
 + border-style: none;
 + margin: 0px;
 + padding: 0px;
 + background-color: #FFFFFF;
 +}
 +
 +table.FlashcardTable td.Showing{
 + font-size: 140%;
 + text-align: center;
 + width: 50%;
 + display: table-cell;
 + padding: 2em;
 + margin: 0px;
 + border-style: solid;
 + border-width: 1px;
 + color: #000000;
 + background-color: #FFFFFF;
 +}
 +
 +table.FlashcardTable td.Hidden{
 + display: none;
 +}
 +
 +/* JMix styles */
 +div#SegmentDiv{
 + margin-top: 2em;
 + margin-bottom: 2em;
 + text-align: center;
 +}
 +
 +a.ExSegment{
 + font-size: 120%;
 + font-weight: bold;
 + text-decoration: none;
 + color: #000000;
 +}
 +
 +span.RemainingWordList{
 + font-style: italic;
 +}
 +
 +div.DropLine {
 + position: absolute;
 + text-align: center;
 + border-bottom-style: solid;
 + border-bottom-width: 1px;
 + border-bottom-color: #000000;
 + width: 80%;
 +}
 +
 +/* JCloze styles */
 +
 +.ClozeWordList{
 + text-align: center;
 + font-weight: bold;
 +}
 +
 +div.ClozeBody{
 + text-align: left;
 + margin-top: 2em;
 + margin-bottom: 2em;
 + line-height: 2.0
 +}
 +
 +span.GapSpan{
 + font-weight: bold;
 +}
 +
 +/* JCross styles */
 +
 +table.CrosswordGrid{
 + margin: auto auto 1em auto;
 + border-collapse: collapse;
 + padding: 0px;
 + background-color: #000000;
 +}
 +
 +table.CrosswordGrid tbody tr td{
 + width: 1.5em;
 + height: 1.5em;
 + text-align: center;
 + vertical-align: middle;
 + font-size: 140%;
 + padding: 1px;
 + margin: 0px;
 + border-style: solid;
 + border-width: 1px;
 + border-color: #000000;
 + color: #000000;
 +}
 +
 +table.CrosswordGrid span{
 + color: #000000;
 +}
 +
 +table.CrosswordGrid td.BlankCell{
 + background-color: #000000;
 + color: #000000;
 +}
 +
 +table.CrosswordGrid td.LetterOnlyCell{
 + text-align: center;
 + vertical-align: middle;
 + background-color: #ffffff;
 + color: #000000;
 + font-weight: bold;
 +}
 +
 +table.CrosswordGrid td.NumLetterCell{
 + text-align: left;
 + vertical-align: top;
 + background-color: #ffffff;
 + color: #000000;
 + padding: 1px;
 + font-weight: bold;
 +}
 +
 +.NumLetterCellText{
 + cursor: pointer;
 + color: #000000;
 +}
 +
 +.GridNum{
 + vertical-align: super;
 + font-size: 66%;
 + font-weight: bold;
 + text-decoration: none;
 + color: #000000;
 +}
 +
 +.GridNum:hover, .GridNum:visited{
 + color: #000000;
 +}
 +
 +table#Clues{
 + margin: auto;
 + vertical-align: top;
 +}
 +
 +table#Clues td{
 + vertical-align: top;
 +}
 +
 +table.ClueList{
 +  margin: auto;
 +}
 +
 +td.ClueNum{
 + text-align: right;
 + font-weight: bold;
 + vertical-align: top;
 +}
 +
 +td.Clue{
 + text-align: left;
 +}
 +
 +div#ClueEntry{
 + text-align: left;
 + margin-bottom: 1em;
 +}
 +
 +/* Keypad styles */
 +
 +div.Keypad{
 + text-align: center;
 + display: none; /* initially hidden, shown if needed */
 + margin-bottom: 0.5em;
 +}
 +
 +div.Keypad button{
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 120%;
 + background-color: #ffffff;
 + color: #000000;
 + width: 2em;
 +}
 +
 +/* JQuiz styles */
 +
 +div.QuestionNavigation{
 + text-align: center;
 +}
 +
 +.QNum{
 + margin: 0em 1em 0.5em 1em;
 + font-weight: bold;
 + vertical-align: middle;
 +}
 +
 +textarea{
 + font-family: Geneva,Arial,sans-serif;
 +}
 +
 +.QuestionText{
 + text-align: left;
 + margin: 0px;
 + font-size: 100%;
 +}
 +
 +.Answer{
 + font-size: 120%;
 + letter-spacing: 0.1em;
 +}
 +
 +.PartialAnswer{
 + font-size: 120%;
 + letter-spacing: 0.1em;
 + color: #000000;
 +}
 +
 +.Highlight{
 + color: #000000;
 + background-color: #ffff00;
 + font-weight: bold;
 + font-size: 120%;
 +}
 +
 +ol.QuizQuestions{
 + text-align: left;
 + list-style-type: none;
 +}
 +
 +li.QuizQuestion{
 + padding: 1em;
 + border-style: solid;
 + border-width: 0px 0px 1px 0px;
 +}
 +
 +ol.MCAnswers{
 + text-align: left;
 + list-style-type: upper-alpha;
 + padding: 1em;
 +}
 +
 +ol.MCAnswers li{
 + margin-bottom: 1em;
 +}
 +
 +ol.MSelAnswers{
 + text-align: left;
 + list-style-type: lower-alpha;
 + padding: 1em;
 +}
 +
 +div.ShortAnswer{
 + padding: 1em;
 +}
 +
 +.FuncButton {
 + text-align: center;
 + border-style: solid;
 +
 + border-left-color: #ffffff;
 + border-top-color: #ffffff;
 + border-right-color: #7f7f7f;
 + border-bottom-color: #7f7f7f;
 + color: #000000;
 + background-color: #FFFFFF;
 +
 + border-width: 2px;
 + padding: 3px 6px 3px 6px;
 + cursor: pointer;
 +}
 +
 +.FuncButtonUp {
 + color: #FFFFFF;
 + text-align: center;
 + border-style: solid;
 +
 + border-left-color: #ffffff;
 + border-top-color: #ffffff;
 + border-right-color: #7f7f7f;
 + border-bottom-color: #7f7f7f;
 +
 + background-color: #000000;
 + color: #FFFFFF;
 + border-width: 2px;
 + padding: 3px 6px 3px 6px;
 + cursor: pointer;
 +}
 +
 +.FuncButtonDown {
 + color: #FFFFFF;
 + text-align: center;
 + border-style: solid;
 +
 + border-left-color: #7f7f7f;
 + border-top-color: #7f7f7f;
 + border-right-color: #ffffff;
 + border-bottom-color: #ffffff;
 + background-color: #000000;
 + color: #FFFFFF;
 +
 + border-width: 2px;
 + padding: 3px 6px 3px 6px;
 + cursor: pointer;
 +}
 +
 +/*BeginNavBarStyle*/
 +
 +div.NavButtonBar{
 + background-color: #000000;
 + text-align: center;
 + margin: 2px 0px 2px 0px;
 + clear: both;
 + font-size: 100%;
 +}
 +
 +.NavButton {
 + border-style: solid;
 +
 + border-left-color: #7f7f7f;
 + border-top-color: #7f7f7f;
 + border-right-color: #000000;
 + border-bottom-color: #000000;
 + background-color: #000000;
 + color: #ffffff;
 +
 + border-width: 2px;
 + cursor: pointer;
 +}
 +
 +.NavButtonUp {
 + border-style: solid;
 +
 + border-left-color: #7f7f7f;
 + border-top-color: #7f7f7f;
 + border-right-color: #000000;
 + border-bottom-color: #000000;
 + color: #000000;
 + background-color: #ffffff;
 +
 + border-width: 2px;
 + cursor: pointer;
 +}
 +
 +.NavButtonDown {
 + border-style: solid;
 +
 + border-left-color: #000000;
 + border-top-color: #000000;
 + border-right-color: #7f7f7f;
 + border-bottom-color: #7f7f7f;
 + color: #000000;
 + background-color: #ffffff;
 +
 + border-width: 2px;
 + cursor: pointer;
 +}
 +
 +/*EndNavBarStyle*/
 +
 +a{
 + color: #0000FF;
 +}
 +
 +a:visited{
 + color: #0000CC;
 +}
 +
 +a:hover{
 + color: #0000FF;
 +}
 +
 +div.CardStyle {
 + position: absolute;
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 100%;
 + padding: 5px;
 + border-style: solid;
 + border-width: 1px;
 + color: #000000;
 + background-color: #FFFFFF;
 + left: -50px;
 + top: -50px;
 + overflow: visible;
 +}
 +
 +.rtl{
 + text-align: right;
 + font-size: 140%;
 +}
 +
 +
 +</style>
 +
 +<script type="text/javascript">
 +
 +//<![CDATA[
 +
 +<!--
 +
 +
 +
 +
 +function Client(){
 +//if not a DOM browser, hopeless
 + this.min = false; if (document.getElementById){this.min = true;};
 +
 + this.ua = navigator.userAgent;
 + this.name = navigator.appName;
 + this.ver = navigator.appVersion;  
 +
 +//Get data about the browser
 + this.mac = (this.ver.indexOf('Mac') != -1);
 + this.win = (this.ver.indexOf('Windows') != -1);
 +
 +//Look for Gecko
 + this.gecko = (this.ua.indexOf('Gecko') > 1);
 + if (this.gecko){
 + this.geckoVer = parseInt(this.ua.substring(this.ua.indexOf('Gecko')+6, this.ua.length));
 +// if (this.geckoVer < 20020000){this.min = false;}
 + }
 +
 +//Look for Firebird
 + this.firebird = (this.ua.indexOf('Firebird') > 1);
 +
 +//Look for Safari
 + this.safari = (this.ua.indexOf('Safari') > 1);
 + if (this.safari){
 + this.gecko = false;
 + }
 +
 +//Look for IE
 + this.ie = (this.ua.indexOf('MSIE') > 0);
 + if (this.ie){
 + this.ieVer = parseFloat(this.ua.substring(this.ua.indexOf('MSIE')+5, this.ua.length));
 + if (this.ieVer < 5.5){this.min = false;}
 + }
 +
 +//Look for Opera
 + this.opera = (this.ua.indexOf('Opera') > 0);
 + if (this.opera){
 + this.operaVer = parseFloat(this.ua.substring(this.ua.indexOf('Opera')+6, this.ua.length));
 + if (this.operaVer < 7.04){this.min = false;}
 + }
 + if (this.min == false){
 +// alert('Your browser may not be able to handle this page.');
 + }
 +
 +//Special case for the horrible ie5mac
 + this.ie5mac = (this.ie&&this.mac&&(this.ieVer<6));
 +}
 +
 +var C = new Client();
 +
 +//for (prop in C){
 +// alert(prop + ': ' + C[prop]);
 +//}
 +
 +
 +
 +//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
 +
 +//[strNavBarJS]
 +function NavBtnOver(Btn){
 + if (Btn.className != 'NavButtonDown'){Btn.className = 'NavButtonUp';}
 +}
 +
 +function NavBtnOut(Btn){
 + Btn.className = 'NavButton';
 +}
 +
 +function NavBtnDown(Btn){
 + Btn.className = 'NavButtonDown';
 +}
 +//[/strNavBarJS]
 +
 +function FuncBtnOver(Btn){
 + if (Btn.className != 'FuncButtonDown'){Btn.className = 'FuncButtonUp';}
 +}
 +
 +function FuncBtnOut(Btn){
 + Btn.className = 'FuncButton';
 +}
 +
 +function FuncBtnDown(Btn){
 + Btn.className = 'FuncButtonDown';
 +}
 +
 +function FocusAButton(){
 + if (document.getElementById('CheckButton1') != null){
 + document.getElementById('CheckButton1').focus();
 + }
 + else{
 + if (document.getElementById('CheckButton2') != null){
 + document.getElementById('CheckButton2').focus();
 + }
 + else{
 + document.getElementsByTagName('button')[0].focus();
 + }
 + }
 +}
 +
 +
 +
 +
 +//CODE FOR HANDLING DISPLAY OF POPUP FEEDBACK BOX
 +
 +var topZ = 1000;
 +
 +function ShowMessage(Feedback){
 + var Output = Feedback + '<br /><br />';
 + document.getElementById('FeedbackContent').innerHTML = Output;
 + var FDiv = document.getElementById('FeedbackDiv');
 + topZ++;
 + FDiv.style.zIndex = topZ;
 + FDiv.style.top = TopSettingWithScrollOffset(30) + 'px';
 +
 + FDiv.style.display = 'block';
 +
 + ShowElements(false, 'input');
 + ShowElements(false, 'select');
 + ShowElements(false, 'object');
 + ShowElements(true, 'object', 'FeedbackContent');
 +
 +//Focus the OK button
 + setTimeout("document.getElementById('FeedbackOKButton').focus()", 50);
 +
 +//
 +}
 +
 +function ShowElements(Show, TagName, ContainerToReverse){
 +// added third argument to allow objects in the feedback box to appear
 +//IE bug -- hide all the form elements that will show through the popup
 +//FF on Mac bug : doesn't redisplay objects whose visibility is set to visible
 +//unless the object's display property is changed
 +
 + //get container object (by Id passed in, or use document otherwise)
 + TopNode = document.getElementById(ContainerToReverse);
 + var Els;
 + if (TopNode != null) {
 + Els = TopNode.getElementsByTagName(TagName);
 + } else {
 + Els = document.getElementsByTagName(TagName);
 + }
 +
 + for (var i=0; i<Els.length; i++){
 + if (TagName == "object") {
 + //manipulate object elements in all browsers
 + if (Show == true){
 + Els[i].style.visibility = 'visible';
 + //get Mac FireFox to manipulate display, to force screen redraw
 + if (C.mac && C.gecko) {Els[i].style.display = '';}
 + }
 + else{
 + Els[i].style.visibility = 'hidden';
 + if (C.mac && C.gecko) {Els[i].style.display = 'none';}
 + }
 + } 
 + else {
 + // tagName is either input or select (that is, Form Elements)
 + // ie6 has a problem with Form elements, so manipulate those
 + if (C.ie) {
 + if (C.ieVer < 7) {
 + if (Show == true){
 + Els[i].style.visibility = 'visible';
 + }
 + else{
 + Els[i].style.visibility = 'hidden';
 + }
 + }
 + }
 + }
 + }
 +}
 +
 +
 +
 +function HideFeedback(){
 + document.getElementById('FeedbackDiv').style.display = 'none';
 + ShowElements(true, 'input');
 + ShowElements(true, 'select');
 + ShowElements(true, 'object');
 + if (Finished == true){
 + Finish();
 + }
 +}
 +
 +
 +//GENERAL UTILITY FUNCTIONS AND VARIABLES
 +
 +//PAGE DIMENSION FUNCTIONS
 +function PageDim(){
 +//Get the page width and height
 + this.W = 600;
 + this.H = 400;
 + this.W = document.getElementsByTagName('body')[0].clientWidth;
 + this.H = document.getElementsByTagName('body')[0].clientHeight;
 +}
 +
 +var pg = null;
 +
 +function GetPageXY(El) {
 + var XY = {x: 0, y: 0};
 + while(El){
 + XY.x += El.offsetLeft;
 + XY.y += El.offsetTop;
 + El = El.offsetParent;
 + }
 + return XY;
 +}
 +
 +function GetScrollTop(){
 + if (typeof(window.pageYOffset) == 'number'){
 + return window.pageYOffset;
 + }
 + else{
 + if ((document.body)&&(document.body.scrollTop)){
 + return document.body.scrollTop;
 + }
 + else{
 + if ((document.documentElement)&&(document.documentElement.scrollTop)){
 + return document.documentElement.scrollTop;
 + }
 + else{
 + return 0;
 + }
 + }
 + }
 +}
 +
 +function GetViewportHeight(){
 + if (typeof window.innerHeight != 'undefined'){
 + return window.innerHeight;
 + }
 + else{
 + if (((typeof document.documentElement != 'undefined')&&(typeof document.documentElement.clientHeight !=
 +     'undefined'))&&(document.documentElement.clientHeight != 0)){
 + return document.documentElement.clientHeight;
 + }
 + else{
 + return document.getElementsByTagName('body')[0].clientHeight;
 + }
 + }
 +}
 +
 +function TopSettingWithScrollOffset(TopPercent){
 + var T = Math.floor(GetViewportHeight() * (TopPercent/100));
 + return GetScrollTop() + T; 
 +}
 +
 +//CODE FOR AVOIDING LOSS OF DATA WHEN BACKSPACE KEY INVOKES history.back()
 +var InTextBox = false;
 +
 +function SuppressBackspace(e){ 
 + if (InTextBox == true){return;}
 + if (C.ie) {
 + thisKey = window.event.keyCode;
 + }
 + else {
 + thisKey = e.keyCode;
 + }
 +
 + var Suppress = false;
 +
 + if (thisKey == 8) {
 + Suppress = true;
 + }
 +
 + if (Suppress == true){
 + if (C.ie){
 + window.event.returnValue = false;
 + window.event.cancelBubble = true;
 + }
 + else{
 + e.preventDefault();
 + }
 + }
 +}
 +
 +if (C.ie){
 + document.attachEvent('onkeydown',SuppressBackspace);
 + window.attachEvent('onkeydown',SuppressBackspace);
 +}
 +else{
 + if (window.addEventListener){
 + window.addEventListener('keypress',SuppressBackspace,false);
 + }
 +}
 +
 +function ReduceItems(InArray, ReduceToSize){
 + var ItemToDump=0;
 + var j=0;
 + while (InArray.length > ReduceToSize){
 + ItemToDump = Math.floor(InArray.length*Math.random());
 + InArray.splice(ItemToDump, 1);
 + }
 +}
 +
 +function Shuffle(InArray){
 + var Num;
 + var Temp = new Array();
 + var Len = InArray.length;
 +
 + var j = Len;
 +
 + for (var i=0; i<Len; i++){
 + Temp[i] = InArray[i];
 + }
 +
 + for (i=0; i<Len; i++){
 + Num = Math.floor(j  *  Math.random());
 + InArray[i] = Temp[Num];
 +
 + for (var k=Num; k < (j-1); k++) {
 + Temp[k] = Temp[k+1];
 + }
 + j--;
 + }
 + return InArray;
 +}
 +
 +function WriteToInstructions(Feedback) {
 + document.getElementById('InstructionsDiv').innerHTML = Feedback;
 +
 +}
 +
 +
 +
 +
 +function EscapeDoubleQuotes(InString){
 + return InString.replace(/"/g, '&quot;')
 +}
 +
 +function TrimString(InString){
 +        var x = 0;
 +
 +        if (InString.length != 0) {
 +                while ((InString.charAt(InString.length - 1) == '\u0020') || (InString.charAt(InString.length - 1) == '\u000A') || (InString.charAt(InString.length - 1) == '\u000D')){
 +                        InString = InString.substring(0, InString.length - 1)
 +                }
 +
 +                while ((InString.charAt(0) == '\u0020') || (InString.charAt(0) == '\u000A') || (InString.charAt(0) == '\u000D')){
 +                        InString = InString.substring(1, InString.length)
 +                }
 +
 +                while (InString.indexOf('  ') != -1) {
 +                        x = InString.indexOf('  ')
 +                        InString = InString.substring(0, x) + InString.substring(x+1, InString.length)
 +                 }
 +
 +                return InString;
 +        }
 +
 +        else {
 +                return '';
 +        }
 +}
 +
 +function FindLongest(InArray){
 + if (InArray.length < 1){return -1;}
 +
 + var Longest = 0;
 + for (var i=1; i<InArray.length; i++){
 + if (InArray[i].length > InArray[Longest].length){
 + Longest = i;
 + }
 + }
 + return Longest;
 +}
 +
 +//UNICODE CHARACTER FUNCTIONS
 +function IsCombiningDiacritic(CharNum){
 + var Result = (((CharNum >= 0x0300)&&(CharNum <= 0x370))||((CharNum >= 0x20d0)&&(CharNum <= 0x20ff)));
 + Result = Result || (((CharNum >= 0x3099)&&(CharNum <= 0x309a))||((CharNum >= 0xfe20)&&(CharNum <= 0xfe23)));
 + return Result;
 +}
 +
 +function IsCJK(CharNum){
 + return ((CharNum >= 0x3000)&&(CharNum < 0xd800));
 +}
 +
 +//SETUP FUNCTIONS
 +//BROWSER WILL REFILL TEXT BOXES FROM CACHE IF NOT PREVENTED
 +function ClearTextBoxes(){
 + var NList = document.getElementsByTagName('input');
 + for (var i=0; i<NList.length; i++){
 + if ((NList[i].id.indexOf('Guess') > -1)||(NList[i].id.indexOf('Gap') > -1)){
 + NList[i].value = '';
 + }
 + if (NList[i].id.indexOf('Chk') > -1){
 + NList[i].checked = '';
 + }
 + }
 +}
 +
 +//EXTENSION TO ARRAY OBJECT
 +function Array_IndexOf(Input){
 + var Result = -1;
 + for (var i=0; i<this.length; i++){
 + if (this[i] == Input){
 + Result = i;
 + }
 + }
 + return Result;
 +}
 +Array.prototype.indexOf = Array_IndexOf;
 +
 +//IE HAS RENDERING BUG WITH BOTTOM NAVBAR
 +function RemoveBottomNavBarForIE(){
 + if ((C.ie)&&(document.getElementById('Reading') != null)){
 + if (document.getElementById('BottomNavBar') != null){
 + document.getElementById('TheBody').removeChild(document.getElementById('BottomNavBar'));
 + }
 + }
 +}
 +
 +
 +
 +
 +//HOTPOTNET-RELATED CODE
 +
 +var HPNStartTime = (new Date()).getTime();
 +var SubmissionTimeout = 30000;
 +var Detail = ''; //Global that is used to submit tracking data
 +
 +function Finish(){
 +//If there's a form, fill it out and submit it
 + if (document.store != null){
 + Frm = document.store;
 + Frm.starttime.value = HPNStartTime;
 + Frm.endtime.value = (new Date()).getTime();
 + Frm.mark.value = Score;
 + Frm.detail.value = Detail;
 + Frm.submit();
 + }
 +}
 +
 +
 +
 +
 +
 +//JMATCH CORE JAVASCRIPT CODE
 +
 +var CorrectIndicator = ':-)';
 +var IncorrectIndicator = 'X';
 +var YourScoreIs = 'Ton score est de';
 +var CorrectResponse = 'Bien jou&#x00E9;!';
 +var IncorrectResponse = 'Dommage! Essaye une autre r&#x00E9;ponse';
 +var TotalUnfixedLeftItems = 0;
 +var TotCorrectChoices = 0;
 +var Penalties = 0;
 +var Finished = false;
 +var TimeOver = false;
 +
 +var Score = 0;
 +var Locked = false;
 +var ShuffleQs = false;
 +var QsToShow = 10;
 +
 +
 +function StartUp(){
 + RemoveBottomNavBarForIE();
 +
 +
 +
 +
 +
 +
 +
 + SetUpItems(ShuffleQs,QsToShow);
 +
 + TotalUnfixedLeftItems = document.getElementById('MatchDiv').getElementsByTagName('select').length;
 +
 +//Create arrays
 + CreateStatusArrays();
 +
 +
 +}
 +
 +Status = new Array();
 +
 +
 +function CreateStatusArrays(){
 + var Selects = document.getElementById('Questions').getElementsByTagName('select');
 + for (var x=0; x<Selects.length; x++){
 + Status[x] = new Array();
 + Status[x][0] = 0; // Item not matched correctly yet
 + Status[x][1] = 0; //Tries at this item so far
 + Status[x][2] = Selects[x].id; //Store a ref to the original drop-down
 + Status[x][3] = new Array(); //Sequence of guesses for this item
 + }
 +}
 +
 +function GetKeyFromSelectContainer(Container){
 + var Result = -1;
 + if (Container.getElementsByTagName('select').length > 0){
 + var Select = Container.getElementsByTagName('select')[0];
 + if (Select != null){
 + Result = parseInt(Select.id.substring(1, Select.id.length));
 + }
 + }
 + return Result;
 +}
 +
 +function GetKeyFromSelect(Select){
 + var Result = -1;
 + if (Select != null){
 + Result = parseInt(Select.id.substring(1, Select.id.length));
 + }
 + return Result;
 +}
 +
 +var OriginalKeys = new Array();
 +var ReducedKeys = new Array();
 +
 +function GetUniqueKeys(Container, TargetArray){
 + TargetArray.length = 0;
 + var x = -1;
 + var SList = Container.getElementsByTagName('select');
 + if (SList.length > 0){
 + for (var i=0; i<SList.length; i++){
 + x = GetKeyFromSelect(SList[i]);
 + if (TargetArray.indexOf(x) < 0){
 + TargetArray.push(x);
 + }
 + }
 + }
 +}
 +
 +function SetUpItems(ShuffleQs, ReduceTo){
 + var QList = new Array();
 + var i, j, k, Selects, Options;
 +
 +//Remove all the table rows and put them in an array for processing
 + var Qs = document.getElementById('Questions');
 +
 +//First, get a list of keys
 + GetUniqueKeys(Qs, OriginalKeys);
 +
 +//Remove the table rows to an array
 + while (Qs.getElementsByTagName('tr').length > 0){
 + QList.push(Qs.removeChild(Qs.getElementsByTagName('tr')[0]));
 + }
 +
 + var Reducing = (QList.length > ReduceTo);
 +
 +//If required, select random rows to delete
 + if (Reducing == true){
 + var DumpItem = 0;
 + while (ReduceTo < QList.length){
 +
 +//Get a number to delete from the array
 + DumpItem = Math.floor(QList.length*Math.random());
 + for (i=DumpItem; i<(QList.length-1); i++){
 + QList[i] = QList[i+1];
 + }
 + QList.length = QList.length-1;
 + }
 + }
 +//Shuffle the rows if necessary
 + if (ShuffleQs == true){
 + QList = Shuffle(QList);
 + }
 +
 + TotalUnfixedLeftItems = QList.length;
 +
 +//Write the rows back to the table body
 + for (i=0; i<QList.length; i++){
 + Qs.appendChild(QList[i]);
 + }
 +
 +//Now we need to remove any drop-down options that no longer have associated select items
 + if (Reducing == true){
 + GetUniqueKeys(Qs, ReducedKeys);
 +
 + Selects = Qs.getElementsByTagName('select');
 + for (i=0; i<Selects.length; i++){
 + Options = Selects[i].getElementsByTagName('option');
 + for (j=Options.length-1; j>=0; j--){
 + if (OptionRequired(Options[j].value) == false){
 + Selects[i].removeChild(Options[j]);
 + }
 + }
 + }
 + }
 +}
 +
 +function OptionRequired(Key){
 + if (ReducedKeys.indexOf(Key) > -1){
 + return true;
 + }
 + else{
 + if (OriginalKeys.indexOf(Key) > -1){
 + return false;
 + }
 + else{
 + return true;
 + }
 + }
 +}
 +
 +function CheckAnswers(){
 + if (Locked == true){return;}
 + var Select = null;
 + var Key = -1;
 + var Parent = null;
 + var Answer = null;
 + var AnsText = '';
 + var AllDone = true;
 + TotCorrectChoices = 0;
 +
 +//for each item not fixed or a distractor
 + for (var i=0; i<Status.length; i++){
 +
 +//if it hasn't been answered correctly yet
 + if (Status[i][0] < 1){
 +
 +//Add one to the number of tries for this item
 + Status[i][1]++;
 +
 +//Get a pointer to the drop-down
 + Select = document.getElementById(Status[i][2]);
 + Key = GetKeyFromSelect(Select);
 +//Save the answer given
 + Status[i][3].push(Select.options[Select.selectedIndex].value);
 +
 +//Check the answer
 + if (Select.options[Select.selectedIndex].value == Key){
 + Status[i][0] = 1;
 + AnsText = Select.options[Select.selectedIndex].innerHTML;
 + Parent = Select.parentNode;
 + Parent.removeChild(Select);
 + Parent.innerHTML = AnsText;
 + Parent.nextSibling.innerHTML = CorrectIndicator;
 + } 
 + else{
 + AllDone = false;
 + Parent = Select.parentNode;
 + Parent.nextSibling.innerHTML = IncorrectIndicator;
 + }
 + }
 + else{
 +//Add a copy of the last (correct) answer.
 + Status[i][3].push(Status[i][3][Status[i][3].length-1]);
 + }
 +//If it's correct, count it
 + if (Status[i][0] == 1){
 + TotCorrectChoices++;
 + }
 + }
 +//Calculate the score
 + Score = Math.floor(((TotCorrectChoices-Penalties)/TotalUnfixedLeftItems)*100);
 + if (Score<0){Score = 0;}
 + var Feedback = '';
 +
 +//Build the feedback
 + if (AllDone == true){
 + Feedback = YourScoreIs + ' ' + Score + '%.' + '<br />' + CorrectResponse;
 + }
 + else{
 + Feedback = YourScoreIs + ' ' + Score + '%.' + '<br />' + IncorrectResponse;
 +//Penalty for incorrect check
 + Penalties++;
 + }
 +
 +//If the exercise is over, deal with that
 + if ((AllDone == true)||(TimeOver == true)){
 +
 +
 + TimeOver = true;
 + Locked = true;
 + Finished = true;
 + setTimeout('Finish()', SubmissionTimeout);
 + WriteToInstructions(Feedback);
 + }
 +
 +//Show the feedback
 + ShowMessage(Feedback);
 +
 +
 +}
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +//-->
 +
 +//]]>
 +
 +</script>
 +
 +
 +</head>
 +
 +<body onload="StartUp()" id="TheBody" >
 +
 +<!-- BeginTopNavButtons -->
 +
 +
 +<div class="NavButtonBar" id="TopNavBar">
 +
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)"  onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='contents.htm'; return false;"> Index </button>
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='nextpage.htm'; return false;">=&gt;</button>
 +
 +
 +</div>
 +
 +
 +
 +<!-- EndTopNavButtons -->
 +
 +<div class="Titles">
 + <h2 class="ExerciseTitle">Les personnages et leur personnalit&#x00E9;</h2>
 +
 +
 +
 +</div>
 +
 +<div id="InstructionsDiv" class="StdDiv">
 + <div id="Instructions"></div>
 +</div>
 +
 +
 +
 +<div id="MainDiv" class="StdDiv">
 +
 +<button id="CheckButton1" class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="CheckAnswers()">&nbsp;Check&nbsp;</button>
 +
 +<div id="MatchDiv" style="text-align: center;">
 +
 +<form id="QForm" method="post" action="" onsubmit="return false;">
 +<table border="0" style="margin: 2em auto 2em auto;"><tbody id="Questions">
 +
 +<tr><td class="LeftItem">Alyssa</td><td class="RightItem"><select id="s0_0"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Dico</td><td class="RightItem"><select id="s1_1"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Djibril</td><td class="RightItem"><select id="s2_2"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Frida</td><td class="RightItem"><select id="s3_3"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Hinda</td><td class="RightItem"><select id="s4_4"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Khoumba</td><td class="RightItem"><select id="s5_5"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Mezut</td><td class="RightItem"><select id="s6_6"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Ming</td><td class="RightItem"><select id="s7_7"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Sandra</td><td class="RightItem"><select id="s8_8"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr><tr><td class="LeftItem">Souleymane</td><td class="RightItem"><select id="s9_9"><option value="x"></option>
 +<option value="9">Calme et timide</option>
 +<option value="8">Triste et contente d'&#x00EA;tre &#x00E0; l'&#x00E9;cole</option>
 +<option value="2">Agit&#x00E9;, fier d'&#x00EA;tre Malien</option>
 +<option value="3">Gentille et agr&#x00E9;able</option>
 +<option value="6">Parle de Tony Parker</option>
 +<option value="1">Ne dit rien sur lui</option>
 +<option value="5">Mauvais caract&#x00E8;re</option>
 +<option value="0">Ne sait pas si elle aime le fran&#x00E7;ais</option>
 +<option value="4">Heureuse de vivre</option>
 +<option value="7">Gentil et travailleur</option>
 +</select></td><td></td></tr>
 +
 +</tbody></table>
 +</form>
 +</div>
 +
 +<button id="CheckButton2" class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="CheckAnswers()">&nbsp;Check&nbsp;</button>
 +
 +</div>
 +
 +
 +
 +<div class="Feedback" id="FeedbackDiv">
 +<div class="FeedbackText" id="FeedbackContent"></div>
 +<button id="FeedbackOKButton" class="FuncButton" onfocus="FuncBtnOver(this)" onblur="FuncBtnOut(this)" onmouseover="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="HideFeedback(); return false;">&nbsp;OK&nbsp;</button>
 +</div>
 +
 +<!-- BeginBottomNavButtons -->
 +
 +
 +<div class="NavButtonBar" id="BottomNavBar">
 +
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)"  onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='contents.htm'; return false;"> Index </button>
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='nextpage.htm'; return false;">=&gt;</button>
 +
 +
 +</div>
 +
 +
 +
 +<!-- EndBottomNavButtons -->
 +
 +<!-- BeginSubmissionForm -->
 +
 +<!-- EndSubmissionForm -->
 +
 +</body>
 +
 +</html>
 +
 +
 +En France, l’exercice de l’autoportrait se fait généralement en début d’année. A votre avis, pour quelle(s) raison(s) le professeur demande-t-il aux élèves ce genre d’exercice?
 +
 +<fc #008000>__Activité 4: l'autoportrait__</fc>
 +
 +Ecoutez et regardez l’extrait vidéo, puis complétez le texte:
 +
 +-Autoportrait: [[http://www.vodkaster.com/Films/Entre-les-murs/13257|lien]]
 +
 +<html><?xml version="1.0"?>
 +       <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
 +       <html xmlns="http://www.w3.org/1999/xhtml"
 +             xml:lang="en"><head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Matthieu."></meta><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"></meta>
 +
 +<link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" />
 +<meta name="DC:Creator" content="Matthieu" />
 +<meta name="DC:Title" content="Carl" />
 +
 +
 +<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
 +
 +<title>
 +Carl
 +</title>
 +
 +<!-- Made with executable version 6.3 Release 0 Build 5 -->
 +
 +<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
 +
 +
 +
 +<style type="text/css">
 +
 +
 +/* This is the CSS stylesheet used in the exercise. */
 +/* Elements in square brackets are replaced by data based on configuration settings when the exercise is built. */
 +
 +/* BeginCorePageCSS */
 +
 +/* Made with executable version 6.3 Release 0 Build 5 */
 +
 +
 +/* Hack to hide a nested Quicktime player from IE, which can't handle it. */
 +* html object.MediaPlayerNotForIE {
 + display: none;
 +}
 +
 +body{
 + font-family: Geneva,Arial,sans-serif;
 + background-color: #C0C0C0;
 + color: #000000;
 + 
 + margin-right: 5%;
 + margin-left: 5%;
 + font-size: small;
 +}
 +
 +p{
 + text-align: left;
 + margin: 0px;
 + font-size: 100%;
 +}
 +
 +table,div,span,td{
 + font-size: 100%;
 + color: #000000;
 +}
 +
 +div.Titles{
 + padding: 0.5em;;
 + text-align: center;
 + color: #000000;
 +}
 +
 +button{
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 100%;
 + display: inline;
 +}
 +
 +.ExerciseTitle{
 + font-size: 140%;
 + color: #000000;
 +}
 +
 +.ExerciseSubtitle{
 + font-size: 120%;
 + color: #000000;
 +}
 +
 +div.StdDiv{
 + background-color: #FFFFFF;
 + text-align: center;
 + font-size: 100%;
 + color: #000000;
 + padding: 0.5em;
 + border-style: solid;
 + border-width: 1px 1px 1px 1px;
 + border-color: #000000;
 + margin-bottom: 1px;
 +}
 +
 +/* EndCorePageCSS */
 +
 +.RTLText{
 + text-align: right;
 + font-size: 150%;
 + direction: rtl;
 + font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", Geneva,Arial,sans-serif; 
 +}
 +
 +.CentredRTLText{
 + text-align: center;
 + font-size: 150%;
 + direction: rtl;
 + font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", Geneva,Arial,sans-serif; 
 +}
 +
 +button p.RTLText{
 + text-align: center;
 +}
 +
 +.RTLGapBox{
 + text-align: right;
 + font-size: 150%;
 + direction: rtl;
 + font-family: "Times New Roman", Geneva,Arial,sans-serif;
 +}
 +
 +.Guess{
 + font-weight: bold;
 +}
 +
 +.CorrectAnswer{
 + font-weight: bold;
 +}
 +
 +div#Timer{
 + padding: 0.25em;
 + margin-left: auto;
 + margin-right: auto;
 + text-align: center;
 + color: #000000;
 +}
 +
 +span#TimerText{
 + padding: 0.25em;
 + border-width: 1px;
 + border-style: solid;
 + font-weight: bold;
 + display: none;
 + color: #000000;
 +}
 +
 +span.Instructions{
 +
 +}
 +
 +div.ExerciseText{
 +
 +}
 +
 +.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
 + color: #000000;
 +}
 +
 +.LeftItem{
 + font-size: 100%;
 + color: #000000;
 + text-align: left;
 +}
 +
 +.RightItem{
 + font-weight: bold;
 + font-size: 100%;
 + color: #000000;
 +}
 +
 +span.CorrectMark{
 +
 +}
 +
 +input, textarea{
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 120%;
 +}
 +
 +select{
 + font-size: 100%;
 +}
 +
 +div.Feedback {
 + background-color: #C0C0C0;
 + left: 33%;
 + width: 34%;
 + top: 33%;
 + z-index: 1;
 + border-style: solid;
 + border-width: 1px;
 + padding: 5px;
 + text-align: center;
 + color: #000000;
 + position: absolute;
 + display: none;
 + font-size: 100%;
 +}
 +
 +
 +
 +
 +div.ExerciseDiv{
 + color: #000000;
 +}
 +
 +/* JMatch flashcard styles */
 +table.FlashcardTable{
 + background-color: transparent;
 + color: #000000;
 + border-color: #000000;
 + margin-left: 5%;
 + margin-right: 5%;
 + margin-top: 2em;
 + margin-bottom: 2em;
 + width: 90%;
 + position: relative;
 + text-align: center;
 + padding: 0px;
 +}
 +
 +table.FlashcardTable tr{
 + border-style: none;
 + margin: 0px;
 + padding: 0px;
 + background-color: #FFFFFF;
 +}
 +
 +table.FlashcardTable td.Showing{
 + font-size: 140%;
 + text-align: center;
 + width: 50%;
 + display: table-cell;
 + padding: 2em;
 + margin: 0px;
 + border-style: solid;
 + border-width: 1px;
 + color: #000000;
 + background-color: #FFFFFF;
 +}
 +
 +table.FlashcardTable td.Hidden{
 + display: none;
 +}
 +
 +/* JMix styles */
 +div#SegmentDiv{
 + margin-top: 2em;
 + margin-bottom: 2em;
 + text-align: center;
 +}
 +
 +a.ExSegment{
 + font-size: 120%;
 + font-weight: bold;
 + text-decoration: none;
 + color: #000000;
 +}
 +
 +span.RemainingWordList{
 + font-style: italic;
 +}
 +
 +div.DropLine {
 + position: absolute;
 + text-align: center;
 + border-bottom-style: solid;
 + border-bottom-width: 1px;
 + border-bottom-color: #000000;
 + width: 80%;
 +}
 +
 +/* JCloze styles */
 +
 +.ClozeWordList{
 + text-align: center;
 + font-weight: bold;
 +}
 +
 +div.ClozeBody{
 + text-align: left;
 + margin-top: 2em;
 + margin-bottom: 2em;
 + line-height: 2.0
 +}
 +
 +span.GapSpan{
 + font-weight: bold;
 +}
 +
 +/* JCross styles */
 +
 +table.CrosswordGrid{
 + margin: auto auto 1em auto;
 + border-collapse: collapse;
 + padding: 0px;
 + background-color: #000000;
 +}
 +
 +table.CrosswordGrid tbody tr td{
 + width: 1.5em;
 + height: 1.5em;
 + text-align: center;
 + vertical-align: middle;
 + font-size: 140%;
 + padding: 1px;
 + margin: 0px;
 + border-style: solid;
 + border-width: 1px;
 + border-color: #000000;
 + color: #000000;
 +}
 +
 +table.CrosswordGrid span{
 + color: #000000;
 +}
 +
 +table.CrosswordGrid td.BlankCell{
 + background-color: #000000;
 + color: #000000;
 +}
 +
 +table.CrosswordGrid td.LetterOnlyCell{
 + text-align: center;
 + vertical-align: middle;
 + background-color: #ffffff;
 + color: #000000;
 + font-weight: bold;
 +}
 +
 +table.CrosswordGrid td.NumLetterCell{
 + text-align: left;
 + vertical-align: top;
 + background-color: #ffffff;
 + color: #000000;
 + padding: 1px;
 + font-weight: bold;
 +}
 +
 +.NumLetterCellText{
 + cursor: pointer;
 + color: #000000;
 +}
 +
 +.GridNum{
 + vertical-align: super;
 + font-size: 66%;
 + font-weight: bold;
 + text-decoration: none;
 + color: #000000;
 +}
 +
 +.GridNum:hover, .GridNum:visited{
 + color: #000000;
 +}
 +
 +table#Clues{
 + margin: auto;
 + vertical-align: top;
 +}
 +
 +table#Clues td{
 + vertical-align: top;
 +}
 +
 +table.ClueList{
 +  margin: auto;
 +}
 +
 +td.ClueNum{
 + text-align: right;
 + font-weight: bold;
 + vertical-align: top;
 +}
 +
 +td.Clue{
 + text-align: left;
 +}
 +
 +div#ClueEntry{
 + text-align: left;
 + margin-bottom: 1em;
 +}
 +
 +/* Keypad styles */
 +
 +div.Keypad{
 + text-align: center;
 + display: none; /* initially hidden, shown if needed */
 + margin-bottom: 0.5em;
 +}
 +
 +div.Keypad button{
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 120%;
 + background-color: #ffffff;
 + color: #000000;
 + width: 2em;
 +}
 +
 +/* JQuiz styles */
 +
 +div.QuestionNavigation{
 + text-align: center;
 +}
 +
 +.QNum{
 + margin: 0em 1em 0.5em 1em;
 + font-weight: bold;
 + vertical-align: middle;
 +}
 +
 +textarea{
 + font-family: Geneva,Arial,sans-serif;
 +}
 +
 +.QuestionText{
 + text-align: left;
 + margin: 0px;
 + font-size: 100%;
 +}
 +
 +.Answer{
 + font-size: 120%;
 + letter-spacing: 0.1em;
 +}
 +
 +.PartialAnswer{
 + font-size: 120%;
 + letter-spacing: 0.1em;
 + color: #000000;
 +}
 +
 +.Highlight{
 + color: #000000;
 + background-color: #ffff00;
 + font-weight: bold;
 + font-size: 120%;
 +}
 +
 +ol.QuizQuestions{
 + text-align: left;
 + list-style-type: none;
 +}
 +
 +li.QuizQuestion{
 + padding: 1em;
 + border-style: solid;
 + border-width: 0px 0px 1px 0px;
 +}
 +
 +ol.MCAnswers{
 + text-align: left;
 + list-style-type: upper-alpha;
 + padding: 1em;
 +}
 +
 +ol.MCAnswers li{
 + margin-bottom: 1em;
 +}
 +
 +ol.MSelAnswers{
 + text-align: left;
 + list-style-type: lower-alpha;
 + padding: 1em;
 +}
 +
 +div.ShortAnswer{
 + padding: 1em;
 +}
 +
 +.FuncButton {
 + text-align: center;
 + border-style: solid;
 +
 + border-left-color: #ffffff;
 + border-top-color: #ffffff;
 + border-right-color: #7f7f7f;
 + border-bottom-color: #7f7f7f;
 + color: #000000;
 + background-color: #FFFFFF;
 +
 + border-width: 2px;
 + padding: 3px 6px 3px 6px;
 + cursor: pointer;
 +}
 +
 +.FuncButtonUp {
 + color: #FFFFFF;
 + text-align: center;
 + border-style: solid;
 +
 + border-left-color: #ffffff;
 + border-top-color: #ffffff;
 + border-right-color: #7f7f7f;
 + border-bottom-color: #7f7f7f;
 +
 + background-color: #000000;
 + color: #FFFFFF;
 + border-width: 2px;
 + padding: 3px 6px 3px 6px;
 + cursor: pointer;
 +}
 +
 +.FuncButtonDown {
 + color: #FFFFFF;
 + text-align: center;
 + border-style: solid;
 +
 + border-left-color: #7f7f7f;
 + border-top-color: #7f7f7f;
 + border-right-color: #ffffff;
 + border-bottom-color: #ffffff;
 + background-color: #000000;
 + color: #FFFFFF;
 +
 + border-width: 2px;
 + padding: 3px 6px 3px 6px;
 + cursor: pointer;
 +}
 +
 +/*BeginNavBarStyle*/
 +
 +div.NavButtonBar{
 + background-color: #000000;
 + text-align: center;
 + margin: 2px 0px 2px 0px;
 + clear: both;
 + font-size: 100%;
 +}
 +
 +.NavButton {
 + border-style: solid;
 +
 + border-left-color: #7f7f7f;
 + border-top-color: #7f7f7f;
 + border-right-color: #000000;
 + border-bottom-color: #000000;
 + background-color: #000000;
 + color: #ffffff;
 +
 + border-width: 2px;
 + cursor: pointer;
 +}
 +
 +.NavButtonUp {
 + border-style: solid;
 +
 + border-left-color: #7f7f7f;
 + border-top-color: #7f7f7f;
 + border-right-color: #000000;
 + border-bottom-color: #000000;
 + color: #000000;
 + background-color: #ffffff;
 +
 + border-width: 2px;
 + cursor: pointer;
 +}
 +
 +.NavButtonDown {
 + border-style: solid;
 +
 + border-left-color: #000000;
 + border-top-color: #000000;
 + border-right-color: #7f7f7f;
 + border-bottom-color: #7f7f7f;
 + color: #000000;
 + background-color: #ffffff;
 +
 + border-width: 2px;
 + cursor: pointer;
 +}
 +
 +/*EndNavBarStyle*/
 +
 +a{
 + color: #0000FF;
 +}
 +
 +a:visited{
 + color: #0000CC;
 +}
 +
 +a:hover{
 + color: #0000FF;
 +}
 +
 +div.CardStyle {
 + position: absolute;
 + font-family: Geneva,Arial,sans-serif;
 + font-size: 100%;
 + padding: 5px;
 + border-style: solid;
 + border-width: 1px;
 + color: #000000;
 + background-color: #FFFFFF;
 + left: -50px;
 + top: -50px;
 + overflow: visible;
 +}
 +
 +.rtl{
 + text-align: right;
 + font-size: 140%;
 +}
 +
 +
 +</style>
 +
 +<script type="text/javascript">
 +
 +//<![CDATA[
 +
 +<!--
 +
 +
 +
 +
 +function Client(){
 +//if not a DOM browser, hopeless
 + this.min = false; if (document.getElementById){this.min = true;};
 +
 + this.ua = navigator.userAgent;
 + this.name = navigator.appName;
 + this.ver = navigator.appVersion;  
 +
 +//Get data about the browser
 + this.mac = (this.ver.indexOf('Mac') != -1);
 + this.win = (this.ver.indexOf('Windows') != -1);
 +
 +//Look for Gecko
 + this.gecko = (this.ua.indexOf('Gecko') > 1);
 + if (this.gecko){
 + this.geckoVer = parseInt(this.ua.substring(this.ua.indexOf('Gecko')+6, this.ua.length));
 +// if (this.geckoVer < 20020000){this.min = false;}
 + }
 +
 +//Look for Firebird
 + this.firebird = (this.ua.indexOf('Firebird') > 1);
 +
 +//Look for Safari
 + this.safari = (this.ua.indexOf('Safari') > 1);
 + if (this.safari){
 + this.gecko = false;
 + }
 +
 +//Look for IE
 + this.ie = (this.ua.indexOf('MSIE') > 0);
 + if (this.ie){
 + this.ieVer = parseFloat(this.ua.substring(this.ua.indexOf('MSIE')+5, this.ua.length));
 + if (this.ieVer < 5.5){this.min = false;}
 + }
 +
 +//Look for Opera
 + this.opera = (this.ua.indexOf('Opera') > 0);
 + if (this.opera){
 + this.operaVer = parseFloat(this.ua.substring(this.ua.indexOf('Opera')+6, this.ua.length));
 + if (this.operaVer < 7.04){this.min = false;}
 + }
 + if (this.min == false){
 +// alert('Your browser may not be able to handle this page.');
 + }
 +
 +//Special case for the horrible ie5mac
 + this.ie5mac = (this.ie&&this.mac&&(this.ieVer<6));
 +}
 +
 +var C = new Client();
 +
 +//for (prop in C){
 +// alert(prop + ': ' + C[prop]);
 +//}
 +
 +
 +
 +//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
 +
 +//[strNavBarJS]
 +function NavBtnOver(Btn){
 + if (Btn.className != 'NavButtonDown'){Btn.className = 'NavButtonUp';}
 +}
 +
 +function NavBtnOut(Btn){
 + Btn.className = 'NavButton';
 +}
 +
 +function NavBtnDown(Btn){
 + Btn.className = 'NavButtonDown';
 +}
 +//[/strNavBarJS]
 +
 +function FuncBtnOver(Btn){
 + if (Btn.className != 'FuncButtonDown'){Btn.className = 'FuncButtonUp';}
 +}
 +
 +function FuncBtnOut(Btn){
 + Btn.className = 'FuncButton';
 +}
 +
 +function FuncBtnDown(Btn){
 + Btn.className = 'FuncButtonDown';
 +}
 +
 +function FocusAButton(){
 + if (document.getElementById('CheckButton1') != null){
 + document.getElementById('CheckButton1').focus();
 + }
 + else{
 + if (document.getElementById('CheckButton2') != null){
 + document.getElementById('CheckButton2').focus();
 + }
 + else{
 + document.getElementsByTagName('button')[0].focus();
 + }
 + }
 +}
 +
 +
 +
 +
 +//CODE FOR HANDLING DISPLAY OF POPUP FEEDBACK BOX
 +
 +var topZ = 1000;
 +
 +function ShowMessage(Feedback){
 + var Output = Feedback + '<br /><br />';
 + document.getElementById('FeedbackContent').innerHTML = Output;
 + var FDiv = document.getElementById('FeedbackDiv');
 + topZ++;
 + FDiv.style.zIndex = topZ;
 + FDiv.style.top = TopSettingWithScrollOffset(30) + 'px';
 +
 + FDiv.style.display = 'block';
 +
 + ShowElements(false, 'input');
 + ShowElements(false, 'select');
 + ShowElements(false, 'object');
 + ShowElements(true, 'object', 'FeedbackContent');
 +
 +//Focus the OK button
 + setTimeout("document.getElementById('FeedbackOKButton').focus()", 50);
 +
 +//
 +}
 +
 +function ShowElements(Show, TagName, ContainerToReverse){
 +// added third argument to allow objects in the feedback box to appear
 +//IE bug -- hide all the form elements that will show through the popup
 +//FF on Mac bug : doesn't redisplay objects whose visibility is set to visible
 +//unless the object's display property is changed
 +
 + //get container object (by Id passed in, or use document otherwise)
 + TopNode = document.getElementById(ContainerToReverse);
 + var Els;
 + if (TopNode != null) {
 + Els = TopNode.getElementsByTagName(TagName);
 + } else {
 + Els = document.getElementsByTagName(TagName);
 + }
 +
 + for (var i=0; i<Els.length; i++){
 + if (TagName == "object") {
 + //manipulate object elements in all browsers
 + if (Show == true){
 + Els[i].style.visibility = 'visible';
 + //get Mac FireFox to manipulate display, to force screen redraw
 + if (C.mac && C.gecko) {Els[i].style.display = '';}
 + }
 + else{
 + Els[i].style.visibility = 'hidden';
 + if (C.mac && C.gecko) {Els[i].style.display = 'none';}
 + }
 + } 
 + else {
 + // tagName is either input or select (that is, Form Elements)
 + // ie6 has a problem with Form elements, so manipulate those
 + if (C.ie) {
 + if (C.ieVer < 7) {
 + if (Show == true){
 + Els[i].style.visibility = 'visible';
 + }
 + else{
 + Els[i].style.visibility = 'hidden';
 + }
 + }
 + }
 + }
 + }
 +}
 +
 +
 +
 +function HideFeedback(){
 + document.getElementById('FeedbackDiv').style.display = 'none';
 + ShowElements(true, 'input');
 + ShowElements(true, 'select');
 + ShowElements(true, 'object');
 + if (Finished == true){
 + Finish();
 + }
 +}
 +
 +
 +//GENERAL UTILITY FUNCTIONS AND VARIABLES
 +
 +//PAGE DIMENSION FUNCTIONS
 +function PageDim(){
 +//Get the page width and height
 + this.W = 600;
 + this.H = 400;
 + this.W = document.getElementsByTagName('body')[0].clientWidth;
 + this.H = document.getElementsByTagName('body')[0].clientHeight;
 +}
 +
 +var pg = null;
 +
 +function GetPageXY(El) {
 + var XY = {x: 0, y: 0};
 + while(El){
 + XY.x += El.offsetLeft;
 + XY.y += El.offsetTop;
 + El = El.offsetParent;
 + }
 + return XY;
 +}
 +
 +function GetScrollTop(){
 + if (typeof(window.pageYOffset) == 'number'){
 + return window.pageYOffset;
 + }
 + else{
 + if ((document.body)&&(document.body.scrollTop)){
 + return document.body.scrollTop;
 + }
 + else{
 + if ((document.documentElement)&&(document.documentElement.scrollTop)){
 + return document.documentElement.scrollTop;
 + }
 + else{
 + return 0;
 + }
 + }
 + }
 +}
 +
 +function GetViewportHeight(){
 + if (typeof window.innerHeight != 'undefined'){
 + return window.innerHeight;
 + }
 + else{
 + if (((typeof document.documentElement != 'undefined')&&(typeof document.documentElement.clientHeight !=
 +     'undefined'))&&(document.documentElement.clientHeight != 0)){
 + return document.documentElement.clientHeight;
 + }
 + else{
 + return document.getElementsByTagName('body')[0].clientHeight;
 + }
 + }
 +}
 +
 +function TopSettingWithScrollOffset(TopPercent){
 + var T = Math.floor(GetViewportHeight() * (TopPercent/100));
 + return GetScrollTop() + T; 
 +}
 +
 +//CODE FOR AVOIDING LOSS OF DATA WHEN BACKSPACE KEY INVOKES history.back()
 +var InTextBox = false;
 +
 +function SuppressBackspace(e){ 
 + if (InTextBox == true){return;}
 + if (C.ie) {
 + thisKey = window.event.keyCode;
 + }
 + else {
 + thisKey = e.keyCode;
 + }
 +
 + var Suppress = false;
 +
 + if (thisKey == 8) {
 + Suppress = true;
 + }
 +
 + if (Suppress == true){
 + if (C.ie){
 + window.event.returnValue = false;
 + window.event.cancelBubble = true;
 + }
 + else{
 + e.preventDefault();
 + }
 + }
 +}
 +
 +if (C.ie){
 + document.attachEvent('onkeydown',SuppressBackspace);
 + window.attachEvent('onkeydown',SuppressBackspace);
 +}
 +else{
 + if (window.addEventListener){
 + window.addEventListener('keypress',SuppressBackspace,false);
 + }
 +}
 +
 +function ReduceItems(InArray, ReduceToSize){
 + var ItemToDump=0;
 + var j=0;
 + while (InArray.length > ReduceToSize){
 + ItemToDump = Math.floor(InArray.length*Math.random());
 + InArray.splice(ItemToDump, 1);
 + }
 +}
 +
 +function Shuffle(InArray){
 + var Num;
 + var Temp = new Array();
 + var Len = InArray.length;
 +
 + var j = Len;
 +
 + for (var i=0; i<Len; i++){
 + Temp[i] = InArray[i];
 + }
 +
 + for (i=0; i<Len; i++){
 + Num = Math.floor(j  *  Math.random());
 + InArray[i] = Temp[Num];
 +
 + for (var k=Num; k < (j-1); k++) {
 + Temp[k] = Temp[k+1];
 + }
 + j--;
 + }
 + return InArray;
 +}
 +
 +function WriteToInstructions(Feedback) {
 + document.getElementById('InstructionsDiv').innerHTML = Feedback;
 +
 +}
 +
 +
 +
 +
 +function EscapeDoubleQuotes(InString){
 + return InString.replace(/"/g, '&quot;')
 +}
 +
 +function TrimString(InString){
 +        var x = 0;
 +
 +        if (InString.length != 0) {
 +                while ((InString.charAt(InString.length - 1) == '\u0020') || (InString.charAt(InString.length - 1) == '\u000A') || (InString.charAt(InString.length - 1) == '\u000D')){
 +                        InString = InString.substring(0, InString.length - 1)
 +                }
 +
 +                while ((InString.charAt(0) == '\u0020') || (InString.charAt(0) == '\u000A') || (InString.charAt(0) == '\u000D')){
 +                        InString = InString.substring(1, InString.length)
 +                }
 +
 +                while (InString.indexOf('  ') != -1) {
 +                        x = InString.indexOf('  ')
 +                        InString = InString.substring(0, x) + InString.substring(x+1, InString.length)
 +                 }
 +
 +                return InString;
 +        }
 +
 +        else {
 +                return '';
 +        }
 +}
 +
 +function FindLongest(InArray){
 + if (InArray.length < 1){return -1;}
 +
 + var Longest = 0;
 + for (var i=1; i<InArray.length; i++){
 + if (InArray[i].length > InArray[Longest].length){
 + Longest = i;
 + }
 + }
 + return Longest;
 +}
 +
 +//UNICODE CHARACTER FUNCTIONS
 +function IsCombiningDiacritic(CharNum){
 + var Result = (((CharNum >= 0x0300)&&(CharNum <= 0x370))||((CharNum >= 0x20d0)&&(CharNum <= 0x20ff)));
 + Result = Result || (((CharNum >= 0x3099)&&(CharNum <= 0x309a))||((CharNum >= 0xfe20)&&(CharNum <= 0xfe23)));
 + return Result;
 +}
 +
 +function IsCJK(CharNum){
 + return ((CharNum >= 0x3000)&&(CharNum < 0xd800));
 +}
 +
 +//SETUP FUNCTIONS
 +//BROWSER WILL REFILL TEXT BOXES FROM CACHE IF NOT PREVENTED
 +function ClearTextBoxes(){
 + var NList = document.getElementsByTagName('input');
 + for (var i=0; i<NList.length; i++){
 + if ((NList[i].id.indexOf('Guess') > -1)||(NList[i].id.indexOf('Gap') > -1)){
 + NList[i].value = '';
 + }
 + if (NList[i].id.indexOf('Chk') > -1){
 + NList[i].checked = '';
 + }
 + }
 +}
 +
 +//EXTENSION TO ARRAY OBJECT
 +function Array_IndexOf(Input){
 + var Result = -1;
 + for (var i=0; i<this.length; i++){
 + if (this[i] == Input){
 + Result = i;
 + }
 + }
 + return Result;
 +}
 +Array.prototype.indexOf = Array_IndexOf;
 +
 +//IE HAS RENDERING BUG WITH BOTTOM NAVBAR
 +function RemoveBottomNavBarForIE(){
 + if ((C.ie)&&(document.getElementById('Reading') != null)){
 + if (document.getElementById('BottomNavBar') != null){
 + document.getElementById('TheBody').removeChild(document.getElementById('BottomNavBar'));
 + }
 + }
 +}
 +
 +
 +
 +
 +//HOTPOTNET-RELATED CODE
 +
 +var HPNStartTime = (new Date()).getTime();
 +var SubmissionTimeout = 30000;
 +var Detail = ''; //Global that is used to submit tracking data
 +
 +function Finish(){
 +//If there's a form, fill it out and submit it
 + if (document.store != null){
 + Frm = document.store;
 + Frm.starttime.value = HPNStartTime;
 + Frm.endtime.value = (new Date()).getTime();
 + Frm.mark.value = Score;
 + Frm.detail.value = Detail;
 + Frm.submit();
 + }
 +}
 +
 +
 +
 +
 +
 +//JCLOZE CORE JAVASCRIPT CODE
 +
 +function ItemState(){
 + this.ClueGiven = false;
 + this.HintsAndChecks = 0;
 + this.MatchedAnswerLength = 0;
 + this.ItemScore = 0;
 + this.AnsweredCorrectly = false;
 + this.Guesses = new Array();
 + return this;
 +}
 +
 +var Feedback = '';
 +var Correct = 'Correct! Well done.';
 +var Incorrect = 'Some of your answers are incorrect. Incorrect answers have been left in place for you to change.'; 
 +var GiveHint = 'The next correct letter has been added to the answer.';
 +var CaseSensitive = false;
 +var YourScoreIs = 'Your score is ';
 +var Finished = false;
 +var Locked = false;
 +var Score = 0;
 +var CurrentWord = 0;
 +var Guesses = '';
 +var TimeOver = false;
 +
 +I = new Array();
 +
 +I[0] = new Array();
 +I[0][1] = new Array();
 +I[0][1][0] = new Array();
 +I[0][1][0][0] = '\u006C\u0027\u006F\u0072\u0064\u0069\u006E\u0061\u0074\u0065\u0075\u0072';
 +I[0][2]='';
 +
 +I[1] = new Array();
 +I[1][1] = new Array();
 +I[1][1][0] = new Array();
 +I[1][1][0][0] = '\u0070\u0061\u0072\u0065\u006E\u0074\u0073';
 +I[1][2]='';
 +
 +I[2] = new Array();
 +I[2][1] = new Array();
 +I[2][1][0] = new Array();
 +I[2][1][0][0] = '\u006D\u0061\u006E\u0067\u0065\u0072';
 +I[2][2]='';
 +
 +I[3] = new Array();
 +I[3][1] = new Array();
 +I[3][1][0] = new Array();
 +I[3][1][0][0] = '\u0070\u0072\u0069\u0073\u006F\u006E';
 +I[3][2]='';
 +
 +I[4] = new Array();
 +I[4][1] = new Array();
 +I[4][1][0] = new Array();
 +I[4][1][0][0] = '\u0063\u006F\u006C\u006C\u00E8\u0067\u0065';
 +I[4][2]='';
 +
 +
 +State = new Array();
 +
 +function StartUp(){
 + RemoveBottomNavBarForIE();
 +//Show a keypad if there is one (added bugfix for 6.0.4.12)
 + if (document.getElementById('CharacterKeypad') != null){
 + document.getElementById('CharacterKeypad').style.display = 'block';
 + }
 +
 +
 +
 +
 +
 +
 +
 + var i = 0;
 +
 + State.length = 0;
 + for (i=0; i<I.length; i++){
 + State[i] = new ItemState();
 + }
 +
 + ClearTextBoxes();
 +
 +
 +
 +}
 +
 +function ShowClue(ItemNum){
 + if (Locked == true){return;}
 + State[ItemNum].ClueGiven = true;
 + ShowMessage(I[ItemNum][2]);
 +}
 +
 +function SaveCurrentAnswers(){
 + var Ans = '';
 + for (var i=0; i<I.length; i++){
 + Ans = GetGapValue(i);
 + if ((Ans.length > 0)&&(Ans != State[i].Guesses[State[i].Guesses.length-1])){
 + State[i].Guesses[State[i].Guesses.length] = Ans;
 + }
 + }
 +}
 +
 +function CompileGuesses(){
 + var F = document.getElementById('store');
 + if (F != null){
 + var Temp = '<?xml version="1.0"?><hpnetresult><fields>';
 + var GapLabel = '';
 + for (var i=0; i<State.length; i++){
 + GapLabel = 'Gap ' + (i+1).toString();
 + Temp += '<field><fieldname>' + GapLabel + '</fieldname>';
 + Temp += '<fieldtype>student-responses</fieldtype><fieldlabel>' + GapLabel + '</fieldlabel>';
 + Temp += '<fieldlabelid>JClozeStudentResponses</fieldlabelid><fielddata>';
 + for (var j=0; j<State[i].Guesses.length; j++){
 + if (j>0){Temp += '| ';}
 + Temp += State[i].Guesses[j] + ' ';
 + }
 +  Temp += '</fielddata></field>';
 + }
 + Temp += '</fields></hpnetresult>';
 + Detail = Temp;
 + }
 +}
 +
 +function CheckAnswers(){
 + if (Locked == true){return;}
 + SaveCurrentAnswers();
 + var AllCorrect = true;
 +
 +//Check each answer
 + for (var i = 0; i<I.length; i++){
 +
 + if (State[i].AnsweredCorrectly == false){
 +//If it's right, calculate its score
 + if (CheckAnswer(i, true) > -1){
 + var TotalChars = GetGapValue(i).length;
 + State[i].ItemScore = (TotalChars-State[i].HintsAndChecks)/TotalChars;
 + if (State[i].ClueGiven == true){State[i].ItemScore /= 2;}
 + if (State[i].ItemScore <0 ){State[i].ItemScore = 0;}
 + State[i].AnsweredCorrectly = true;
 +//Drop the correct answer into the page, replacing the text box
 + SetCorrectAnswer(i, GetGapValue(i));
 + }
 + else{
 +//Otherwise, increment the hints for this item, as a penalty
 + State[i].HintsAndChecks++;
 +
 +//then set the flag
 + AllCorrect = false;
 + }
 + }
 + }
 +
 +//Calculate the total score
 + var TotalScore = 0;
 + for (i=0; i<State.length; i++){
 + TotalScore += State[i].ItemScore;
 + }
 + TotalScore = Math.floor((TotalScore * 100)/I.length);
 +
 +//Compile the output
 + Output = '';
 +
 + if (AllCorrect == true){
 + Output = Correct + '<br />';
 + }
 +
 + Output += YourScoreIs + ' ' + TotalScore + '%.<br />';
 + if (AllCorrect == false){
 + Output += Incorrect;
 + }
 + ShowMessage(Output);
 + setTimeout('WriteToInstructions(Output)', 50);
 +
 + Score = TotalScore;
 + CompileGuesses();
 +
 + if ((AllCorrect == true)||(Finished == true)){
 +
 +
 +
 + TimeOver = true;
 + Locked = true;
 + Finished = true;
 + setTimeout('Finish()', SubmissionTimeout);
 + }
 +
 +}
 +
 +function TrackFocus(BoxNumber){
 + CurrentWord = BoxNumber;
 + InTextBox = true;
 +}
 +
 +function LeaveGap(){
 + InTextBox = false;
 +}
 +
 +function CheckBeginning(Guess, Answer){
 + var OutString = '';
 + var i = 0;
 + var UpperGuess = '';
 + var UpperAnswer = '';
 +
 + if (CaseSensitive == false) {
 + UpperGuess = Guess.toUpperCase();
 + UpperAnswer = Answer.toUpperCase();
 + }
 + else {
 + UpperGuess = Guess;
 + UpperAnswer = Answer;
 + }
 +
 + while (UpperGuess.charAt(i) == UpperAnswer.charAt(i)) {
 + OutString += Guess.charAt(i);
 + i++;
 + }
 + OutString += Answer.charAt(i);
 + return OutString;
 +}
 +
 +function GetGapValue(GNum){
 + var RetVal = '';
 + if ((GNum<0)||(GNum>=I.length)){return RetVal;}
 + if (document.getElementById('Gap' + GNum) != null){
 + RetVal = document.getElementById('Gap' + GNum).value;
 + RetVal = TrimString(RetVal);
 + }
 + else{
 + RetVal = State[GNum].Guesses[State[GNum].Guesses.length-1];
 + }
 + return RetVal;
 +}
 +
 +function SetGapValue(GNum, Val){
 + if ((GNum<0)||(GNum>=I.length)){return;}
 + if (document.getElementById('Gap' + GNum) != null){
 + document.getElementById('Gap' + GNum).value = Val;
 + document.getElementById('Gap' + GNum).focus();
 + }
 +}
 +
 +function SetCorrectAnswer(GNum, Val){
 + if ((GNum<0)||(GNum>=I.length)){return;}
 + if (document.getElementById('GapSpan' + GNum) != null){
 + document.getElementById('GapSpan' + GNum).innerHTML = Val;
 + }
 +}
 +
 +function FindCurrent() {
 + var x = 0;
 + FoundCurrent = -1;
 +
 +//Test the current word:
 +//If its state is not set to already correct, check the word.
 + if (State[CurrentWord].AnsweredCorrectly == false){
 + if (CheckAnswer(CurrentWord, false) < 0){
 + return CurrentWord;
 + }
 + }
 +
 + x=CurrentWord + 1;
 + while (x<I.length){
 + if (State[x].AnsweredCorrectly == false){
 + if (CheckAnswer(x, false) < 0){
 + return x;
 + }
 + }
 + x++;
 + }
 +
 + x = 0;
 + while (x<CurrentWord){
 + if (State[x].AnsweredCorrectly == false){
 + if (CheckAnswer(x, false) < 0){
 + return x;
 + }
 + }
 + x++;
 + }
 + return FoundCurrent;
 +}
 +
 +function CheckAnswer(GapNum, MarkAnswer){
 + var Guess = GetGapValue(GapNum);
 + var UpperGuess = '';
 + var UpperAnswer = '';
 + if (CaseSensitive == false){
 + UpperGuess = Guess.toUpperCase();
 + }
 + else{
 + UpperGuess = Guess;
 + }
 + var Match = -1;
 + for (var i = 0; i<I[GapNum][1].length; i++){
 + if (CaseSensitive == false){
 + UpperAnswer = I[GapNum][1][i][0].toUpperCase();
 + }
 + else{
 + UpperAnswer = I[GapNum][1][i][0];
 + }
 + if (TrimString(UpperGuess) == UpperAnswer){
 + Match = i;
 + if (MarkAnswer == true){
 + State[GapNum].AnsweredCorrectly = true;
 + }
 + }
 + }
 + return Match;
 +}
 +
 +function GetHint(GapNum){
 + Guess = GetGapValue(GapNum);
 +
 + if (CheckAnswer(GapNum, false) > -1){return ''}
 + RightBits = new Array();
 + for (var i=0; i<I[GapNum][1].length; i++){
 + RightBits[i] = CheckBeginning(Guess, I[GapNum][1][i][0]);
 + }
 + var RightOne = FindLongest(RightBits);
 + var Result = I[GapNum][1][RightOne][0].substring(0,RightBits[RightOne].length);
 +//Add another char if the last one is a space
 + if (Result.charAt(Result.length-1) == ' '){
 + Result = I[GapNum][1][RightOne][0].substring(0,RightBits[RightOne].length+1);
 + }
 + return Result;
 +}
 +
 +function ShowHint(){
 + if (document.getElementById('FeedbackDiv').style.display == 'block'){return;}
 + if (Locked == true){return;}
 + var CurrGap = FindCurrent();
 + if (CurrGap < 0){return;}
 +
 + var HintString = GetHint(CurrGap);
 +
 + if (HintString.length > 0){
 + SetGapValue(CurrGap, HintString);
 + State[CurrGap].HintsAndChecks += 1;
 + }
 + ShowMessage(GiveHint);
 +}
 +
 +function TypeChars(Chars){
 + var CurrGap = FindCurrent();
 + if (CurrGap < 0){return;}
 + if (document.getElementById('Gap' + CurrGap) != null){
 + SetGapValue(CurrGap, document.getElementById('Gap' + CurrGap).value + Chars);
 + }
 +}
 +
 +
 +
 +
 +
 +
 +
 +
 +//-->
 +
 +//]]>
 +
 +</script>
 +
 +
 +</head>
 +
 +<body onload="StartUp()" id="TheBody" >
 +
 +<!-- BeginTopNavButtons -->
 +
 +
 +<div class="NavButtonBar" id="TopNavBar">
 +
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)"  onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='contents.htm'; return false;"> Index </button>
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='nextpage.htm'; return false;">=&gt;</button>
 +
 +
 +</div>
 +
 +
 +
 +<!-- EndTopNavButtons -->
 +
 +<div class="Titles">
 + <h2 class="ExerciseTitle">Carl</h2>
 +
 +
 +
 +</div>
 +
 +<div id="InstructionsDiv" class="StdDiv">
 + <div id="Instructions"></div>
 +</div>
 +
 +
 +
 +
 +
 +<div id="MainDiv" class="StdDiv">
 +
 +<!-- These top buttons hidden; reveal if required -->
 +<!--
 +<button id="CheckButton1" class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="CheckAnswers()">&nbsp;Check&nbsp;</button>
 +
 +
 +<button class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="ShowHint()">&nbsp;Hint&nbsp;</button>
 +
 +
 + -->
 + 
 +<div id="ClozeDiv">
 +<form id="Cloze" method="post" action="" onsubmit="return false;">
 +<div class="ClozeBody">
 +&#x00AB;&#x00A0;J&#x2019;aime jouer au foot. J&#x2019;aime jouer sur <span class="GapSpan" id="GapSpan0"><input type="text" id="Gap0" onfocus="TrackFocus(0)" onblur="LeaveGap()" class="GapBox" size="12"></input></span>. J&#x2019;aime jouer avec les jolies filles. J&#x2019;aime aller en vacances aux Antilles. J&#x2019;aime les frites, le zouk et la dancehall. J&#x2019;aime regarder MTV Base. J&#x2019;aime mes <span class="GapSpan" id="GapSpan1"><input type="text" id="Gap1" onfocus="TrackFocus(1)" onblur="LeaveGap()" class="GapBox" size="7"></input></span> et mon fr&#x00E8;re. J&#x2019;aime mes potes, faire des nuits blanches. J&#x2019;aime la s&#x00E9;rie &#x00AB;&#x00A0;Tropiques Amers&#x00A0;&#x00BB;. J&#x2019;aime ma cit&#x00E9;. J&#x2019;aime la s&#x00E9;rie &#x00AB;&#x00A0;S&#x00E9;curit&#x00E9; Int&#x00E9;rieure&#x00A0;&#x00BB;. J&#x2019;aime <span class="GapSpan" id="GapSpan2"><input type="text" id="Gap2" onfocus="TrackFocus(2)" onblur="LeaveGap()" class="GapBox" size="6"></input></span> au resto et me taper des d&#x00E9;lires. J&#x2019;aime pas les gens qui pleurent pour rien. J&#x2019;aime pas la techno et la tecktonik. J&#x2019;aime pas les frimeurs et les frimeuses. J&#x2019;aime pas aller voir mon fr&#x00E8;re en <span class="GapSpan" id="GapSpan3"><input type="text" id="Gap3" onfocus="TrackFocus(3)" onblur="LeaveGap()" class="GapBox" size="6"></input></span>. J&#x2019;aime pas la &#x00AB;&#x00A0;Nouvelle Star&#x00A0;&#x00BB; et la &#x00AB;&#x00A0;Star Academy&#x00A0;&#x00BB;. J&#x2019;aime pas les hommes politiques, la guerre en Irak, les gothiques et les skaters. J&#x2019;aime pas les profs s&#x00E9;v&#x00E8;res. J&#x2019;aime pas les maths, les racistes et j&#x2019;aime pas Materazzi. J&#x2019;aimais pas le <span class="GapSpan" id="GapSpan4"><input type="text" id="Gap4" onfocus="TrackFocus(4)" onblur="LeaveGap()" class="GapBox" size="7"></input></span> Paul Eluard et j&#x2019;aime bien &#x00EA;tre ici.&#x00A0;&#x00BB;
 +</div>
 +</form>
 +</div>
 +
 +
 +
 +<button id="CheckButton2" class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="CheckAnswers()">&nbsp;Check&nbsp;</button>
 +
 +
 +<button class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="ShowHint()">&nbsp;Hint&nbsp;</button>
 +
 +
 +</div>
 +
 +
 +
 +<div class="Feedback" id="FeedbackDiv">
 +<div class="FeedbackText" id="FeedbackContent"></div>
 +<button id="FeedbackOKButton" class="FuncButton" onfocus="FuncBtnOver(this)" onblur="FuncBtnOut(this)" onmouseover="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="HideFeedback(); return false;">&nbsp;OK&nbsp;</button>
 +</div>
 +
 +<!-- BeginBottomNavButtons -->
 +
 +
 +<div class="NavButtonBar" id="BottomNavBar">
 +
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)"  onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='contents.htm'; return false;"> Index </button>
 +
 +
 +
 +<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='nextpage.htm'; return false;">=&gt;</button>
 +
 +
 +</div>
 +
 +
 +
 +<!-- EndBottomNavButtons -->
 +
 +<!-- BeginSubmissionForm -->
 +
 +<!-- EndSubmissionForm -->
 +
 +</body>
 +
 +</html>
 +
 +<fc #008000>
 +__Documents supplémentaires__</fc>
 +
 +-Lien autres dossiers: [[http://www.institutfrancais.de/IMG/pdf/Cinefete10_EntreLesMurs.pdf|lien]]
 +[[http://www.tv5.org/TV5Site/enseigner-apprendre-francais/enseigner_recherche_resultats.php?action=search&type%5Bt%5D=1%2C2%2C3%2C4%2C7&type%5Bi%5D=5%2C6&txt=entre+les+murs&x=0&y=0|lien]]
 +
 +
 +
 +