Highlight text as it spoken by avatar

Jon -
Yes this can be accomplished using the vh_audioProgess callback - which enables synchronization between audio playback and visual display.

You could display the text as a ticker (as in the below example), or as movie captions (line by line) or you could display the entire text and highlight the portions as they are being read. The manner in which this is visualized is up to you.

The following support example shows a ticker tape display -
http://www.oddcast.com/support/close_...

For your reference note that this example is available on the support page under "Other API Examples"
https://www.sitepal.com/support/

Hope this helps,
Gil
SitePal Team

Hi..
thanks!!!
How can I
"you could display the entire text and highlight the portions as they are being read"

any ideas?

Have you looked at the example?

Yes..
But how would I highlight the text, in yellow - that is currently being spoken and display all the text?
Thanks

You might want to use the 'Mark' tag (HTML5) -
http://html5doctor.com/draw-attention...
or just color the selected words - here's a good example -
http://stackoverflow.com/questions/10...

Hope this helps,
Gil

thanks!
But how who I apply this to the TTS that I entered and the audio being generated.
I guess I just need the timing of the words in the Avatar audio.
any more ideas?

thanks again for the quick reply

Yes - the switch points will need to be dynamic (per callbacks received) and not as in the example above. You would need to work it out - seems doable.

Another possibility to consider that might be simpler to implement -
Break down the text into lines or segments as appropriate for your display, and play them using multiple sayText calls - queue them for playback as in this example -
http://www.oddcast.com/support/sayMul...
then use talkEnded callbacks to highlight the next section
see example for talkEnded - http://www.oddcast.com/support/vh_sce...

I see.... but all of this is over my head.

How do you get the audio URL from your link - to use the popcorn approach?

How would you add a callback for each of the sayText sections and highlight the sayText?

How do wire the singalong() to the PLAY button?

any more ideas? Thanks !!!!!!!!!!!!

You guys should provide this functionality - I would pay more for it.
It's would be a great in educational tutorials - and that's what I'm using your software for.

Jon -

You may be right - it might be good to provide this (and other) advanced functionality as part of the product. So far we have limited ourselves to providing APIs - and advanced examples. The assumption being that people's needs are different, and we should provide the tools for folks to build their own.

In any case - I'm not sure I can help you any further here. I'll see if one of our engineers can put together another example that better demonstrates.

Thanks again for all your help...
Please keep me informed if you get sample code for this.

Great product... would be great to assist in teaching/learning.