<html>
<head>
<script language="JavaScript" type="text/javascript" src="http://vhss-d.oddcast.com/vocalware_embed_functions.php?acc=3314795&js=1"></script>
<script language="javascript">
var agt =navigator.userAgent.toLowerCase();
var is_ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
// define global variables
var characterCount = 0;
var displayString = "";
var previousProgress= 0;
var displayPosition = 0;
var audioStarted = 0;
var englishText = "Welcome to the Scrolling Text example. This page automatically generates scrolling text for any text input. To demonstrate that this code will work for any text, type or paste your own message below!";
var germanText = "Goethe war der berühmteste deutsche Dichter und einer der bekanntesten Dichter der Welt. Er hat größte und schönste dichterische Kunstwerke geschaffen und viele weise und richtige Erkenntnisse ausgesprochen. Goethe war ein reichbegabter Mensch und lebenslang vom Glück begünstigt. Er wurde 1749 in Frankfurt am Main geboren und wuchs in wohlhabenden Verhältnissen auf. Sein Vater war ein gebildeter Mann, der sein Leben nach strengen Grundsätzen führte, ohne daß er einen richtigen Beruf gelernt hätte. Seine Mutter dagegen war eine frohe, heitere Frau mit viel Wärme, Phantasie und Humor. Beide Eigenschaften seiner Eltern hatte der Sohn geerbt.";
var japaneseText = "人形浄瑠璃の番付を収集した貼り込み帳。収集した人は不明だが、その時期は享和（1801～1803）ころと推定され、明治期に活躍した義太夫節の名人竹本摂津大掾〈たけもとせっつのたいじょう〉が所蔵していたものである。「番付」というのは、現代の劇場のチラシやパンフレットにあたり、芝居を見に行く前や、観劇の際に参照された。いつ、どこで、だれが、なんの芝居をやっているかという情報が記されており、江戸時代演劇史の基本的な資料である。";
var scroller;
function Scroller(scrollText,language)
{
this.language = language;
this.scrollText = scrollText;
this.characters = 0;
this.totalChar = scrollText.length;
this.timer = null;
this.speed = 70; //1000 = 1 second
this.stopped = true; //Stopped initially
this.cut_text = 56;
audioStarted = 0;
document.getElementById('scrolling_text_box').innerHTML='';
if(this.language==12) {
this.cut_text = 35;
this.speed = 250;
if(is_ie) this.cut_text = 33;
}
}
Scroller.prototype.totalChars= function(){
return this.totalChar
}
Scroller.prototype.scroll = function()
{
var text_scroll = this.scrollText;
var text_box = document.getElementById('scrolling_text_box').innerHTML;
var length_scroll = text_scroll.length;
var length_box = text_box.length;
this.stopped = false;
if(length_box>this.cut_text) {
text_box = text_box.substring(1, text_box.length);
}
text_scroll = text_box + text_scroll.substring(this.characters, this.characters + 1);
document.getElementById('scrolling_text_box').innerHTML= text_scroll;
this.characters = this.characters + 1;
var obj = this;
this.timer = setTimeout(function(){obj.scroll();}, this.speed);
if(this.characters>=length_scroll){
this.stopped = true;
clearTimeout(this.timer) ;
}
}
Scroller.prototype.stop_scroll = function()
{
this.stopped = true;
if (this.timer){
clearTimeout(this.timer);
}
}
Scroller.prototype.slower = function()
{
if (this.speed < 600){
this.speed += 25;
}
}
Scroller.prototype.faster = function()
{
if (this.speed > 49){
this.speed -= 25;
}
}
Scroller.prototype.getSpeed = function()
{
return this.speed ;
}
function vw_apiLoaded()
{
setStatus(1, 1,0);
}
function stopSpeech2(){
scroller.stop_scroll();
stopSpeech();
enableButtons();
}
function enableButtons(){
document.getElementById('b1').disabled = false;
document.getElementById('b2').disabled = false;
document.getElementById('b3').disabled = false;
document.getElementById('b4').disabled = false;
}
function vw_audioProgress(progress)
{
var charactersToDisplay = Math.round((progress/100) * scroller.totalChar);
if(audioStarted==0){
audioStarted = 1;
scroller.scroll();
}
if(scroller.characters<charactersToDisplay && scroller.characters>0){
scroller.faster();
}else{
scroller.slower();
}
}
function vw_talkEnded (){
enableButtons();
}
function speakText(text, voice, language, engine,bID)
{
console.log(text)
setStatus(1, 1);
if(typeof scroller !="undefined") stopSpeech2();
if(typeof bID !="undefined") document.getElementById(bID).disabled = true;
document.getElementById('scrolling_text_box').innerHTML='';
scroller = new Scroller(text,language);
sayText(text, voice, language, engine); // if you are using sayAudio, place the sayAudio call here()
}
</script>
</head>
<body>
<!-- This function call needs to be in or after the body tag -->
<script language="JavaScript" type="text/javascript">
AC_Vocalware_Embed(3314795, 1, 1, '', 0, 1, 2504354, 0, 1, 0, 'e704f7a6017aab05093b2cb079e00e4e', 9);
</script>
<img src="https://www.vocalware.com/images/support/welcome_to_vocalware_support.jpg"><br/><br/>
<div id="scrolling_text_box" style="border: 1px solid #CCCCCC;font-family: courier new,courier,monospace;font-size: 12px;height: 12px;margin-top: 20px;padding: 5px;text-align: right;white-space: nowrap;width: 410px;"></div><br>
<div style=" padding-left: 15px; padding-top: 10px; ">
<INPUT style=" padding:0 .25em 0 .25em; width:auto; overflow:visible;" TYPE="button" VALUE="English Example" id="b1" onClick="javascript: speakText(englishText,1,1,3,'b1');" class="form2">
<INPUT style=" padding:0 .25em 0 .25em; width:auto; overflow:visible;"TYPE="button" VALUE="German Example" id="b2" onClick="javascript: speakText(germanText,1,3,2,'b2');" class="form2">
<INPUT style=" padding:0 .25em 0 .25em; width:auto; overflow:visible;"TYPE="button" VALUE="Japanese Example" id="b3" onClick="javascript: speakText(japaneseText,1,12,3,'b3');" class="form2">
</div>
<div style=" padding-left: 15px; padding-top: 15px;"> The example will dynamically generate synchronized close captions for any audio. <br> </div>
<div style=" padding-left: 155px; padding-top: 10px; "> Type in your text below!<br> </div>
<FORM NAME="textInput" class="form">
<textarea name="textToSay" MAXLENGTH="600" cols="50" rows="5" ACCEPT-CHARSET="UTF-8" ENCTYPE="multipart/form-data"></textarea><br>
<div style="padding-left: 155px; padding-top: 10px; ">
( voice, language, engine )<br>
<input type="text" name="voice" value="3" size="1" MAXLENGTH="2" class="form">
<input type="text" name="languageSet" value="1" size="1" MAXLENGTH="2" class="form">
<input type="text" name="engine" size="1" value="3" MAXLENGTH="1" class="form"><br><br>
<INPUT style=" padding:0 .65em 0 .65em; width:auto; overflow:visible;" TYPE="button" VALUE="Speak with Scrollbar" NAME="Submit" id="b4" onClick="javaScript:speakText(textToSay.value, voice.value, languageSet.value, engine.value,'b4')" class="form">
</form>
</div>
</div>
</body>
</html>
