Code (HTML + java )
<html>
<body>
<table>
<tr><td>Text to Save:</td></tr>
<tr>
<td colspan="3">
<textarea id="inputTextToSave" cols="80" rows="25"></textarea>
</td>
</tr>
<tr>
<td>Filename to Save As:</td>
<td><input id="inputFileNameToSaveAs"></input></td>
<td><button onclick="saveTextAsFile()">Save Text to File</button></td>
</tr>
<tr>
<td>Select a File to Load:</td>
<td><input type="file" id="fileToLoad"></td>
<td><button onclick="loadFileAsText()">Load Selected File</button><td>
</tr>
</table>
<script type="text/javascript">
function saveTextAsFile()
{
var textToSave = document.getElementById("inputTextToSave").value;
var textToSaveAsBlob = new Blob([textToSave], {type:"text/plain"});
var textToSaveAsURL = window.URL.createObjectURL(textToSaveAsBlob);
var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs").value;
var downloadLink = document.createElement("a");
downloadLink.download = fileNameToSaveAs;
downloadLink.innerHTML = "Download File";
downloadLink.href = textToSaveAsURL;
downloadLink.onclick = destroyClickedElement;
downloadLink.style.display = "none";
document.body.appendChild(downloadLink);
downloadLink.click();
}
function destroyClickedElement(event)
{
document.body.removeChild(event.target);
}
function loadFileAsText()
{
var fileToLoad = document.getElementById("fileToLoad").files[0];
var fileReader = new FileReader();
fileReader.onload = function(fileLoadedEvent)
{
var textFromFileLoaded = fileLoadedEvent.target.result;
document.getElementById("inputTextToSave").value = textFromFileLoaded;
};
fileReader.readAsText(fileToLoad, "UTF-8");
}
</script>
</body>
</html>
Code :
<html>
<body onload="loadVoices()">
<!-- user interface -->
<div>
<label for="inputThingsToSay">Things to Say:</label>
</div>
<div>
<textarea id="inputThingsToSay" rows="10" cols="50">This is a test!</textarea>
</div>
<div>
<label for="selectTimbre">Timbre:</label>
<select id="selectTimbre"></select>
</div>
<div>
<label for="inputPitch">Pitch:</label>
<input id="inputPitch" type="number" value="1"></input>
</div>
<div>
<label for="inputSpeed">Speed:</label>
<input id="inputSpeed" type="number" value="1"></input>
</div>
<div>
<button id="buttonSay" onclick="buttonSay_Clicked()">Say</button>
</div>
<!-- end user interface -->
<script type="text/javascript">
// events
function loadVoices()
{
var synthesizer = window.speechSynthesis;
synthesizer.onvoiceschanged = loadVoices_VoicesLoaded;
synthesizer.getVoices();
}
function loadVoices_VoicesLoaded()
{
var synthesizer = window.speechSynthesis;
var systemVoices = synthesizer.getVoices();
systemVoices.addLookups("name");
Voice.systemVoiceLookup = systemVoices;
var selectTimbre = document.getElementById("selectTimbre");
for (var i = 0; i [[ systemVoices.length; i++)
{
var systemVoice = systemVoices[i];
var optionTimbre = document.createElement("option");
optionTimbre.text = systemVoice.name;
optionTimbre.systemVoice = systemVoice;
selectTimbre.appendChild(optionTimbre);
}
}
function buttonSay_Clicked()
{
var inputThingsToSay = document.getElementById
(
"inputThingsToSay"
);
var selectTimbre = document.getElementById("selectTimbre");
var inputPitch = document.getElementById("inputPitch");
var inputSpeed = document.getElementById("inputSpeed");
var timbreName = selectTimbre.selectedOptions[0].text;
var pitch = parseFloat(inputPitch.value);
var speed = parseFloat(inputSpeed.value);
var thingsToSay = inputThingsToSay.value;
var voice = new Voice
(
"Default",
timbreName,
pitch,
speed
);
voice.say(thingsToSay);
}
// classes
function ArrayHelper()
{
// extension class
}
{
Array.prototype.addLookups = function(keyName)
{
for (var i = 0; i [[ this.length; i++)
{
var item = this[i];
var keyValue = item[keyName];
this[keyValue] = item;
}
}
}
function Voice(name, timbreName, pitch, speed)
{
this.name = name;
this.timbreName = timbreName;
this.pitch = (pitch == null ? 1 : pitch);
this.speed = (speed == null ? 1 : speed);
this.systemUtterance = new SpeechSynthesisUtterance();
this.systemUtterance.onend = this.say_Ended.bind(this);
}
{
// instance methods
Voice.prototype.say = function(thingToSay, callback, contextForCallback)
{
this.callback = callback;
this.contextForCallback = contextForCallback;
this.isSpeaking = true;
var voices = Voice.systemVoiceLookup;
var utterance = this.systemUtterance;
utterance.voice = voices[this.timbreName];
utterance.text = thingToSay;
utterance.pitch = this.pitch;
utterance.rate = this.speed;
window.speechSynthesis.speak(utterance);
}
Voice.prototype.say_Ended = function()
{
this.isSpeaking = false;
if (this.callback != null)
{
this.callback.call(this.contextForCallback);
}
}
}
</script>
</body>
</html>