www.puzzlehacker.com

Improve mathematical skill

Posted on: March 3, 2007

<html> 
<body onclick="MouseClick()" bgColor=Aqua  text=black background="" > 
<div id='TableDiv' class=Section1> 
<p class=MsoNormal style="BACKGROUND-IMAGE: url('')"> 
<TABLE cellSpacing=1 cellPadding=1 width="100%" height="5%" id=ResultsTable style="LEFT: 5px; WIDTH: 100%; FONT-FAMILY: sans-serif; POSITION: absolute; TOP: 486px" bgColor=cornflowerblue> 

  <TR> 
    <TD><INPUT id=HelpID onclick='ShowHelp()' type=button value='?' name=HelpBtn size=16 ></TD> 
    <TD><SELECT id=OperationID> <OPTION value=1 
        selected>Addition</OPTION><OPTION value=2>Subtraction</OPTION><OPTION 
        value=3>Multiplication</OPTION><OPTION value=0>All</OPTION></SELECT> 
        <SELECT id=LevelID  name=select1> <OPTION value=0 
        selected>Easy</OPTION><OPTION value=1>Medium</OPTION><OPTION 
        value=2>Hard</OPTION></SELECT> 
        <INPUT id=ResetID onclick='RestartGame()'  type=button value=Restart name=ResetBtn size=16 style="WIDTH: 67px; HEIGHT: 25px"></TD> 
    <TD align=right>Question</TD> 
    <TD id=Question align=left></TD> 
    <TD align=right>Missed</TD> 
    <TD id=MissID align=left>0</TD> 
    <TD align=right>Score</TD> 
    <TD id=ScoreID align=left>0</TD> 
    <TD align=right>Time</TD> 
    <TD id=TimeID align=left>00:00</TD> 
   </TR> 
</TABLE><SPAN></SPAN> 
</p> 

</div> 
 <script language="JavaScript"> 
<!-- 

font='Ravie'; 

answerSize=30; 
ymouse        = 0; 
xmouse        = 0; 

MaxNum        = 15; 
var OperatorMax; 
OperatorMax = new Array; 
OperatorMax[0] = 3; 
OperatorMax[1] = 8; 
OperatorMax[2] = 12; 

numberBackgroundColor = 'silver'; 

var Questions, Answers,    Score,    Missed; 
var    RemainingQuestions, QuestionAnswered; 
var startTime; 

Ny = new Array(); 
NDy = new Array(); 

for (i=0; i <MaxNum; i++) 
  document.write('<div id= "NumberID"style="position:absolute;top:0px;left:0;height:'+ answerSize +';width:'+ answerSize +';text-align:center;background-color=' + numberBackgroundColor + '"> </B></font></div>'); 

document.write('<div id= "MouseQuestionID"style="position:absolute;top:0px;left:0;text-align:center;background-color=cornflowerblue"> </B></font></div>');   

// document.write('<div id="PointerID" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+'^'+'</B></font></div>'); 

document.onmousemove=Mouse; 
window.onload=Startup; 
document.onmouseclick=MouseClick; 
//var name = prompt('Enter your name :'); 

var incorrectElement; 
var incorrectCountdown = 0; 

ResultsTable.style.top = document.body.clientHeight-100; 

var restartStr = "Click Restart"; 
restartShowing = false; 
RestartDiameter=40; 
speed        = 0.5;                    // 0 < speed < 1 
R            = restartStr.split(''); 
Angle        = 220/R.length;            // Angle increment between letters 
step        = 0.2;                    // Angle increment per delay period 
currStep    = 0;                    // Initial Angle 

// Current center of rotation for each letter 
Dy = new Array();    Dx = new Array(); 
DY = new Array();    DX = new Array(); 

for (i=0; i < R.length; i++) 
{ 
    Dy[i] = 0;    Dx[i] = 0;    DY[i] = 0;    DX[i] = 0; 
} 

restartSize = 10; 

for (i=0; i < R.length; i++) 
    document.write('<div id="RestartMsg" style="position:absolute;top:0px;left:0;height:' + restartSize + ';width:' + restartSize + ';text-align:center; font-family: sans-serif;">'+R[i]+'</div>'); 

function ShowHelp() 
{ 

    var prev = LoadPreviousResults( ); 
    var msg = 'Click on the number on that is the answer to then' + 
              'displayed maths question.n' + 
              'n'; 

    if ( prev != null ) 
      msg += "Previous results : n" + prev + "nn"; 

    var sessions = SessionsCompleted( ); 
    if ( sessions > 0 ) 
        msg += "Sessions Completed : " + sessions + "nn"; 

    msg += 'RON' + 
          ''  

    var wasShowing = restartShowing; 
    ShowRestartMsg( false ); 
    alert( msg ); 
    ShowRestartMsg( wasShowing ); 
} 

function Mouse( evnt ) 
{ 
  ymouse = event.y; 
  xmouse = event.x; 
  MouseQuestionID.style.top = ymouse + 5; 
  MouseQuestionID.style.left = xmouse + 10; 
} 

function ShowRestartMsg( showIt ) 
{ 
    restartShowing = showIt; 
    var visibility; 

    if ( showIt ) 
        visibility = 'visible'; 
    else 
        visibility = 'hidden'; 

    for (i=0; i < R.length; i++) 
        RestartMsg[ i ].style.visibility = visibility; 
} 

function MouseClick( evnt ) 
{ 
    element = event.srcElement; 
    if ( element.id == "NumberID" ) 
    { 
        if ( element.innerText == Answers[CurrentQuestionIndex] ) 
        { 
            QuestionAnswered[ CurrentQuestionIndex ] = true; 
            element.style.visibility = 'hidden'; 
            Score += 1; 
            ScoreID.innerText = Score; 
            NextQuestion( ); 
        } 
        else 
        { 
            Missed += 1; 
            MissID.innerText = Missed; 
            HighlightIncorrectAnswer( element ); 
        } 
    } 
} 

function NextQuestion( ) 
{ 
    if ( RemainingQuestions == 0 ) 
    { 
        MouseQuestionID.innerText = ''; 
        ShowCompletionMsg(); 
        ShowRestartMsg( true ); 
    } 
    else 
    { 
        var index = RandomInteger(1,RemainingQuestions); 
        var i = 0; 
        while ( index > 0 ) 
        { 
            if ( !QuestionAnswered[i] ) 
              index = index - 1; 
            i = i + 1; 
        } 
        CurrentQuestionIndex = i - 1; 
        Question.innerText = Questions[CurrentQuestionIndex]; 
        MouseQuestionID.innerText = Questions[CurrentQuestionIndex]; 
        RemainingQuestions = RemainingQuestions - 1; 
    } 
} 

function MoveAnswers(){ 

  var maxY = document.body.clientHeight  - ResultsTable.offsetHeight; 
  var dx = document.body.clientWidth / ( MaxNum + 2 ); 
  ResultsTable.style.top = maxY; 

  if ( restartShowing ) 
    return; 

//  PointerID.style.top = maxY - 2 * NumberID[0].style.pixelHeight; 
//  PointerID.style.left = xmouse; 

  maxY = maxY - ResultsTable.offsetHeight; 

  for (i=0; i<MaxNum;i++) 
  { 
    Ny[ i ] = Ny[ i ] + NDy[ i ]; 
    if ( Ny[ i ] > maxY ) 
      Ny[ i ] = 0; 
    NumberID[i].style.top = Ny[ i ]; 
    NumberID[i].style.left = (i+1)*dx; 
  } 

} 

function MaybeResetNumberBackground( force ) 
{ 
  if ( incorrectElement != undefined ) 
  { 
    if ( !force & incorrectCountdown > 0 ) 
        incorrectCountdown = incorrectCountdown - 1; 
    else 
    { 
        incorrectElement.style.backgroundColor = numberBackgroundColor; 
        incorrectElement = undefined; 
    } 
  } 
}  

function HighlightIncorrectAnswer( element ) 
{ 
    MaybeResetNumberBackground( true ); 
    element.style.backgroundColor = 'red'; 
    incorrectElement = element; 
    incorrectCountdown = 10; 
} 

function MoveRestartMsg() 
{ 
    if ( restartShowing ) 
    { 
        Dy[0] = Math.round( DY[0] += ((ymouse)-DY[0])*speed ); 
        Dx[0] = Math.round( DX[0] += ((xmouse)-DX[0])*speed ); 
        for (i=1; i < R.length; i++){ 
            Dy[i] = Math.round( DY[i] += (Dy[i-1]-DY[i])*speed ); 
            Dx[i] = Math.round( DX[i] += (Dx[i-1]-DX[i])*speed ); 
        } 
        for (i=0; i < R.length; i++){ 
            RestartMsg[ i ].style.top  = Dy[i] + RestartDiameter*1.5*Math.sin(currStep+i*Angle*Math.PI/180); 
            RestartMsg[ i ].style.left = Dx[i] + RestartDiameter*1.5*Math.cos(currStep+i*Angle*Math.PI/180); 
        } 
        currStep-=step; 
    } 
} 

function Delay() 
{ 
  MaybeResetNumberBackground( false ); 
  MoveRestartMsg(); 
  MoveAnswers(); 
  if ( RemainingQuestions > 0 ) 
  { 
    var now = new Date(); 
    TimeID.innerText = SecondsAsString( 
                    Math.floor( 
                        (now.valueOf() - startTime.valueOf())/1000 ) ); 
  } 
  setTimeout('Delay()',100); 
} 

function SecondsAsString( seconds ) 
{ 
    var minutes = Math.floor( seconds/60 ); 
    var secRem = seconds - (minutes*60); 
    var str = minutes + ':'; 
    if ( secRem < 10 ) 
      return str + '0' + secRem; 
    return str + secRem; 
} 

function CreateQuestionsAndAnswers( Questions, Answers, MaxQuestions ) 
{ 
    var i; 
    for (i=0;i<MaxQuestions;i++) 
    { 
        operand = OperationID.value; 
        if ( operand == 0 ) 
            operand = RandomInteger(1,3); 
        var numberMax = OperatorMax[LevelID.value];     

        // Increase range for addition & subtraction 
        // unless we are on the easy level 
        if ( operand != 3 & LevelID.value != 0 ) 
            numberMax = numberMax * 2; 

        x = RandomInteger(1,numberMax); 

        if ( operand == 2 ) 
            y = RandomInteger(1,x); 
        else 
            y = RandomInteger(1,numberMax); 

        if ( operand == 1 ) 
        { 
            z = x + y; 
            operandStr = '+'; 
        } 
        else 
        { 
            if ( operand == 2 ) 
            { 
                z = x - y; 
                operandStr = '-'; 
            } 
            else 
            { 
                z = x * y; 
                operandStr = '*'; 
            } 
        } 
        Questions[ i ] = x + operandStr + y + '='; 
        Answers[ i ] = z; 
    } 
} 

function RandomInteger( MinValue, MaxValue ) 
{ 
    var i; 
    range = MaxValue - MinValue + 1; 
    i = Math.random( ) * range; 
    i = Math.round( i - 0.5 ) 
    i = MinValue + i; 
    return i; 
} 

function RestartGame( ) 
{ 
    Questions = new Array(); 
    Answers = new Array(); 
    Score = 0; 
    Missed = 0; 
    RemainingQuestions = MaxNum; 
    MaybeResetNumberBackground( true ); 
    CreateQuestionsAndAnswers( Questions,Answers, MaxNum ); 
    QuestionAnswered = new Array( ); 
    for (i=0;i<MaxNum;i++) 
    { 
          QuestionAnswered[ i ] = false; 
        Ny[ i ] = 0; 
        NDy[ i ] = (Math.random( )*0.5+0.5) * (LevelID.value/2 + 1); 
        NumberID[ i ].innerText = Answers[i]; 
        NumberID[ i ].style.visibility = 'visible'; 
    } 
    ScoreID.innerText = Score; 
    MissID.innerText = Missed; 
    startTime = new Date(); 
    NextQuestion( ); 
    ShowRestartMsg( false ); 
} 

function Startup( ) 
{ 
    ShowRestartMsg( true ); 
    Delay(); 
} 

function GetLevelDescription( ) 
{ 
    switch ( parseInt( LevelID.value ) ) 
    { 
    case 0:    return "Easy"; 
    case 1:    return "Medium"; 
    case 2:    return "Hard"; 
    } 
    return "Unknown"; 
} 

function GetOperationDescription( ) 
{ 
    switch ( parseInt( OperationID.value ) ) 
    { 
    case 0:    return "All"; 
    case 1:    return "Addition"; 
    case 2:    return "Subtraction"; 
    case 3:    return "Multiplication"; 
    } 
    return "Unknown"; 
} 

function ShowCompletionMsg() 
{ 
    var msg = "Congratulations"; 
    if ( name != undefined ) 
      msg += " " + name; 
    msg += "!nAll questions answered in " + TimeID.innerText; 
    if ( Missed == 0 ) 
      msg += " with no incorrect selections!"; 
    else 
    { 
      msg = msg + " with only " + Missed + " incorrect selection"; 
      if ( Missed == 1 ) 
        msg += "!"; 
      else 
        msg += "s!"; 
    } 

    UpdateSessionsCompleted( ); 

    var prev = LoadPreviousResults( ); 

    if ( prev != null ) 
        msg += "nnPrevious Results : n" + prev; 

    var sessions = SessionsCompleted( ); 
    if ( sessions > 0 ) 
        msg += "nnSessions Completed : " + sessions; 

    SaveResult( ); 
    alert(msg); 
} 

function SessionsCompleted( ) 
{ 
    var completed = GetCookie("SessionsCompleted"); 
    if ( completed == null ) 
        return 0; 
    completed = parseInt( completed ); 
    // See if completed == Nan (NB : Nan != Nan == true ) 
    if ( completed != completed ) 
        return 0; 
    return completed; 
} 

function GetExpiry( ) 
{ 
    return new Date(2040,1,1); 
} 

function UpdateSessionsCompleted( ) 
{ 
    var completed = SessionsCompleted( ) + 1; 
    SetCookie( "SessionsCompleted", completed.toString( ),  GetExpiry( ) ); 
} 

function LoadPreviousResults( ) 
{ 
    return GetCookie("PrevResults"); 
} 

function SaveResult( ) 
{ 
    var prev = LoadPreviousResults( ); 

    curResult = GetLevelDescription( ) + "-" + GetOperationDescription( ) + 
                " " + TimeID.innerText + " "; 
    if ( Missed == 0 ) 
      curResult += "None incorrectn"; 
    else 
      curResult += Missed + " incorrectn"; 

    if ( prev != null ) 
       prev = curResult + prev; 
    else 
       prev = curResult; 

    // Strip off last result if result string is too long 
    if ( prev.length > 300 ) 
    { 
      var last = prev.lastIndexOf("n"); 
      if ( last > -1 ) 
        prev = prev.substring( 0, last ); 
    } 
    SetCookie( "PrevResults", prev, GetExpiry( ) ); 
} 

function getCookieVal (offset) 
{ 
  var endstr = document.cookie.indexOf (";", offset); 
  if (endstr == -1) 
    endstr = document.cookie.length; 
  return unescape(document.cookie.substring(offset, endstr)); 
} 
function GetCookie (name) 
{ 
  var arg = name + "="; 
  var alen = arg.length; 
  var clen = document.cookie.length; 
  var i = 0; 
  while (i < clen) { 
    var j = i + alen; 
    if (document.cookie.substring(i, j) == arg) 
      return getCookieVal (j); 
    i = document.cookie.indexOf(" ", i) + 1; 
    if (i == 0) break; 
  } 
  return null; 
} 
function SetCookie (name, value) 
{ 
  var argv = SetCookie.arguments; 
  var argc = SetCookie.arguments.length; 
  var expires = (argc > 2) ? argv[2] : null; 
  var path = (argc > 3) ? argv[3] : null; 
  var domain = (argc > 4) ? argv[4] : null; 
  var secure = (argc > 5) ? argv[5] : false; 
  document.cookie = name + "=" + escape (value) + 
    ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + 
    ((path == null) ? "" : ("; path=" + path)) + 
    ((domain == null) ? "" : ("; domain=" + domain)) + 
    ((secure == true) ? "; secure" : ""); 
} 
function setLastlastVisitCookie () 
{ 
  var rightNow = new Date(); 
  var expdate = new Date(); 
  expdate.setTime (expdate.getTime() + 1 * (24 * 60 * 60 * 1000)); //+1 day 
  SetCookie ("lastVisit", rightNow.getTime(), expdate, "/"); 
} 
function ResetCookie() 
{ 
  SetCookie("lastVisit", 0, null, "/"); 
} 

// --> 
</script></body></html>
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

Join 93 other followers

Twitter

Error: Twitter did not respond. Please wait a few minutes and refresh this page.

Subscribe to RSS headline updates from:
Powered by FeedBurner

Software Blogs - BlogCatalog Blog Directory
%d bloggers like this: