qNumber: 読み上げ
数字型フィールドの数値を読み上げます(Text-to-Speech)。Web Speech API を利用して、音声合成(Speech Synthesis)を行います。たとえば「12000000(円)」という請求金額データを「イッセンニヒャクマン」や「twelve million」という音声で確認することが可能です。
- ボリュームが不安定になる(小さくなる)場合があります。
- 多くの場合、リセットボタンで回復します。
Input / Output
- ← qNumber
q_InvoiceAmount
- → (Sound Playback Device)
Code Example
HTML/JavaScript (click to close)
<button type="button" onclick="user_resetSpeechApi()">
<span class="material-icons">stop_circle</span></button>
<button type="button" onclick="user_startSpeech( 'en-US' )">
(β) en-US <span class="material-icons">volume_up</span></button>
<button type="button" onclick="user_startSpeech( 'ja-JP' )">
(β) ja-JP <span class="material-icons">volume_up</span></button>
<div id="user_speechStatus" style="padding:2px; margin:5px; border: 3px solid #FFC69B; "
>(SpeechAPI Status viewer...)</div>
<script>
//// Initialize for Win Chrome
const synth = window.speechSynthesis;
function user_initializeSpeechApi () {
if ( ! 'speechSynthesis' in window ) { console.error('text-to-speech not supported'); }
let arrVoices = synth.getVoices(); // array of SpeechSynthesisVoice objects
console.log( 'Initialized (arrVoices:' + arrVoices.length + ')' );
}
qbpms.form.on ( 'ready', user_initializeSpeechApi );
//// User action: reset
function user_resetSpeechApi () {
synth.cancel(); // Remove all utters from the queue.
let arrVoices = synth.getVoices();
console.log( 'Queue canceled (arrVoices:' + arrVoices.length + ')' );
let msg = " (utterance queue cleared)";
msg += ( synth.paused ? " Paused:" : "" );
msg += ( synth.pending ? " Pending:" : "" );
msg += ( synth.speaking ? " Speaking:" : "" );
user_showMsg ( '#user_speechStatus', msg );
}
//// User action: start
function user_startSpeech ( strLang ) {
// https://developer.mozilla.org/docs/Web/API/Web_Speech_API
let bigInvoiceAmount = qbpms.form.get( "q_InvoiceAmount" ); // ★★★ EDIT Field Name ★★★
let speech = new SpeechSynthesisUtterance();
// https://developer.mozilla.org/docs/Web/API/SpeechSynthesisUtterance
speech.text = bigInvoiceAmount.toString();
speech.lang = strLang;
synth.speak( speech ); // Adds an utterance to the utterance queue.
let msg = "";
msg += ( synth.paused ? " Paused:" : "" );
msg += ( synth.pending ? " Pending:" : "" );
msg += ( synth.speaking ? " Speaking:" : "" );
msg += " pitch=" + speech.pitch;
msg += " speed=" + speech.rate;
msg += " volume=" + speech.volume;
msg += " lang=" + speech.lang;
msg += " " + ( speech.voice?.name ?? "-" );
msg += " " + ( speech.voice?.lang ?? "-" );
user_showMsg ( '#user_speechStatus', msg );
}
/**
* Show a message in the specified HTML element by its ID
* @param {string} id - The ID of the HTML element where the message will be shown.
* @param {string} text - The message text to be displayed in the HTML element.
*/
function user_showMsg ( id, text ) { // eg "#user_speechStatus"
let elMsgArea = document.querySelector ( id );
while ( elMsgArea.firstChild ) { elMsgArea.removeChild ( elMsgArea.firstChild ); }
elMsgArea.appendChild( document.createTextNode( text ) );
}
</script>
自由改変可能な HTML/JavaScript コードです (MIT License)。いかなる保証もありません。
Capture

