tag:blogger.com,1999:blog-8394939428697627212024-03-26T23:37:51.529-07:00EJERCICIOS PARA PRACTICAR TU INGLÉSFrancisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.comBlogger575125tag:blogger.com,1999:blog-839493942869762721.post-83593131569325485342021-10-27T10:35:00.002-07:002021-10-27T10:35:15.052-07:00MICHAEL JACKSON - THRILLER<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/Z85lxckrtzg" width="320" youtube-src-id="Z85lxckrtzg"></iframe></div><br /><p style="text-align: center;"><br /></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="MICHAEL JACKSON - THRILLER" />
<title>
MICHAEL JACKSON - THRILLER
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u006D\u0069\u0064\u006E\u0069\u0067\u0068\u0074';
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\u0061\u006C\u0079\u0073\u0065\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0066\u0069\u0067\u0068\u0074\u0069\u006E\u0067';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0068\u006F\u0070\u0065';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0073\u0065\u0063\u006F\u006E\u0064';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u006A\u0061\u0077\u0073';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0074\u0068\u0061\u0074\u0020\u006E\u0075\u006D\u0062\u0065\u0072';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0049\u0020\u0063\u0061\u006E';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0069\u0073\u0020\u0063\u006C\u006F\u0073\u0065\u0020\u0061\u0074\u0020\u0068\u0061\u006E\u0064';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0069\u006E\u0073\u0069\u0064\u0065';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0063\u006C\u006F\u0073\u0069\u006E\u0067';
I[10][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">MICHAEL JACKSON - THRILLER</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   closing      fighting      hope      I can      inside      is close at hand      jaws      midnight      paralysed      second      that number   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
It's close to <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> <br />Something evil's lurking from the dark<br />Under the moonlight<br />You see a sight that almost stops your heart<br />You try to scream<br />But terror takes the sound before you make it<br />You start to freeze<br />As horror looks you right between the eyes<br />You're <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> <br />'Cause this is thriller<br />Thriller night<br />And no-one's gonna save you<br />From the beast about to strike<br />You know it's thriller<br />Thriller night<br />You're <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> for your life<br />Inside a killer<br />Thriller tonight, yeah<br />You hear the door slam<br />And realise there's nowhere left to run<br />You feel the cold hand<br />And wonder if you'll ever see the sun<br />You close your eyes<br />And <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> that this is just imagination<br />(Girl)<br />But all the while<br />You hear a creature creeping up behind<br />You're outta time<br />'Cause this is thriller<br />Thriller night<br />There ain't no <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> chance<br />Against the thing with the forty eyes, girl<br />Thriller (ooh, ooh)<br />Thriller night<br />You're fighting for your life<br />Inside a killer<br />Thriller tonight<br />Night creatures calling<br />The dead start to walk in their masquerade<br />There's no escaping the <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> of the alien this time (they're open wide)<br />This is the end of your life<br />They're out to get you<br />There's demons closing in on every side<br />They will possess you<br />Unless you change <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> on your dial<br />Now is the time<br />For you and I to cuddle close together, yeah<br />All through the night<br />I'll save you from the terror on the screen<br />I'll make you see<br />That this is thriller<br />Thriller night<br />'Cause <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> thrill you more<br />Than any ghoul could ever dare try<br />(Thriller) Ooh, ooh<br />(Thriller night)<br />So let me hold you tight<br />And share a<br />(Killer, diller, chiller)<br />(Thriller here tonight)<br />'Cause this is thriller<br />Thriller night<br />Girl, I can thrill you more<br />Than any ghoul could ever dare try<br />(Thriller) Ooh, ooh<br />(Thriller night)<br />So let me hold you tight<br />And share a<br />(Killer, thriller) Oh<br />I'm gonna thrill you tonight<br />Darkness falls across the land<br />The midnight hour <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> <br />Creatures crawl in search of blood<br />To terrorise y'alls neighborhood<br />And whosoever shall be found<br />Without the soul for getting down<br />Must stand and face the Hounds of Hell<br />And rot <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> a corpse's shell<br />I'm gonna thrill you tonight<br />(Thriller, ooh, ooh, yeah)<br />I'm gonna thrill you tonight<br />(Thriller, oh, darling)<br />I'm gonna thrill you tonight<br />(Thriller)<br />Ooh, ooh, babe<br />I'm gonna thrill you tonight<br />(Thriller) Oh, darling<br />Thriller night<br />Ooh<br />The foulest stench is in the air<br />The funk of forty-thousand years<br />And grizzly ghouls from every tomb<br />Are <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="closing">closing</option><option value="fighting">fighting</option><option value="hope">hope</option><option value="I can">I can</option><option value="inside">inside</option><option value="is close at hand">is close at hand</option><option value="jaws">jaws</option><option value="midnight">midnight</option><option value="paralysed">paralysed</option><option value="second">second</option><option value="that number">that number</option></select></span> in to seal your doom<br />And though you fight to stay alive<br />Your body starts to shiver<br />For no mere mortal can resist<br />The evil of the thriller
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com11tag:blogger.com,1999:blog-839493942869762721.post-2075299745735225182021-10-27T09:58:00.004-07:002021-10-27T09:58:37.103-07:00MELANIE MARTINEZ - MRS. POTATO HEAD<p style="text-align: center;"> <b>Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/wkri1NUq9ro" width="320" youtube-src-id="wkri1NUq9ro"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="MELANIE MARTINEZ - MRS. POTATO HEAD" />
<title>
MELANIE MARTINEZ - MRS. POTATO HEAD
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u006F\u0072\u006E\u0061\u006D\u0065\u006E\u0074\u0073';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0066\u0065\u0065\u006C';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0073\u006B\u0069\u006E';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0075\u006E\u0061\u0074\u0074\u0072\u0061\u0063\u0074\u0069\u0076\u0065';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0070\u0072\u0065\u0074\u0074\u0079';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0073\u0075\u0072\u0067\u0065\u0072\u0079';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0066\u0072\u0065\u006E\u0063\u0068';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0057\u0068\u0065\u006E';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u006C\u0065\u0061\u0074\u0068\u0065\u0072';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0050\u006F\u0074\u0061\u0074\u006F';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0073\u0077\u0065\u0061\u0072';
I[10][2]='';
I[11] = new Array();
I[11][1] = new Array();
I[11][1][0] = new Array();
I[11][1][0][0] = '\u0074\u0072\u0075\u0065';
I[11][2]='';
I[12] = new Array();
I[12][1] = new Array();
I[12][1][0] = new Array();
I[12][1][0][0] = '\u0066\u0061\u0063\u0065';
I[12][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">MELANIE MARTINEZ - MRS. POTATO HEAD</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   face      feel      french      leather      ornaments      Potato      pretty      skin      surgery      swear      true      unattractive      When   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
If you weren't born with it<br />You can buy a couple <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> <br />Just be sure to read the warning, kids<br />'Cause pretty soon you'll be bored of it<br />Sexual, hey girl if you wanna <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> sexual<br />You can always call up a professional<br />They stick pins in you like a vegetable<br />Kids forever, kids forever<br />Baby soft <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> turns into leather<br />Don't be dramatic it's only some plastic<br />No one will love you if you're <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> <br />Oh Mrs. Potato Head tell me<br />Is it true that pain is beauty?<br />Does a new face come with a warranty?<br />Will a <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> face make it better?<br />Oh Mr. Potato Head tell me<br />How did you afford her <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span>?<br />Do you swear you'll stay forever<br />Even if her face don't stay together<br />Even if her face don't stay together<br />If you want a little more confidence<br />Potatoes turn to <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> fries, yeah it's common sense<br />All you need's a couple more condiments<br />And a hundred thousand dollars for some compliments<br />It's such a waste<br /><span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> little girls grow into their mother's face<br />But little girls are learning how to cut and paste<br />And pucker up their lips until they suffocate<br />Kids forever kids forever<br />Baby soft skin turns into <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> <br />Don't be dramatic it's only some plastic<br />No one will love you if you're unattractive<br />Oh Mrs. <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> Head tell me<br />Is it true that pain is beauty?<br />Does a new face come with a warranty?<br />Will a pretty face make it better?<br />Oh Mr. potato head tell me<br />How did you afford her surgery?<br />Do you <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> you'll stay forever<br />Even if her face don't stay together<br />Stay forever, stay forever<br />Even if her face don't stay together<br />Stay forever, stay forever<br />Even if her face don't stay together<br />Oh Mrs. Potato Head tell me<br />Is it <span class="GapSpan" id="GapSpan11"><select id="Gap11"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> that pain is beauty?<br />Does a new face come with a warranty?<br />Will a pretty face make it better?<br />Oh Mr. Potato Head tell me<br />How did you afford her surgery?<br />Do you swear you'll stay forever<br />Even if her <span class="GapSpan" id="GapSpan12"><select id="Gap12"><option value=""> </option><option value="face">face</option><option value="feel">feel</option><option value="french">french</option><option value="leather">leather</option><option value="ornaments">ornaments</option><option value="Potato">Potato</option><option value="pretty">pretty</option><option value="skin">skin</option><option value="surgery">surgery</option><option value="swear">swear</option><option value="true">true</option><option value="unattractive">unattractive</option><option value="When">When</option></select></span> don't stay together<br />Stay forever, stay forever<br />Even if her face don't stay together<br />Stay forever, stay forever<br />Even if her face don't stay together<br />Stay forever, stay forever<br />Even if her face don't stay together<br />Stay forever, stay forever<br />Even if her face don't stay together
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com1tag:blogger.com,1999:blog-839493942869762721.post-8177984062623324362021-10-27T09:44:00.006-07:002021-10-27T09:44:44.656-07:00NIRVANA - SOMETHING IN THE WAY<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/1YhR5UfaAzM" width="320" youtube-src-id="1YhR5UfaAzM"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="NIRVANA - SOMETHING IN THE WAY" />
<title>
NIRVANA - SOMETHING IN THE WAY
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0055\u006E\u0064\u0065\u0072\u006E\u0065\u0061\u0074\u0068';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0074\u0072\u0061\u0070\u0070\u0065\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0064\u0072\u0069\u0070\u0070\u0069\u006E\u0067\u0073';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0061\u006E\u0079';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0062\u0065\u0063\u006F\u006D\u0065';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0065\u0061\u0074';
I[5][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">NIRVANA - SOMETHING IN THE WAY</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   any      become      drippings      eat      trapped      Underneath   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
<span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="any">any</option><option value="become">become</option><option value="drippings">drippings</option><option value="eat">eat</option><option value="trapped">trapped</option><option value="Underneath">Underneath</option></select></span> the bridge<br />Tarp has sprung a leak<br />And the animals I've <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="any">any</option><option value="become">become</option><option value="drippings">drippings</option><option value="eat">eat</option><option value="trapped">trapped</option><option value="Underneath">Underneath</option></select></span> <br />Have all become my pets<br />And I'm living off of grass<br />And the <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="any">any</option><option value="become">become</option><option value="drippings">drippings</option><option value="eat">eat</option><option value="trapped">trapped</option><option value="Underneath">Underneath</option></select></span> from my ceiling<br />It's okay to eat fish<br />Cause they don't have <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="any">any</option><option value="become">become</option><option value="drippings">drippings</option><option value="eat">eat</option><option value="trapped">trapped</option><option value="Underneath">Underneath</option></select></span> feelings<br />Something in the way<br />Mmm-mmm<br />Something in the way, yeah<br />Mmm-mmm<br />Something in the way<br />Mmm-mmm<br />Something in the way, yeah<br />Mmm-mmm<br />Something in the way<br />Mmm-mmm<br />Something in the way, yeah<br />Mmm-mmm<br />Underneath the bridge<br />Tarp has sprung a leak<br />And the animals I've trapped<br />Have all <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="any">any</option><option value="become">become</option><option value="drippings">drippings</option><option value="eat">eat</option><option value="trapped">trapped</option><option value="Underneath">Underneath</option></select></span> my pets<br />And I'm living off of grass<br />And the drippings from the ceiling<br />It's okay to <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="any">any</option><option value="become">become</option><option value="drippings">drippings</option><option value="eat">eat</option><option value="trapped">trapped</option><option value="Underneath">Underneath</option></select></span> fish<br />Cause they don't have any feelings<br />Something in the way<br />Mmm-mmm<br />Something in the way, yeah<br />Mmm-mmm<br />Something in the way<br />Mmm-mmm<br />Something in the way, yeah<br />Mmm-mmm<br />Something in the way<br />Mmm-mmm<br />Something in the way, yeah<br />Mmm-mmm<br />Something in the way<br />Mmm-mmm<br />Something in the way, yeah<br />Mmm-mmm
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com2tag:blogger.com,1999:blog-839493942869762721.post-51450679423938005822021-10-27T09:41:00.002-07:002021-10-27T09:41:22.652-07:002PAC - LET ME BLOW YA LOVE<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/NI3HJGtRWic" width="320" youtube-src-id="NI3HJGtRWic"></iframe></div><p></p><p style="text-align: center;"><b><br /></b></p><p style="text-align: center;"><b><br /></b></p>
<html lang="en" prefix="dc: http://purl.org/dc/elements/1.1/" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head><meta content="Created with Hot Potatoes by Half-Baked Software, registered to PC." name="author"></meta><meta content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria" name="keywords"></meta>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"></meta>
<meta content="PC" name="dc:creator"></meta>
<meta content="2PAC - LET ME BLOW YA LOVE" name="dc:title"></meta>
<title>
2PAC - LET ME BLOW YA LOVE
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0066\u0072\u006F\u006D';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0070\u0065\u0072\u0068\u0061\u0070\u0073';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0061\u0072\u0067\u0075\u006D\u0065\u006E\u0074\u0073';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0061\u0074\u0074\u0069\u0074\u0075\u0064\u0065';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0077\u0069\u0074\u0068';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0068\u0065\u0061\u0072';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0068\u0065\u0072\u0065';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0074\u0072\u0061\u0070';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0068\u006F\u006C\u0064\u0069\u006E';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0063\u006C\u0065\u0061\u0072';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0067\u006F\u0074';
I[10][2]='';
I[11] = new Array();
I[11][1] = new Array();
I[11][1][0] = new Array();
I[11][1][0][0] = '\u0070\u0069\u006C\u006C\u006F\u0077';
I[11][2]='';
I[12] = new Array();
I[12][1] = new Array();
I[12][1][0] = new Array();
I[12][1][0][0] = '\u0068\u0061\u0070\u0070\u0069\u006E\u0065\u0073\u0073';
I[12][2]='';
I[13] = new Array();
I[13][1] = new Array();
I[13][1][0] = new Array();
I[13][1][0][0] = '\u0073\u0068\u006F\u0075\u006C\u0064\u0061';
I[13][2]='';
I[14] = new Array();
I[14][1] = new Array();
I[14][1][0] = new Array();
I[14][1][0][0] = '\u006D\u0069\u0073\u0065\u0072\u0079';
I[14][2]='';
I[15] = new Array();
I[15][1] = new Array();
I[15][1][0] = new Array();
I[15][1][0][0] = '\u0074\u0061\u006B\u0065';
I[15][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body id="TheBody" onload="StartUp()">
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">2PAC - LET ME BLOW YA LOVE</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div class="StdDiv" id="InstructionsDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div class="StdDiv" id="WordsDiv">
<span class="ClozeWordList" id="WordList"> arguments attitude clear from got happiness hear here holdin misery perhaps pillow shoulda take trap with </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form autocomplete="off" id="Cloze" method="post" onsubmit="return false;">
<div class="ClozeBody">
I shoulda seen<br />You was trouble right <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> the start, taught me so many lessons<br />How not to mess with broken hearts, so many questions<br />When this began we was the perfect match, <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> <br />We had some problems but we workin at it, and now<br />The <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> are gettin' loud, I wanna stay<br />But I can't help from walkin' out just throw it away<br />Just take my hand and understand, if you could see<br />I never planned to be your man it just wasn't me<br />But now I'm searchin' for commitment, in other arms<br />I wanna shelter you from harm, don't be alarmed<br />Your <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> was the cause, you got me stressin'<br />Soon as I open up the door with your jealous questions<br />Like where can I be you're killin' me <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> your jealousy<br />Now my ambition's to be free<br />I can't breathe, cause soon as I leave, it's like a trap<br />I <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> you callin' me to come back, I'm a sucka for love<br />If I had to give you more, it's only been a year<br />Now I've got my foot through the door, and I ain't going nowhere<br />It took a while to get me <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span>, and I'm gonna take my time<br />Don't fight that good shit in your ear, now let me blow ya mind<br />Just when I thought I broke away and I'm feelin' happy<br />You try to <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> me say you pregnant and guess who the daddy<br />Don't wanna fall for it, but in this case what could I do? So now I'm back<br />To makin promises to you, tryin to keep it true<br />What if I'm wrong, a trick to keep me <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> on<br />Tryin' to be strong and in the process, keep you goin<br />I'm bout to lose my composure, I'm gettin' close<br />To packin' up and leavin' notes, and gettin' ghost<br />Tell me who knows, a peaceful place where I can go<br />To <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> my head I'm feelin low, losin control<br />My heart is sayin' leave, oh what a tangle web we weave<br />When we conspire to conceive, and now<br />You gettin' calls at the house, guess you cheatin'<br />That's all I need to hear cause I'm leavin', I'm out the do'<br />Never no more will you see me, this is the end<br />Cause now I know you've been cheatin, I'm a sucka for love<br />If I had to give you more, it's only been a year<br />Now I've <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> my foot through the door, and I ain't going nowhere<br />It took a while to get me here, and I'm gonna take my time<br />Don't fight that good shit in your ear, now let me blow ya mind<br />Now he left you with scars, tears on your <span class="GapSpan" id="GapSpan11"><select id="Gap11"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> and you still stay<br />As you sit and pray, hoping the beatings'll go away<br />It wasn't always a hit and run relationship<br />It use to be love, <span class="GapSpan" id="GapSpan12"><select id="Gap12"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> and companionship<br />Remember when I treated you good<br />I moved you up to the hills, out the ills of the ghetto hood<br />Me and you a happy home, when it was on<br />I had a love to call my own<br />I <span class="GapSpan" id="GapSpan13"><select id="Gap13"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> seen you was trouble but I was lost, trapped in your eyes<br />Preoccupied with gettin' tossed, no need to lie<br />You had a man and I knew it, you told me<br />Don't worry bout it we can do it now I'm under pressure<br />Make a decision cause I'm waitin', when I'm alone<br />I'm on the phone havin' secret conversations, huh<br />I wanna take your <span class="GapSpan" id="GapSpan14"><select id="Gap14"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span>, replace it with happiness<br />But I need your faith in me, I'm a sucka for love<br />If I had to give you more, it's only been a year<br />Now I've got my foot through the door, and I ain't going nowhere<br />It took a while to get me here, and I'm gonna <span class="GapSpan" id="GapSpan15"><select id="Gap15"><option value=""> </option><option value="arguments">arguments</option><option value="attitude">attitude</option><option value="clear">clear</option><option value="from">from</option><option value="got">got</option><option value="happiness">happiness</option><option value="hear">hear</option><option value="here">here</option><option value="holdin">holdin</option><option value="misery">misery</option><option value="perhaps">perhaps</option><option value="pillow">pillow</option><option value="shoulda">shoulda</option><option value="take">take</option><option value="trap">trap</option><option value="with">with</option></select></span> my time<br />Don't fight that good shit in your ear, now let me blow yaaaa mind
</div>
</form>
</div>
<button class="FuncButton" id="CheckButton2" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button class="FuncButton" id="FeedbackOKButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-72578935563087531532021-10-27T09:26:00.002-07:002021-10-27T09:26:38.290-07:00BON JOVI - BED OF ROSES<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/NvR60Wg9R7Q" width="320" youtube-src-id="NvR60Wg9R7Q"></iframe></div><p style="text-align: center;"><br /></p><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="BON JOVI - BED OF ROSES" />
<title>
BON JOVI - BED OF ROSES
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0068\u0061\u0072\u0064\u0020\u0074\u006F';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0069\u006E\u0020\u006D\u0079\u0020\u0062\u0065\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0069\u0072\u006F\u006E\u0063\u006C\u0061\u0064';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0074\u0061\u006C\u006B\u0069\u006E\u0067';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u006F\u0066\u0020\u0072\u006F\u0073\u0065\u0073';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0074\u0068\u0061\u0074';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0074\u0068\u0072\u006F\u0075\u0067\u0068';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0068\u0061\u006E\u0067\u006F\u0076\u0065\u0072';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u006D\u0069\u0073\u0074\u0072\u0065\u0073\u0073';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0074\u006F\u0020\u0062\u0065\u0020\u006A\u0075\u0073\u0074';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0047\u0068\u006F\u0073\u0074';
I[10][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">BON JOVI - BED OF ROSES</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   Ghost      hangover      hard to      in my bed      ironclad      mistress      of roses      talking      that      through      to be just   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Sitting here wasted and wounded<br />At this old piano<br />Trying <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> capture<br />The moment this morning I don't know<br />'Cause a bottle of Vodka's still lodged in my head<br />And some blonde gave me nightmares<br />Think that she's still <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> <br />As I dream about movies<br />They won't make of me when I'm dead<br />With an <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> fist<br />I wake up and french kiss the morning<br />While some marching band keeps its own beat in my head<br />While we're <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> <br />About all of the things that I long to believe<br />About love, the truth, what you mean to me<br />And the truth is<br />Baby you're all that I need<br />I want to lay you down in a bed <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> <br />For tonight I'll sleep on a bed of nails<br />Oh I want to be just as close as the Holy Ghost is<br />And lay you down on a bed of roses<br />Well I'm so far away<br />Each step <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> I take is on my way home<br />A king's ransom in dimes, I'd give each night<br />To see through this payphone<br />Still I run out of time<br />Or it's hard to get <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> <br />Till the bird on the wire flies me back to you<br />I'll just close my eyes and whisper<br />"Baby, blind love is true"<br />I want to lay you down in a bed of roses<br />For tonight I'll sleep on a bed of nails<br />Oh I want to be just as close as the Holy Ghost is<br />And lay you down on a bed of roses<br />Well this hotel bar's <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> whiskey's gone dry<br />The barkeeper's wig's crooked<br />And she's giving me the eye<br />Well I might have said yeah<br />But I laughed so hard I think I died<br />Ooh yeah<br />Now as you close your eyes<br />Know I'll be thinking about you<br />While my <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> she calls me<br />To stand in her spotlight again<br />Tonight I won't be alone<br />But you know that don't mean I'm not lonely<br />I've got nothing to prove<br />For it's you that I'd die to defend<br />I want to lay you down in a bed of roses<br />For tonight I'll sleep on a bed of nails<br />I want <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> as close as the Holy Ghost is<br />And lay you down<br />I want to lay you down in a bed of roses<br />For tonight I'll sleep on a bed of nails<br />I want to be just as close as the Holy <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="Ghost">Ghost</option><option value="hangover">hangover</option><option value="hard to">hard to</option><option value="in my bed">in my bed</option><option value="ironclad">ironclad</option><option value="mistress">mistress</option><option value="of roses">of roses</option><option value="talking">talking</option><option value="that">that</option><option value="through">through</option><option value="to be just">to be just</option></select></span> is<br />And lay you down<br />On a bed of roses
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com14tag:blogger.com,1999:blog-839493942869762721.post-17832402225458617602021-10-27T09:18:00.001-07:002021-10-27T09:18:16.249-07:00PLANETSHAKERS - NOTHING IS IMPOSSIBLE<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/lbSPw7f3FxI" width="320" youtube-src-id="lbSPw7f3FxI"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="PLANETSHAKERS - NOTHING IS IMPOSSIBLE" />
<title>
PLANETSHAKERS - NOTHING IS IMPOSSIBLE
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0054\u0068\u0072\u006F\u0075\u0067\u0068';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0073\u0074\u0072\u0065\u006E\u0067\u0074\u0068';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u006C\u0069\u0076\u0069\u006E\u0067';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0068\u0065\u0072\u0065\u0020\u0077\u0069\u0074\u0068\u0020\u006D\u0065';
I[3][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">PLANETSHAKERS - NOTHING IS IMPOSSIBLE</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   here with me      living      strength      Through   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
<span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="here with me">here with me</option><option value="living">living</option><option value="strength">strength</option><option value="Through">Through</option></select></span> you<br />I can do anything<br />I can do all things<br />For it's You who give me <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="here with me">here with me</option><option value="living">living</option><option value="strength">strength</option><option value="Through">Through</option></select></span> <br />Nothing is impossible<br />Through you<br />Blind eyes are opened<br />Strongholds are broken<br />I am <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="here with me">here with me</option><option value="living">living</option><option value="strength">strength</option><option value="Through">Through</option></select></span> by faith<br />Nothing is impossible!<br />I'm not gonna live by what I see<br />I'm not gonna live by what I feel<br />Deep down I<br />Know that you're <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="here with me">here with me</option><option value="living">living</option><option value="strength">strength</option><option value="Through">Through</option></select></span> <br />I know that, you can do anything<br />I believe, I believe<br />I believe, I believe in you
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com4tag:blogger.com,1999:blog-839493942869762721.post-91138119853783712072021-10-27T09:04:00.006-07:002021-10-27T09:04:41.975-07:00THE FRAY - HOW TO SAVE A LIFE<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/cjVQ36NhbMk" width="320" youtube-src-id="cjVQ36NhbMk"></iframe></div><br /><p style="text-align: center;"><br /></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="THE FRAY - HOW TO SAVE A LIFE" />
<title>
THE FRAY - HOW TO SAVE A LIFE
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0064\u006F\u0077\u006E';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0073\u006F\u0072\u0074';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0077\u006F\u006E\u0064\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] = '\u0062\u0069\u0074\u0074\u0065\u0072\u006E\u0065\u0073\u0073';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0074\u0068\u0061\u0074';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0074\u0068\u0069\u006E\u0067\u0073';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0066\u0072\u0069\u0065\u006E\u0064';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0072\u0061\u0069\u0073\u0065';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0061\u0064\u006D\u0069\u0074';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0073\u0074\u0061\u0079\u0065\u0064';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0068\u0061\u0076\u0065';
I[10][2]='';
I[11] = new Array();
I[11][1] = new Array();
I[11][1][0] = new Array();
I[11][1][0][0] = '\u0057\u0068\u0065\u0072\u0065';
I[11][2]='';
I[12] = new Array();
I[12][1] = new Array();
I[12][1][0] = new Array();
I[12][1][0][0] = '\u006E\u0069\u0067\u0068\u0074';
I[12][2]='';
I[13] = new Array();
I[13][1] = new Array();
I[13][1][0] = new Array();
I[13][1][0][0] = '\u0048\u0061\u0064';
I[13][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">THE FRAY - HOW TO SAVE A LIFE</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   admit      bitterness      down      friend      Had      have      night      raise      sort      stayed      that      things      Where      wonder   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Step one, you say we need to talk<br />He walks, you say sit <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span>, it's just a talk<br />He smiles politely back at you<br />You stare politely right on through<br />Some <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> of window to your right<br />As he goes left, and you stay right<br />Between the lines of fear and blame<br />You begin to <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> why you came<br />Where did I go wrong?<br />I lost a friend<br />Somewhere along in the <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> <br />And I would have stayed up with you all night<br />Had I known how to save a life<br />Let him know <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> you know best<br />'Cause after all, you do know best<br />Try to slip past his defense<br />Without granting innocence<br />Lay down a list of what is wrong<br />The <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> you've told him all along<br />And pray to God he hears you<br />And I pray to God he hears you<br />And where did I go wrong?<br />I lost a <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> <br />Somewhere along in the bitterness<br />And I would have stayed up with you all night<br />Had I known how to save a life<br />As he begins to <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> his voice<br />You lower yours and grant him one last choice<br />Drive until you lose the road<br />Or break with the ones you've followed<br />He will do one of two things<br />He will <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> to everything<br />Or he'll say he's just not the same<br />And you'll begin to wonder why you came<br />Where did I go wrong?<br />I lost a friend<br />Somewhere along in the bitterness<br />And I would have <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> up with you all night<br />Had I known how to save a life<br />Where did I go wrong?<br />I lost a friend<br />Somewhere along in the bitterness<br />And I would <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> stayed up with you all night<br />Had I known how to save a life<br />How to save a life<br />How to save a life<br /><span class="GapSpan" id="GapSpan11"><select id="Gap11"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> did I go wrong?<br />I lost a friend<br />Somewhere along in the bitterness<br />And I would have stayed up with you all <span class="GapSpan" id="GapSpan12"><select id="Gap12"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> <br />Had I known how to save a life<br />Where did I go wrong?<br />I lost a friend<br />Somewhere along in the bitterness<br />And I would have stayed up with you all night<br /><span class="GapSpan" id="GapSpan13"><select id="Gap13"><option value=""> </option><option value="admit">admit</option><option value="bitterness">bitterness</option><option value="down">down</option><option value="friend">friend</option><option value="Had">Had</option><option value="have">have</option><option value="night">night</option><option value="raise">raise</option><option value="sort">sort</option><option value="stayed">stayed</option><option value="that">that</option><option value="things">things</option><option value="Where">Where</option><option value="wonder">wonder</option></select></span> I known how to save a life<br />How to save a life<br />How to save a life
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com2tag:blogger.com,1999:blog-839493942869762721.post-18404028106260720302021-10-27T08:49:00.006-07:002021-10-27T08:49:58.486-07:00ONE DIRECTION - THEY DON'T KNOW ABOUT US<p style="text-align: center;"> <b>Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/L_Y4V44GW58" width="320" youtube-src-id="L_Y4V44GW58"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="ONE DIRECTION - THEY DON'T KNOW ABOUT US" />
<title>
ONE DIRECTION - THEY DON'T KNOW ABOUT US
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0061\u0062\u006F\u0075\u0074';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u006C\u006F\u006E\u0067\u0065\u0072';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0054\u0068\u0065\u0079';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u006E\u0069\u0067\u0068\u0074\u0073';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0074\u006F\u0075\u0063\u0068';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u006A\u0065\u0061\u006C\u006F\u0075\u0073';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0074\u0068\u0061\u0074';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0063\u0061\u006E';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0074\u0068\u0061\u0074';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0077\u006F\u0075\u006C\u0064';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0077\u0061\u0069\u0074\u0065\u0064';
I[10][2]='';
I[11] = new Array();
I[11][1] = new Array();
I[11][1][0] = new Array();
I[11][1][0][0] = '\u0074\u0068\u0069\u006E\u0067\u0073';
I[11][2]='';
I[12] = new Array();
I[12][1] = new Array();
I[12][1][0] = new Array();
I[12][1][0][0] = '\u0066\u0069\u006E\u0064';
I[12][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">ONE DIRECTION - THEY DON'T KNOW ABOUT US</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   about      can      find      jealous      longer      nights      that      They      things      touch      waited      would   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
People say we shouldn't be together<br />Too young to know <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> forever<br />But I say they don't know what they're talk-talk-talkin' about (talk-talk-talkin' about)<br />'Cause this love is only getting stronger<br />So I don't wanna wait any <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> <br />I just wanna tell the world that you're mine, girl<br />Oh, they don't know about the things we do<br /><span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> don't know about the I love you's<br />But I bet you if they only knew (they don't know)<br />They would just be jealous of us<br />They don't know about the up all <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> <br />They don't know I've waited all my life<br />Just to find a love that feels this right (they don't know)<br />Baby, they don't know about, they don't know about us<br />One <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> and I was a believer<br />Every kiss, it gets a little sweeter<br />It's getting better<br />Keeps getting better all the time, girl<br />They don't know about the things we do<br />They don't know about the I love you's<br />But I bet you if they only knew (they don't know)<br />They would just be <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> of us<br />They don't know about the up all nights<br />They don't know I've waited all my life<br />Just to find a love <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> feels this right (they don't know)<br />Baby, they don't know about, they don't know about us<br />They don't know how special you are<br />They don't know what you've done to my heart<br />They <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> say anything they want<br />'Cause they don't know about us<br />They don't know what we do best<br />That's between me and you, our little secret<br />But I wanna tell 'em<br />I wanna tell the world <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> you're mine, girl<br />They don't know about the things we do<br />They don't know about the I love you's (I love you)<br />But I bet you if they only knew (if they only knew)<br />They <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> just be jealous of us (they would just be jealous of us)<br />They don't know about the up all nights<br />They don't know I've <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> all my life<br />Just to find a love that feels this right (feels so right)<br />Baby, they don't know about<br />They don't know 'bout the <span class="GapSpan" id="GapSpan11"><select id="Gap11"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> we do ('bout us)<br />They don't know' bout the I love you's ('bout us)<br />But I bet you if they only knew ('bout us)<br />They would just be jealous of us<br />They don't know about the up all nights<br />They don't know I've waited all my life<br />Just to <span class="GapSpan" id="GapSpan12"><select id="Gap12"><option value=""> </option><option value="about">about</option><option value="can">can</option><option value="find">find</option><option value="jealous">jealous</option><option value="longer">longer</option><option value="nights">nights</option><option value="that">that</option><option value="They">They</option><option value="things">things</option><option value="touch">touch</option><option value="waited">waited</option><option value="would">would</option></select></span> a love that feels this right<br />Baby, they don't know about, they don't know about us<br />They don't know 'bout us
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com2tag:blogger.com,1999:blog-839493942869762721.post-18801924788407295012021-10-27T08:44:00.007-07:002021-10-27T08:44:48.688-07:00GORILLAZ - FEEL GOOD INC.<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/HyHNuVaZJ-k" width="320" youtube-src-id="HyHNuVaZJ-k"></iframe></p><p style="text-align: center;"><br /><b><br /></b></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="GORILLAZ - FEEL GOOD INC." />
<title>
GORILLAZ - FEEL GOOD INC.
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0062\u0072\u0065\u0061\u006B\u0069\u006E\u0067';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0062\u0061\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0077\u0061\u006E\u006E\u0061';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0073\u0074\u0072\u0069\u0064\u0065';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0074\u0068\u0065\u0073\u0065';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0067\u0072\u0061\u0076\u0069\u0074\u0061\u0074\u0065';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0073\u006F\u0075\u006E\u0064';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0068\u0061\u006E\u0064\u0020\u0069\u006E\u0020\u0068\u0061\u006E\u0064';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0065\u0076\u0065\u0072\u0079\u0062\u006F\u0064\u0079';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0053\u0074\u0065\u0061\u0064\u0079';
I[9][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">GORILLAZ - FEEL GOOD INC.</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   bad      breaking      everybody      gravitate      hand in hand      sound      Steady      stride      these      wanna   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />City's <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span> down on a camel's back<br />They just have to go, 'cause they don't know wack<br />So while you fill the streets, it's appealing to see<br />You won't get out the county, 'cause you're <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span> and free<br />You got a new horizon, it's ephemeral style<br />A melancholy town where we never smile<br />And all I <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span> hear is the message beep<br />My dreams, they got a kissing<br />'Cause I don't get sleep, no<br />Windmill, windmill for the land<br />Turn forever hand in hand<br />Take it all in on your <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span> <br />It is ticking, falling down<br />Love forever, love is freely<br />Turned forever, you and me<br />Windmill, windmill for the land<br />Is everybody in?<br />Laughin' gas <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span> hazmats, fast cats<br />Linin' 'em up like ass cracks<br />Play these ponies at the track<br />It's my chocolate attack<br />Shit, I'm steppin' in the heart of this here (yeah)<br />Care Bear rappin' in harder this year (yeah)<br />Watch me as I <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span>, ha-ha-ha-ha-ha<br />Yo, we gon' ghost town this Motown<br />With yo' sound, you in the blink<br />Gon' bite the dust, can't fight with us<br />With yo' <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span>, you kill the Inc.<br />So don't stop, get it, get it (Get it)<br />Until you're cheddar headed<br />And watch the way I navigate<br />Ha-ha-ha-ha-ha<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Windmill, windmill for the land<br />Turn forever <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span> <br />Take it all in on your stride<br />It is ticking, falling down<br />Love forever, love is freely<br />Turned forever, you and me<br />Windmill, windmill for the land<br />Is <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span> in?<br />Don't stop, get it, get it<br />Peep how your captain's in it<br />Steady, watch me navigate<br />Ha-ha-ha-ha-ha<br />Don't stop, get it, get it<br />Peep how your captain's in it<br /><span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="bad">bad</option><option value="breaking">breaking</option><option value="everybody">everybody</option><option value="gravitate">gravitate</option><option value="hand in hand">hand in hand</option><option value="sound">sound</option><option value="Steady">Steady</option><option value="stride">stride</option><option value="these">these</option><option value="wanna">wanna</option></select></span>, watch me navigate<br />Ha-ha-ha-ha-ha<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good<br />Sha, sha-ba-da, sha-ba-da-ca, feel good
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com8tag:blogger.com,1999:blog-839493942869762721.post-29387921492068312472021-10-27T08:36:00.001-07:002021-10-27T08:36:15.016-07:00SHAWN MENDES - IMAGINATION<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/8ySX2AVKyU4" width="320" youtube-src-id="8ySX2AVKyU4"></iframe></div><div class="separator" style="clear: both; text-align: center;"><br /></div><div class="separator" style="clear: both; text-align: center;"><br /></div><br /><p style="text-align: center;"><br /></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to PC."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="PC" />
<meta name="dc:title" content="SHAWN MENDES - IMAGINATION" />
<title>
SHAWN MENDES - IMAGINATION
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0074\u0068\u0065\u0072\u0065';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0068\u006F\u0077';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0077\u0061\u006E\u006E\u0061';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0077\u0068\u0065\u006E';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0066\u0072\u006F\u006D';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0073\u0070\u0065\u006E\u0064';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0064\u0061\u006D\u006E';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0061\u006E\u0079\u006D\u006F\u0072\u0065';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u006B\u006E\u006F\u0077\u0073';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0077\u0069\u0074\u0068\u0020\u006D\u0065';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u006A\u0075\u0073\u0074\u0020\u006D\u0065';
I[10][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">SHAWN MENDES - IMAGINATION</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   anymore      damn      from      how      just me      knows      spend      there      wanna      when      with me   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Oh, <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> she goes again<br />Every morning it's the same<br />You walk on by my house<br />I wanna call out your name<br />I wanna tell you <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> beautiful you are from where I'm standing<br />You got me thinking what we could be 'cause<br />I keep craving, craving, you don't know it but it's true<br />Can't get my mouth to say the words they <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> say to you<br />This is typical of love<br />Can't wait anymore, I won't wait<br />I need to tell you how I feel <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> I see us together forever<br />In my dreams you're with me<br />We'll be everything I want us to be<br />And <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> there, who knows?<br />Maybe this will be the night that we kiss for the first time<br />Or is that just me and my imagination?<br />We walk, we laugh, we <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> our time walking by the ocean side<br />Our hands are gently intertwined<br />A feeling I just can't describe<br />All this time we spent alone, thinking we could not belong to something so damn beautiful<br />So <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> beautiful<br />I keep craving, craving, you don't know it, but it's true<br />Can't get my mouth to say the words they wanna say to you<br />This is typical of love<br />I can't wait <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span>, I won't wait<br />Need to tell you how I feel when I see us together forever<br />In my dreams, you're with me<br />We'll be everything I want us to be<br />And from there, who <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span>?<br />Maybe this will be the night that we kiss for the first time<br />Or is that just me and my imagination? (Whoa, oh)<br />Imagination (whoa, oh, whoa, oh)<br />Imagination (whoa, oh)<br />(Whoa, oh, whoa, oh, whoa, oh, ooh)<br />In my dreams, you're <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> <br />We'll be everything I want us to be<br />And from there, who knows?<br />Maybe this will be the night that we kiss for the first time<br />Or is that <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="anymore">anymore</option><option value="damn">damn</option><option value="from">from</option><option value="how">how</option><option value="just me">just me</option><option value="knows">knows</option><option value="spend">spend</option><option value="there">there</option><option value="wanna">wanna</option><option value="when">when</option><option value="with me">with me</option></select></span> and my imagination<br />I keep craving, craving, you don't know it, but it's true<br />Can't get my mouth to say the words they wanna say to you
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com21tag:blogger.com,1999:blog-839493942869762721.post-60282735348002752532021-04-19T15:56:00.002-07:002021-04-19T15:58:59.686-07:00HELLOWEEN - A TALE THAT WASN'T RIGHT<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/3vXHzK5l0T4" width="320" youtube-src-id="3vXHzK5l0T4"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="HELLOWEEN - A TALE THAT WASN'T RIGHT" />
<title>
HELLOWEEN - A TALE THAT WASN'T RIGHT
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0074\u0075\u0072\u006E\u0065\u0064';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0074\u0068\u0061\u0074';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0079\u006F\u0075\u006E\u0067';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0073\u006C\u0065\u0065\u0070';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0077\u0069\u0074\u0068';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0072\u0065\u0061\u006C\u006C\u0079';
I[5][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">HELLOWEEN - A TALE THAT WASN'T RIGHT</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   really      sleep      that      turned      with      young   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Here I stand all alone<br />Have my mind <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="really">really</option><option value="sleep">sleep</option><option value="that">that</option><option value="turned">turned</option><option value="with">with</option><option value="young">young</option></select></span> to stone<br />Have my heart filled up with ice<br />To avoid its breakin' twice<br />Thanks to you, my dear old friend<br />But you can't help, this is the end<br />Of a tale <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="really">really</option><option value="sleep">sleep</option><option value="that">that</option><option value="turned">turned</option><option value="with">with</option><option value="young">young</option></select></span> wasn't right<br />I won't have no sleep tonight<br />In my heart, in my soul<br />I really hate to pay this toll<br />Should be strong, <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="really">really</option><option value="sleep">sleep</option><option value="that">that</option><option value="turned">turned</option><option value="with">with</option><option value="young">young</option></select></span> and bold<br />But the only thing I feel is pain<br />It's alright, we'll stay friends<br />Trustin' in my confidence<br />And let's say it's just alright<br />You won't <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="really">really</option><option value="sleep">sleep</option><option value="that">that</option><option value="turned">turned</option><option value="with">with</option><option value="young">young</option></select></span> alone tonight<br />In my heart, in my soul<br />I really hate to pay this toll<br />Should be strong, young and bold<br />But the only thing I feel is pain<br />With my heart, <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="really">really</option><option value="sleep">sleep</option><option value="that">that</option><option value="turned">turned</option><option value="with">with</option><option value="young">young</option></select></span> my soul<br />Some guys cry you've bought and sold<br />They've been strong, young and bold<br />And they say, play this song again<br />In my heart, in my soul<br />I <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="really">really</option><option value="sleep">sleep</option><option value="that">that</option><option value="turned">turned</option><option value="with">with</option><option value="young">young</option></select></span> hate to pay this toll<br />Should be strong, young and bold<br />But the only thing I feel is pain
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com1tag:blogger.com,1999:blog-839493942869762721.post-40527023153585182892021-04-19T15:53:00.002-07:002021-04-19T15:54:35.969-07:00IRON MAIDEN - WASTED YEARS<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/Ij99dud8-0A" width="320" youtube-src-id="Ij99dud8-0A"></iframe></div><br /><p style="text-align: center;"><br /></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="IRON MAIDEN - WASTED YEARS" />
<title>
IRON MAIDEN - WASTED YEARS
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0063\u006F\u0061\u0073\u0074';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0062\u0075\u0074';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0067\u006F\u0065\u0073';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0064\u0079\u0069\u006E\u0067';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0052\u0065\u0061\u006C\u0069\u007A\u0065';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0068\u0061\u0072\u0064';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0077\u0061\u0073\u0074\u0065';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0073\u0065\u0061\u0072\u0063\u0068\u0069\u006E\u0067';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0077\u0061\u0073\u0074\u0065';
I[8][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">IRON MAIDEN - WASTED YEARS</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   but      coast      dying      goes      hard      Realize      searching      waste   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Wased years!<br />One, two, three-<br />From the <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> of gold, across the seven seas<br />Travelin' on, far and wide<br />But now it seems I'm just a stranger to myself<br />And all the things I sometimes do, it isn't me <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> someone else<br />I close my eyes and I think of home<br />Another city <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> by in the night<br />Ain't it funny how it is? You never miss it til' it's gone away<br />And my heart is lying there, will be 'til my <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> day, Adrian!<br />So understand<br />Don't waste your time always searching for those wasted years<br />Face up, make your stand<br /><span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> you're living in the golden years<br />Too much time on my hands, I got you on my mind<br />Can't ease this pain so easily<br />When you can't find the words to say, <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> to make it through another day<br />And it makes me wanna cry, throw my hands up to the sky<br />So understand<br />Don't <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> your time always searching for those wasted years<br />Face up, make your stand<br />Realize you're living in the golden years, hey!<br />So understand, Adrian!<br />Don't waste your time always <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> for those wasted years<br />Face up, make your stand<br />Realize you're living in the golden years<br />So understand<br />Don't <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="but">but</option><option value="coast">coast</option><option value="dying">dying</option><option value="goes">goes</option><option value="hard">hard</option><option value="Realize">Realize</option><option value="searching">searching</option><option value="waste">waste</option></select></span> your time always searching for those wasted years<br />Face up, make your stand<br />Realize you're living in the golden years, hey!
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-13738540230217731452021-04-19T15:39:00.003-07:002021-04-19T15:40:22.887-07:00LOUIS TOMLINSON - DON'T LET IT BREAK YOUR HEART<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/xhjCkwFMb_Q" width="320" youtube-src-id="xhjCkwFMb_Q"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="LOUIS TOMLINSON - DON'T LET IT BREAK YOUR HEART" />
<title>
LOUIS TOMLINSON - DON'T LET IT BREAK YOUR HEART
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0075\u006E\u0064\u0065\u0072';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0074\u006F\u006F';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0077\u0068\u0061\u0074\u0065\u0076\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] = '\u0067\u006F\u0065\u0073';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0077\u0068\u0061\u0074';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0067\u0069\u0076\u0065';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0068\u0075\u0072\u0074\u0073';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0062\u0072\u0065\u0061\u006B';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0067\u0065\u0074\u0073';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0079\u006F\u0075';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0061\u0070\u0061\u0072\u0074';
I[10][2]='';
I[11] = new Array();
I[11][1] = new Array();
I[11][1][0] = new Array();
I[11][1][0][0] = '\u0063\u0061\u006E\u0027\u0074';
I[11][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">LOUIS TOMLINSON - DON'T LET IT BREAK YOUR HEART</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   apart      break      can't      gets      give      goes      hurts      too      under      what      whatever      you   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
On our way to Twenty Seven<br />Got a place on the other side of London<br />Doing better, doing better<br />And I know you left a part of you<br />In New York <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> your bed in a box<br />But you're doing better, doing better<br />Life gets hard and it gets messed up<br />When you give so much, but it's not enough<br />When the high's <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> high, and the low's too low<br />When you love someone and they let you go<br />Don't you let it kill you<br />Even when it hurts like hell<br />Oh, <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> tears you apart<br />Don't let it break your heart<br />Time takes time to heal it<br />You can't do it by yourself<br />Oh, whatever tears you apart<br />Don't let it break your heart<br />It comes and it <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> <br />We're driving down a one-way road<br />To something better, something better<br />And <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> hurts you is gonna pass<br />And you'll have learnt from it when it comes back<br />You'll be doing better, yeah, doing better<br />'Cause life gets hard and it gets messed up<br />When you <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> so much, but it's not enough<br />When the high's too high, and the low's too low<br />When you love someone and they let you go<br />Don't you let it kill you<br />Even when it <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> like hell<br />Oh, whatever tears you apart<br />Don't let it break your heart<br />Time takes time to heal it<br />You can't do it by yourself<br />Oh, whatever tears you apart<br />Don't let it <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> your heart<br />Hey!<br />(Oh, oh, oh, oh-oh-oh) Hey!<br />(Oh, oh, oh, oh-oh) Hey!<br />Don't let it break your heart<br />'Cause life gets hard and it <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> messed up<br />When you give so much and it's not enough<br />When the high's too high, and the low's too low<br />When <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> love someone and they let you go<br />Don't you let it kill you<br />Even when it hurts like hell<br />Oh, whatever tears you <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> <br />Don't let it break your heart<br />Time takes time to heal it<br />You <span class="GapSpan" id="GapSpan11"><select id="Gap11"><option value=""> </option><option value="apart">apart</option><option value="break">break</option><option value="can't">can't</option><option value="gets">gets</option><option value="give">give</option><option value="goes">goes</option><option value="hurts">hurts</option><option value="too">too</option><option value="under">under</option><option value="what">what</option><option value="whatever">whatever</option><option value="you">you</option></select></span> do it by yourself<br />Oh, whatever tears you apart<br />Don't let it break your heart<br />Don't let it break your heart (Oh, oh, oh, oh-oh, hey!)<br />Don't let it break your heart (Oh, oh, oh, oh-oh, hey!)<br />Don't let it break your heart (Oh, oh, oh, oh-oh, hey!)<br />Don't let it break your heart (Don't let it break your heart)<br />Don't let it break your heart<br />(Oh, oh, oh, oh-oh, don't let it break your heart)<br />Don't let it break your heart (Oh, oh, oh, oh-oh)<br />Don't let it break your heart<br />Don't let it break your heart
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-4746284358496929012021-04-19T15:19:00.002-07:002021-04-19T15:28:01.712-07:00LOUIS TOMLINSON - WE MADE IT<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/XWXRh6icAzQ" width="320" youtube-src-id="XWXRh6icAzQ"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="LOUIS TOMLINSON - WE MADE IT" />
<title>
LOUIS TOMLINSON - WE MADE IT
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0073\u0061\u0079\u0069\u006E\u0067';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0068\u0061\u006E\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0065\u0061\u0063\u0068';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0075\u006E\u0064\u0065\u0072\u0072\u0061\u0074\u0065\u0064';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u004C\u006F\u006F\u006B\u0069\u006E\u0067';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0074\u0068\u0061\u0074';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0077\u0061\u0076\u0069\u006E\u0067';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0068\u0069\u0067\u0068';
I[7][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">LOUIS TOMLINSON - WE MADE IT</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   each      hand      high      Looking      saying      that      underrated      waving   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
'Cause we made it, underestimated and always underrated<br />Now, we're <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> goodbye, waving to the hard times<br />Yeah, it's gonna be alright, like the first time<br />Met you at your doorstep, remember how it tasted<br />Looking into your eyes, baby, you were still high<br />Never coming down with your <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> in mine<br />Oh my, I remember those nights<br />Meet you at your uni, cheap drinks, drink 'em all night<br />Staying out 'til sunrise<br />Share a single bed and tell <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> other what we dream about<br />Things we'd never say to someone else out loud<br />We were only kids, just tryna work it out<br />Wonder what they'd think if they could see us now<br />Yeah, 'cause we made it, underestimated and always <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> <br />Now, we're saying goodbye, waving to the hard times<br />Knew that we would be alright, from the first time<br />Met you at your doorstep, remember how it tasted<br /><span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> into your eyes, baby, you were still high<br />Never coming down with your hand in mine<br />Oh God, what I could've become<br />Don't know why they put this all on us when we're so young<br />Done a pretty good job, dealing with it all when you're here<br />Don't need to say no more<br />Nothing in the world <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> I would change it for<br />Singing something pop'y on the same four chords<br />Used to worry 'bout it, but I don't no more<br />Yeah, 'cause we made it, underestimated and always underrated<br />Now, we're saying goodbye, <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> to the hard times<br />Smoke something, drink something, yeah, just like the first time<br />Met you at your doorstep, remember how it tasted<br />Looking into your eyes, baby, you were still <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="each">each</option><option value="hand">hand</option><option value="high">high</option><option value="Looking">Looking</option><option value="saying">saying</option><option value="that">that</option><option value="underrated">underrated</option><option value="waving">waving</option></select></span> <br />Never coming down with your hand in mine<br />With your hand in mine<br />(Yeah, yeah, yeah, yeah) No-no, no-no, 'cause we made it<br />(Yeah, yeah, yeah, yeah)<br />(Yeah, yeah, yeah, yeah) Yeah, 'cause we made it<br />(Yeah, yeah, yeah, yeah) Never coming down with your hand in mine
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-70472008125235029792021-04-19T15:11:00.003-07:002021-04-19T15:20:22.836-07:00LAURA MARANO - LET ME CRY<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/6xlX5R9euBU" width="320" youtube-src-id="6xlX5R9euBU"></iframe></div><p style="text-align: center;"><br /></p><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="LAURA MARANO - LET ME CRY" />
<title>
LAURA MARANO - LET ME CRY
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0064\u0072\u0065\u0073\u0073\u0069\u006E\u0067';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0046\u0065\u0065\u006C\u0069\u006E\u0067';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0074\u0068\u006F\u0075\u0067\u0068\u006F\u0075\u0074';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0065\u006D\u006F\u0074\u0069\u006F\u006E\u0061\u006C';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0063\u0061\u0075\u0073\u0065';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0066\u0065\u0065\u006C';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0064\u0065\u006C\u0065\u0074\u0065';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u006D\u0079\u0073\u0065\u006C\u0066';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0073\u0074\u0061\u006E\u0064';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u006A\u0075\u0073\u0074';
I[9][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">LAURA MARANO - LET ME CRY</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   cause      delete      dressing      emotional      feel      Feeling      just      myself      stand      thoughout   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
I know I'm being irrational<br />Right now a little bit flamable<br />So you better watch<br />Watch out<br />I know I'm <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> so casual<br />In my bed laying diagonal<br />Cause I'm all alone now<br />Right now<br />In three words<br />My heart hurts<br />So why do I feel it in my whole body?<br />All over<br />It's the worst<br /><span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> down has just become a hobby<br />I'll stand on my feet, but not today<br />I'll hit delete, throw it all away<br />I'll be so sweet, right to your face<br />But when you leave just let me cry<br />Get it all out baby<br />I'll be alright just gotta play<br />Alanis all night and <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> the day<br />I'll pick myself up but not today<br />Today I am a mess just let me cry<br />Get it all out baby<br />Boy you're not even <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> <br />Out of every night, uncontrollable<br />How do you do it?<br />How?<br />Why are you post everything you do?<br />Is it <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> you want me to know that you<br />You doing better<br />Better than me<br />In three words<br />My heart hurts<br />So why do I <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> it in my whole body?<br />All over<br />It's the worst<br />Feeling down has just become a hobby<br />I'll stand on my feet, but not today<br />I'll hit <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span>, throw it all away<br />I'll be so sweet, right to your face<br />But when you leave just let me cry<br />Get it all out baby<br />I'll be alright just gotta play<br />Alanis all night and thoughout the day<br />I'll pick <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> up but not today<br />Today I am a mess just let me cry<br />Get it all out baby<br />All night<br />Just let me kick, let me scream<br />Just let me kick, let me scream in my pillow<br />Just let me get, get you out (let me get you out)<br />Just let me get, get you out of my system<br />I'll <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> on my feet, but not today<br />I'll hit delete, throw it all away<br />I'll be so sweet, right to your face<br />But when you leave just let me cry<br />Get it all out baby<br />I'll be alright <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="cause">cause</option><option value="delete">delete</option><option value="dressing">dressing</option><option value="emotional">emotional</option><option value="feel">feel</option><option value="Feeling">Feeling</option><option value="just">just</option><option value="myself">myself</option><option value="stand">stand</option><option value="thoughout">thoughout</option></select></span> gotta play<br />Alanis all night and thoughout the day<br />I'll pick myself up but not today<br />Today I am a mess just let me cry<br />Get it all out baby
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-4654386552488844212021-04-19T13:35:00.006-07:002021-04-19T15:59:31.742-07:00MELANIE MARTINEZ - SHOW & TELL<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/8cXPoQ5WalM" width="320" youtube-src-id="8cXPoQ5WalM"></iframe></div><p style="text-align: center;"><br /></p><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="MELANIE MARTINEZ - SHOW & TELL" />
<title>
MELANIE MARTINEZ - SHOW & TELL
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0074\u0072\u0065\u0061\u0074';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0068\u0061\u0072\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0066\u0075\u0063\u006B\u0065\u0072\u0073';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0042\u0075\u0079';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0062\u0065\u0067';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0068\u0061\u0072\u0064';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0064\u0069\u0073\u0070\u006C\u0061\u0079';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0068\u0065\u0061\u0072\u0020\u006D\u0065';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0048\u0061\u0072\u0073\u0068';
I[8][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">MELANIE MARTINEZ - SHOW & TELL</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   beg      Buy      display      fuckers      hard      Harsh      hear me      treat   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
You pull me by my hair, so I don't go nowhere<br />Tell me you love me, but you <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> me like I'm never there<br />You say the cruelest words, you used to break my heart<br />'Cause I'm over here working my ass off<br />Why is it so <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> to see? (Why?)<br />If I cut myself, I would bleed (kill me)<br />I'm just like you, you're like me<br />Imperfect and human, are we?<br />Show and tell<br />I'm on display for all you <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> to see<br />Show and tell<br />Harsh words if you don't get a pic with me<br /><span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> and sell (buy and sell me, baby)<br />Like I'm a product to society<br />Art don't sell<br />Unless you fucked every authority<br />You <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> and cry for more, he had 'em on the floor<br />There are strangers takin' pictures of me when I ask "No more"<br />It's really hard for me to say just how I feel<br />I'm scared that I'll get thrown away like a banana peel<br />Why is it so <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> to see? (Why?)<br />If I cut myself, I would bleed (kill me)<br />I'm just like you, you're like me<br />Imperfect and human, are we?<br />Show and tell (show and tell)<br />I'm on <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> for all you fuckers to see (fuckers to see)<br />Show and tell (show and tell)<br />Harsh words if you don't get a pic with me<br />Buy and sell (buy and sell)<br />Like I'm a product to society<br />Art don't sell<br />Unless you fucked every authority<br />Show and tell<br />Why can't you fucking <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span>?<br />Show and tell, um<br />Are you listening yet?<br />Show and tell (show and tell, baby)<br />I'm on display for all you fuckers to see (fuckers to see)<br />Show and tell (oh)<br /><span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="beg">beg</option><option value="Buy">Buy</option><option value="display">display</option><option value="fuckers">fuckers</option><option value="hard">hard</option><option value="Harsh">Harsh</option><option value="hear me">hear me</option><option value="treat">treat</option></select></span> words if you don't get a pic with me<br />Buy and sell<br />Like I'm a product to society<br />Art don't sell<br />Unless you fucked every authority
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-16836070220834414342021-04-19T13:28:00.001-07:002021-04-19T16:00:34.430-07:00SAM SMITH - FIRE ON FIRE<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/vk_xq1P7vIU" width="320" youtube-src-id="vk_xq1P7vIU"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="SAM SMITH - FIRE ON FIRE" />
<title>
SAM SMITH - FIRE ON FIRE
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0073\u0074\u0061\u0072\u0074\u0065\u0064';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0074\u0068\u0069\u006E\u006B';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0073\u0074\u0065\u0061\u006C';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u006D\u0075\u0063\u0068';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u006F\u006E\u006C\u0079';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0074\u0068\u0065\u006E';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0062\u0072\u0065\u0061\u0074\u0068';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0075\u006E\u0066\u006F\u006C\u0064';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u006E\u006F\u0072\u006D\u0061\u006C\u006C\u0079';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0073\u0069\u006E\u006E\u0065\u0072\u0073';
I[9][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">SAM SMITH - FIRE ON FIRE</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   breath      much      normally      only      sinners      started      steal      then      think      unfold   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
My mother said I'm too romantic<br />She said, "You're dancing in the movies"<br />I almost <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> to believe her<br />Then I saw you and I knew<br />Maybe it's 'cause I got a little bit older<br />Maybe it's all that I've been through<br />I'd like to <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> it's how you lean on my shoulder<br />And how I see myself with you<br />I don't say a word <br />But still, you take my breath and <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> the things I know<br />There you go, saving me from out of the cold<br />Fire on fire would normally kill us<br />But this <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> desire, together, we're winners<br />They say that we're out of control and some say we're sinners<br />But don't let them ruin our beautiful rhythms<br />'Cause when you unfold me and tell me you love me<br />And look in my eyes<br />You are perfection, my <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> direction<br />It's fire on fire, mmm<br />It's fire on fire<br />When we fight, we fight like lions<br />But <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> we love and feel the truth<br />We lose our minds in a city of roses<br />We won't abide by any rules<br />I don't say a word<br />But still, you take my <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> and steal the things I know<br />There you go, saving me from out of the cold<br />Fire on fire would normally kill us<br />But this much desire, together, we're winners<br />They say that we're out of control and some say we're sinners<br />But don't let them ruin our beautiful rhythms<br />'Cause when you <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> me and tell me you love me<br />And look in my eyes<br />You are perfection, my only direction<br />It's fire on fire, oh<br />It's fire on fire<br />Fire on fire would <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> kill us<br />But this much desire, together, we're winners<br />They say that we're out of control and some say we're sinners<br />But don't let them ruin our beautiful rhythms<br />Fire on fire would normally kill us<br />But this much desire, together, we're winners<br />They say that we're out of control and some say we're <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="breath">breath</option><option value="much">much</option><option value="normally">normally</option><option value="only">only</option><option value="sinners">sinners</option><option value="started">started</option><option value="steal">steal</option><option value="then">then</option><option value="think">think</option><option value="unfold">unfold</option></select></span> <br />But don't let them ruin our beautiful rhythms<br />'Cause when you unfold me and tell me you love me<br />And look in my eyes<br />You are perfection, my only direction<br />It's fire on fire<br />You are perfection, my only direction<br />It's fire on fire
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com4tag:blogger.com,1999:blog-839493942869762721.post-53197803420559576072021-04-19T12:29:00.004-07:002021-04-19T13:24:24.891-07:00SAM SMITH - FIRE ON FIRE<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/vk_xq1P7vIU" width="320" youtube-src-id="vk_xq1P7vIU"></iframe></div><br /><div class="separator" style="clear: both; text-align: center;"><br /></div><br /><div class="separator" style="clear: both; text-align: center;"><br /></div><p style="text-align: center;"><br /></p>
<html lang="en" prefix="dc: http://purl.org/dc/elements/1.1/" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head><meta content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa." name="author"></meta><meta content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria" name="keywords"></meta>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type"></meta>
<meta content="Francisco Ochoa" name="dc:creator"></meta>
<meta content="SAM SMITH - FIRE ON FIRE" name="dc:title"></meta>
<title>
SAM SMITH - FIRE ON FIRE
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0073\u0074\u0061\u0072\u0074\u0065\u0064\u0020\u0074\u006F';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0073\u0061\u0079\u0020\u0061\u0020\u0077\u006F\u0072\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0063\u006F\u006E\u0074\u0072\u006F\u006C\u0020\u0061\u006E\u0064';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0074\u0068\u0065\u006E\u0020\u0077\u0065\u0020\u006C\u006F\u0076\u0065';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u006D\u0075\u0063\u0068\u0020\u0064\u0065\u0073\u0069\u0072\u0065';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0077\u006F\u0075\u006C\u0064\u0020\u006E\u006F\u0072\u006D\u0061\u006C\u006C\u0079';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0074\u0068\u0065\u006D\u0020\u0072\u0075\u0069\u006E';
I[6][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body id="TheBody" onload="StartUp()">
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">SAM SMITH - FIRE ON FIRE</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div class="StdDiv" id="InstructionsDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div class="StdDiv" id="WordsDiv">
<span class="ClozeWordList" id="WordList"> control and much desire say a word started to them ruin then we love would normally </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form autocomplete="off" id="Cloze" method="post" onsubmit="return false;">
<div class="ClozeBody">
My mother said I'm too romantic<br />She said, "You're dancing in the movies"<br />I almost <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="control and">control and</option><option value="much desire">much desire</option><option value="say a word">say a word</option><option value="started to">started to</option><option value="them ruin">them ruin</option><option value="then we love">then we love</option><option value="would normally">would normally</option></select></span> believe her<br />Then I saw you and I knew<br />Maybe it's 'cause I got a little bit older<br />Maybe it's all that I've been through<br />I'd like to think it's how you lean on my shoulder<br />And how I see myself with you<br />I don't <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="control and">control and</option><option value="much desire">much desire</option><option value="say a word">say a word</option><option value="started to">started to</option><option value="them ruin">them ruin</option><option value="then we love">then we love</option><option value="would normally">would normally</option></select></span> <br />But still, you take my breath and steal the things I know<br />There you go, saving me from out of the cold<br />Fire on fire would normally kill us<br />But this much desire, together, we're winners<br />They say that we're out of <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="control and">control and</option><option value="much desire">much desire</option><option value="say a word">say a word</option><option value="started to">started to</option><option value="them ruin">them ruin</option><option value="then we love">then we love</option><option value="would normally">would normally</option></select></span> some say we're sinners<br />But don't let them ruin our beautiful rhythms<br />'Cause when you unfold me and tell me you love me<br />And look in my eyes<br />You are perfection, my only direction<br />It's fire on fire, mmm<br />It's fire on fire<br />When we fight, we fight like lions<br />But <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="control and">control and</option><option value="much desire">much desire</option><option value="say a word">say a word</option><option value="started to">started to</option><option value="them ruin">them ruin</option><option value="then we love">then we love</option><option value="would normally">would normally</option></select></span> and feel the truth<br />We lose our minds in a city of roses<br />We won't abide by any rules<br />I don't say a word<br />But still, you take my breath and steal the things I know<br />There you go, saving me from out of the cold<br />Fire on fire would normally kill us<br />But this <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="control and">control and</option><option value="much desire">much desire</option><option value="say a word">say a word</option><option value="started to">started to</option><option value="them ruin">them ruin</option><option value="then we love">then we love</option><option value="would normally">would normally</option></select></span>, together, we're winners<br />They say that we're out of control and some say we're sinners<br />But don't let them ruin our beautiful rhythms<br />'Cause when you unfold me and tell me you love me<br />And look in my eyes<br />You are perfection, my only direction<br />It's fire on fire, oh<br />It's fire on fire<br />Fire on fire <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="control and">control and</option><option value="much desire">much desire</option><option value="say a word">say a word</option><option value="started to">started to</option><option value="them ruin">them ruin</option><option value="then we love">then we love</option><option value="would normally">would normally</option></select></span> kill us<br />But this much desire, together, we're winners<br />They say that we're out of control and some say we're sinners<br />But don't let them ruin our beautiful rhythms<br />Fire on fire would normally kill us<br />But this much desire, together, we're winners<br />They say that we're out of control and some say we're sinners<br />But don't let <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="control and">control and</option><option value="much desire">much desire</option><option value="say a word">say a word</option><option value="started to">started to</option><option value="them ruin">them ruin</option><option value="then we love">then we love</option><option value="would normally">would normally</option></select></span> our beautiful rhythms<br />'Cause when you unfold me and tell me you love me<br />And look in my eyes<br />You are perfection, my only direction<br />It's fire on fire<br />You are perfection, my only direction<br />It's fire on fire
</div>
</form>
</div>
<button class="FuncButton" id="CheckButton2" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button class="FuncButton" id="FeedbackOKButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-22036634775038546902021-04-19T11:36:00.002-07:002021-04-19T11:51:22.798-07:00BRUNO MARS - TALKING TO THE MOON<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/F1Q4_30x9gw" width="320" youtube-src-id="F1Q4_30x9gw"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="BRUNO MARS - TALKING TO THE MOON" />
<title>
BRUNO MARS - TALKING TO THE MOON
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0074\u0068\u0069\u006E\u006B';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u006C\u0069\u0067\u0068\u0074';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0068\u006F\u0070\u0065\u0073';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0066\u0065\u0065\u006C\u0069\u006E\u0067';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0077\u0068\u0065\u006E';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0073\u0069\u0064\u0065';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0065\u0076\u0065\u0072\u0079';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0073\u006F\u006D\u0065\u0077\u0068\u0065\u0072\u0065';
I[7][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">BRUNO MARS - TALKING TO THE MOON</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   every      feeling      hopes      light      side      somewhere      think      when   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
I know you're somewhere out there<br />Somewhere far away<br />I want you back, I want you back<br />My neighbors <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span> I'm crazy<br />But they don't understand<br />You're all I have, you're all I have<br />At night, when the stars <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span> up my room<br />I sit by myself<br />Talking to the moon<br />Trying to get to you<br />In <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span> you're on the other side, talking to me too<br />Or am I a fool, who sits alone, talking to the moon?<br />Oh<br />I'm <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span> like I'm famous, the talk of the town<br />They say I've gone mad<br />Yeah, I've gone mad<br />But they don't know what I know<br />'Cause <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span> the sun goes down, someone's talking back<br />Yeah, they're talking back, oh<br />At night, when the stars light up my room<br />I sit by myself<br />Talking to the moon<br />Trying to get to you<br />In hopes you're on the other <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span>, talking to me too<br />Or am I a fool, who sits alone, talking to the moon?<br />Do you ever hear me calling?<br />(Ah-ah, ah-ah, ah-ah) Oh-oh-oh, oh-oh-oh<br />'Cause <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span> night, I'm talking to the moon<br />Still trying to get to you<br />In hopes you're on the other side, talking to me too<br />Or am I a fool, who sits alone, talking to the moon?<br />Oh<br />I know you're <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="every">every</option><option value="feeling">feeling</option><option value="hopes">hopes</option><option value="light">light</option><option value="side">side</option><option value="somewhere">somewhere</option><option value="think">think</option><option value="when">when</option></select></span> out there<br />Somewhere far away
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com29tag:blogger.com,1999:blog-839493942869762721.post-33814822580769209362021-04-19T11:11:00.001-07:002021-04-19T11:12:56.879-07:00THE BEATLES - HELP!<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/2Q_ZzBGPdqE" width="320" youtube-src-id="2Q_ZzBGPdqE"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="THE BEATLES - HELP!" />
<title>
THE BEATLES - HELP!
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u006E\u0065\u0065\u0064\u0065\u0064';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0061\u0073\u0073\u0075\u0072\u0065\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0063\u0061\u006E';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0063\u0068\u0061\u006E\u0067\u0065\u0064';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0066\u0065\u0065\u006C\u0069\u006E\u0067';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0079\u006F\u0075\u006E\u0067\u0065\u0072';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u006F\u0070\u0065\u006E\u0065\u0064';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0066\u0065\u0065\u0074';
I[7][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">THE BEATLES - HELP!</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   assured      can      changed      feeling      feet      needed      opened      younger   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
I need somebody<br />(Help!) not just anybody<br />(Help!) you know I need someone<br />Help!<br />I never <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span> anybody's help in any way<br />But now these days are gone, I'm not so self <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span> (but now these days are gone)<br />(And now I find) Now I find I've changed my mind and opened up the doors<br />Help me if you <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span>, I'm feeling down<br />And I do appreciate you being 'round<br />Help me get my feet back on the ground<br />Won't you please, please help me?<br />And now my life has <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span> in oh so many ways (and now my life has changed)<br />My independence seems to vanish in the haze<br />But every now and then I feel so insecure (I know that I)<br />I know that I just need you like I've never done before<br />Help me if you can, I'm <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span> down<br />And I do appreciate you being 'round<br />Help me get my feet back on the ground<br />Won't you please, please help me<br />When I was <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span>, so much younger than today<br />I never needed anybody's help in any way<br />But now these days are gone, I'm not so self assured (but now these days are gone)<br />(And now I find) now I find I've changed my mind and <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span> up the doors<br />Help me if you can, I'm feeling down<br />And I do appreciate you being 'round<br />Help me get my <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="assured">assured</option><option value="can">can</option><option value="changed">changed</option><option value="feeling">feeling</option><option value="feet">feet</option><option value="needed">needed</option><option value="opened">opened</option><option value="younger">younger</option></select></span> back on the ground<br />Won't you please, please help me, help me, help me, ooh
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com17tag:blogger.com,1999:blog-839493942869762721.post-50104238498701943732021-03-15T12:24:00.000-07:002021-03-15T12:25:48.805-07:00CHARLIE PUTH - ATTENTION<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/nfs8NYg7yQM" width="320" youtube-src-id="nfs8NYg7yQM"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="CHARLIE PUTH - ATTENTION" />
<title>
CHARLIE PUTH - ATTENTION
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0064\u0072\u0065\u0073\u0073';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0074\u0068\u006F\u0075\u0067\u0068\u0074';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0061\u006C\u0072\u0065\u0061\u0064\u0079';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u006D\u0061\u006B\u0069\u006E\u0067';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0074\u0068\u0069\u006E\u006B\u0069\u006E\u0067';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u006F\u0076\u0065\u0072';
I[5][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">CHARLIE PUTH - ATTENTION</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   already      dress      making      over      thinking      thought   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Oh-oh, ooh<br />You've been runnin' round, runnin' round, runnin' round throwin' that dirt all on my name<br />'Cause you knew that I, knew that I, knew that I'd call you up<br />You've been going round, going round, going round every party in L.A.<br />'Cause you knew that I, knew that I, knew that I'd be at one, oh<br />I know that <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="already">already</option><option value="dress">dress</option><option value="making">making</option><option value="over">over</option><option value="thinking">thinking</option><option value="thought">thought</option></select></span> is karma, perfume regret<br />You got me thinking 'bout when you were mine, oh<br />And now I'm all up on ya, what you expect?<br />But you're not coming home with me tonight<br />You just want attention, you don't want my heart<br />Maybe you just hate the <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="already">already</option><option value="dress">dress</option><option value="making">making</option><option value="over">over</option><option value="thinking">thinking</option><option value="thought">thought</option></select></span> of me with someone new<br />Yeah, you just want attention, I knew from the start<br />You're just making sure I'm never gettin' over you<br />you've been runnin' round, runnin' round, runnin' round throwing that dirt all on my name<br />'Cause you knew that I, knew that I, knew that I'd call you up<br />Baby, now that we're, now that we're, now that we're right here standing face-to-face<br />You already know, <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="already">already</option><option value="dress">dress</option><option value="making">making</option><option value="over">over</option><option value="thinking">thinking</option><option value="thought">thought</option></select></span> know, already know that you won, oh<br />I know that dress is karma (dress is karma), perfume regret<br />You got me thinking 'bout when you were mine (you got me thinking 'bout when you were mine)<br />And now I'm all up on ya (all up on ya), what you expect? (oh baby)<br />But you're not coming home with me tonight (oh no)<br />You just want attention, you don't want my heart<br />Maybe you just hate the thought of me with someone new<br />Yeah, you just want attention, I knew from the start<br />You're just <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="already">already</option><option value="dress">dress</option><option value="making">making</option><option value="over">over</option><option value="thinking">thinking</option><option value="thought">thought</option></select></span> sure I'm never gettin' over you, oh<br />What are you doin' to me, what are you doin', huh?<br />(What are you doin'?)<br />What are you doin' to me, what are you doin', huh?<br />(What are you doin'?)<br />What are you doin' to me, what are you doin', huh?<br />(What are you doin'?)<br />What are you doin' to me, what are you doin', huh?<br />I know that dress is karma, perfume regret<br />You got me <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="already">already</option><option value="dress">dress</option><option value="making">making</option><option value="over">over</option><option value="thinking">thinking</option><option value="thought">thought</option></select></span> 'bout when you were mine<br />And now I'm all up on ya, what you expect?<br />But you're not coming home with me tonight<br />You just want attention, you don't want my heart<br />Maybe you just hate the thought of me with someone new<br />Yeah, you just want attention, I knew from the start<br />You're just making sure I'm never gettin' <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="already">already</option><option value="dress">dress</option><option value="making">making</option><option value="over">over</option><option value="thinking">thinking</option><option value="thought">thought</option></select></span> you (over you)<br />What are you doin' to me? (hey) what are you doin', huh? (what are you doin', what?)<br />(What are you doin', to me? What are you doin', huh?)<br />(What are you doin', to me? What are you doin', huh?)<br />(What are you doin' to me, what are you doin', huh?)
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-31587607157556871782021-03-15T12:17:00.001-07:002021-03-15T12:18:19.389-07:00CHARLIE PUTH - BOY<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/iILJvqrAQ_w" width="320" youtube-src-id="iILJvqrAQ_w"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="CHARLIE PUTH - BOY" />
<title>
CHARLIE PUTH - BOY
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0061\u006C\u0077\u0061\u0079\u0073';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0063\u006F\u0075\u0070\u006C\u0065';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u004E\u006F\u0077';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0079\u006F\u0075\u006E\u0067';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0077\u0061\u006B\u0065';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u006E\u0065\u0065\u0064\u0065\u0064';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0072\u006F\u0075\u006E\u0064';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0074\u0068\u0061\u0074';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0067\u0061\u0076\u0065';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u006E\u0069\u006E\u0065\u0074\u0069\u0065\u0073';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0077\u0061\u006E\u0074\u0065\u0064';
I[10][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">CHARLIE PUTH - BOY</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   always      couple      gave      needed      nineties      Now      round      that      wake      wanted      young   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
I got these girls tryin' to lock me down<br />And I <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> let them leave<br />But for the first time in a while<br />I wanna throw away the key<br />And I know you've been in a <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> more relationships than me<br />'Cause you talk a different talk<br />And you kiss me differently<br /><span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> I don't know where to go<br />After you love me this way<br />After you love me so good<br />How are you gonna tell me you don't wanna stay?<br />Uh<br />You tell me I'm too <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> but<br />I gave you what you wanted<br />Baby, how do you treat me just fine<br />Like a boy<br />You won't <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> up beside me<br />'Cause I was born in the nineties<br />Baby, how do you treat me just fine<br />Like a boy<br />Go and treat me like (Boy)<br />Go and treat me like (Oh oh oh oh oh)<br />Oh oh oh oh oh oh oh oh oh oh<br />You told me you <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> a perfect guy<br />That'll make your parents proud<br />'Cause you still ain't found him yet<br />'Cause we're still missing a <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> <br />And now you watch me put in all this work<br />Just to say it won't work out<br />You never took me seriously<br />Now what the hell is <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> about?<br />Now I don't know where to go<br />After you love me this way<br />After you love me so good<br />How are you gonna tell me you don't wanna stay?<br />Uh<br />You tell me I'm too young but<br />I <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> you what you wanted<br />Baby, how do you treat me just fine<br />Like a boy<br />You won't wake up beside me<br />'Cause I was born in the <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> <br />Baby, how do you treat me just fine<br />Like a boy<br />Go and treat me like (Boy)<br />Go and treat me like (Oh oh oh oh oh)<br />Oh oh oh oh oh oh oh oh oh oh<br />Baby, don't you treat me like a boy (Boy)<br />Go and treat me like (Boy)<br />Go and treat me like (Oh oh oh oh oh)<br />Oh oh oh oh oh oh oh oh oh oh<br />Oh oh oh, oh oh oh<br />Oh oh oh, oh oh oh<br />Oh oh oh, oh oh oh<br />Oh oh oh, oh oh oh<br />Uh<br />You tell me I'm too young but<br />I gave you what you <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="always">always</option><option value="couple">couple</option><option value="gave">gave</option><option value="needed">needed</option><option value="nineties">nineties</option><option value="Now">Now</option><option value="round">round</option><option value="that">that</option><option value="wake">wake</option><option value="wanted">wanted</option><option value="young">young</option></select></span> <br />Baby, how do you treat me just fine<br />Like a boy<br />You won't wake up beside me<br />'Cause I was born in the nineties<br />Baby, how do you treat me just fine<br />Like a boy<br />Go and treat me like (Boy)<br />Go and treat me like (Oh oh oh oh oh)<br />Oh oh oh oh oh oh oh oh oh oh<br />Baby, don't you treat me like a boy (Boy)<br />Go and treat me like (Boy)<br />Go and treat me like (Oh oh oh oh oh)<br />Oh oh oh oh oh oh oh oh oh oh<br />Just fine, like a boy<br />Just fine, like a boy
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-8304205256259278932021-03-15T11:58:00.001-07:002021-03-15T12:01:32.342-07:00ARROWS TO ATHENS - BLACK SKY<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/fKpvjcHZy9M" width="320" youtube-src-id="fKpvjcHZy9M"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="ARROWS TO ATHENS - BLACK SKY" />
<title>
ARROWS TO ATHENS - BLACK SKY
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0061\u006C\u0077\u0061\u0079\u0073';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0073\u006F\u0075\u006E\u0064';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0077\u0061\u006E\u0074';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0070\u0069\u0065\u0063\u0065\u0073';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0054\u006F\u006E\u0069\u0067\u0068\u0074';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0073\u006F\u0075\u006E\u0064';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0073\u0074\u0061\u0072\u0074\u0069\u006E\u0067';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0066\u0061\u006C\u006C\u0069\u006E\u0067';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0061\u0067\u0061\u0069\u006E';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0062\u0075\u0072\u006E\u0073';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0068\u0069\u0067\u0068\u0065\u0072';
I[10][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">ARROWS TO ATHENS - BLACK SKY</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   again      always      burns      falling      higher      pieces      sound      starting      Tonight      want   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
I <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> knew a missing piece<br />Was waiting in the dark<br />Like a quiet melody<br />But if I listened hard<br />I could hear the <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> <br />Rising from the ground<br />Every moment until now<br />I was dying to change from a spark to a flame<br />I <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> fire, fire<br />It burns bright<br />I'm fighting to reach it<br />But the higher higher<br />That I fly i'm falling to <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> inside<br />Even when it's hot, even when it's hot<br />Never gonna quit, never gonna stop<br />Fire, fire<br /><span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> I'm lighting up the black sky<br />On the edge of giving up<br />Letting go tonight<br />But I have waited long enough<br />And when I close my eyes<br />I can hear the <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> <br />Rising from the ground<br />I want to let it out<br />'Cause i'm <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> to change from a spark to a flame<br />I want fire, fire<br />It burns bright<br />I'm fighting to reach it<br />But the higher higher<br />That I fly i'm <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> to pieces inside<br />Even when it's hot, even when it's hot<br />Never gonna quit, never gonna stop<br />Fire, fire<br />Tonight I'm lighting up the black sky<br />Oh, can feel it burn, burn, burn<br />But I won't go back <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> <br />Oh, I can feel it burn, burn, burn<br />But I won't go back again<br />Fire, fire<br />It <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> bright<br />I'm fighting to reach it<br />But the higher, higher<br />That I fly i'm falling to pieces inside<br />I want fire, fire<br />It burns bright<br />I'm fighting to reach it<br />But the higher <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="again">again</option><option value="always">always</option><option value="burns">burns</option><option value="falling">falling</option><option value="higher">higher</option><option value="pieces">pieces</option><option value="sound">sound</option><option value="starting">starting</option><option value="Tonight">Tonight</option><option value="want">want</option></select></span> <br />That I fly i'm galling to pieces inside<br />Even when it's hot, even when it's hot<br />Never gonna quit, never gonna stop<br />Fiire, fire<br />Tonight I'm lighting up the black sky
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-35449186232109678232021-03-15T11:51:00.003-07:002021-03-15T11:52:11.815-07:00MARSHMELLO, ANNE-MARIE - FRIENDS<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/CY8E6N5Nzec" width="320" youtube-src-id="CY8E6N5Nzec"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="MARSHMELLO, ANNE-MARIE - FRIENDS" />
<title>
MARSHMELLO, ANNE-MARIE - FRIENDS
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0073\u0061\u0079';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u006D\u0065\u0073\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\u006B\u0065';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0072\u0065\u0061\u006C\u006C\u0079';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u0070\u006F\u006C\u0069\u0074\u0065';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u0073\u0070\u0065\u006C\u006C';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0057\u0061\u006E\u0074';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0070\u006F\u0075\u0072\u0069\u006E\u0067';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0069\u006E\u0073\u0061\u006E\u0065';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0074\u006F\u006C\u0064';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u006F\u0075\u0074';
I[10][2]='';
I[11] = new Array();
I[11][1] = new Array();
I[11][1][0] = new Array();
I[11][1][0][0] = '\u0074\u0068\u0061\u0074';
I[11][2]='';
I[12] = new Array();
I[12][1] = new Array();
I[12][1][0] = new Array();
I[12][1][0][0] = '\u0072\u0065\u0061\u0073\u006F\u006E\u0065\u0064';
I[12][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">MARSHMELLO, ANNE-MARIE - FRIENDS</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   insane      make      mess      out      polite      pouring      really      reasoned      say      spell      that      told      Want   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
Ooh ooh, ooh ooh<br />Ooh ooh, ooh ooh<br />You say you love me, I <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> you crazy<br />We're nothing more than friends<br />You're not my lover, more like a brother<br />I known you since we were like ten, yeah<br />Don't <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> it up, talking that shit<br />Only gonna push me away, that's it<br />When you say you love me, that <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> me crazy<br />Here we go again<br />Don't go look at me with that look in your eye<br />You <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> ain't going away without a fight<br />You can't be reasoned with, I'm done being <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> <br />I've told you one, two, three, four, five, six thousand times<br />Haven't I made it obvious?<br />Haven't I made it clear?<br />Want me to <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> it out for you?<br />F-R-I-E-N-D-S<br />Haven't I made it obvious?<br />Haven't I made it clear?<br /><span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> me to spell it out for you?<br />F-R-I-E-N-D-S<br />F-R-I-E-N-D-S<br />Have you got no shame? You looking insane<br />Turning up at my door<br />It's two in the morning, the rain is <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> <br />Haven't we been here before?<br />Don't mess it up, talking that shit<br />Only gonna push me away, that's it<br />Have you got no shame? You looking <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> <br />Here we go again<br />So don't go look at me with that look in your eye<br />You really ain't going away without a fight<br />You can't be reasoned with, I'm done being polite<br />I've <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> you one, two, three, four, five, six thousand times<br />Haven't I made it obvious? (Haven't I made it?)<br />Haven't I made it clear? (Haven't I made it clear?)<br />Want me to spell it out for you?<br />F-R-I-E-N-D-S<br />Haven't I made it obvious?<br />Haven't I made it clear? (Haven't I?)<br />Want me to spell it <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> for you? (To spell it out for you?)<br />F-R-I-E-N-D-S<br />F-R-I-E-N-D-S<br />F-R-I-E-N-D-S<br />That's how you f- spell "friends"<br />F-R-I-E-N-D-S<br />Get <span class="GapSpan" id="GapSpan11"><select id="Gap11"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> shit inside your head<br />No, no, yeah, uh, ah<br />F-R-I-E-N-D-S<br />We're just friends<br />So don't go look at me with that look in your eye<br />You really ain't going nowhere without a fight<br />You can't be <span class="GapSpan" id="GapSpan12"><select id="Gap12"><option value=""> </option><option value="insane">insane</option><option value="make">make</option><option value="mess">mess</option><option value="out">out</option><option value="polite">polite</option><option value="pouring">pouring</option><option value="really">really</option><option value="reasoned">reasoned</option><option value="say">say</option><option value="spell">spell</option><option value="that">that</option><option value="told">told</option><option value="Want">Want</option></select></span> with, I'm done being polite<br />I've told you one, two, three, four, five, six thousand times<br />Haven't I made it obvious? (Have I not made it obvious?)<br />Haven't I made it clear? (I made it very clear)<br />Want me to spell it out for you? (Yo)<br />F-R-I-EN-D-S (I said F-R-I-E-N-D-S)<br />Haven't I made it obvious? (I made it very obvious)<br />Haven't I made it clear? (I made it very clear)<br />Want me to spell it out for you?<br />F-R-I-E-N-D-S<br />F-R-I-E-N-D-S<br />Mmm, ooh ooh, ooh ooh<br />Ah, ah-oh, ah
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0tag:blogger.com,1999:blog-839493942869762721.post-9918903817133079932021-03-15T11:26:00.001-07:002021-03-15T11:27:00.963-07:00CHARLIE PUTH - WE DON'T TALK ANYMORE<p style="text-align: center;"><b> Play the song and follow the lyrics...</b></p><p style="text-align: center;"></p><div class="separator" style="clear: both; text-align: center;"><iframe allowfullscreen="" class="BLOG_video_class" height="266" src="https://www.youtube.com/embed/3AtDnEC4zak" width="320" youtube-src-id="3AtDnEC4zak"></iframe></div><br /><b><br /></b><p></p>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" prefix="dc: http://purl.org/dc/elements/1.1/">
<head><meta name="author" content="Created with Hot Potatoes by Half-Baked Software, registered to Francisco Ochoa."/><meta name="keywords" content="Hot Potatoes, Hot Potatoes, Half-Baked Software, Windows, University of Victoria"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="dc:creator" content="Francisco Ochoa" />
<meta name="dc:title" content="CHARLIE PUTH - WE DON'T TALK ANYMORE" />
<title>
CHARLIE PUTH - WE DON'T TALK ANYMORE
</title>
<!-- Made with executable version 7.0 Release 3 Build 0 -->
<!-- The following insertion allows you to add your own code directly to this head tag from the configuration screen -->
<style>
/* 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 7.0 Release 3 Build 0 */
/* CSS variables for colours. */
:root{
--strFontFace: "Century Gothic",Geneva,Arial,sans-serif;
--strFontSize: medium;
--strTextColor: #000000;
--strTitleColor: #000000;
--strFuncLightColor: #ffffff;
--strFuncShadeColor: #7f7f7f;
--strLinkColor: #0000FF;
--strVLinkColor: #0000CC;
--strNavBarColor: #000000;
--strNavLightColor: #7f7f7f;
--strNavShadeColor: #000000;
--strNavTextColor: #ffffff;
--strPageBGColor: #C0C0C0;
--strExBGColor: #FFFFFF;
}
body{
font-family: var(--strFontFace);
background-color: var(--strPageBGColor);
color: var(--strTextColor);
margin-right: 5%;
margin-left: 5%;
font-size: var(--strFontSize);
padding-bottom: 0.5em;
}
p{
text-align: left;
margin: 0px;
font-size: 1em;
}
table,div,span,td{
font-size: 1em;
color: var(--strTextColor);
}
div.Titles{
padding: 0.5em;;
text-align: center;
color: var(--strTitleColor);
}
button{
font-family: var(--strFontFace);
font-size: 1em;
display: inline;
}
.ExerciseTitle{
font-size: 140%;
color: var(--strTitleColor);
}
.ExerciseSubtitle{
font-size: 120%;
color: var(--strTitleColor);
}
div.StdDiv, div.ExerciseContainer, div.ReadingContainer{
background-color: var(--strExBGColor);
text-align: center;
font-size: 1em;
color: var(--strTextColor);
padding: 0.5em;
border-style: solid;
border-width: 1px 1px 1px 1px;
border-color: var(--strTextColor);
margin-bottom: 1px;
}
div.ReadingContainer, div.ExerciseContainer{
min-width: 15em;
flex-grow: 1;
flex-basis: 0;
margin: 1px;
}
div#ContainerDiv{
margin: -1px;
padding: 0;
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
/* EndCorePageCSS */
.RTLText{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
.CentredRTLText{
text-align: center;
font-size: 150%;
direction: rtl;
font-family: "Simplified Arabic", "Traditional Arabic", "Times New Roman", var(--strFontFace);
}
button p.RTLText{
text-align: center;
}
.RTLGapBox{
text-align: right;
font-size: 150%;
direction: rtl;
font-family: "Times New Roman", var(--strFontFace);
}
.Guess{
font-weight: bold;
}
.CorrectAnswer{
font-weight: bold;
}
div#Timer{
padding: 0.25em;
margin-left: auto;
margin-right: auto;
text-align: center;
color: var(--strTitleColor);
}
span#TimerText{
padding: 0.25em;
border-width: 1px;
border-style: solid;
font-weight: bold;
display: none;
color: var(--strTitleColor);
}
span.Instructions{
}
div.ExerciseText{
}
.FeedbackText, .FeedbackText span.CorrectAnswer, .FeedbackText span.Guess, .FeedbackText span.Answer{
color: var(--strTitleColor);
}
.LeftItem{
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
.RightItem{
font-weight: bold;
font-size: 1em;
color: var(--strTextColor);
text-align: left;
}
span.CorrectMark{
}
input, textarea{
font-family: var(--strFontFace);
font-size: 120%;
}
select{
font-size: 1em;
}
div.Feedback {
background-color: var(--strPageBGColor);
left: 33%;
width: 34%;
top: 33%;
z-index: 1;
border-style: solid;
border-width: 1px;
padding: 5px;
text-align: center;
color: var(--strTitleColor);
position: absolute;
display: none;
font-size: 1em;
}
div.ExerciseDiv{
color: var(--strTextColor);
}
/* JMatch standard output table. */
table.MatchTable{
margin: 2em auto;
border-width: 0;
}
/* JMatch flashcard styles */
table.FlashcardTable{
background-color: transparent;
color: var(--strTextColor);
border-color: var(--strTextColor);
margin-left: auto;
margin-right: auto;
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: var(--strExBGColor);
}
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;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
background-color: var(--strPageBGColor);
}
table.FlashcardTable td.Hidden{
display: none;
}
/* JMix styles */
div.JMixDrag, div.JMatchDrag{
padding: 0;
background-color: var(--strPageBGColor);
border-style: none;
}
div#GuessDiv{
padding: 0.5em;
margin-bottom: 2em;
}
div#SegmentDiv{
margin-top: 2em;
margin-bottom: 2em;
text-align: center;
}
a.ExSegment{
font-size: 120%;
font-weight: bold;
text-decoration: none;
color: var(--strTextColor);
display: inline-block;
padding: 0.5em;
border: solid 1pt gray;
margin-bottom: 0.5em;
}
span.RemainingWordList{
font-style: italic;
}
div.DropLine {
position: absolute;
text-align: left;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--strTitleColor);
width: 80%;
left: 10%;
}
/* 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: var(--strFontFace);
font-size: 120%;
background-color: #ffffff;
color: #000000;
width: 2em;
border-style: solid;
border-width: 1px;
border-radius: 0.5em;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
}
/* JQuiz styles */
div.QuestionNavigation{
text-align: center;
}
.QNum{
margin: 0em 1em 0.5em 1em;
font-weight: bold;
vertical-align: middle;
}
textarea{
font-family: var(--strFontFace);
}
.QuestionText{
text-align: left;
margin: 0px;
font-size: 1em;
}
.Answer{
font-size: 120%;
}
.PartialAnswer{
font-size: 120%;
letter-spacing: 0.1em;
color: var(--strTitleColor);
}
.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 {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strFuncLightColor);
border-top-color: var(--strFuncLightColor);
border-right-color: var(--strFuncShadeColor);
border-bottom-color: var(--strFuncShadeColor);
color: var(--strTextColor);
background-color: var(--strExBGColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strFuncShadeColor);
}
.FuncButton:active {
box-shadow: none;
}
.FuncButton:hover{
color: var(--strExBGColor);
background-color: var(--strTextColor);
}
/*BeginNavBarStyle*/
div.NavButtonBar{
background-color: var(--strNavBarColor);
text-align: center;
margin: 0.25rem 0;
clear: both;
font-size: 1em;
padding: 0.2em;
box-sizing: border-box;
}
.NavButton {
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 3em;
border-left-color: var(--strNavLightColor);
border-top-color: var(--strNavLightColor);
border-right-color: var(--strNavShadeColor);
border-bottom-color: var(--strNavShadeColor);
background-color: var(--strNavBarColor);
color: var(--strNavTextColor);
border-width: 1pt;
cursor: pointer;
box-shadow: 0.2em 0.3em 0.2em var(--strNavShadeColor);
}
.NavButton:active {
box-shadow: none;
}
.NavButton:hover{
color: var(--strNavBarColor);
background-color: var(--strNavTextColor);
}
/*EndNavBarStyle*/
a{
color: var(--strLinkColor);
}
a:visited{
color: var(--strVLinkColor);
}
a:hover{
color: var(--strLinkColor);
}
div.CardStyle {
position: absolute;
font-family: var(--strFontFace);
font-size: 1em;
border-style: solid;
border-radius: 0.5em;
padding: 0.5em;
min-width: 2em;
border-width: 1pt;
color: var(--strTextColor);
box-shadow: 0.2em 0.3em 0.2em var(--strTextColor);
background-color: var(--strExBGColor);
left: -50px;
top: -50px;
overflow: visible;
touch-action: none;
user-select: none;
box-sizing: border-box;
}
div.CardStyleCentered{
text-align: center;
}
.rtl{
text-align: right;
font-size: 140%;
}
</style>
<script>
//<![CDATA[
<!--
//CODE FOR HANDLING NAV BUTTONS AND FUNCTION BUTTONS
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';
}
else{
Els[i].style.visibility = 'hidden';
}
}
}
}
function HideFeedback(){
document.getElementById('FeedbackDiv').style.display = 'none';
ShowElements(true, 'input');
ShowElements(true, 'select');
ShowElements(true, 'object');
}
//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].offsetWidth;
this.H = document.getElementsByTagName('body')[0].offsetHeight;
}
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;}
thisKey = e.keyCode;
var Suppress = false;
if (thisKey == 8) {
Suppress = true;
e.preventDefault();
}
}
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, '"')
}
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;
}
//SELECTION OBJECT FOR TYPING WITH KEYPAD
var selObj = null;
SelObj = function(box){
this.box = box;
this.selStart = this.box.selectionStart;
this.selEnd = this.box.selectionEnd;
this.selText = this.box.value.substring(this.selStart, this.selEnd);
return this;
}
function setSelText(newText){
var caretPos = this.selStart + newText.length;
var newValue = this.box.value.substring(0, this.selStart);
newValue += newText;
newValue += this.box.value.substring(this.selEnd, this.box.value.length);
this.box.value = newValue;
this.box.setSelectionRange(caretPos, caretPos);
this.box.focus();
}
SelObj.prototype.setSelText = setSelText;
function setSelSelectionRange(start, end){
this.box.setSelectionRange(start, end);
}
SelObj.prototype.setSelSelectionRange = setSelSelectionRange;
//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 = '';
}
}
}
//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] = '\u0077\u0065';
I[0][2]='';
I[1] = new Array();
I[1][1] = new Array();
I[1][1][0] = new Array();
I[1][1][0][0] = '\u0061\u006E\u0079\u006D\u006F\u0072\u0065';
I[1][2]='';
I[2] = new Array();
I[2][1] = new Array();
I[2][1][0] = new Array();
I[2][1][0][0] = '\u0065\u0076\u0065\u006E';
I[2][2]='';
I[3] = new Array();
I[3][1] = new Array();
I[3][1][0] = new Array();
I[3][1][0][0] = '\u0077\u0065\u0061\u0072\u0069\u006E\u0067';
I[3][2]='';
I[4] = new Array();
I[4][1] = new Array();
I[4][1][0] = new Array();
I[4][1][0][0] = '\u006F\u0076\u0065\u0072\u0064\u006F\u0073\u0065\u0064';
I[4][2]='';
I[5] = new Array();
I[5][1] = new Array();
I[5][1][0] = new Array();
I[5][1][0][0] = '\u006C\u006F\u0076\u0065';
I[5][2]='';
I[6] = new Array();
I[6][1] = new Array();
I[6][1][0] = new Array();
I[6][1][0][0] = '\u0068\u006F\u0070\u0065';
I[6][2]='';
I[7] = new Array();
I[7][1] = new Array();
I[7][1][0] = new Array();
I[7][1][0][0] = '\u0074\u0068\u0069\u006E\u006B';
I[7][2]='';
I[8] = new Array();
I[8][1] = new Array();
I[8][1][0] = new Array();
I[8][1][0][0] = '\u0068\u006F\u006C\u0064\u0069\u006E\u0067';
I[8][2]='';
I[9] = new Array();
I[9][1] = new Array();
I[9][1][0] = new Array();
I[9][1][0][0] = '\u0073\u0075\u0063\u0068';
I[9][2]='';
I[10] = new Array();
I[10][1] = new Array();
I[10][1][0] = new Array();
I[10][1][0][0] = '\u0077\u0061\u0073';
I[10][2]='';
I[11] = new Array();
I[11][1] = new Array();
I[11][1][0] = new Array();
I[11][1][0][0] = '\u0077\u0065\u0061\u0072\u0069\u006E\u0067';
I[11][2]='';
I[12] = new Array();
I[12][1] = new Array();
I[12][1][0] = new Array();
I[12][1][0][0] = '\u0073\u0075\u0063\u0068';
I[12][2]='';
I[13] = new Array();
I[13][1] = new Array();
I[13][1][0] = new Array();
I[13][1][0][0] = '\u0064\u0072\u0065\u0073\u0073';
I[13][2]='';
I[14] = new Array();
I[14][1] = new Array();
I[14][1][0] = new Array();
I[14][1][0][0] = '\u0062\u0072\u0061\u0069\u006E';
I[14][2]='';
State = new Array();
function StartUp(){
//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;
}
}
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;}
var box = document.getElementById('Gap' + CurrGap);
if (box != null){
var selObj = SelObj(box);
selObj.setSelText(Chars);
}
}
//-->
//]]>
</script>
</head>
<body onload="StartUp()" id="TheBody" >
<!-- BeginTopNavButtons -->
<div class="NavButtonBar" id="TopNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndTopNavButtons -->
<div class="Titles">
<h2 class="ExerciseTitle">CHARLIE PUTH - WE DON'T TALK ANYMORE</h2>
<h3 class="ExerciseSubtitle">Gap-fill exercise</h3>
</div>
<div id="InstructionsDiv" class="StdDiv">
<div id="Instructions">Fill in all the gaps, then press "Check" to check your answers. Use the "Hint" button to get a free letter if an answer is giving you trouble. You can also click on the "[?]" button to get a clue. Note that you will lose points if you ask for hints or clues!</div>
</div>
<div id="ContainerDiv">
<div class="ExerciseContainer">
<div id="WordsDiv" class="StdDiv">
<span id="WordList" class="ClozeWordList">   anymore      brain      dress      even      holding      hope      love      overdosed      such      think      was      we      wearing   </span>
</div>
<!-- These top buttons hidden; reveal if required -->
<!--
<button id="CheckButton1" class="FuncButton" onclick="CheckAnswers()"> Check </button>
-->
<div id="ClozeDiv">
<form id="Cloze" method="post" autocomplete="off" onsubmit="return false;">
<div class="ClozeBody">
We don't talk anymore<br />We don't talk anymore<br />We don't talk anymore<br />Like <span class="GapSpan" id="GapSpan0"><select id="Gap0"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> used to do<br />We don't love anymore<br />What was all of it for?<br />Oh, we don't talk <span class="GapSpan" id="GapSpan1"><select id="Gap1"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> <br />Like we used to do<br />I just heard you found the one you've been looking<br />You've been looking for<br />I wish I would have known that wasn't me<br />'Cause <span class="GapSpan" id="GapSpan2"><select id="Gap2"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> after all this time, I still wonder<br />Why I can't move on<br />Just the way you did so easily<br />Don't wanna know<br />Kind of dress you're <span class="GapSpan" id="GapSpan3"><select id="Gap3"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> tonight<br />If he's holding onto you so tight<br />The way I did before<br />I <span class="GapSpan" id="GapSpan4"><select id="Gap4"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> <br />Should've known your love was a game<br />Now I can't get you out of my brain<br />Oh, it's such a shame<br />That we don't talk anymore<br />We don't talk anymore<br />We don't talk anymore<br />Like we used to do<br />We don't <span class="GapSpan" id="GapSpan5"><select id="Gap5"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> anymore<br />What was all of it for?<br />Oh, we don't talk anymore<br />Like we used to do<br />I just <span class="GapSpan" id="GapSpan6"><select id="Gap6"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> you're lying next to somebody<br />Who knows how to love you like me<br />There must be a good reason that you're gone<br />Every now and then I <span class="GapSpan" id="GapSpan7"><select id="Gap7"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> you might want me to<br />Come show up at your door<br />But I'm just too afraid that I'll be wrong<br />Don't wanna know<br />If you're looking into her eyes<br />If she's <span class="GapSpan" id="GapSpan8"><select id="Gap8"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> onto you so tight<br />The way I did before<br />I overdosed<br />Should've known your love was a game<br />Now I can't get you out of my brain<br />Oh, it's <span class="GapSpan" id="GapSpan9"><select id="Gap9"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> a shame<br />That we don't talk anymore<br />We don't talk anymore<br />We don't talk anymore<br />Like we used to do<br />We don't love anymore<br />What <span class="GapSpan" id="GapSpan10"><select id="Gap10"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> all of it for?<br />Oh, we don't talk anymore<br />Like we used to do<br />Like we used to do<br />Don't wanna know<br />Kind of dress you're <span class="GapSpan" id="GapSpan11"><select id="Gap11"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> tonight<br />If he's giving it to you just right<br />The way I did before<br />I overdosed<br />Should've known your love was a game<br />Now I can't get you out of my brain<br />Oh, it's <span class="GapSpan" id="GapSpan12"><select id="Gap12"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> a shame<br />That we don't talk anymore<br />We don't talk anymore<br />We don't talk anymore<br />Like we used to do<br />We don't love anymore<br />What was all of it for?<br />Oh, we don't talk anymore<br />Like we used to do<br />We don't talk anymore (don't wanna know)<br />Kind of <span class="GapSpan" id="GapSpan13"><select id="Gap13"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> you're wearing tonight (oh)<br />If he's holding onto you so tight (oh)<br />The way I did before<br />We don't talk anymore (I overdosed)<br />Should've known your love was a game (oh)<br />Now I can't get you out of my <span class="GapSpan" id="GapSpan14"><select id="Gap14"><option value=""> </option><option value="anymore">anymore</option><option value="brain">brain</option><option value="dress">dress</option><option value="even">even</option><option value="holding">holding</option><option value="hope">hope</option><option value="love">love</option><option value="overdosed">overdosed</option><option value="such">such</option><option value="think">think</option><option value="was">was</option><option value="we">we</option><option value="wearing">wearing</option></select></span> (whoa)<br />Oh, it's such a shame<br />That we don't talk anymore
</div>
</form>
</div>
<button id="CheckButton2" class="FuncButton" onclick="CheckAnswers()"> Check </button>
</div>
</div>
<div class="Feedback" id="FeedbackDiv">
<div class="FeedbackText" id="FeedbackContent"></div>
<button id="FeedbackOKButton" class="FuncButton" onclick="HideFeedback(); return false;"> OK </button>
</div>
<!-- BeginBottomNavButtons -->
<div class="NavButtonBar" id="BottomNavBar">
<button class="NavButton" onclick="location='https://www.pacho8a.com/canciones-1/'; return false;"> More Songs </button>
</div>
<!-- EndBottomNavButtons -->
<!-- BeginSubmissionForm -->
<!-- EndSubmissionForm -->
</body>
</html>
Francisco Ochoahttp://www.blogger.com/profile/16749253261499371552noreply@blogger.com0