I'm trying to build a simple javascript-based hiragana flashcard program. I have the code working almost totally right, but I'm having one little glitch. The page refuses to re-draw in between when it shows the values. There's an HTML page and a javascript page. Here's the code attached. Does anyone know of a simple work-around to make this function, or maybe a better "sleep" function for me? The "waittime" there is in miliseconds.
Thanks!
- Mith
PS: see it in action at http://flash.holdmeaccountable.org/
flash.js:
- Code: Select all
function sleep(delay)
{
var start = new Date().getTime();
while (new Date().getTime() < start + delay);
}
function updateL1(newChar)
{
document.getElementById('lang1').innerHTML = newChar + '';
}
function updateL2(newChar)
{
document.getElementById('lang2').innerHTML = newChar + '';
}
function mainroutine()
{
var myLang1 = [ 'あ', 'い', 'う', 'え', 'お'];
var myLang2 = [ 'a', 'i', 'u', 'e', 'o'];
var waitTime=500;
for (myCounter = 0; myCounter < 5; myCounter++)
{
updateL1(myLang1[myCounter]);
updateL2(myLang2[myCounter]);
sleep(waitTime);
}
}
- Code: Select all
<html>
<head>
<link rel="stylesheet" href="flash.css" />
<script type="text/javascript" src="flash.js"></script>
<title>Flashcards at holdmeaccountable.org</title>
</head>
<body onload="mainroutine();">
<div class="flashheader">
Flashcards at holdmeaccountable.org
</div>
<div class="myspacer"> </div>
[align=center]
<p class="lang1" id="lang1">-</div>
<p class="lang2" id="lang2">-</div>
[/align]
</body>
</html>
). Because the sleep function uses all the CPU, the browser doesn't have time to display anything until it is done "sleeping", and then you see the last card.
I suppose you *could* use perl... If only you had someone you could talk to who knew something about it.
)