Dear members,

A couple months ago one of our fellow-forum-members helped me a lot with building this Aircraft Recognition Quiz.
It is already fully operational in my school and I'm very happy with it, but I found some troubles with keeping it up to date because every picture has to be brought in manually. (it's about 1000pictures and it constantly evolves)

The website only consists of javascript, because I have to copy the "webtool" offline with my fellow-students and so I cannot teach everyone how to install a PHP-server. (I guess, I'm totally no pro! )

Now every picture has its adress and its value...
I wanted to know if I could let the browser pick a random picture from a folder and the value should then be the name of the folder. (or a name that I can still type in manually, but I should be great already if I can just drop pictures in a folder and so they will pop up in the quiz automaticly)

Is this possible with what I have already???


Thank you !

Here an example of how the website looks like at this moment:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Multiple Rocket Launcher Recognition</title>

<script type="text/javascript" src="difflib.js"></script>

<script type="text/javascript">

var totalQuestions = 0;
var score = 0;

var testData = [ ['1.jpg', 'm270 mlrs'],
['2.jpg', 'm270 mlrs'],
['3.jpg', 'm270 mlrs'],
['4.jpg', 'bm-21'],
['5.jpg', 'bm-21'],
['6.jpg', 'bm-21'],
['7.jpg', 'rm-70'],
['8.jpg', 'rm-70'],
['9.jpg', 'rm-70'],
['10.jpg', '9p140'],
['11.jpg', '9p140'],
['12.jpg', '9p140'],
['13.jpg', '9p140 transloader'],
['14.jpg', '9p140 transloader'],
['15.jpg', '9p140 transloader'],
['16.jpg', '9a52 smerch'],
['17.jpg', '9a52 smerch'],
['18.jpg', '9a52 smerch'],
['19.jpg', '9a52 transloader'],
['20.jpg', '9a52 transloader'],
['21.jpg', '9a52 transloader'],

];



var questionId = 0;

/*
* Using difflib we are testing if is an approximation
*/
function IsApproximate (stCorrect, stAnswer)
{
var sm = new difflib.SequenceMatcher(stCorrect, stAnswer);
return sm.ratio();;
}

/* Create a new question
*/
function createQuestion()
{
totalQuestions++;
// Update Total Questions Label:
document.getElementById('questions').innerHTML = totalQuestions.toString();

// Prepare a new question Id:
questionId = Math.floor(Math.random() * testData.length);
document.getElementById('imageTest').src = testData[questionId][0];

}

/* Update Score Points
*/
function updateScore(points)
{
score+=points;
// Update Total Questions Label:
document.getElementById('score').innerHTML = score.toString();
}

/* Check Answer
*/
function checkAnswer(questionId)
{
// If we have an approximation we can let the user retry
var retry = false;

// Get the ratio approximation:
var ratio = IsApproximate (testData[questionId][1], document.getElementById('tekstregel').value.toLowerCase() );


// Response is Exact!
if ( ratio == 1 )
{
window.alert("Volledig juist!");
document.getElementById('tekstregel').value = "";
updateScore(1); // 1 points up in the score!
}
else if ( ratio > 0.7 ) // My limit to consider the answers Valid is 0.5 (must be adjusted!)
{
// I let him to retry, if it's an approximation (may be not infinitely )
retry = window.confirm("Probeer andere schrijfwijze, bijna juist!");

if ( retry == false) {
window.alert ("Correct Answer is: "+ testData[questionId][1]);
document.getElementById('tekstregel').value = "";
updateScore(1); // only 1 point up in score!
}
}
else
{
window.alert("Fout!\nHet juiste antwoord is: "+ testData[questionId][1]);
document.getElementById('tekstregel').value = "";
}

// If is retrying, don't generate new question
if ( retry == false )
createQuestion();
}

function keypressed(){
if(event.keyCode=='13'){checkAnswer(questionId);}
}
</script>


<body bgcolor="#999999" onkeyup="keypressed()">
<a href="manual.pdf" target="blank"><img src="manual.png" BORDER=0 align="right"></a>
<h1 align="center">MRL Recognition</h1>
<center>

<div id="scores">
<h4><b>Question:</b><span id="questions">0</span>&nbsp;&nbsp;&nbsp;/&nbsp;&nbsp;
Score:<span id="score">0</span></h4>
</div>

<img style="height: 350px;" id="imageTest" src="#" />
</br></br>




<input type="text" name="tekstregel" id="tekstregel" size="25">
<input type="button" value="OK" onClick="checkAnswer(questionId)">




<script language="JavaScript">
createQuestion();
</script>

</center>
</body>
</html>