root/trunk/max-javahotpot-tutorial/tutorial/eng/jmix1.htm @ 35

Revision 35, 28.3 KB (checked in by max, 23 months ago)

mario.izquierdo
max-javahotpot-tutorial (3.1.max1)

  • New release
Line 
1<?xml version="1.0"?>
2       <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
3       <html xmlns="http://www.w3.org/1999/xhtml"
4             xml:lang="en"><head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Martin Holmes."></meta><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"></meta>
5
6<link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" />
7<meta name="DC:Creator" content="Martin Holmes" />
8<meta name="DC:Creator" content="UNREGISTERED" />
9<meta name="DC:Title" content="A Jumbled-Sentence Exercise made with JMix" />
10
11
12<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
13
14<title>
15A Jumbled-Sentence Exercise made with JMix
16</title>
17
18<!-- Made with executable version 6.0 Release 2 Build 0 -->
19
20<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
21
22
23
24<style type="text/css">
25
26
27/* This is the CSS stylesheet used in the exercise. */
28/* Elements in square brackets are replaced by data based on configuration settings when the exercise is built. */
29
30
31body{
32        font-family: Geneva,Arial;
33        background-color: #ffffff;
34        color: #000000;
35 
36        margin-right: 5%;
37        margin-left: 5%;
38        font-size: small;
39}
40
41p{
42        text-align: left;
43        margin: 0px;
44        font-size: small;
45}
46
47div,span,td{
48        font-size: small;
49        color: #000000;
50}
51
52.RTLText{
53        text-align: right;
54        font-size: 150%;
55        direction: rtl;
56        font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", Geneva,Arial;
57}
58
59.CentredRTLText{
60        text-align: center;
61        font-size: 150%;
62        direction: rtl;
63        font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", Geneva,Arial;
64}
65
66button p.RTLText{
67        text-align: center;
68}
69
70.RTLGapBox{
71        text-align: right;
72        font-size: 150%;
73        direction: rtl;
74        font-family: "Times New Roman", Geneva,Arial;
75}
76
77.Guess{
78        font-weight: bold;
79}
80
81.CorrectAnswer{
82        font-weight: bold;
83}
84
85div.Titles{
86        padding: 10px;
87        text-align: center;
88        color: #330000;
89}
90
91button{
92        display: inline;
93}
94
95.ExerciseTitle{
96        font-size: large;
97        color: #330000;
98}
99
100.ExerciseSubtitle{
101        color: #330000;
102}
103
104div#Timer{
105        padding: 6px;
106        margin-left: auto;
107        margin-right: auto;
108        text-align: center;
109}
110
111span#TimerText{
112        padding: 6px;
113        border-width: 1px;
114        border-style: solid;
115        font-weight: bold;
116        display: none;
117}
118
119span.Instructions{
120
121}
122
123div.ExerciseText{
124
125}
126
127.FeedbackText{
128        color: #330000;
129}
130
131span.LeftItem{
132        font-size: small;
133        color: #000000;
134}
135
136span.RightItem{
137        font-weight: bold;
138        font-size: small;
139        color: #000000;
140}
141
142span.CorrectMark{
143
144}
145
146div.Feedback {
147        background-color: #ffffff;
148        left: 33%;
149        width: 34%;
150        top: 33%;
151        z-index: 1;
152        border-style: solid;
153        border-width: 1px;
154        padding: 5px;
155        text-align: center;
156        color: #330000;
157        position: absolute;
158        display: none;
159        font-size: small;
160}
161
162
163
164
165div.ExerciseDiv{
166        color: #000000;
167}
168
169/* JMatch flashcard styles */
170table.FlashcardTable{
171        background-color: transparent;
172        color: #000000;
173        border-color: #000000;
174        margin-left: 5%;
175        margin-right: 5%;
176        margin-top: 2em;
177        margin-bottom: 2em;
178        width: 90%;
179        position: relative;
180        align: center;
181        padding: 0px;
182}
183
184table.FlashcardTable tr{
185        border-style: none;
186        margin: 0px;
187        padding: 0px;
188        background-color: #bfcaae;
189}
190
191table.FlashcardTable td.Showing{
192        font-size: large;
193        text-align: center;
194        width: 50%;
195        display: table-cell;
196        padding: 2em;
197        margin: 0px;
198        border-style: solid;
199        border-width: 1px;
200        color: #000000;
201        background-color: #bfcaae;
202}
203
204table.FlashcardTable td.Hidden{
205        display: none;
206}
207
208/* JMix styles */
209div#SegmentDiv{
210        margin-top: 2em;
211        margin-bottom: 2em;
212        text-align: center;
213}
214
215a.ExSegment{
216        font-size: medium;
217        font-weight: bold;
218        text-decoration: none;
219        color: #000000;
220}
221
222span.RemainingWordList{
223        font-style: italic;
224}
225
226div.DropLine {
227        position: absolute;
228        text-align: center;
229        border-bottom-style: solid;
230        border-bottom-width: 1px;
231        border-bottom-color: #330000;
232        width: 80%;
233}
234
235/* JCloze styles */
236
237input{
238        font-family: Geneva,Arial;
239        font-size: larger;
240}
241
242.ClozeWordList{
243        text-align: center;
244        font-weight: bold;
245}
246
247div.ClozeBody{
248        text-align: left;
249        margin-top: 2em;
250        margin-bottom: 2em;
251        line-height: 2.0
252}
253
254span.GapSpan{
255        font-weight: bold;
256}
257
258/* JCross styles */
259
260table.CrosswordGrid{
261        margin: auto auto 1em auto;
262        border-collapse: collapse;
263        padding: 0px;
264}
265
266table.CrosswordGrid td{
267        width: 1.5em;
268        height: 1.5em;
269        text-align: center;
270        vertical-align: middle;
271        font-size: large;
272        padding: 0px;
273        margin: 0px;
274        border-style: solid;
275        border-width: 1px;
276        border-color: #000000;
277}
278
279table.CrosswordGrid td.BlankCell{
280        background-color: #000000;
281        color: #000000;
282}
283
284table.CrosswordGrid td.LetterOnlyCell{
285        text-align: center;
286        vertical-align: middle;
287        background-color: #ffffff;
288        color: #000000;
289        font-weight: bold;
290}
291
292table.CrosswordGrid td.NumLetterCell{
293        text-align: left;
294        vertical-align: top;
295        background-color: #ffffff;
296        color: #000000;
297        padding: 1px;
298        font-weight: bold;
299}
300
301.NumLetterCellText{
302        cursor: pointer;
303}
304
305.GridNum{
306        vertical-align: super;
307        font-size: x-small;
308        font-weight: bold;
309        text-decoration: none;
310        color: #000000;
311}
312
313table#Clues{
314        margin: auto;
315        vertical-align: top;
316}
317
318table#Clues td{
319        vertical-align: top;
320}
321
322table.ClueList{
323  margin: auto;
324}
325
326td.ClueNum{
327        text-align: right;
328        font-weight: bold;
329        vertical-align: top;
330}
331
332td.Clue{
333        text-align: left;
334}
335
336div#ClueEntry{
337        text-align: left;
338        margin-bottom: 1em;
339}
340
341/* Keypad styles */
342
343div.Keypad{
344        text-align: center;
345}
346
347div.Keypad button{
348        font-family: Geneva,Arial;
349        font-size: 120%;
350        background-color: #ffffff;
351        color: #000000;
352        width: 2em;
353}
354
355/* JQuiz styles */
356
357div.QuestionNavigation{
358        text-align: center;
359}
360
361.QNum{
362        margin: 0em 1em 0.5em 1em;
363        font-weight: bold;
364        vertical-align: middle;
365}
366
367textarea{
368        font-family: Geneva,Arial;
369        font-size: larger;
370}
371
372.QuestionText{
373
374}
375
376.Answer{
377        font-size: 120%;
378        letter-spacing: 0.1em;
379}
380
381.Highlight{
382        color: #000000;
383        background-color: #ffff00;
384        font-weight: bold;
385        font-size: 120%;
386}
387
388ol.QuizQuestions{
389        text-align: left;
390        list-style-type: none;
391}
392
393li.QuizQuestion{
394        padding: 1em;
395        border-style: solid;
396        border-width: 0px 0px 1px 0px;
397}
398
399ol.MCAnswers{
400        text-align: left;
401        list-style-type: upper-alpha;
402        padding: 1em;
403}
404
405ol.MCAnswers li{
406        margin-bottom: 1em;
407}
408
409ol.MSelAnswers{
410        text-align: left;
411        list-style-type: lower-alpha;
412        padding: 1em;
413}
414
415div.ShortAnswer{
416        padding: 1em;
417}
418
419div.StdDiv{
420        background-color: #bfcaae;
421        text-align: center;
422        font-size: small;
423        color: #000000;
424        padding: 8px;
425        border-style: solid;
426        border-width: 1px 1px 1px 1px;
427        border-color: #000000;
428        margin: 1px;
429}
430
431.FuncButton {
432        text-align: center;
433        border-style: solid;
434
435        border-left-color: #dfe4d6;
436        border-top-color: #dfe4d6;
437        border-right-color: #5f6557;
438        border-bottom-color: #5f6557;
439        color: #000000;
440        background-color: #bfcaae;
441
442        border-width: 2px;
443        padding: 3px 6px 3px 6px;
444        cursor: pointer;
445}
446
447.FuncButtonUp {
448        color: #bfcaae;
449        text-align: center;
450        border-style: solid;
451
452        border-left-color: #dfe4d6;
453        border-top-color: #dfe4d6;
454        border-right-color: #5f6557;
455        border-bottom-color: #5f6557;
456
457        background-color: #000000;
458        color: #bfcaae;
459        border-width: 2px;
460        padding: 3px 6px 3px 6px;
461        cursor: pointer;
462}
463
464.FuncButtonDown {
465        color: #bfcaae;
466        text-align: center;
467        border-style: solid;
468
469        border-left-color: #5f6557;
470        border-top-color: #5f6557;
471        border-right-color: #dfe4d6;
472        border-bottom-color: #dfe4d6;
473        background-color: #000000;
474        color: #bfcaae;
475
476        border-width: 2px;
477        padding: 3px 6px 3px 6px;
478        cursor: pointer;
479}
480
481/*BeginNavBarStyle*/
482
483div.NavButtonBar{
484        background-color: #008000;
485        text-align: center;
486        margin: 2px 0px 2px 0px;
487        clear: both;
488        font-size: small;
489}
490
491.NavButton {
492        border-style: solid;
493       
494        border-left-color: #7fbf7f;
495        border-top-color: #7fbf7f;
496        border-right-color: #004000;
497        border-bottom-color: #004000;
498        background-color: #008000;
499        color: #ffffff;
500
501        border-width: 2px;
502        cursor: pointer;       
503}
504
505.NavButtonUp {
506        border-style: solid;
507
508        border-left-color: #7fbf7f;
509        border-top-color: #7fbf7f;
510        border-right-color: #004000;
511        border-bottom-color: #004000;
512        color: #008000;
513        background-color: #ffffff;
514
515        border-width: 2px;
516        cursor: pointer;       
517}
518
519.NavButtonDown {
520        border-style: solid;
521
522        border-left-color: #004000;
523        border-top-color: #004000;
524        border-right-color: #7fbf7f;
525        border-bottom-color: #7fbf7f;
526        color: #008000;
527        background-color: #ffffff;
528
529        border-width: 2px;
530        cursor: pointer;       
531}
532
533/*EndNavBarStyle*/
534
535a{
536        color: #0000ff;
537}
538
539a: visited{
540        color: #0000cc;
541}
542
543a:hover{
544        color: #0000ff;
545}
546
547div.CardStyle {
548        position: absolute;
549        font-family: Geneva,Arial;
550        font-size: small;
551        padding: 5px;
552        border-style: solid;
553        border-width: 1px;
554        color: #000000;
555        background-color: #bfcaae;
556        left: -50px;
557        top: -50px;
558        overflow: visible;
559}
560
561.rtl{
562        text-align: right;
563        font-size: large;
564}
565
566
567</style>
568
569<script type="text/javascript">
570
571//<![CDATA[
572
573<!--
574
575
576function Client(){
577//if not a DOM browser, hopeless
578        this.min = false; if (document.getElementById){this.min = true;};
579
580        this.ua = navigator.userAgent;
581        this.name = navigator.appName;
582        this.ver = navigator.appVersion; 
583
584//Get data about the browser
585        this.mac = (this.ver.indexOf('Mac') != -1);
586        this.win = (this.ver.indexOf('Windows') != -1);
587
588//Look for Gecko
589        this.gecko = (this.ua.indexOf('Gecko') > 1);
590        if (this.gecko){
591                this.geckoVer = parseInt(this.ua.substring(this.ua.indexOf('Gecko')+6, this.ua.length));
592                if (this.geckoVer < 20020000){this.min = false;}
593        }
594       
595//Look for Firebird
596        this.firebird = (this.ua.indexOf('Firebird') > 1);
597       
598//Look for Safari
599        this.safari = (this.ua.indexOf('Safari') > 1);
600        if (this.safari){
601                this.gecko = false;
602        }
603       
604//Look for IE
605        this.ie = (this.ua.indexOf('MSIE') > 0);
606        if (this.ie){
607                this.ieVer = parseFloat(this.ua.substring(this.ua.indexOf('MSIE')+5, this.ua.length));
608                if (this.ieVer < 5.5){this.min = false;}
609        }
610       
611//Look for Opera
612        this.opera = (this.ua.indexOf('Opera') > 0);
613        if (this.opera){
614                this.operaVer = parseFloat(this.ua.substring(this.ua.indexOf('Opera')+6, this.ua.length));
615                if (this.operaVer < 7.04){this.min = false;}
616        }
617        if (this.min == false){
618                alert('Your browser may not be able to handle this page.');
619        }
620       
621//Special case for the horrible ie5mac
622        this.ie5mac = (this.ie&&this.mac&&(this.ieVer<6));
623}
624
625var C = new Client();
626
627//for (prop in C){
628//      alert(prop + ': ' + C[prop]);
629//}
630
631
632
633//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
634
635//[strNavBarJS]
636function NavBtnOver(Btn){
637        if (Btn.className != 'NavButtonDown'){Btn.className = 'NavButtonUp';}
638}
639
640function NavBtnOut(Btn){
641        Btn.className = 'NavButton';
642}
643
644function NavBtnDown(Btn){
645        Btn.className = 'NavButtonDown';
646}
647//[/strNavBarJS]
648
649function FuncBtnOver(Btn){
650        if (Btn.className != 'FuncButtonDown'){Btn.className = 'FuncButtonUp';}
651}
652
653function FuncBtnOut(Btn){
654        Btn.className = 'FuncButton';
655}
656
657function FuncBtnDown(Btn){
658        Btn.className = 'FuncButtonDown';
659}
660
661function FocusAButton(){
662        if (document.getElementById('CheckButton1') != null){
663                document.getElementById('CheckButton1').focus();
664        }
665        else{
666                if (document.getElementById('CheckButton2') != null){
667                        document.getElementById('CheckButton2').focus();
668                }
669                else{
670                        document.getElementsByTagName('button')[0].focus();
671                }
672        }
673}
674
675
676
677
678//CODE FOR HANDLING DISPLAY OF POPUP FEEDBACK BOX
679
680var topZ = 1000;
681
682function ShowMessage(Feedback){
683        var Output = Feedback + '<br /><br />';
684        document.getElementById('FeedbackContent').innerHTML = Output;
685        var FDiv = document.getElementById('FeedbackDiv');
686        topZ++;
687        FDiv.style.zIndex = topZ;
688        FDiv.style.top = TopSettingWithScrollOffset(30) + 'px';
689//IE can't focus a hidden div; Moz needs to focus before display to avoid jumping
690        if (C.gecko){
691                document.getElementById('FeedbackOKButton').focus();
692        }
693        FDiv.style.display = 'block';
694
695        ShowElements(false, 'input');
696        ShowElements(false, 'select');
697        ShowElements(false, 'object');
698        if (C.ie){
699                document.getElementById('FeedbackOKButton').focus();
700        }
701       
702//
703}
704
705function ShowElements(Show, TagName){
706//Special for IE bug -- hide all the form elements that will show through the popup
707        if (C.ie){
708                var Els = document.getElementsByTagName(TagName);
709                for (var i=0; i<Els.length; i++){
710                        if (Show == true){
711                                Els[i].style.display = 'inline';
712                        }
713                        else{
714                                Els[i].style.display = 'none';
715                        }
716                }
717        }
718}
719
720function HideFeedback(){
721        document.getElementById('FeedbackDiv').style.display = 'none';
722        ShowElements(true, 'input');
723        ShowElements(true, 'select');
724        ShowElements(true, 'object');
725        if (Finished == true){
726                Finish();
727        }
728}
729
730
731//GENERAL UTILITY FUNCTIONS AND VARIABLES
732
733//PAGE DIMENSION FUNCTIONS
734function PageDim(){
735//Get the page width and height
736        this.W = 600;
737        this.H = 400;
738        this.W = document.getElementsByTagName('body')[0].clientWidth;
739        this.H = document.getElementsByTagName('body')[0].clientHeight;
740}
741
742var pg = null;
743
744function GetPageXY(El) {
745        var XY = {x: 0, y: 0};
746        while(El){
747                XY.x += El.offsetLeft;
748                XY.y += El.offsetTop;
749                El = El.offsetParent;
750        }
751        return XY;
752}
753
754function GetScrollTop(){
755        if (document.documentElement && document.documentElement.scrollTop){
756                return document.documentElement.scrollTop;
757        }
758        else{
759                if (document.body){
760                        return document.body.scrollTop;
761                }
762                else{
763                        return window.pageYOffset;
764                }
765        }
766}
767
768function GetViewportHeight(){
769        if (window.innerWidth){
770                return window.innerWidth;
771        }
772        else{
773                return document.getElementsByTagName('body')[0].clientHeight;
774        }
775}
776
777function TopSettingWithScrollOffset(TopPercent){
778        var T = Math.floor(GetViewportHeight() * (TopPercent/100));
779        return GetScrollTop() + T;
780}
781
782//CODE FOR AVOIDING LOSS OF DATA WHEN BACKSPACE KEY INVOKES history.back()
783var InTextBox = false;
784
785function SuppressBackspace(e){
786        if (InTextBox == true){return;}
787        if (C.ie) {
788                thisKey = window.event.keyCode;
789        }
790        else {
791                thisKey = e.keyCode;
792        }
793
794        var Suppress = false;
795
796        if (thisKey == 8) {
797                Suppress = true;
798        }
799
800        if (Suppress == true){
801                if (C.ie){
802                        window.event.returnValue = false;       
803                        window.event.cancelBubble = true;
804                }
805                else{
806                        e.preventDefault();
807                }
808        }
809}
810
811if (C.ie){
812        document.attachEvent('onkeydown',SuppressBackspace);
813        window.attachEvent('onkeydown',SuppressBackspace);
814}
815else{
816        window.addEventListener('keypress',SuppressBackspace,false);
817}
818
819function ReduceItems(InArray, ReduceToSize){
820        var ItemToDump=0;
821        var j=0;
822        while (InArray.length > ReduceToSize){
823                ItemToDump = Math.floor(InArray.length*Math.random());
824                InArray.splice(ItemToDump, 1);
825        }
826}
827
828function Shuffle(InArray){
829        Temp = new Array();
830        var Len = InArray.length;
831
832        var j = Len;
833
834        for (var i=0; i<Len; i++){
835                Temp[i] = InArray[i];
836        }
837
838        for (i=0; i<Len; i++){
839                Num = Math.floor(j  *  Math.random());
840                InArray[i] = Temp[Num];
841
842                for (var k=Num; k < j; k++) {
843                        Temp[k] = Temp[k+1];
844                }
845                j--;
846        }
847        return InArray;
848}
849
850function WriteToInstructions(Feedback) {
851//      Feedback = '<span class="FeedbackText">' + Feedback + '</span>';
852        document.getElementById('InstructionsDiv').innerHTML = Feedback;
853
854}
855
856
857
858
859function EscapeDoubleQuotes(InString){
860        return InString.replace(/"/g, '&quot;')
861}
862
863function FocusAButton(){
864        if (document.getElementById('CheckButton1') != null){
865                document.getElementById('CheckButton1').focus();
866        }
867        else{
868                document.getElementsByTagName('button')[0].focus();
869        }
870}
871
872function TrimString(InString){
873        var x = 0;
874
875        if (InString.length != 0) {
876                while ((InString.charAt(InString.length - 1) == '\u0020') || (InString.charAt(InString.length - 1) == '\u000A') || (InString.charAt(InString.length - 1) == '\u000D')){
877                        InString = InString.substring(0, InString.length - 1)
878                }
879
880                while ((InString.charAt(0) == '\u0020') || (InString.charAt(0) == '\u000A') || (InString.charAt(0) == '\u000D')){
881                        InString = InString.substring(1, InString.length)
882                }
883
884                while (InString.indexOf('  ') != -1) {
885                        x = InString.indexOf('  ')
886                        InString = InString.substring(0, x) + InString.substring(x+1, InString.length)
887                 }
888
889                return InString;
890        }
891
892        else {
893                return '';
894        }
895}
896
897function FindLongest(InArray){
898        if (InArray.length < 1){return -1;}
899
900        var Longest = 0;
901        for (var i=1; i<InArray.length; i++){
902                if (InArray[i].length > InArray[Longest].length){
903                        Longest = i;
904                }
905        }
906        return Longest;
907}
908
909//UNICODE CHARACTER FUNCTIONS
910function IsCombiningDiacritic(CharNum){
911        var Result = (((CharNum >= 0x0300)&&(CharNum <= 0x370))||((CharNum >= 0x20d0)&&(CharNum <= 0x20ff)));
912        Result = Result || (((CharNum >= 0x3099)&&(CharNum <= 0x309a))||((CharNum >= 0xfe20)&&(CharNum <= 0xfe23)));
913        return Result;
914}
915
916function IsCJK(CharNum){
917        return ((CharNum >= 0x3000)&&(CharNum < 0xd800));
918}
919
920//SETUP FUNCTIONS
921//BROWSER WILL REFILL TEXT BOXES FROM CACHE IF NOT PREVENTED
922function ClearTextBoxes(){
923        var NList = document.getElementsByTagName('input');
924        for (var i=0; i<NList.length; i++){
925                if (NList[i].id.indexOf('Guess') > -1){
926                        NList[i].value = '';
927                }
928                if (NList[i].id.indexOf('Chk') > -1){
929                        NList[i].checked = '';
930                }
931        }
932}
933
934//EXTENSION TO ARRAY OBJECT
935function Array_IndexOf(Input){
936        var Result = -1;
937        for (var i=0; i<this.length; i++){
938                if (this[i] == Input){
939                        Result = i;
940                }
941        }
942        return Result;
943}
944Array.prototype.indexOf = Array_IndexOf;
945
946//IE HAS RENDERING BUG WITH BOTTOM NAVBAR
947function RemoveBottomNavBarForIE(){
948        if (C.ie){
949                if (document.getElementById('BottomNavBar') != null){
950                        document.getElementById('TheBody').removeChild(document.getElementById('BottomNavBar'));
951                }
952        }
953}
954
955
956
957
958//HOTPOTNET-RELATED CODE
959
960var HPNStartTime = (new Date()).getTime();
961var SubmissionTimeout = 30000;
962var Detail = ''; //Global that is used to submit tracking data
963
964function Finish(){
965//If there's a form, fill it out and submit it
966        if (document.store != null){
967                Frm = document.store;
968                Frm.starttime.value = HPNStartTime;
969                Frm.endtime.value = (new Date()).getTime();
970                Frm.mark.value = Score;
971                Frm.detail.value = Detail;
972                Frm.submit();
973        }
974}
975
976
977//JMIX STANDARD OUTPUT FORMAT CODE
978
979
980var CorrectResponse = 'Correct!';
981var IncorrectResponse = 'Sorry! Try again.';
982var TheseAnswersToo = 'These answers are also correct:';
983var ThisMuchCorrect = 'This much of your answer is correct:';
984var RemainingWords = 'Remaining words:';
985var NextCorrect = 'The next correct part is: ';
986var YourScoreIs = 'Your score is ';
987var CapitalizeFirst = true;
988var DefaultResponse = '[strDefaultResponse]';
989var Penalties = 0;
990var Finished = false;
991var Score = 0;
992
993
994var SegmentTemplate = '&nbsp; &nbsp;<a class="ExSegment" href="javascript:void(0)" onclick="AddSegment([SegmentNumber])" title="Click on words to add them to the sentence.">[CurrentSegment]</a>&nbsp; &nbsp;';
995
996var Exercise = '';
997
998var Punctuation = '\u002E';
999
1000var Openers = '';
1001
1002var Guesses = new Array();
1003var Remaining = new Array();
1004var CorrectParts = new Array();
1005
1006var ClosestMatch = 0;
1007
1008var LowerString='';
1009var UpperString='';
1010
1011var Output = '';
1012
1013var Segments = new Array();
1014Segments[0] = new Array();
1015Segments[0][0] = '\u0048\u006F\u0074\u0020\u0050\u006F\u0074\u0061\u0074\u006F\u0065\u0073';
1016Segments[0][1] = 1;
1017Segments[0][2] = 0;
1018Segments[1] = new Array();
1019Segments[1][0] = '\u0061\u0076\u0061\u0069\u006C\u0061\u0062\u006C\u0065';
1020Segments[1][1] = 3;
1021Segments[1][2] = 0;
1022Segments[2] = new Array();
1023Segments[2][0] = '\u004D\u0061\u0063\u0069\u006E\u0074\u006F\u0073\u0068';
1024Segments[2][1] = 7;
1025Segments[2][2] = 0;
1026Segments[3] = new Array();
1027Segments[3][0] = '\u0057\u0069\u006E\u0064\u006F\u0077\u0073';
1028Segments[3][1] = 5;
1029Segments[3][2] = 0;
1030Segments[4] = new Array();
1031Segments[4][0] = '\u0061\u006E\u0064';
1032Segments[4][1] = 6;
1033Segments[4][2] = 0;
1034Segments[5] = new Array();
1035Segments[5][0] = '\u0066\u006F\u0072';
1036Segments[5][1] = 4;
1037Segments[5][2] = 0;
1038Segments[6] = new Array();
1039Segments[6][0] = '\u0069\u0073';
1040Segments[6][1] = 2;
1041Segments[6][2] = 0;
1042Segments[7] = new Array();
1043Segments[7][0] = '\u002E';
1044Segments[7][1] = 8;
1045Segments[7][2] = 0;
1046
1047
1048var GuessSequence = new Array();
1049
1050var Answers = new Array();
1051Answers[0] = new Array(1,2,3,4,5,6,7,8);
1052Answers[1] = new Array(1,2,3,4,7,6,5,8);
1053
1054
1055function WriteToGuess(Feedback) {
1056        Feedback = '<span class="FeedbackText">' + Feedback + '</span>';
1057        document.getElementById('GuessDiv').innerHTML = Feedback;
1058
1059}
1060
1061function Restart(){
1062        Penalties = 0;
1063        GuessSequence.length = 0;
1064        Segments = Shuffle(Segments);
1065        BuildCurrGuess();
1066        WriteToGuess(RemainingWords + '<br /><span class="RemainingWordList">' + RemainingList + '</span>');
1067        BuildExercise();
1068        DisplayExercise(Exercise);
1069}
1070
1071function Undo(){
1072        if (GuessSequence.length < 1){
1073                return;
1074        }
1075        GuessSequence.length = GuessSequence.length - 1;
1076        BuildCurrGuess();
1077        BuildExercise();
1078        DisplayExercise(Exercise);
1079        WriteToGuess('<span class="Answer">' + Output + '</span><br /><br />' + RemainingWords + '<br /><span class="RemainingWordList">' + RemainingList + '</span>');
1080}
1081
1082function AddSegment(SegNum){
1083
1084        GuessSequence[GuessSequence.length] = SegNum;
1085        BuildCurrGuess();
1086        WriteToGuess('<span class="Answer">' + Output + '</span>');
1087        BuildExercise();
1088        DisplayExercise(Exercise);
1089}
1090
1091function BuildCurrGuess(){
1092
1093        var i = 0;
1094        var j = 0;
1095        var NewSeg = '';
1096
1097//first, create arrays of all the segments guessed so far and those not yet used
1098        GuessSegs = new Array();
1099        GuessSegs.length = 0;
1100
1101//set the "used" markers all to 0
1102        for (i=0; i<Segments.length; i++){
1103                Segments[i][2] = 0;
1104        }
1105
1106        for (i=0; i<GuessSequence.length; i++){
1107                for (j=0; j<Segments.length; j++){
1108                        if ((Segments[j][1] == GuessSequence[i])&&(Segments[j][2] == 0)){
1109                                GuessSegs[GuessSegs.length] = Segments[j][0];
1110                                Segments[j][2] = 1;
1111                                break;
1112                        }
1113                }
1114        }
1115
1116//Create the list of unused segments
1117        RemainingList = '';
1118        for (i=0; i<Segments.length; i++){
1119                if (Segments[i][2] == 0){
1120                        RemainingList += Segments[i][0] + '&nbsp; &nbsp;&nbsp;';
1121                }
1122        }
1123       
1124//now concatenate the segments, adding spaces where appropriate;
1125        Output = CompileString(GuessSequence);
1126}
1127
1128function CompileString(InArray){
1129        var OutString = '';
1130        var i = 0;
1131        OutArray = new Array();
1132
1133        for (i=0; i<InArray.length; i++){
1134                OutArray[OutArray.length] = FindSegment(InArray[i]);
1135        }
1136
1137        if (OutArray.length > 0){
1138                OutString = OutArray[0];
1139        }
1140        else{
1141                OutString = '';
1142        }
1143        var Spacer = '';
1144
1145        for (i=1; i<OutArray.length; i++){
1146                Spacer = ' ';
1147                if ((Openers.indexOf(OutString.charAt(OutString.length-1)) > -1)||(Punctuation.indexOf(OutArray[i].charAt(0)) > -1)){
1148                        Spacer = '';
1149                }
1150                OutString = OutString + Spacer + OutArray[i];           
1151        }
1152
1153//Capitalize the first letter if necessary
1154        if (CapitalizeFirst == true){
1155                i = 0;
1156                if ((Openers.indexOf(OutString.charAt(i))>-1)||(OutString.charAt(i) == ' ')){
1157                        i++;
1158                }
1159                if ((Openers.indexOf(OutString.charAt(i))>-1)||(OutString.charAt(i) == ' ')){
1160                        i++;
1161                }
1162                var Temp = OutString.charAt(i);
1163                Temp = Temp.toUpperCase();
1164                OutString = OutString.substring(0, i) + Temp + OutString.substring(i+1, OutString.length);
1165        }
1166        return OutString;
1167}
1168function CheckAnswer(CheckType){
1169
1170        if (GuessSequence.length < 1){
1171                if (CheckType == 1){
1172                        ShowMessage(NextCorrect + '<br /><span class="Answer">' + FindSegment(Answers[0][0]) + '</span>');
1173                        Penalties++;
1174                }
1175                return;
1176        }
1177
1178        var i = 0;
1179        var j = 0;
1180        var k = 0;
1181        var WellDone = '';
1182        var WhichCorrect = -1;
1183        var TryAgain = '';
1184        var LongestCorrectBit = '';
1185        TempCorrect = new Array();
1186        LongestCorrect = new Array();
1187        var TempHint = '';
1188        var HintToReturn = 1;
1189        var OtherAnswers = '';
1190
1191        for (i=0; i<Answers.length; i++){
1192                TempCorrect.length = 0;
1193                for (j=0; j<Answers[i].length; j++){
1194                        if (Answers[i][j] == GuessSequence[j]){
1195                                TempCorrect[j] = GuessSequence[j];
1196                        }
1197                        else{
1198                                TempHint = Answers[i][j];
1199                                break;
1200                        }
1201                }
1202                if ((TempCorrect.length == GuessSequence.length)&&(TempCorrect.length == Answers[i].length)){
1203
1204                        WhichCorrect = i;
1205                        break;
1206                }
1207                else{
1208                        if (TempCorrect.length > LongestCorrect.length){
1209                                LongestCorrect.length = 0;
1210                                for (k=0; k<TempCorrect.length; k++){
1211                                        LongestCorrect[k] = TempCorrect[k];
1212                                }
1213                                HintToReturn = TempHint;
1214                        }
1215                }       
1216        }
1217        if (WhichCorrect > -1){
1218                for (i=0; i<Answers.length; i++){
1219                        if (i!=WhichCorrect){
1220                                OtherAnswers += '<br />' + CompileString(Answers[i]);
1221                        }
1222                }
1223
1224                WellDone = '<span class="Answer">' + Output + '</span><br /><br />' + CorrectResponse + '<br />';
1225
1226//Do score calculation here
1227                Score = Math.floor(((Segments.length-Penalties) * 100)/Segments.length);
1228                WellDone += YourScoreIs + ' ' + Score + '%.<br />';
1229
1230
1231
1232                WriteToGuess(WellDone);
1233                ShowMessage(WellDone);
1234
1235                Finished = true;
1236                setTimeout('Finish()', SubmissionTimeout);
1237                return;
1238        }
1239
1240        else{
1241                TryAgain = '<span class="Answer">' + CompileString(GuessSequence) + '</span><br /><br />';
1242                Penalties++;
1243                if (CheckType == 0){
1244                        TryAgain += IncorrectResponse + '<br />';
1245                }
1246
1247                if (LongestCorrect.length > 0){
1248
1249                        LongestCorrectBit = CompileString(LongestCorrect);
1250                        GuessSequence.length = LongestCorrect.length;
1251                        TryAgain += ThisMuchCorrect + '<br /><span class="Answer">' + LongestCorrectBit + '</span><br />';
1252                }
1253
1254                if (CheckType == 1){
1255                        TryAgain += NextCorrect + '<br /><span class="Answer">' + FindSegment(HintToReturn) + '</span>';
1256                }
1257
1258                BuildCurrGuess();
1259                BuildExercise();
1260                DisplayExercise(Exercise);
1261                ShowMessage(TryAgain);
1262
1263        }
1264}
1265
1266function FindSegment(SegID){
1267        var Seg = '';
1268        for (var i=0; i<Segments.length; i++){
1269                if (Segments[i][1] == SegID){
1270                        Seg = Segments[i][0];
1271                        break;
1272                }
1273        }
1274        return Seg;
1275}
1276
1277function StartUp(){
1278        RemoveBottomNavBarForIE();
1279
1280
1281
1282
1283
1284        Segments = Shuffle(Segments);
1285
1286//Build and show the exercise
1287        BuildExercise();
1288        DisplayExercise(Exercise);     
1289       
1290
1291}
1292
1293
1294function BuildExercise(){
1295        Exercise = '';
1296
1297        var SegRow = '';
1298        var TempRow = '';
1299
1300        for (var i=0; i<Segments.length; i++){
1301//if the segment hasn't been used yet
1302                if (Segments[i][2] == 0){
1303                        TempRow = SegmentTemplate;
1304                        TempRow = TempRow.replace(/\[SegmentNumber\]/g, Segments[i][1]);
1305                        TempRow = TempRow.replace(/\[CurrentSegment\]/g, Segments[i][0]);
1306                        SegRow += TempRow;
1307                }
1308        }
1309
1310//Make it into a table
1311        Exercise = SegRow;
1312}
1313
1314function DisplayExercise(StuffToDisplay){
1315        document.getElementById('SegmentDiv').innerHTML = StuffToDisplay;
1316        FocusAButton();
1317
1318}
1319
1320
1321
1322
1323
1324
1325
1326
1327//-->
1328
1329//]]>
1330
1331</script>
1332
1333
1334</head>
1335
1336<body onload="StartUp()" id="TheBody">
1337
1338<!-- BeginTopNavButtons -->
1339
1340
1341<div class="NavButtonBar" id="TopNavBar">
1342
1343
1344
1345
1346
1347
1348<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='jmix2.htm'; return false;">Next example</button>
1349
1350
1351</div>
1352
1353
1354
1355<!-- EndTopNavButtons -->
1356
1357<div class="Titles">
1358        <h2 class="ExerciseTitle">A Jumbled-Sentence Exercise made with JMix</h2>
1359        <h3 class="ExerciseSubtitle">Mixed-up sentence exercise</h3>
1360
1361
1362</div>
1363
1364<div id="InstructionsDiv" class="StdDiv">
1365        <p id="Instructions">Put the parts in order to form a sentence. Click on a part to add it to the answer. When you think your sentence is correct, click on "Check" to check your answer. If you get stuck, click on "Hint" to find out the next correct part.</p>
1366</div>
1367
1368
1369
1370<div id="GuessDiv" class="StdDiv">
1371
1372</div>
1373
1374<div id="MainDiv" class="StdDiv">
1375
1376<button id="CheckButton1" class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="CheckAnswer(0)">&nbsp;Check&nbsp;</button>
1377
1378
1379<button class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="Undo()">&nbsp;Undo&nbsp;</button>
1380
1381
1382
1383<button class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="Restart()">&nbsp;Restart&nbsp;</button>
1384
1385
1386
1387<button class="FuncButton" onmouseover="FuncBtnOver(this)" onfocus="FuncBtnOver(this)" onmouseout="FuncBtnOut(this)" onblur="FuncBtnOut(this)" onmousedown="FuncBtnDown(this)" onmouseup="FuncBtnOut(this)" onclick="CheckAnswer(1)">&nbsp;Hint&nbsp;</button>
1388
1389
1390<div id="SegmentDiv">
1391
1392</div>
1393
1394</div>
1395
1396
1397
1398<div class="Feedback" id="FeedbackDiv">
1399<div class="FeedbackText" id="FeedbackContent"></div>
1400<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>
1401</div>
1402
1403<!-- BeginBottomNavButtons -->
1404
1405
1406<div class="NavButtonBar" id="BottomNavBar">
1407
1408
1409
1410
1411
1412
1413<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='jmix2.htm'; return false;">Next example</button>
1414
1415
1416</div>
1417
1418
1419
1420<!-- EndBottomNavButtons -->
1421
1422<!-- BeginSubmissionForm -->
1423
1424<!-- EndSubmissionForm -->
1425
1426</body>
1427
1428</html>
Note: See TracBrowser for help on using the browser.