Random letter change in a phrase

A simple example of changing the letters in a phrase over time.
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="Tizen example"/>
    <title>Tizen lodash.js example</title>
</head>
<body>
<div id="first">
</div>
<br>
<div id="second">
</div>
</div>
<script>

var firstDiv = document.getElementById('first');
var secondDiv = document.getElementById('second');

    firstDiv.innerHTML = "We are changing the letters dynamically over time:";

var phrase = "FBETIO";
var dictionary = "QAZWSXEDCRFVTGBYHNUJMIKLOP";

var intervalTime = 500;

var letterTimer = setInterval(changeLetter, intervalTime);

function changeLetter() {

   var rndLetterPlace = Math.floor(Math.random() * phrase.length);
   var rndSymbolPlace = Math.floor(Math.random() * dictionary.length);
   var nextIntervalTime = 100 + Math.floor(Math.random() * 1100);

   var newLetter = dictionary.charAt(rndSymbolPlace);

   phrase = phrase.split('');
   phrase[rndLetterPlace] = newLetter;
   phrase = phrase.join('');

   intervalTime = nextIntervalTime;

   secondDiv.innerHTML = phrase;
}

</script>
</body>

</html>

Responses

0 Replies